{ colors }:
with colors;
''
  :root {
    --zen-colors-primary: #${base02-hex} !important;
    --zen-primary-color: #${base0D-hex} !important;
    --zen-colors-secondary: #${base02-hex} !important;
    --zen-colors-tertiary: #${base01-hex} !important;
    --zen-colors-border: #${base0D-hex} !important;
    --toolbarbutton-icon-fill: #${base0D-hex} !important;
    --lwt-text-color: #${base05-hex} !important;
    --toolbar-field-color: #${base05-hex} !important;
    --tab-selected-textcolor: #${base05-hex} !important;
    --toolbar-field-focus-color: #${base05-hex} !important;
    --toolbar-color: #${base05-hex} !important;
    --newtab-text-primary-color: #${base05-hex} !important;
    --arrowpanel-color: #${base05-hex} !important;
    --arrowpanel-background: #${base00-hex} !important;
    --sidebar-text-color: #${base05-hex} !important;
    --lwt-sidebar-text-color: #${base05-hex} !important;
    --lwt-sidebar-background-color: #${base00-hex} !important;
    --toolbar-bgcolor: #${base02-hex} !important;
    --newtab-background-color: #${base00-hex} !important;
    --zen-themed-toolbar-bg: #${base00-hex} !important;
    --zen-main-browser-background: #${base00-hex} !important;
    --toolbox-bgcolor-inactive: #${base01-hex} !important;
  }

  #permissions-granted-icon {
    color: #${base05-hex} !important;
  }

  .sidebar-placesTree {
    background-color: #${base00-hex} !important;
  }

  #zen-workspaces-button {
    background-color: #${base00-hex} !important;
  }

  #TabsToolbar {
    background-color: #${base00-hex} !important;
  }

  .urlbar-background {
    background-color: #${base02-hex} !important;
  }

  .content-shortcuts {
    background-color: #${base00-hex} !important;
    border-color: #${base0D-hex} !important;
  }

  .urlbarView-url {
    color: #${base0D-hex} !important;
  }

  #urlbar-input::selection {
    background-color: #${base0D-hex} !important;
    color: #${base00-hex} !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #${base00-hex} !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #${base02-hex} !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #${base00-hex};
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #${base0D-hex} !important;
    --identity-icon-color: #${base0D-hex} !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #${base0C-hex} !important;
    --identity-icon-color: #${base0C-hex} !important;
  }

  .identity-color-green {
    --identity-tab-color: #${base0B-hex} !important;
    --identity-icon-color: #${base0B-hex} !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #${base0A-hex} !important;
    --identity-icon-color: #${base0A-hex} !important;
  }

  .identity-color-orange {
    --identity-tab-color: #${base09-hex} !important;
    --identity-icon-color: #${base09-hex} !important;
  }

  .identity-color-red {
    --identity-tab-color: #${base08-hex} !important;
    --identity-icon-color: #${base08-hex} !important;
  }

  .identity-color-pink {
    --identity-tab-color: #${base0E-hex} !important;
    --identity-icon-color: #${base0E-hex} !important;
  }

  .identity-color-purple {
    --identity-tab-color: #${base0F-hex} !important;
    --identity-icon-color: #${base0F-hex} !important;
  }

  hbox#titlebar {
    background-color: #${base00-hex} !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #${base00-hex} !important;
  }

  #contentAreaContextMenu menu,
  menuitem,
  menupopup {
    color: #${base05-hex} !important;
  }
''
