/* imports the user facing variables */
/* USER FACING VARIABLES -------------------------------------------------------------------------------------- */
/* this file does NOT have to be updated between versions */

/* NOTE: restart Firefox to apply any changes */

:root {


  /* custom accent color to be used across Firefox*/
  /* use hexcode or color name */
  --custom-accent-color: #ebcb8b;


  /* color of the tab dividers / separators */
  /* set variable = none, to disable dividers */
  --custom-tab-divider-color: #4c566a;


  /* sets the height of the tabs toolbar */
  /* legacy height (<= v1.6.2) = 33px */
  /* functionality broken as of FF 108 - WIP */
  /* --tab-bar-height: 35px; */


  /* set the size of sync profile pic */
  /* 1.0 = 100% scale */
  --sync-avatar-scale: 1.0;

  /* custom paddings/margins for the menu itmes */
  /* for reference: */
  --custom-menuitem-padding-vertical: 6px;
  --custom-menuitem-padding-horizontal: 8px;
  --custom-menuitem-margin: 4px;

}



/* CUSTOM ACCENT COLORS -------------------------------------------------------------------------------------- */

:root {
  --lwt-toolbarbutton-icon-fill-attention: var(--custom-accent-color, #0a84ff) !important;
  --toolbarbutton-icon-fill-attention: var(--custom-accent-color, #0a84ff) !important;
  --button-primary-bgcolor: var(--custom-accent-color, #0a84ff) !important;
  --button-primary-hover-bgcolor: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --button-primary-active-bgcolor: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  --buttons-primary-button-bgcolor: var(--custom-accent-color, #0a84ff) !important;
  --buttons-primary-button-hover-bgcolor: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --buttons-primary-button-active-bgcolor: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  --button-background-color-primary: var(--custom-accent-color, #0a84ff) !important;
  --button-background-color-primary-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --button-background-color-primary-active: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  --brand-color-accent: var(--custom-accent-color, #0a84ff) !important;
  --brand-color-accent-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --brand-color-accent-active: var(--custom-accent-color, #0a84ff) !important;
  --color-accent-primary: var(--custom-accent-color, #0a84ff) !important;
  --color-accent-primary-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --color-accent-primary-pressed: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  --tab-attention-icon-color: var(--custom-accent-color, #0a84ff) !important;
  --checkbox-checked-bgcolor: var(--custom-accent-color, #0a84ff) !important;
  --checkbox-checked-hover-bgcolor: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
  --checkbox-checked-active-bgcolor: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  --lwt-brighttext-url-color: var(--custom-accent-color, #0a84ff) !important;
  --lwt-popup-brighttext-url-color: var(--custom-accent-color, #0a84ff) !important;
  --focus-outline-color: var(--custom-accent-color, #0a84ff) !important;
  --toolbar-field-focus-border-color: var(--custom-accent-color, #0a84ff) !important;
  --link-color: var(--custom-accent-color, #0a84ff) !important;
  /*Star Highlight & Download Finished*/
  --lwt-toolbarbutton-icon-fill-attention: var(--custom-accent-color, #0a84ff) !important;
  --lwt-toolbar-field-icon-fill-attention: var(--custom-accent-color, #0a84ff) !important;
}

.urlbarView-url,
.popup-notification-learnmore-link.text-link {
  color: var(--custom-accent-color, #0a84ff) !important;
}

/* colors various popup windows (e.g. edit bookmarks, close window menus) */
@-moz-document regexp("^(about:|chrome:|moz-extension:).*") {

  html:not([role="dialog"]),
  html:not([role="dialog"]) *,
  html:not([role="dialog"]) body.activity-stream,
  window:not([chromehidden]),
  window:not([chromehidden])>dialog {
    --in-content-primary-button-background: var(--custom-accent-color, #0a84ff) !important;
    --in-content-primary-button-background-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
    --in-content-primary-button-background-active: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
  }
}

/* color report broken side link */
#report-broken-site-popup-send-more-info-link {
  color: var(--custom-accent-color, #0a84ff) !important;
}

/* color the update/info dot in app menu */
:root {
  --panel-banner-item-info-icon-bgcolor: var(--custom-accent-color, #0a84ff) !important;
  --panel-banner-item-update-supported-bgcolor: var(--custom-accent-color, #0a84ff) !important;
}


/* color the left strip in notification banners (purple-yellow gradient -> accent color) */
.infobar::before {
  background-image: linear-gradient(var(--custom-accent-color, #0a84ff), var(--custom-accent-color, #0a84ff)) !important;
}


/* color the password autofill highlight color on click */
.autocomplete-richlistitem {
  &[selected] {
    background-color: color-mix(in srgb, white 15%, var(--custom-accent-color, #0a84ff)) !important;
  }
}

/* color the "manage themes" link on the customize page */
#customization-lwtheme-link.text-link {
  color: var(--custom-accent-color, #0a84ff) !important;
}

/* replace the mozilla purple to yellow gradient in appmenu */
/* (enabled by default for default, light, and dark themes) */
:root:not(:-moz-lwtheme),
:root[lwt-default-theme-in-dark-mode],
/* based on https://github.com/black7375/Firefox-UI-Fix/issues/288 */
:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"],
/* Light Theme */
:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]

/* Dark Theme */
  {
  --panel-separator-zap-gradient: linear-gradient(var(--custom-accent-color, #0a84ff), var(--custom-accent-color, #0a84ff)) !important;
}

/* can be manually overridden by pref */
@media (-moz-bool-pref: "browser.appmenugradient.overwrite") {
  :root {
    --panel-separator-zap-gradient: linear-gradient(var(--custom-accent-color, #0a84ff), var(--custom-accent-color, #0a84ff)) !important;
  }
}


/* TITLE BAR ----------------------------------------------------------------------------------------------- */

/* override mozilla min/max/close buttons with default ones (only relevant on linux) */
@media (-moz-gtk-csd-available) {
  @media (-moz-bool-pref: "browser.windowcontrolbuttons.overwrite") {
    .titlebar-button:-moz-lwtheme {
      appearance: auto !important;
    }

    .titlebar-min:-moz-lwtheme,
    .titlebar-max:-moz-lwtheme,
    .titlebar-restore:-moz-lwtheme,
    .titlebar-close:-moz-lwtheme {
      list-style-image: none !important;
    }

    .titlebar-button:-moz-lwtheme:hover,
    .titlebar-button:-moz-lwtheme:hover:active {
      background-color: unset !important;
      color: unset !important;
    }
  }
}


/* remove window corner rounding in gtk */
:root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]) #navigator-toolbox:-moz-lwtheme,
:root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]) ::backdrop {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}


/* TAB BAR ------------------------------------------------------------------------------------------------- */

/* sets the height of the tab toolbar
otherwise will change height when tabs overflow [FIXED] */
/* tab height when playing audio issue fixed in FF 96.0.2+ */
/* https://bugzilla.mozilla.org/show_bug.cgi?id=1714276 */
/* height change when tab overflow fixed in FF 97 beta+ */
/* #TabsToolbar {height: var(--tab-bar-height, 35px) !important;} */
/* :root{ */
/* default value for tab-min-height = 36px */
/* --tab-min-height: var(--tab-bar-height, 35px) !important; */
/* } */
/* .toolbar-items {height: var(--tab-bar-height, 35px) !important;} */
/* .tabbrowser-tab {height: var(--tab-bar-height, 35px) !important;} */

#tabbrowser-tabs {
  min-height: 0 !important;
}

/* Reduce left spacer on tab bar */
@supports (not (-moz-osx-font-smoothing: auto)) {
  @media not (-moz-bool-pref:"browser.lefttabspacer.enable") {
    .titlebar-spacer[type="pre-tabs"] {
      display: none !important;
    }
  }
}


/* Tab - Connect to window */
.tab-background {
  border-radius: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.tab-content {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.tab-stack {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* adds the little colored strip on top of the selected tab */
.tab-background:is([selected], [multiselected]) {
  box-shadow: inset 0 2px var(--custom-accent-color, #0a84ff) !important;
  border: 0 !important;
  outline: none !important;
  background-repeat: no-repeat !important;
}

/* special handling for mozilla containers */
tab[class*="identity-color"] {
  background-image: linear-gradient(var(--identity-tab-color, white), var(--identity-tab-color, white));
  background-size: 75% var(--container-stripe-height, 1px);
  background-position: bottom center;
  background-repeat: no-repeat;
  border: 0 !important;
  outline: none !important;
}

/* override the built in container colors */
tab[class*="identity-color"][selected="true"]>.tab-stack>.tab-background>.tab-context-line {
  height: 0 !important;
}

/* replace with our own container border */
tab[class*="identity-color"][selected="true"]>.tab-stack>.tab-background:is([selected], [multiselected]) {
  background-image: linear-gradient(var(--identity-tab-color, white), var(--identity-tab-color, white));
  background-size: 75% var(--container-stripe-height, 1px);
  background-position: bottom center;
  background-repeat: no-repeat;
  border: 0 !important;
  outline: none !important;
}

@media (-moz-bool-pref:"browser.tabcontextline.match_container_color") {
  tab[class*="identity-color"][selected="true"]>.tab-stack>.tab-background:is([selected], [multiselected]) {
    box-shadow: inset 0 2px var(--identity-tab-color, white) !important;
  }
}


/* realign the selected tab so it doesnt droop down by 2px */
.tabbrowser-tab[selected="true"] {
  z-index: 0 !important;
}


/* neighbouring tabs should "pinch" together */
.tabbrowser-tab {
  padding-inline: 0 !important;
}


/* Unselected Tab - Divide line */
.tab-stack::before,
.tabbrowser-tab:last-of-type .tab-stack::after {
  content: "";
}

.tab-stack::before,
.tab-stack::after {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  width: 0px;
  height: 100%;
  border-right: 1px solid var(--custom-tab-divider-color, #535354);
}

.tab-stack::after {
  right: 0;
}

/* removes double tab line next to view button, fixes some padding */
:root:not([privatebrowsingmode], [firefoxviewhidden]) :is(toolbarbutton, toolbarpaletteitem)+#tabbrowser-tabs {
  border-inline-start: None !important;
  padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width) + 0px) !important;
  margin-inline-start: 0 !important;
}

/* squares the mute button on hover */
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
  border-radius: 0 !important;
}

/* new sidebar tabs */
moz-button,
:host {
  --button-border-radius: 0 !important;
}

/* NAV BAR ---------------------------------------------------------------------------------------------------- */

:root {
  /* reduce padding between menu items */
  --arrowpanel-menuitem-padding: var(--custom-menuitem-padding-vertical, 6px) var(--custom-menuitem-padding-horizontal, 8px) !important;
  --arrowpanel-menuitem-margin: 0 var(--custom-menuitem-margin, 4px) !important;
  --panel-subview-body-padding: var(--custom-menuitem-margin, 4px) 0 !important;


  /* square the off most of the UI (selection buttons on hover, context menus, hamburger menus, etc) */
  --toolbarbutton-border-radius: 0 !important;
  --arrowpanel-menuitem-border-radius: 0 !important;
  --arrowpanel-border-radius: 0 !important;
  --tab-border-radius: 0 !important;
  --subviewbutton-border-radius: 0 !important;
}


/* squares the profile picture on toolbar if logged into sync AND not disabled by pref */
@media not (-moz-bool-pref:"browser.syncavatar.round") {
  #fxa-avatar-image {
    border-radius: 0 !important;
  }
}


/* scales the profile picture, since it is quite small */
#fxa-avatar-image {
  transform: scale(var(--sync-avatar-scale)) !important;
}


/* option to hide extensions button */
@media (-moz-bool-pref:"browser.unifiedextensions.hide") {
  #unified-extensions-button {
    display: none
  }
}

/* option to hide the extentions notification dot */
@media (-moz-bool-pref:"browser.extensionsdot.hide") {
  #unified-extensions-button[attention]>.toolbarbutton-icon {
    background-image: None !important;
  }
}

/* SUB MENUS --------------------------------------------------------------------------------------------- */

/* more padding code for sub menus */
.panel-header {
  padding: var(--custom-menuitem-margin, 4px) !important;
  padding-bottom: 0 !important;
}

.subviewbutton-back {
  margin: 0 0 !important;
}


/* removes the rounded corners from popup menus (main hamburger menu, bookmarks, etc) */
.menupopup-arrowscrollbox,
.panel-arrowcontainer,
.panel-arrowbox,
.panel-arrowscrollbox,
menupopup {
  border-radius: 0 !important;
}

#report-broken-site-popup-url,
#report-broken-site-popup-description {
  border-radius: 0 !important;
}

/* removes rounded corner from selection boxes and autocomplete popups */
menupopup menuitem,
menupopup menu,
menupopup,
panel,
menulist {
  border-radius: 0 !important;
  --panel-border-radius: 0 !important;
}


/* square input fields in the edit bookmarks menu */
#editBMPanel_namePicker {
  border-radius: 0 !important;
}

#editBMPanel_folderMenuList {
  border-radius: 0 !important;
}

#editBMPanel_tagsField {
  border-radius: 0 !important;
}

#editBMPanel_tagsSelector {
  border-radius: 0 !important;
}

#editBMPanel_locationField {
  border-radius: 0 !important;
}

#editBMPanel_keywordField {
  border-radius: 0 !important;
}


/* square off aspects of the download menu (i.e. selection boxes, open in folder button) */
.download-state,
.downloadButton {
  border-radius: 0 !important;
}

.downloadProgress {
  border-radius: 0 !important;
  overflow: hidden !important;
}

.downloadProgress[paused] {
  border-radius: 0 !important;
}

.downloadProgress:not([value="0"])::-moz-progress-bar {
  border-radius: 0 !important;
}

.downloadProgress::-moz-progress-bar {
  border-radius: 0 !important;
}

.downloadProgress[paused]::-moz-progress-bar {
  border-radius: 0 !important;
}


/* square off the toggle switch for "enhanced tracking protection" */
.protections-popup-tp-switch,
.protections-popup-tp-switch::before {
  border-radius: 0 !important;
}

.toggle-button,
.toggle-button::before {
  border-radius: 0 !important;
}

/* square the permissions popup (e.g. autoplay blocked) */
#permission-popup-menulist {
  border-radius: 0 !important;
}


/* square permission popups for webRTC (screen sharing and voice) */
#webRTC-selectMicrophone-menulist {
  border-radius: 0 !important;
}

#webRTC-selectWindow-menulist {
  border-radius: 0 !important;
}

#webRTC-previewVideo {
  border-radius: 0 !important;
}


/* square the fullscreen and zoom reset */
#appMenu-zoomReset-button2>.toolbarbutton-text,
#appMenu-fullscreen-button2>.toolbarbutton-icon {
  border-radius: 0 !important;
}

/* square the selection in the "List All Tabs" menu */
.all-tabs-item {
  border-radius: 0 !important;
  margin-inline: var(--custom-menuitem-margin, 4px) !important;
}


/* MISC ITEMS ------------------------------------------------------------------------------------------- */

/* square "close tabs and quit" window and buttons (and prob other dialog boxes) */
.dialogBox {
  border-radius: 0 !important;
}

button {
  border-radius: 0 !important;
}


/* square checkboxes */
.checkbox-check {
  border-radius: 0 !important;
}

#checkbox {
  border-radius: 0 !important;
}


/* square dropdown selection and autocompete boxes */
select {
  border-radius: 0 !important;
}

:is(panel, menupopup)::part(content) {
  border-radius: 0 !important;
}


/* square selections, checkboxes, and nav buttons on the print page */
.toggle-group-label {
  border-radius: 0 !important;
}

.photon-number {
  border-radius: 0 !important;
}

#headers-footers-enabled {
  border-radius: 0 !important;
}

#backgrounds-enabled {
  border-radius: 0 !important;
}

.toolbarButton:not(:hover) {
  background-color: #2b2a33 !important;
}

#custom-range {
  border-radius: 0 !important;
}


/* autosave password notification input fields */
#password-notification-username {
  border-radius: 0 !important;
}

#password-notification-password {
  border-radius: 0 !important;
}


/* searchbox and buttons in find bar (ctrl+F) */
.findbar-textbox {
  border-radius: 0 !important;
}

toolbarbutton {
  border-radius: 0 !important;
}


/* certain new folder and login field popup dialogs */
#loginTextbox {
  border-radius: 0 !important;
}

#password1Textbox {
  border-radius: 0 !important;
}


