@media (prefers-color-scheme: light) {
  :root {
    --uc-compact-tab-close-button-bg-color: rgb(245, 245, 245);
    --uc-compact-tab-close-button-bg-hover-color: rgb(254, 254, 254);
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --uc-compact-tab-close-button-bg-color: rgb(28, 28, 32);
    --uc-compact-tab-close-button-bg-hover-color: rgb(0, 0, 0);
  }
}

@media not (-moz-bool-pref: "zen.view.sidebar-expanded") {
  & .tabbrowser-tab {
    &:not([pinned]) {
      &:hover .tab-icon-stack {
        margin-left: 7px;
      }

      &:hover .tab-close-button {
        position: absolute !important;
        display: block !important;
        padding: 5px !important;
        height: 18px !important;
        width: 18px !important;
        border-radius: 50% !important;
        margin-inline-end: 0 !important;
        margin-left: -8px;
        margin-top: -18px;
        background-color: var(
          --zen-urlbar-background,
          var(--uc-compact-tab-close-button-bg-color)
        ) !important;
        cursor: pointer;
        transition: background-color 0.1s ease-in-out;

        &:hover {
          background-color: var(
            --zen-main-browser-background,
            var(--uc-compact-tab-close-button-bg-hover-color)
          ) !important;
        }
      }
    }
  }
}