/** 工具栏溢出菜单横排按钮间距调整 */
.widget-overflow-list
  .toolbaritem-combined-buttons
  .toolbarbutton-1
  > .toolbarbutton-text {
  padding-inline-end: 4px !important;
}

.widget-overflow-list
  #zoom-controls[cui-areatype="toolbar"]
  > #zoom-reset-button
  > .toolbarbutton-text {
  min-width: calc(5ch + 4px) !important;
  padding-inline: 0 !important;
}

:is(toolbar, .customization-palette)
  .toolbaritem-combined-buttons.chromeclass-toolbar-additional {
  margin-inline: 0 !important;
}

:is(toolbar, .customization-palette)
  .toolbaritem-combined-buttons.chromeclass-toolbar-additional:not(:hover)
  > separator {
  width: 0.67px !important;
  height: 20px !important;
  margin-inline-end: -0.67px !important;
  background-image: linear-gradient(
    currentColor 0,
    currentColor 100%
  ) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 1px 20px !important;
  opacity: 0.2 !important;
}

:is(toolbar, .customization-palette) .toolbarbutton-combined-buttons-dropmarker,
#PersonalToolbar
  .toolbaritem-combined-buttons
  .toolbarbutton-combined-buttons-dropmarker {
  margin-block: var(--toolbarbutton-inner-padding) !important;
}

:is(toolbar, .customization-palette)
  .toolbarbutton-combined-buttons-dropmarker
  > .toolbarbutton-icon {
  padding-inline: 2px !important;
  padding-block: 2px !important;
  height: 20px !important;
  width: 16px !important;
}

.customization-palette .toolbarbutton-1 {
  appearance: none !important;
  margin: 0 !important;
  padding: 0 var(--toolbarbutton-outer-padding) !important;
  justify-items: center !important;
}

.customization-palette .toolbarbutton-1 > .toolbarbutton-icon {
  width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
  height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
}

.customization-palette .toolbarbutton-1 > .toolbarbutton-icon,
toolbar .toolbarbutton-1 > .toolbarbutton-text,
toolbar .toolbarbutton-1 > .toolbarbutton-badge-stack {
  padding: var(--toolbarbutton-inner-padding) !important;
  border-radius: var(--toolbarbutton-border-radius) !important;
}

:is(toolbar, .customization-palette)
  .toolbarbutton-combined-buttons-dropmarker
  > .toolbarbutton-icon {
  padding-inline: 2px !important;
  padding-block: 2px !important;
  height: 20px !important;
  width: 16px !important;
}

:is(toolbar, .customization-palette)
  .toolbaritem-combined-buttons.unified-extensions-item
  toolbarbutton {
  // background-color: transparent !important;
  padding: 0 var(--toolbarbutton-outer-padding) !important;
}

:is(toolbar, .customization-palette):not(#PersonalToolbar)
  #edit-controls
  > #cut-button,
:is(toolbar, .customization-palette)
  #profiler-button
  > #profiler-button-button {
  padding-left: 2px !important;
}

:is(toolbar, .customization-palette):not(#PersonalToolbar)
  #edit-controls
  > #paste-button,
:is(toolbar, .customization-palette)
  #profiler-button
  > #profiler-button-dropmarker {
  padding-right: 2px !important;
}

#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-out-button,
#wrapper-edit-controls[place="palette"] > #edit-controls > #cut-button,
#wrapper-profiler-button[place="palette"]
  > #profiler-button
  > #profiler-button-button,
#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-in-button,
#wrapper-edit-controls[place="palette"] > #edit-controls > #paste-button,
#wrapper-profiler-button[place="palette"]
  > #profiler-button
  > #profiler-button-dropmarker {
  align-items: center !important;
  flex: 0 !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette)
  #zoom-controls
  > :is(#zoom-out-button, #zoom-in-button) {
  margin-block: var(--toolbarbutton-inner-padding) !important;
  width: unset !important;
  padding: 0 !important;
  padding-inline: 2px !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette)
  #zoom-controls
  > :is(#zoom-out-button, #zoom-in-button)
  > .toolbarbutton-icon {
  height: 20px !important;
  width: 20px !important;
  padding: 4px !important;
}

#zoom-in-button > .toolbarbutton-icon {
  padding-inline-start: 0 !important;
}

#zoom-controls > #zoom-reset-button > .toolbarbutton-text {
  min-width: revert !important;
  &:before {
    margin-top: 1.2px;
    transform: translateY(-50%);
  }
}

:root[uidensity="compact"] {
  #zoom-controls > #zoom-reset-button > .toolbarbutton-text {
    &:before {
      margin-top: 3px;
    }
  }
}

:root[uidensity="touch"] {
  #zoom-controls > #zoom-reset-button > .toolbarbutton-text {
    &:before {
      margin-top: 0px;
    }
  }
}

#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button {
  display: revert !important;
}

#wrapper-zoom-controls[place="palette"]
  > #zoom-controls
  > #zoom-reset-button::before {
  content: "100%" !important;
  line-height: 1.5em !important;
  height: 20px !important;
  min-height: 20px !important;
  box-sizing: border-box !important;
  font-size: 0.98em;
  padding-inline: 5px !important;
  background: hsla(0, 0%, 100%, 0.045);
  border: 1px solid var(--toolbarbutton-hover-background);
  border-radius: 10px !important;
  opacity: 0.4 !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette)
  #zoom-controls
  > #zoom-reset-button {
  margin-block: var(--toolbarbutton-inner-padding) !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette, panel)
  #zoom-controls
  > #zoom-reset-button
  > .toolbarbutton-text {
  height: 20px !important;
  min-height: 20px !important;
  font-size: 0.98em;
  background: hsla(0, 0%, 100%, 0.045);
  border: 1px solid var(--toolbarbutton-hover-background);
  border-radius: 10px !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette, panel)
  #zoom-controls
  > #zoom-reset-button:not([disabled]):is(:hover, :focus-visible)
  > .toolbarbutton-text {
  border-color: transparent;
  background-color: var(--toolbarbutton-hover-background) !important;
}

:where(toolbar:not(#PersonalToolbar), .customization-palette, panel)
  #zoom-controls
  > #zoom-reset-button:not([disabled]):hover:active
  > .toolbarbutton-text {
  background-color: var(--toolbarbutton-active-background) !important;
}

#zoom-controls[cui-areatype="panel"] > #zoom-reset-button {
  padding-block: 0 !important;
  margin: 0 !important;
  min-height: revert !important;
  background: none !important;
}

#zoom-controls[cui-areatype="panel"]
  > #zoom-reset-button
  > .toolbarbutton-text {
  padding: var(--toolbarbutton-inner-padding) !important;
  flex: 1 !important;
  padding-block: 4px !important;
  height: auto !important;
  border-radius: 50px !important;
}

:is(toolbar, .customization-palette):not(#PersonalToolbar)
  #zoom-controls
  separator {
  display: none !important;
}

/** 修正用户头像在定制窗口里的显示 */
#wrapper-fxa-toolbar-menu-button #fxa-avatar-image {
  padding: var(--toolbarbutton-inner-padding) !important;
  width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
  height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
}

[appname="Floorp"] #statusBar {
  background-color: var(--toolbar-bgcolor) !important;
}