/* density options in "Customize Toolbar" */
#customization-uidensity-menuitem-compact {
  border-radius: 0 !important;
}

#customization-uidensity-menuitem-normal {
  border-radius: 0 !important;
}

#customization-uidensity-menuitem-touch {
  border-radius: 0 !important;
}


/* square popup when entering full screen video */
#fullscreen-warning {
  border-radius: 0 !important;
}


/* square dismissable "show me how" notification messages */
notification-message {
  border-radius: 0 !important;
}

.animated {
  border-radius: 0 !important;
}

.infobar {
  border-radius: 0 !important;
}

.infobar::before {
  border-start-start-radius: 0 !important;
  border-end-start-radius: 0 !important;
}


/* clear history popup and warnings */
#sanitizeDurationChoice {
  border-radius: 0 !important;
}

#sanitizeEverythingWarningBox {
  border-radius: 0 !important;
}


/* url preview on hover */
#statuspanel-label {
  border-radius: 0 !important;
}

/* sidebar and its panels*/
#sidebar,
.screen,
.select-item,
.button-background,
.inline-image,
.selectedTab,
.moz-card,
moz-fieldset,
#inputs,
.search-container {
  border-radius: 0 !important;
}

/* input fields dont like to change, so do it this way instead */
:root {
  --border-radius-small: 0 !important;
  --border-radius-medium: 0 !important;
  --border-radius-large: 0 !important;
}

