// change icons position
#urlbar-input-container {
  display: flex !important;
  align-items: center !important;
}

#urlbar-zoom-button {
  order: 100 !important;
}

#page-action-buttons {
  order: 99 !important;
}

#tracking-protection-icon-container {
  order: 98 !important;
}

.urlbar-input-box {
  flex: 1 1 auto !important;
}

// URL icons
#identity-box,
#tracking-protection-icon-container,
#notification-popup-box,
.urlbar-icon:not(#star-button[starred], #tracking-protection-icon-box[active]) {
  fill: get-var("icon-color-secondary") !important;
  color: get-var("text-primary") !important;
}

// URL popup icons
#identity-popup,
#permission-popup,
#protections-popup,
.popup-notification-icon,
.permission-popup-permission-icon,
.subviewbutton-iconic:not([class*="identity-color-"]) > .toolbarbutton-icon {
  fill: get-var("icon-color-secondary") !important;
}

#urlbar {
  &[open] {
    #page-action-buttons,
    #tracking-protection-icon-container {
      display: none !important;
    }
  }
}

// Centered URL icons
.urlbar-page-action {
  -moz-box-align: center !important;
  align-items: center !important;
}
#urlbar-input-container:not([pageproxystate="invalid"]) {
  .urlbar-page-action {
    &:not([hidden]) {
      display: grid !important;
      align-content: center !important;
    }
  }
}

// protections-popup-tp-switch color
.protections-popup-tp-switch::before {
  background-color: get-var("text-on-accent") !important;
}

// fix background for "Firefox" box in urlbar container
#identity-box[pageproxystate="valid"].notSecureText > .identity-box-button,
#identity-box[pageproxystate="valid"].chromeUI > .identity-box-button,
#identity-box[pageproxystate="valid"].extensionPage > .identity-box-button,
#urlbar-label-box {
  // background-color: var(--urlbar-box-bgcolor); // Default
  background-color: transparent !important;

  &:hover {
    background-color: get-var("control-background-color") !important;
    outline-color: get-var("control-border-color") !important;
  }
}

// remove unnecessary right space from shield icon button (like chrome)
#identity-box {
  // margin-inline-end: var(--identity-box-margin-inline); // default
  margin-inline-end: 0 !important;
}

// fix "Not secure" doesn’t fit into pill shape correctly (#118)
#identity-box[pageproxystate="valid"]:is(.extensionPage, .notSecure, .notSecureText, .mixedActiveContent, .httpsOnlyErrorPage, .weakCipher, .mixedDisplayContent, .mixedDisplayContentLoadedActiveBlocked, .certUserOverridden, #identity-box[pageproxystate="valid"].certErrorPage) #identity-icon-box.identity-box-button {
  padding-inline: 8px !important;
}

#identity-icon-label {
  font-family: 500 !important;
}

// hide left border for menu button
#PanelUI-button {
  border: none !important;
  border-inline: none !important;
}

// hide right border for identity box button
#identity-icon-box {
  &::after,
  &::before {
    display: none !important;
  }
}

// disable refresh button animation
#nav-bar-customization-target {
  align-items: center;
}

#reload-button,
#stop-button {
  .toolbarbutton-icon {
    fill: inherit !important;
  }

  .toolbarbutton-animatable-box {
    display: none !important;
  }
}

@include moz-pref-media("not userChrome.theme-default") {
  #urlbar-searchmode-switcher,
  #urlbar-searchmode-switcher[open],
  #urlbar-searchmode-switcher[open]:hover {
    background-color: get-var(background-color-100) !important;
  }

}