/* THUNDERBIRD SPECIFIC ------------------------------------------------------------------------------ */
/* custom color for tab line */
:root {
  --tabline-color: var(--custom-accent-color, #0a84ff) !important;
}

/* the loading/compacting progress bar on bottom right */
.progressmeter-statusbar {
  border-radius: 0 !important;
}

.progressmeter-statusbar:not([value="0"])::-moz-progress-bar {
  border-radius: 0 !important;
}

/* Remove back, forward, and refresh buttons */
#back-button,
#forward-button,
#reload-button {
  display: none !important;
}

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

#firefox-view-button {
  display: none !important;
}

#new-tab-button {
  display: none !important;
}

#alltabs-button {
  display: none !important;
}

#identity-permission-box {
  display: none !important;
}

#picture-in-picture-button {
  display: none !important;
}

#star-button-box {
  display: none !important;
}

#pageAction-urlbar-_testpilot-containers {
  display: none !important;
}

#navigator-toolbox>#PersonalToolbar {
  display: none !important;
}

#tabbrowser-tabbox {
  outline: none !important;
  box-shadow: none !important;

}

#reader-mode-button {
  display: none !important;
}

#translations-button {
  display: none !important;
}

/* Remove Context Menu Entries */
#context-back,
#context-take-screenshot,
#context-forward,
#context-reload,
#context-stop,
#context-bookmarkpage,
#context-savepage,
#context-pocket,
#screenshots_mozilla_org_create-screenshot,
#context-inspect,
#context-sep-selectall,
#context-selectall,
#context-copy,
#context-viewsource,
#context-viewinfo,
#context-print-selection,
#context-viewpartialsource-selection,
#context-inspect-a11y,
#context-openlinkintab,
#context-openlink,
#context-openlinkprivate,
#context-bookmarklink,
#context-savelink,
#context-savelinktopocket,
#context-sendimage,
#context-searchselect-private {
  display: none !important;
}

#statuspanel[type="overLink"] {
  opacity: 0 !important;
}

#statuspanel {
  opacity: 0 !important;
}

#statuspanel {
  display: none !important
}

#statuspanel-label {
  display: none !important;
}

#unified-extensions-button:hover #unified-extensions-view,
#unified-extensions-view:hover {
  visibility: visible !important;
  opacity: 1 !important;
}

/* Hide URL suggestions and other elements */
#urlbar-results,
#urlbar-go-button,
#page-action-buttons,
#reader-mode-button-container {
  display: none !important;
}

/* Hide "This time search with" suggestion */
#urlbar-one-offs-header-label {
  display: none !important;
}

/* Hide search engine symbols */
#urlbar-engine-one-off-item,
#urlbar-one-off-search-buttons {
  display: none !important;
}

/* Disable one-off search */
#urlbar[oneoffsearchfieldshidden] {
  pointer-events: none !important;
}

/* Hide sidebar */
#sidebar-box {
  visibility: collapse !important;
}

/* Hide bottom status/ui bar */
#status-bar {
  visibility: collapse !important;
}

scrollbar {
  -moz-appearance: none !important;
  display: none !important;
  width: 0px !important;
  background-color: transparent !important;
}

scrollcorner {
  -moz-appearance: none !important;
  display: none !important;
}

*[id*="sep"],
*[class*="sep"] {
  display: none !important;
}


/* Remove tab close button */
.tab-close-button {
  display: none !important;
}

/* Remove new tab button */
#tabs-newtab-button {
  display: none !important;
}

.titlebar-buttonbox-container {
  display: none !important;
}

#stop-button {
  display: none !important;
}

#customizableui-special-spring1,
#customizableui-special-spring2 {
  display: none !important;
}

#vertical-spacer {
  display: none !important;
}

.search-one-offs {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* #sidebar-main {
  visibility: collapse !important;
} */

/* remove annoying top border on top of urlbar*/
#nav-bar {
  box-shadow: none !important;
  border-top: none !important;
}

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

#sidebar-tools-and-extensions-splitter {
  display: none !important;
}

#urlbar-searchmode-switcher {
  display: none !important;
}

#urlbar-input::placeholder {
  color: transparent !important;
}