Bump lodash from 4.17.15 to 4.17.21

Bumps [lodash](https://github.com/lodash/lodash) from 4.17.15 to 4.17.21. - [Release notes](https://github.com/lodash/lodash/releases) - [Commits](https://github.com/lodash/lodash/compare/4.17.15...4.17.21) Signed-off-by: dependabot[bot] <support@github.com>
2025-12-13 15:29:53 +01:00 · 2021-05-07 15:02:59 +00:00
84 changed files with 1620 additions and 26711 deletions
--- a/Gulpfile.js
+++ b/Gulpfile.js
@@ -11,7 +11,7 @@ gulp.task('styles', function(done) {
 });

 gulp.task('shell-style', function(done) {
-    gulp.src('gnome-shell/**/*.scss')
+    gulp.src('gnome-shell/*.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest('./gnome-shell/'))
        .pipe(exec('gsettings set org.gnome.shell.extensions.user-theme name "Sweet"'))
--- a/cinnamon/_common.scss
+++ b/cinnamon/_common.scss
@@ -1254,225 +1254,182 @@ StScrollBar {
 //

 .window-list {
-
  &-box {
-    spacing: 6px;
-    padding-left: 10px;
-    padding-top: 1px;
+    spacing: 0;

-    &.vertical {
-      spacing: 2px;
-      padding-left: 0px;
-      padding-right: 0px;
-      padding-top: 10px;
-      padding-bottom: 10px;
+    .panel-top,
+    .panel-bottom & {
+      &:ltr { padding: 0 0 0 8px; }
+      &:rtl { padding: 0 8px 0 0; }
    }

-    &:highlight {
-      background-color: transparentize($error_color, 0.5);
-    }
-  }
+    &.vertical { padding: 6px 0 0 0; }

-  &-item-label {
-    font-weight: bold;
-    width: 15em;
-    min-width: 5px;
+    &:highlight { background-color: $selected_bg_color }
  }

  &-item-box {
-    font-weight: bold;
+    border: 0 none transparent;
+    border-image: none;
    background-image: none;
-    padding-top: 0;
-    padding-left: 8px;
-    padding-right: 8px;
-    transition-duration: 100;
-    color: transparentize($selected_fg_color, 0.4);
-
-    &.top,
-    &.bottom {
-      border-bottom-width: 2px;
-
-      & StLabel { padding-left: 2px; }
-    }
-
-    &.right {
-      padding-left: 0px;
-      padding-right: 0px;
-      border-right-width: 2px;
-
-      & StBin { padding-right: 0; }
-    }
-
-    &.left {
-      padding-left: 0px;
-      padding-right: 0px;
-      border-left-width: 2px;
-
-      & StBin { padding-left: 1px; }
-    }
-
-    &:hover,
-    &:groupFocus {
+    background-color: $panel_bg;
+    color: $osd_fg_color;
+    box-shadow: none;
+    font-weight: 400;
+    
+    &:hover {
      color: $selected_fg_color;
-      background-color: transparentize($selected_fg_color, 0.9);
-    }
+      @each $position, $_indicator in (top, 0 2px),
+                                      (bottom, 0 -2px),
+                                      (left, 2px 0),
+                                      (right, -2px 0) {
+        .panel-#{$position} & {
+          box-shadow: inset #{$_indicator} $selected_bg_color;
+        }
+      }

+    }
    &:active,
    &:checked,
-    &:focus,
-    &:running {
-      color: $selected_fg_color;
-      border-color: $selected_bg_color;
+    &:focus {
+      &, &:hover {
+        color: $selected_fg_color;
+
+        @each $position, $_indicator in (top, 0 2px),
+                                        (bottom, 0 -2px),
+                                        (left, 2px 0),
+                                        (right, -2px 0) {
+          .panel-#{$position} & {
+            box-shadow: inset #{$_indicator} $red;
+          }
+        }
+      }
    }

-    & .progress {
-      background-color: transparentize($selected_bg_color, 0.2);
+    StIcon,
+    StBin {
+      .panel-top &,
+      .panel-bottom & { padding: 0 (6px - 2px); }
+    }
+
+    &.vertical StIcon,
+    &.vertical StBin { padding: 0; }
+
+    StLabel {
+      font-weight: 400;
+
+      .panel-top &,
+      .panel-bottom & {
+        &:ltr { padding: 0 (6px - 2px) 0 0; }
+        &:rtl { padding: 0 0 0 (6px - 2px); }
+      }
+    }
+
+    &:progress,
+    .progress {
+      background-gradient-start: $selected_bg_color;
+      background-gradient-end: $selected_bg_color;
    }
  }

  &-item-demands-attention {
-    background-gradient-direction: vertical;
-    background-gradient-start: $destructive_color;
-    background-gradient-end: $destructive_color;
+    background-gradient-start: $selected_bg_color;
+    background-gradient-end: $selected_bg_color;
+    color: $selected_fg_color;
+
+    @each $position, $_indicator in (top, 0 2px),
+                                    (bottom, 0 -2px),
+                                    (left, 2px 0),
+                                    (right, -2px 0) {
+      .panel-#{$position} & {
+        box-shadow: inset #{$_indicator} $selected_bg_color;
+      }
+    }
  }

-  &-preview {
-    spacing: 6px;
-    color: $fg_color;
-    border: 1px solid $borders_color;
-    background-color: $bg_color;
-    border-radius: 3px;
-    padding: 6px 12px 12px 12px;
-    font-size: 1em;
+  
+
+  // >= 3.6.7
+  &-preview { // thumbnail popup windows = .switcher-list
+    padding: 20px - 8px; // = .switcher-list - .item-box
+    spacing: 8px; // = .switcher-list-item-container
+    border: none;
+    border-image: url("assets/misc/osd.svg") 9 9 9 9;
+    border-radius: 2px;
+    color: $osd_fg_color;
+    background: none;
  }
 }

-//
-// Grouped window list
-//

 .grouped-window-list {
-
-  &-item-label {
-    font-weight: bold;
-    width: 15em;
-    min-width: 5px;
-  }
-
  &-item-box {
-    text-align: left;
-    font-weight: bold;
+    border: 0 none transparent;
+    border-image: none;
    background-image: none;
-    padding-top: 0;
-    padding-left: 8px;
-    padding-right: 8px;
-    transition-duration: 100;
-    color: transparentize($selected_fg_color, 0.4);
-
-    &.top,
-    &.bottom {
-      border-bottom-width: 2px;
-
-      & StLabel { padding-left: 2px; }
-    }
-
-    &.right {
-      padding-left: 0px;
-      padding-right: 0px;
-      border-right-width: 2px;
-
-      & StBin { padding-right: 0; }
-    }
-
-    &.left {
-      padding-left: 0px;
-      padding-right: 0px;
-      border-left-width: 2px;
-
-      & StBin { padding-left: 1px; }
-    }
-
-    &:hover,
-    &:focus {
-      color: $selected_fg_color;
-      background-color: transparentize($panel_bg, 0.7);
+    background-color: $panel_bg;
+    color: $osd_fg_color;
+    box-shadow: none;
+    font-weight: 400;
+    
+    StIcon,
+    StBin {
+      .panel-top &,
+      .panel-bottom & { padding: 0 (6px - 2px); }
    }

    &:active,
    &:checked {
-      color: $selected_fg_color;
-      border-color: $selected_bg_color;
+          @each $position, $_indicator in (top, 0 2px),
+                                        (bottom, 0 -2px),
+                                        (left, 2px 0),
+                                        (right, -2px 0) {
+          .panel-#{$position} & {
+            box-shadow: inset #{$_indicator} lighten($panel_bg, 30%);
+          }
+        }
    }

-    & .progress {
-      background-color: transparentize($selected_bg_color, 0.2);
+    &:hover,
+    &:active:hover,
+    &:focus,
+    &:active:focus,
+    &:focus:hover,
+    &:active:focus:hover {
+        @each $position, $_indicator in (top, 0 2px),
+                                        (bottom, 0 -2px),
+                                        (left, 2px 0),
+                                        (right, -2px 0) {
+          .panel-#{$position} & {
+            box-shadow: inset #{$_indicator} $selected_bg_color
+          }
+        }
+    }
+
+
+    &:progress,
+    .progress {
+      background-gradient-start: $selected_bg_color;
+      background-gradient-end: $selected_bg_color;
    }
  }

  &-item-demands-attention {
-    background-gradient-direction: vertical;
-    background-gradient-start: $destructive_color;
-    background-gradient-end: $destructive_color;
-  }
+    background-gradient-start: $selected_bg_color;
+    background-gradient-end: $selected_bg_color;
+    color: $selected_fg_color;

-  &-thumbnail-label {
-    padding-left: 4px;
-  }
-
-  &-number-label {
-    z-index: 99;
-    color: $fg_color;
-  }
-
-  &-badge {
-    border-radius: 256px;
-    background-color: $panel_bg;
-  }
-
-  &-button-label {
-    padding-left: 4px;
-  }
-
-  &-thumbnail-alert {
-    background: rgba(255,52,52,0.3);
-  }
-
-  &-thumbnail-menu {
-    color: $fg_color;
-    border: 1px solid $borders_color;
-    background-color: $bg_color;
-    border-radius: 3px;
-    padding: 0px;
-
-    > StBoxLayout {
-      padding: 4px;
-    }
-
-    .item-box {
-      padding: 10px;
-      border-radius: 2px;
-      spacing: 4px;
-
-      &:outlined {
-        padding: 8px;
-        border: 1px solid $selected_bg_color;
-      }
-
-      &:selected {
-        border: 1px solid $selected_bg_color;
+    @each $position, $_indicator in (top, 0 2px),
+                                    (bottom, 0 -2px),
+                                    (left, 2px 0),
+                                    (right, -2px 0) {
+      .panel-#{$position} & {
+        box-shadow: inset #{$_indicator} $selected_bg_color;
      }
    }
-
-    .thumbnail { width: 256px; }
-
-    .separator {
-      width: 1px;
-      background: rgba(255,255,255,0.2);
-    }
  }
+
 }
-
-
 ///
 // Sound Applet (status/volume.js)
 //
@@ -1852,25 +1809,3 @@ StScrollBar {
  background-color: rgba(0,0,0,0);
  border-radius: 0px;
 }
-
-//
-// Cinnamenu applet
-//
-
-.menu-category-button {
-
-  padding: 7px;
-  border: 1px solid rgba(0, 0, 0, 0); 
-  
-  &-selected {
-    padding: 7px;
-    color: $selected_fg_color;
-    background-color: $selected_bg_color;
-    border: 1px solid $borders_color; 
-  }
-
-  &-hover {
-    background-color: transparentize($selected_bg_color, 0.7);
-    border-radius: 2px; 
-  }
-}
--- a/cinnamon/cinnamon-dark.css
+++ b/cinnamon/cinnamon-dark.css
@@ -1088,153 +1088,137 @@ StScrollBar {
    background-color: #00e8b7; }

 .window-list-box {
-  spacing: 6px;
-  padding-left: 10px;
-  padding-top: 1px; }
+  spacing: 0; }
+  .window-list-box .panel-top:ltr,
+  .panel-bottom .window-list-box:ltr {
+    padding: 0 0 0 8px; }
+  .window-list-box .panel-top:rtl,
+  .panel-bottom .window-list-box:rtl {
+    padding: 0 8px 0 0; }
  .window-list-box.vertical {
-    spacing: 2px;
-    padding-left: 0px;
-    padding-right: 0px;
-    padding-top: 10px;
-    padding-bottom: 10px; }
+    padding: 6px 0 0 0; }
  .window-list-box:highlight {
-    background-color: rgba(252, 65, 56, 0.5); }
-
-.window-list-item-label {
-  font-weight: bold;
-  width: 15em;
-  min-width: 5px; }
+    background-color: #00e8b7; }

 .window-list-item-box {
-  font-weight: bold;
+  border: 0 none transparent;
+  border-image: none;
  background-image: none;
-  padding-top: 0;
-  padding-left: 8px;
-  padding-right: 8px;
-  transition-duration: 100;
-  color: rgba(247, 247, 247, 0.6); }
-  .window-list-item-box.top, .window-list-item-box.bottom {
-    border-bottom-width: 2px; }
-    .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel {
-      padding-left: 2px; }
-  .window-list-item-box.right {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-right-width: 2px; }
-    .window-list-item-box.right StBin {
-      padding-right: 0; }
-  .window-list-item-box.left {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-left-width: 2px; }
-    .window-list-item-box.left StBin {
-      padding-left: 1px; }
-  .window-list-item-box:hover, .window-list-item-box:groupFocus {
-    color: #f7f7f7;
-    background-color: rgba(247, 247, 247, 0.1); }
-  .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:focus, .window-list-item-box:running {
-    color: #f7f7f7;
-    border-color: #00e8b7; }
+  background-color: #182129;
+  color: #BAC3CF;
+  box-shadow: none;
+  font-weight: 400; }
+  .window-list-item-box:hover {
+    color: #f7f7f7; }
+    .panel-top .window-list-item-box:hover {
+      box-shadow: inset 0 2px #00e8b7; }
+    .panel-bottom .window-list-item-box:hover {
+      box-shadow: inset 0 -2px #00e8b7; }
+    .panel-left .window-list-item-box:hover {
+      box-shadow: inset 2px 0 #00e8b7; }
+    .panel-right .window-list-item-box:hover {
+      box-shadow: inset -2px 0 #00e8b7; }
+  .window-list-item-box:active, .window-list-item-box:active:hover, .window-list-item-box:checked, .window-list-item-box:checked:hover, .window-list-item-box:focus, .window-list-item-box:focus:hover {
+    color: #f7f7f7; }
+    .panel-top .window-list-item-box:active, .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus, .panel-top .window-list-item-box:focus:hover {
+      box-shadow: inset 0 2px #ed254e; }
+    .panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus, .panel-bottom .window-list-item-box:focus:hover {
+      box-shadow: inset 0 -2px #ed254e; }
+    .panel-left .window-list-item-box:active, .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus, .panel-left .window-list-item-box:focus:hover {
+      box-shadow: inset 2px 0 #ed254e; }
+    .panel-right .window-list-item-box:active, .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus, .panel-right .window-list-item-box:focus:hover {
+      box-shadow: inset -2px 0 #ed254e; }
+  .panel-top .window-list-item-box StIcon,
+  .panel-bottom .window-list-item-box StIcon, .panel-top
+  .window-list-item-box StBin,
+  .panel-bottom
+  .window-list-item-box StBin {
+    padding: 0 4px; }
+  .window-list-item-box.vertical StIcon,
+  .window-list-item-box.vertical StBin {
+    padding: 0; }
+  .window-list-item-box StLabel {
+    font-weight: 400; }
+    .panel-top .window-list-item-box StLabel:ltr,
+    .panel-bottom .window-list-item-box StLabel:ltr {
+      padding: 0 4px 0 0; }
+    .panel-top .window-list-item-box StLabel:rtl,
+    .panel-bottom .window-list-item-box StLabel:rtl {
+      padding: 0 0 0 4px; }
+  .window-list-item-box:progress,
  .window-list-item-box .progress {
-    background-color: rgba(0, 232, 183, 0.8); }
+    background-gradient-start: #00e8b7;
+    background-gradient-end: #00e8b7; }

 .window-list-item-demands-attention {
-  background-gradient-direction: vertical;
-  background-gradient-start: #F04A50;
-  background-gradient-end: #F04A50; }
+  background-gradient-start: #00e8b7;
+  background-gradient-end: #00e8b7;
+  color: #f7f7f7; }
+  .panel-top .window-list-item-demands-attention {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .window-list-item-demands-attention {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .window-list-item-demands-attention {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .window-list-item-demands-attention {
+    box-shadow: inset -2px 0 #00e8b7; }

 .window-list-preview {
-  spacing: 6px;
-  color: #98abb2;
-  border: 1px solid #161819;
-  background-color: #222e39;
-  border-radius: 3px;
-  padding: 6px 12px 12px 12px;
-  font-size: 1em; }
-
-.grouped-window-list-item-label {
-  font-weight: bold;
-  width: 15em;
-  min-width: 5px; }
+  padding: 12px;
+  spacing: 8px;
+  border: none;
+  border-image: url("assets/misc/osd.svg") 9 9 9 9;
+  border-radius: 2px;
+  color: #BAC3CF;
+  background: none; }

 .grouped-window-list-item-box {
-  text-align: left;
-  font-weight: bold;
+  border: 0 none transparent;
+  border-image: none;
  background-image: none;
-  padding-top: 0;
-  padding-left: 8px;
-  padding-right: 8px;
-  transition-duration: 100;
-  color: rgba(247, 247, 247, 0.6); }
-  .grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom {
-    border-bottom-width: 2px; }
-    .grouped-window-list-item-box.top StLabel, .grouped-window-list-item-box.bottom StLabel {
-      padding-left: 2px; }
-  .grouped-window-list-item-box.right {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-right-width: 2px; }
-    .grouped-window-list-item-box.right StBin {
-      padding-right: 0; }
-  .grouped-window-list-item-box.left {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-left-width: 2px; }
-    .grouped-window-list-item-box.left StBin {
-      padding-left: 1px; }
-  .grouped-window-list-item-box:hover, .grouped-window-list-item-box:focus {
-    color: #f7f7f7;
-    background-color: rgba(24, 33, 41, 0.3); }
-  .grouped-window-list-item-box:active, .grouped-window-list-item-box:checked {
-    color: #f7f7f7;
-    border-color: #00e8b7; }
+  background-color: #182129;
+  color: #BAC3CF;
+  box-shadow: none;
+  font-weight: 400; }
+  .panel-top .grouped-window-list-item-box StIcon,
+  .panel-bottom .grouped-window-list-item-box StIcon, .panel-top
+  .grouped-window-list-item-box StBin,
+  .panel-bottom
+  .grouped-window-list-item-box StBin {
+    padding: 0 4px; }
+  .panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked {
+    box-shadow: inset 0 2px #526e89; }
+  .panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked {
+    box-shadow: inset 0 -2px #526e89; }
+  .panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked {
+    box-shadow: inset 2px 0 #526e89; }
+  .panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked {
+    box-shadow: inset -2px 0 #526e89; }
+  .panel-top .grouped-window-list-item-box:hover, .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:focus, .panel-top .grouped-window-list-item-box:active:focus, .panel-top .grouped-window-list-item-box:focus:hover, .panel-top .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .grouped-window-list-item-box:hover, .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:focus, .panel-bottom .grouped-window-list-item-box:active:focus, .panel-bottom .grouped-window-list-item-box:focus:hover, .panel-bottom .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .grouped-window-list-item-box:hover, .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:focus, .panel-left .grouped-window-list-item-box:active:focus, .panel-left .grouped-window-list-item-box:focus:hover, .panel-left .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .grouped-window-list-item-box:hover, .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:focus, .panel-right .grouped-window-list-item-box:active:focus, .panel-right .grouped-window-list-item-box:focus:hover, .panel-right .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset -2px 0 #00e8b7; }
+  .grouped-window-list-item-box:progress,
  .grouped-window-list-item-box .progress {
-    background-color: rgba(0, 232, 183, 0.8); }
+    background-gradient-start: #00e8b7;
+    background-gradient-end: #00e8b7; }

 .grouped-window-list-item-demands-attention {
-  background-gradient-direction: vertical;
-  background-gradient-start: #F04A50;
-  background-gradient-end: #F04A50; }
-
-.grouped-window-list-thumbnail-label {
-  padding-left: 4px; }
-
-.grouped-window-list-number-label {
-  z-index: 99;
-  color: #98abb2; }
-
-.grouped-window-list-badge {
-  border-radius: 256px;
-  background-color: #182129; }
-
-.grouped-window-list-button-label {
-  padding-left: 4px; }
-
-.grouped-window-list-thumbnail-alert {
-  background: rgba(255, 52, 52, 0.3); }
-
-.grouped-window-list-thumbnail-menu {
-  color: #98abb2;
-  border: 1px solid #161819;
-  background-color: #222e39;
-  border-radius: 3px;
-  padding: 0px; }
-  .grouped-window-list-thumbnail-menu > StBoxLayout {
-    padding: 4px; }
-  .grouped-window-list-thumbnail-menu .item-box {
-    padding: 10px;
-    border-radius: 2px;
-    spacing: 4px; }
-    .grouped-window-list-thumbnail-menu .item-box:outlined {
-      padding: 8px;
-      border: 1px solid #00e8b7; }
-    .grouped-window-list-thumbnail-menu .item-box:selected {
-      border: 1px solid #00e8b7; }
-  .grouped-window-list-thumbnail-menu .thumbnail {
-    width: 256px; }
-  .grouped-window-list-thumbnail-menu .separator {
-    width: 1px;
-    background: rgba(255, 255, 255, 0.2); }
+  background-gradient-start: #00e8b7;
+  background-gradient-end: #00e8b7;
+  color: #f7f7f7; }
+  .panel-top .grouped-window-list-item-demands-attention {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .grouped-window-list-item-demands-attention {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .grouped-window-list-item-demands-attention {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .grouped-window-list-item-demands-attention {
+    box-shadow: inset -2px 0 #00e8b7; }

 .sound-button {
  width: 22px;
@@ -1530,15 +1514,3 @@ StScrollBar {
  border: 0px;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 0px; }
-
-.menu-category-button {
-  padding: 7px;
-  border: 1px solid rgba(0, 0, 0, 0); }
-  .menu-category-button-selected {
-    padding: 7px;
-    color: #f7f7f7;
-    background-color: #00e8b7;
-    border: 1px solid #161819; }
-  .menu-category-button-hover {
-    background-color: rgba(0, 232, 183, 0.3);
-    border-radius: 2px; }
--- a/cinnamon/cinnamon.css
+++ b/cinnamon/cinnamon.css
@@ -1088,153 +1088,137 @@ StScrollBar {
    background-color: #00e8b7; }

 .window-list-box {
-  spacing: 6px;
-  padding-left: 10px;
-  padding-top: 1px; }
+  spacing: 0; }
+  .window-list-box .panel-top:ltr,
+  .panel-bottom .window-list-box:ltr {
+    padding: 0 0 0 8px; }
+  .window-list-box .panel-top:rtl,
+  .panel-bottom .window-list-box:rtl {
+    padding: 0 8px 0 0; }
  .window-list-box.vertical {
-    spacing: 2px;
-    padding-left: 0px;
-    padding-right: 0px;
-    padding-top: 10px;
-    padding-bottom: 10px; }
+    padding: 6px 0 0 0; }
  .window-list-box:highlight {
-    background-color: rgba(252, 65, 56, 0.5); }
-
-.window-list-item-label {
-  font-weight: bold;
-  width: 15em;
-  min-width: 5px; }
+    background-color: #00e8b7; }

 .window-list-item-box {
-  font-weight: bold;
+  border: 0 none transparent;
+  border-image: none;
  background-image: none;
-  padding-top: 0;
-  padding-left: 8px;
-  padding-right: 8px;
-  transition-duration: 100;
-  color: rgba(247, 247, 247, 0.6); }
-  .window-list-item-box.top, .window-list-item-box.bottom {
-    border-bottom-width: 2px; }
-    .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel {
-      padding-left: 2px; }
-  .window-list-item-box.right {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-right-width: 2px; }
-    .window-list-item-box.right StBin {
-      padding-right: 0; }
-  .window-list-item-box.left {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-left-width: 2px; }
-    .window-list-item-box.left StBin {
-      padding-left: 1px; }
-  .window-list-item-box:hover, .window-list-item-box:groupFocus {
-    color: #f7f7f7;
-    background-color: rgba(247, 247, 247, 0.1); }
-  .window-list-item-box:active, .window-list-item-box:checked, .window-list-item-box:focus, .window-list-item-box:running {
-    color: #f7f7f7;
-    border-color: #00e8b7; }
+  background-color: #182129;
+  color: #BAC3CF;
+  box-shadow: none;
+  font-weight: 400; }
+  .window-list-item-box:hover {
+    color: #f7f7f7; }
+    .panel-top .window-list-item-box:hover {
+      box-shadow: inset 0 2px #00e8b7; }
+    .panel-bottom .window-list-item-box:hover {
+      box-shadow: inset 0 -2px #00e8b7; }
+    .panel-left .window-list-item-box:hover {
+      box-shadow: inset 2px 0 #00e8b7; }
+    .panel-right .window-list-item-box:hover {
+      box-shadow: inset -2px 0 #00e8b7; }
+  .window-list-item-box:active, .window-list-item-box:active:hover, .window-list-item-box:checked, .window-list-item-box:checked:hover, .window-list-item-box:focus, .window-list-item-box:focus:hover {
+    color: #f7f7f7; }
+    .panel-top .window-list-item-box:active, .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus, .panel-top .window-list-item-box:focus:hover {
+      box-shadow: inset 0 2px #ed254e; }
+    .panel-bottom .window-list-item-box:active, .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus, .panel-bottom .window-list-item-box:focus:hover {
+      box-shadow: inset 0 -2px #ed254e; }
+    .panel-left .window-list-item-box:active, .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus, .panel-left .window-list-item-box:focus:hover {
+      box-shadow: inset 2px 0 #ed254e; }
+    .panel-right .window-list-item-box:active, .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus, .panel-right .window-list-item-box:focus:hover {
+      box-shadow: inset -2px 0 #ed254e; }
+  .panel-top .window-list-item-box StIcon,
+  .panel-bottom .window-list-item-box StIcon, .panel-top
+  .window-list-item-box StBin,
+  .panel-bottom
+  .window-list-item-box StBin {
+    padding: 0 4px; }
+  .window-list-item-box.vertical StIcon,
+  .window-list-item-box.vertical StBin {
+    padding: 0; }
+  .window-list-item-box StLabel {
+    font-weight: 400; }
+    .panel-top .window-list-item-box StLabel:ltr,
+    .panel-bottom .window-list-item-box StLabel:ltr {
+      padding: 0 4px 0 0; }
+    .panel-top .window-list-item-box StLabel:rtl,
+    .panel-bottom .window-list-item-box StLabel:rtl {
+      padding: 0 0 0 4px; }
+  .window-list-item-box:progress,
  .window-list-item-box .progress {
-    background-color: rgba(0, 232, 183, 0.8); }
+    background-gradient-start: #00e8b7;
+    background-gradient-end: #00e8b7; }

 .window-list-item-demands-attention {
-  background-gradient-direction: vertical;
-  background-gradient-start: #F04A50;
-  background-gradient-end: #F04A50; }
+  background-gradient-start: #00e8b7;
+  background-gradient-end: #00e8b7;
+  color: #f7f7f7; }
+  .panel-top .window-list-item-demands-attention {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .window-list-item-demands-attention {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .window-list-item-demands-attention {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .window-list-item-demands-attention {
+    box-shadow: inset -2px 0 #00e8b7; }

 .window-list-preview {
-  spacing: 6px;
-  color: #98abb2;
-  border: 1px solid #161819;
-  background-color: #222e39;
-  border-radius: 3px;
-  padding: 6px 12px 12px 12px;
-  font-size: 1em; }
-
-.grouped-window-list-item-label {
-  font-weight: bold;
-  width: 15em;
-  min-width: 5px; }
+  padding: 12px;
+  spacing: 8px;
+  border: none;
+  border-image: url("assets/misc/osd.svg") 9 9 9 9;
+  border-radius: 2px;
+  color: #BAC3CF;
+  background: none; }

 .grouped-window-list-item-box {
-  text-align: left;
-  font-weight: bold;
+  border: 0 none transparent;
+  border-image: none;
  background-image: none;
-  padding-top: 0;
-  padding-left: 8px;
-  padding-right: 8px;
-  transition-duration: 100;
-  color: rgba(247, 247, 247, 0.6); }
-  .grouped-window-list-item-box.top, .grouped-window-list-item-box.bottom {
-    border-bottom-width: 2px; }
-    .grouped-window-list-item-box.top StLabel, .grouped-window-list-item-box.bottom StLabel {
-      padding-left: 2px; }
-  .grouped-window-list-item-box.right {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-right-width: 2px; }
-    .grouped-window-list-item-box.right StBin {
-      padding-right: 0; }
-  .grouped-window-list-item-box.left {
-    padding-left: 0px;
-    padding-right: 0px;
-    border-left-width: 2px; }
-    .grouped-window-list-item-box.left StBin {
-      padding-left: 1px; }
-  .grouped-window-list-item-box:hover, .grouped-window-list-item-box:focus {
-    color: #f7f7f7;
-    background-color: rgba(24, 33, 41, 0.3); }
-  .grouped-window-list-item-box:active, .grouped-window-list-item-box:checked {
-    color: #f7f7f7;
-    border-color: #00e8b7; }
+  background-color: #182129;
+  color: #BAC3CF;
+  box-shadow: none;
+  font-weight: 400; }
+  .panel-top .grouped-window-list-item-box StIcon,
+  .panel-bottom .grouped-window-list-item-box StIcon, .panel-top
+  .grouped-window-list-item-box StBin,
+  .panel-bottom
+  .grouped-window-list-item-box StBin {
+    padding: 0 4px; }
+  .panel-top .grouped-window-list-item-box:active, .panel-top .grouped-window-list-item-box:checked {
+    box-shadow: inset 0 2px #526e89; }
+  .panel-bottom .grouped-window-list-item-box:active, .panel-bottom .grouped-window-list-item-box:checked {
+    box-shadow: inset 0 -2px #526e89; }
+  .panel-left .grouped-window-list-item-box:active, .panel-left .grouped-window-list-item-box:checked {
+    box-shadow: inset 2px 0 #526e89; }
+  .panel-right .grouped-window-list-item-box:active, .panel-right .grouped-window-list-item-box:checked {
+    box-shadow: inset -2px 0 #526e89; }
+  .panel-top .grouped-window-list-item-box:hover, .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:focus, .panel-top .grouped-window-list-item-box:active:focus, .panel-top .grouped-window-list-item-box:focus:hover, .panel-top .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .grouped-window-list-item-box:hover, .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:focus, .panel-bottom .grouped-window-list-item-box:active:focus, .panel-bottom .grouped-window-list-item-box:focus:hover, .panel-bottom .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .grouped-window-list-item-box:hover, .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:focus, .panel-left .grouped-window-list-item-box:active:focus, .panel-left .grouped-window-list-item-box:focus:hover, .panel-left .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .grouped-window-list-item-box:hover, .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:focus, .panel-right .grouped-window-list-item-box:active:focus, .panel-right .grouped-window-list-item-box:focus:hover, .panel-right .grouped-window-list-item-box:active:focus:hover {
+    box-shadow: inset -2px 0 #00e8b7; }
+  .grouped-window-list-item-box:progress,
  .grouped-window-list-item-box .progress {
-    background-color: rgba(0, 232, 183, 0.8); }
+    background-gradient-start: #00e8b7;
+    background-gradient-end: #00e8b7; }

 .grouped-window-list-item-demands-attention {
-  background-gradient-direction: vertical;
-  background-gradient-start: #F04A50;
-  background-gradient-end: #F04A50; }
-
-.grouped-window-list-thumbnail-label {
-  padding-left: 4px; }
-
-.grouped-window-list-number-label {
-  z-index: 99;
-  color: #98abb2; }
-
-.grouped-window-list-badge {
-  border-radius: 256px;
-  background-color: #182129; }
-
-.grouped-window-list-button-label {
-  padding-left: 4px; }
-
-.grouped-window-list-thumbnail-alert {
-  background: rgba(255, 52, 52, 0.3); }
-
-.grouped-window-list-thumbnail-menu {
-  color: #98abb2;
-  border: 1px solid #161819;
-  background-color: #222e39;
-  border-radius: 3px;
-  padding: 0px; }
-  .grouped-window-list-thumbnail-menu > StBoxLayout {
-    padding: 4px; }
-  .grouped-window-list-thumbnail-menu .item-box {
-    padding: 10px;
-    border-radius: 2px;
-    spacing: 4px; }
-    .grouped-window-list-thumbnail-menu .item-box:outlined {
-      padding: 8px;
-      border: 1px solid #00e8b7; }
-    .grouped-window-list-thumbnail-menu .item-box:selected {
-      border: 1px solid #00e8b7; }
-  .grouped-window-list-thumbnail-menu .thumbnail {
-    width: 256px; }
-  .grouped-window-list-thumbnail-menu .separator {
-    width: 1px;
-    background: rgba(255, 255, 255, 0.2); }
+  background-gradient-start: #00e8b7;
+  background-gradient-end: #00e8b7;
+  color: #f7f7f7; }
+  .panel-top .grouped-window-list-item-demands-attention {
+    box-shadow: inset 0 2px #00e8b7; }
+  .panel-bottom .grouped-window-list-item-demands-attention {
+    box-shadow: inset 0 -2px #00e8b7; }
+  .panel-left .grouped-window-list-item-demands-attention {
+    box-shadow: inset 2px 0 #00e8b7; }
+  .panel-right .grouped-window-list-item-demands-attention {
+    box-shadow: inset -2px 0 #00e8b7; }

 .sound-button {
  width: 22px;
@@ -1530,15 +1514,3 @@ StScrollBar {
  border: 0px;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 0px; }
-
-.menu-category-button {
-  padding: 7px;
-  border: 1px solid rgba(0, 0, 0, 0); }
-  .menu-category-button-selected {
-    padding: 7px;
-    color: #f7f7f7;
-    background-color: #00e8b7;
-    border: 1px solid #161819; }
-  .menu-category-button-hover {
-    background-color: rgba(0, 232, 183, 0.3);
-    border-radius: 2px; }
--- a/gnome-shell/_common.scss
+++ b/gnome-shell/_common.scss
@@ -74,8 +74,6 @@ StEntry {
    warning-color: $warning_color;
    padding: 0 4px;
  }
-
-  StLabel.hint-text { color: transparentize($fg_color, 0.3); }
 }


@@ -524,11 +522,7 @@ StScrollBar {
    box-shadow: $depth6;
  }

-  .popup-menu-content { 
-    padding: 15px 0; 
-    background-color: $bg_color;
-    border-radius: 7px;
-  }
+  .popup-menu-content { padding: 15px 0; }
  .popup-menu-item {
    spacing: 5px;
    padding: 5px;
@@ -724,10 +718,7 @@ StScrollBar {
    spacing: 8px;
  }

-  .ws-switcher-active-up,
-  .ws-switcher-active-down,
-  .ws-switcher-active-left,
-  .ws-switcher-active-right {
+  .ws-switcher-active-up, .ws-switcher-active-down {
    height: 50px;
    background-color: $selected_bg_color;
    color: $selected_fg_color;
@@ -1388,10 +1379,6 @@ StScrollBar {
  spacing: 24px; //
 }

-#overview.cosmic-solid-bg {
-  background-color: $base_color !important;
-}
-
 .overview-controls {
  padding-bottom: 32px;
 }
@@ -1446,20 +1433,6 @@ StScrollBar {

  //search results

-  %search-section-content-item {  
-    &:focus,
-    &:hover,
-    &:selected {
-      background-color: transparentize($osd_fg_color, .9);
-      transition-duration: 200ms;
-    }
-  
-    &:active,
-    &:checked {
-      background-color: transparentize(darken($osd_bg_color, 10%), .1);
-    }
-  }
-
  #searchResultsBin {
    max-width: 1000px;
  }
@@ -1484,7 +1457,7 @@ StScrollBar {
  }
  .list-search-results { spacing: 3px; }

-  .search-section-separator { height: 2px; background-color: $gray; }
+  .search-section-separator { height: 2px; background-color: rgba(255, 255, 255, 0.2); }

  .list-search-result-content { spacing: 30px; }
  .list-search-result-title { color: lighten($topbar_color,5%); spacing: 12px; }
@@ -1493,12 +1466,6 @@ StScrollBar {
  .list-search-provider-content { spacing: 20px; }
  .search-provider-icon { padding: 15px; }

-  //Icon tile
-  .search-provider-icon,
-  .list-search-result {
-    @extend %search-section-content-item;
-  }
-

  /* DASHBOARD */

@@ -1581,6 +1548,16 @@ StScrollBar {
    }
  }

+  //Icon tile
+  .search-provider-icon,
+  .list-search-result {
+    @extend %icon_tile;
+    &:active, &:checked { background-color: transparentize(darken($osd_bg_color,10%),.1); }
+    &:focus, &:selected, &:hover {
+      background-color: transparentize($bg_color,.7);
+      transition-duration: 200ms;
+    }
+  }
  .app-well-app,
  .app-well-app.app-folder,
  .show-apps,
--- a/gnome-shell/_cosmic.scss
+++ b/gnome-shell/_cosmic.scss
@@ -1,31 +0,0 @@
-
-/* Pop_OS COSMIC Dock styling, append !important to any changed rules */
-
-.cosmic-dock #dock {
-  border-radius: 12px 12px 12px 12px !important;
-  border: 0 !important;
-  background-color: darken($bg_color, 3%);
-  margin: 4px !important; 
-}
-
-.cosmic-dock.extended #dock {
-  border-radius: 0px !important;
-  margin: 0 !important; }
-
-.cosmic-dock.extended.side #dock {
-  border-top-width: 0 !important;
-  border-bottom-width: 0 !important; }
-
-.cosmic-dock.extended.side.left #dock {
-  border-left-width: 0 !important; }
-
-.cosmic-dock.extended.side.right #dock {
-  border-right-width: 0 !important; }
-
-.cosmic-dock.extended.bottom #dock {
-  border-bottom-width: 0 !important;
-  border-left-width: 0 !important;
-  border-right-width: 0 !important; }
-
-.cosmic-dock .app-well-app:hover .overview-icon, .cosmic-dock .app-well-app:focus .overview-icon, .cosmic-dock .app-well-app:selected .overview-icon {
-  border-radius: 11px; }
--- a/gnome-shell/gnome-shell.css
+++ b/gnome-shell/gnome-shell.css
@@ -111,12 +111,11 @@ StEntry {
    icon-size: 16px;
    warning-color: #ff9f39;
    padding: 0 4px; }
-  StEntry StLabel.hint-text {
-    color: rgba(152, 171, 178, 0.7); }

 /* Scrollbars */
 StScrollView.vfade {
  -st-vfade-offset: 68px; }
+
 StScrollView.hfade {
  -st-hfade-offset: 68px; }

@@ -163,14 +162,18 @@ StScrollBar {
 /* Check Boxes */
 .check-box StBoxLayout {
  spacing: .8em; }
+
 .check-box StBin {
  width: 24px;
  height: 22px;
  background-image: url("assets/checkbox-off.svg"); }
+
 .check-box:focus, .check-box:hover StBin {
  background-image: url("assets/checkbox-off-focused.svg"); }
+
 .check-box:checked StBin {
  background-image: url("assets/checkbox.svg"); }
+
 .check-box:focus:checked StBin {
  background-image: url("assets/checkbox-focused.svg"); }

@@ -370,6 +373,7 @@ StScrollBar {

 .mount-dialog-app-list-item-icon:ltr {
  padding-right: 17px; }
+
 .mount-dialog-app-list-item-icon:rtl {
  padding-left: 17px; }

@@ -469,6 +473,7 @@ StScrollBar {
 .extension-dialog .message-dialog-main-layout {
  spacing: 24px;
  padding: 10px; }
+
 .extension-dialog .message-dialog-title {
  color: #576c74; }

@@ -494,9 +499,7 @@ StScrollBar {
    background-color: rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.2); }
  .popup-menu .popup-menu-content {
-    padding: 15px 0;
-    background-color: #222e39;
-    border-radius: 7px; }
+    padding: 15px 0; }
  .popup-menu .popup-menu-item {
    spacing: 5px;
    padding: 5px; }
@@ -660,10 +663,7 @@ StScrollBar {
  padding: 0px;
  spacing: 8px; }

-.ws-switcher-active-up,
-.ws-switcher-active-down,
-.ws-switcher-active-left,
-.ws-switcher-active-right {
+.ws-switcher-active-up, .ws-switcher-active-down {
  height: 50px;
  background-color: #00e8b7;
  color: #f7f7f7;
@@ -772,9 +772,17 @@ StScrollBar {
    #panel .panel-button .system-status-icon {
      icon-size: 1.09em;
      padding: 0 5px; }
-    .unlock-screen #panel .panel-button, .login-screen #panel .panel-button, .lock-screen #panel .panel-button {
+    .unlock-screen #panel .panel-button,
+    .login-screen #panel .panel-button,
+    .lock-screen #panel .panel-button {
      color: #b5c3c8; }
-      .unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active, .login-screen #panel .panel-button:focus, .login-screen #panel .panel-button:hover, .login-screen #panel .panel-button:active, .lock-screen #panel .panel-button:focus, .lock-screen #panel .panel-button:hover, .lock-screen #panel .panel-button:active {
+      .unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active,
+      .login-screen #panel .panel-button:focus,
+      .login-screen #panel .panel-button:hover,
+      .login-screen #panel .panel-button:active,
+      .lock-screen #panel .panel-button:focus,
+      .lock-screen #panel .panel-button:hover,
+      .lock-screen #panel .panel-button:active {
        color: #b5c3c8; }
    #panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
      box-shadow: none; }
@@ -859,6 +867,7 @@ StScrollBar {
 .events-button:hover,
 .events-button:focus {
  background-color: #2c3b49; }
+
 .datemenu-today-button:active,
 .world-clocks-button:active,
 .weather-button:active,
@@ -1022,8 +1031,9 @@ StScrollBar {
  padding: 8px;
  color: #98abb2;
  background-color: transparent; }
-.message-list-section-close:hover > StIcon, .message-list-section-close:focus > StIcon
-.message-list-section-close:active > StIcon {
+
+.message-list-section-close:hover > StIcon,
+.message-list-section-close:focus > StIcon .message-list-section-close:active > StIcon {
  color: #ff007a;
  background: transparent; }

@@ -1052,7 +1062,7 @@ StScrollBar {
  color: #6c8791;
  font-size: 0.7em;
  /* HACK: the label should be baseline-aligned with a 1em label,
-           fake this with some bottom padding */
+                     fake this with some bottom padding */
  padding-bottom: 0.13em; }

 .message-secondary-bin > StIcon {
@@ -1090,11 +1100,13 @@ StScrollBar {
 .world-clocks-button .world-clocks-city {
  color: #98abb2;
  font-weight: normal; }
+
 .world-clocks-button .world-clocks-time {
  font-weight: bold;
  color: #98abb2;
  font-feature-settings: "lnum";
  text-align: right; }
+
 .world-clocks-button .world-clocks-timezone {
  color: #627a82;
  font-feature-settings: "tnum"; }
@@ -1105,12 +1117,14 @@ StScrollBar {
  font-weight: bold; }
  .weather-button .weather-header.location {
    font-weight: normal; }
+
 .weather-button .weather-forecast-time {
  color: #7b939c;
  font-feature-settings: "tnum";
  font-weight: normal;
  padding-top: 0.2em;
  padding-bottom: 0.4em; }
+
 .weather-button .weather-forecast-temp {
  font-weight: bold; }

@@ -1241,9 +1255,6 @@ StScrollBar {
 #overview {
  spacing: 24px; }

-#overview.cosmic-solid-bg {
-  background-color: #1E282C !important; }
-
 .overview-controls {
  padding-bottom: 32px; }

@@ -1288,17 +1299,6 @@ StScrollBar {
    .search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon {
      color: #98abb2; }

-.search-provider-icon:focus,
-.list-search-result:focus, .search-provider-icon:hover,
-.list-search-result:hover, .search-provider-icon:selected,
-.list-search-result:selected {
-  background-color: rgba(152, 171, 178, 0.1);
-  transition-duration: 200ms; }
-.search-provider-icon:active,
-.list-search-result:active, .search-provider-icon:checked,
-.list-search-result:checked {
-  background-color: rgba(15, 20, 25, 0.85); }
-
 #searchResultsBin {
  max-width: 1000px; }

@@ -1322,7 +1322,7 @@ StScrollBar {

 .search-section-separator {
  height: 2px;
-  background-color: #2f404f; }
+  background-color: rgba(255, 255, 255, 0.2); }

 .list-search-result-content {
  spacing: 30px; }
@@ -1408,12 +1408,25 @@ StScrollBar {
  .app-view-control:last-child {
    border-radius: 0 3px 3px 0; }

+.search-provider-icon:active, .search-provider-icon:checked,
+.list-search-result:active,
+.list-search-result:checked {
+  background-color: rgba(15, 20, 25, 0.85); }
+
+.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover,
+.list-search-result:focus,
+.list-search-result:selected,
+.list-search-result:hover {
+  background-color: rgba(34, 46, 57, 0.3);
+  transition-duration: 200ms; }
+
 .app-well-app,
 .app-well-app.app-folder,
 .show-apps,
 .grid-search-result {
  border: none; }
-  .app-well-app:active .overview-icon, .app-well-app:checked .overview-icon,
+  .app-well-app:active .overview-icon,
+  .app-well-app:checked .overview-icon,
  .app-well-app.app-folder:active .overview-icon,
  .app-well-app.app-folder:checked .overview-icon,
  .show-apps:active .overview-icon,
@@ -1423,7 +1436,9 @@ StScrollBar {
    background-color: rgba(21, 28, 35, 0.85);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
    color: #98abb2; }
-  .app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon,
+  .app-well-app:hover .overview-icon,
+  .app-well-app:focus .overview-icon,
+  .app-well-app:selected .overview-icon,
  .app-well-app.app-folder:hover .overview-icon,
  .app-well-app.app-folder:focus .overview-icon,
  .app-well-app.app-folder:selected .overview-icon,
@@ -1446,7 +1461,8 @@ StScrollBar {
  box-shadow: 0px 0px 5px 4px rgba(0, 232, 183, 0.8);
  margin-bottom: 0px; }

-.app-well-app .overview-icon,
+.search-provider-icon,
+.list-search-result, .app-well-app .overview-icon,
 .app-well-app.app-folder .overview-icon,
 .show-apps .overview-icon,
 .grid-search-result .overview-icon {
@@ -1837,7 +1853,8 @@ StScrollBar {

 .login-dialog-not-listed-label {
  padding-left: 2px; }
-  .login-dialog-not-listed-button:focus .login-dialog-not-listed-label, .login-dialog-not-listed-button:hover .login-dialog-not-listed-label {
+  .login-dialog-not-listed-button:focus .login-dialog-not-listed-label,
+  .login-dialog-not-listed-button:hover .login-dialog-not-listed-label {
    color: #98abb2; }

 .login-dialog-not-listed-label {
@@ -1884,6 +1901,7 @@ StScrollBar {

 .user-widget-label:ltr {
  padding-left: 18px; }
+
 .user-widget-label:rtl {
  padding-right: 18px; }

@@ -2011,6 +2029,7 @@ StScrollBar {
 .lg-dialog StEntry {
  selection-background-color: #bbbbbb;
  selected-color: #333333; }
+
 .lg-dialog .shell-link {
  color: #999999; }
  .lg-dialog .shell-link:hover {
@@ -2065,34 +2084,3 @@ StScrollBar {

 .openweather-current-databox-captions, .openweather-forecast-day {
  color: #00e8b7; }
-
-/* Pop_OS COSMIC Dock styling, append !important to any changed rules */
-.cosmic-dock #dock {
-  border-radius: 12px 12px 12px 12px !important;
-  border: 0 !important;
-  background-color: #1c262f;
-  margin: 4px !important; }
-
-.cosmic-dock.extended #dock {
-  border-radius: 0px !important;
-  margin: 0 !important; }
-
-.cosmic-dock.extended.side #dock {
-  border-top-width: 0 !important;
-  border-bottom-width: 0 !important; }
-
-.cosmic-dock.extended.side.left #dock {
-  border-left-width: 0 !important; }
-
-.cosmic-dock.extended.side.right #dock {
-  border-right-width: 0 !important; }
-
-.cosmic-dock.extended.bottom #dock {
-  border-bottom-width: 0 !important;
-  border-left-width: 0 !important;
-  border-right-width: 0 !important; }
-
-.cosmic-dock .app-well-app:hover .overview-icon, .cosmic-dock .app-well-app:focus .overview-icon, .cosmic-dock .app-well-app:selected .overview-icon {
-  border-radius: 11px; }
-
-/*# sourceMappingURL=gnome-shell.css.map */
--- a/gnome-shell/gnome-shell.scss
+++ b/gnome-shell/gnome-shell.scss
@@ -3,5 +3,4 @@ $subtheme: 'main';
@import "colors"; //use gtk colors
@import "drawing";
@import "common";
-@import "extensions";
-@import "cosmic"
+@import "extensions"
--- a/gnome-shell/v40/_common.scss
+++ b/gnome-shell/v40/_common.scss
--- a/gnome-shell/v40/gnome-shell.css
+++ b/gnome-shell/v40/gnome-shell.css
--- a/gnome-shell/v40/gnome-shell.scss
+++ b/gnome-shell/v40/gnome-shell.scss
@@ -1,6 +0,0 @@
-$subtheme: 'main';
-
-@import "../colors"; //use gtk colors
-@import "../drawing";
-@import "common";
-@import "../extensions"
--- a/gtk-3.0/_colors-public.scss
+++ b/gtk-3.0/_colors-public.scss
@@ -108,78 +108,4 @@ read if you used those and something break with a version upgrade you're on your

 //Budgie desktop
@define-color budgie_tasklist_indicator_color #{"" +$selected_bg_color};
-@define-color budgie_tasklist_indicator_color_active #{"" +$selected_bg_color};
-
-
-// Elementary OS colors
-@define-color STRAWBERRY_100 #{$STRAWBERRY_100};
-@define-color STRAWBERRY_300 #{$STRAWBERRY_300};
-@define-color STRAWBERRY_500 #{$STRAWBERRY_500};
-@define-color STRAWBERRY_700 #{$STRAWBERRY_700};
-@define-color STRAWBERRY_900 #{$STRAWBERRY_900};
-
-@define-color ORANGE_100 #{$ORANGE_100};
-@define-color ORANGE_300 #{$ORANGE_300};
-@define-color ORANGE_500 #{$ORANGE_500};
-@define-color ORANGE_700 #{$ORANGE_700};
-@define-color ORANGE_900 #{$ORANGE_900};
-
-@define-color BANANA_100 #{$BANANA_100};
-@define-color BANANA_300 #{$BANANA_300};
-@define-color BANANA_500 #{$BANANA_500};
-@define-color BANANA_700 #{$BANANA_700};
-@define-color BANANA_900 #{$BANANA_900};
-
-@define-color LIME_100 #{$LIME_100};
-@define-color LIME_300 #{$LIME_300};
-@define-color LIME_500 #{$LIME_500};
-@define-color LIME_700 #{$LIME_700};
-@define-color LIME_900 #{$LIME_900};
-
-@define-color MINT_100 #{$MINT_100};
-@define-color MINT_300 #{$MINT_300};
-@define-color MINT_500 #{$MINT_500};
-@define-color MINT_700 #{$MINT_700};
-@define-color MINT_900 #{$MINT_900};
-
-@define-color BLUEBERRY_100 #{$BLUEBERRY_100};
-@define-color BLUEBERRY_300 #{$BLUEBERRY_300};
-@define-color BLUEBERRY_500 #{$BLUEBERRY_500};
-@define-color BLUEBERRY_700 #{$BLUEBERRY_700};
-@define-color BLUEBERRY_900 #{$BLUEBERRY_900};
-
-@define-color BUBBLEGUM_100 #{$BUBBLEGUM_100};
-@define-color BUBBLEGUM_300 #{$BUBBLEGUM_300};
-@define-color BUBBLEGUM_500 #{$BUBBLEGUM_500};
-@define-color BUBBLEGUM_700 #{$BUBBLEGUM_700};
-@define-color BUBBLEGUM_900 #{$BUBBLEGUM_900};
-
-@define-color GRAPE_100 #{$GRAPE_100};
-@define-color GRAPE_300 #{$GRAPE_300};
-@define-color GRAPE_500 #{$GRAPE_500};
-@define-color GRAPE_700 #{$GRAPE_700};
-@define-color GRAPE_900 #{$GRAPE_900};
-
-@define-color COCOA_100 #{$COCOA_100};
-@define-color COCOA_300 #{$COCOA_300};
-@define-color COCOA_500 #{$COCOA_500};
-@define-color COCOA_700 #{$COCOA_700};
-@define-color COCOA_900 #{$COCOA_900};
-
-@define-color SILVER_100 #{$SILVER_100};
-@define-color SILVER_300 #{$SILVER_300};
-@define-color SILVER_500 #{$SILVER_500};
-@define-color SILVER_700 #{$SILVER_700};
-@define-color SILVER_900 #{$SILVER_900};
-
-@define-color SLATE_100 #{$SLATE_100};
-@define-color SLATE_300 #{$SLATE_300};
-@define-color SLATE_500 #{$SLATE_500};
-@define-color SLATE_700 #{$SLATE_700};
-@define-color SLATE_900 #{$SLATE_900};
-
-@define-color BLACK_100 #{$BLACK_100};
-@define-color BLACK_300 #{$BLACK_300};
-@define-color BLACK_500 #{$BLACK_500};
-@define-color BLACK_700 #{$BLACK_700};
-@define-color BLACK_900 #{"" + $BLACK_900};
+@define-color budgie_tasklist_indicator_color_active #{"" +$selected_bg_color};
--- a/gtk-3.0/_elementary-colors.scss
+++ b/gtk-3.0/_elementary-colors.scss
@@ -1,71 +0,0 @@
-$STRAWBERRY_100: #ff8c82;
-$STRAWBERRY_300: #ed5353;
-$STRAWBERRY_500: #c6262e;
-$STRAWBERRY_700: #a10705;
-$STRAWBERRY_900: #7a0000;
-
-$ORANGE_100: #ffc27d;
-$ORANGE_300: #ffa154;
-$ORANGE_500: #f37329;
-$ORANGE_700: #cc3b02;
-$ORANGE_900: #a62100;
-
-$BANANA_100: #fff394;
-$BANANA_300: #ffe16b;
-$BANANA_500: #f9c440;
-$BANANA_700: #d48e15;
-$BANANA_900: #ad5f00;
-
-$LIME_100: #d1ff82;
-$LIME_300: #9bdb4d;
-$LIME_500: #68b723;
-$LIME_700: #3a9104;
-$LIME_900: #206b00;
-
-$MINT_100: #89ffdd;
-$MINT_300: #43d6b5;
-$MINT_500: #28bca3;
-$MINT_700: #0e9a83;
-$MINT_900: #007367;
-
-$BLUEBERRY_100: #8cd5ff;
-$BLUEBERRY_300: #64baff;
-$BLUEBERRY_500: #3689e6;
-$BLUEBERRY_700: #0d52bf;
-$BLUEBERRY_900: #002e99;
-
-$BUBBLEGUM_100: #fe9ab8;
-$BUBBLEGUM_300: #f4679d;
-$BUBBLEGUM_500: #de3e80;
-$BUBBLEGUM_700: #bc245d;
-$BUBBLEGUM_900: #910e38;
-
-$GRAPE_100: #e4c6fa;
-$GRAPE_300: #cd9ef7;
-$GRAPE_500: #a56de2;
-$GRAPE_700: #7239b3;
-$GRAPE_900: #452981;
-
-$COCOA_100: #a3907c;
-$COCOA_300: #8a715e;
-$COCOA_500: #715344;
-$COCOA_700: #57392d;
-$COCOA_900: #3d211b;
-
-$SILVER_100: #fafafa;
-$SILVER_300: #d4d4d4;
-$SILVER_500: #abacae;
-$SILVER_700: #7e8087;
-$SILVER_900: #555761;
-
-$SLATE_100: #95a3ab;
-$SLATE_300: #667885;
-$SLATE_500: #485a6c;
-$SLATE_700: #273445;
-$SLATE_900: #0e141f;
-
-$BLACK_100: #666;
-$BLACK_300: #4d4d4d;
-$BLACK_500: #333;
-$BLACK_700: #1a1a1a;
-$BLACK_900: #000;
--- a/gtk-3.0/apps/_nemo.scss
+++ b/gtk-3.0/apps/_nemo.scss
@@ -60,10 +60,5 @@
            &:checked { @include button(active-header); }
        }
    }
-
-    .nemo-inactive-pane .view,
-    .nemo-inactive-pane iconview {
-        background-color: darken($base_color, 5%); 
-    }
    
 }
--- a/gtk-3.0/apps/_pantheon.scss
+++ b/gtk-3.0/apps/_pantheon.scss
@@ -304,142 +304,4 @@ LibraryWindow {
      }
    }
  }
-}
-
-
-/**************************
- * Colors in context menu *
-**************************/
-
-checkbutton.color-button {
-  border: 1px solid $borders_color;
-  border-radius: 100px;
-  background-clip: border-box;
-  padding: 0;
-  margin: 2px 1px;
-
-  > check {
-    -gtk-icon-source: none;
-    background: none;
-    margin-right: 0;
-    padding: 2px;
-  }
-
-  &.none {
-    > check {
-      background-color: transparent;
-      border-radius: 100px;
-      -gtk-icon-source: -gtk-icontheme("close-symbolic");
-    }
-  }
-
-}
-
-radiobutton.color-button {
-  > radio {
-    -gtk-icon-source: none;
-    margin-right: 0;
-    border: 1px solid rgba(black, 0.15);
-    border-radius: 100px;
-    background-clip: border-box;
-  }
-
-  &:active > radio {
-    border: 1px solid rgba(black, 0.35);
-  }
-}
-
-.color-button {
-  check,
-  check:checked,
-  radio,
-  radio:checked, {
-      background-image: none;
-      border: 1px solid rgba(black, 0.2);
-      border-radius: 50%;
-      color: $base_color;
-      -gtk-icon-source: -gtk-icontheme("check-active-symbolic");
-  }
-
-  &.red check,
-  &.red radio,
-  &.strawberry check,
-  &.strawberry radio {
-      background-color: #{'@STRAWBERRY_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@STRAWBERRY_500'};
-  }
-
-  &.orange check,
-  &.orange radio {
-      background-color: #{'@ORANGE_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@ORANGE_500'};
-  }
-
-  &.yellow check,
-  &.yellow radio,
-  &.banana check,
-  &.banana radio {
-      background-color: #{'@BANANA_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BANANA_700'};
-  }
-
-  &.green check,
-  &.green radio,
-  &.lime check,
-  &.lime radio {
-      background-color: #{'@LIME_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@LIME_700'};
-  }
-
-  &.blue check,
-  &.blue radio,
-  &.blueberry check,
-  &.blueberry radio {
-      background-color: #{'@BLUEBERRY_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BLUEBERRY_700'};
-  }
-
-  &.purple check,
-  &.purple radio,
-  &.grape check,
-  &.grape radio {
-      background-color: #{'@GRAPE_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@GRAPE_700'};
-  }
-
-  &.brown check,
-  &.brown radio,
-  &.cocoa check,
-  &.cocoa radio {
-      background-color: #{'@COCOA_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@COCOA_500'};
-  }
-
-  &.mint check,
-  &.mint radio  {
-      background-color: #{'@MINT_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@MINT_700'};
-  }
-
-  &.pink check,
-  &.pink radio,
-  &.bubblegum check,
-  &.bubblegum radio  {
-      background-color: #{'@BUBBLEGUM_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BUBBLEGUM_700'};
-  }
-
-  &.slate check,
-  &.slate radio  {
-      background-color: #{'@SLATE_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@SLATE_500'};
-
-  }
-
-  &.auto radio {
-      background-image: url("assets/color-button-auto.png");
-      background-position: -1px -1px;
-      background-repeat: no-repeat;
-      background-size: calc(100% + 2px);
-  }
 }
--- a/gtk-3.0/apps/_xfce.scss
+++ b/gtk-3.0/apps/_xfce.scss
@@ -75,14 +75,14 @@ scrolledwindow.sidebar treeview.view {
 }

 /* path-bar of thunar */
-window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.toggle.path-bar-button, .thunar toolbar .path-bar-button {
+window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.toggle.path-bar-button {
  margin-top: 7px;
  margin-bottom: 7px;
  &:hover { color: $selected_bg_color; }
  &:checked { @include button(active-header); }
 }

-window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.path-bar-button, .thunar toolbar .path-bar-button {
+window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.path-bar-button {
  background: none;
  outline: none;
  border: none;
--- a/gtk-3.0/gtk-dark.css
+++ b/gtk-3.0/gtk-dark.css
--- a/gtk-3.0/gtk-dark.scss
+++ b/gtk-3.0/gtk-dark.scss
@@ -3,7 +3,6 @@
 $variant: 'dark';

@import 'colors';
-@import 'elementary-colors';
@import 'colors-public';
@import 'drawing';
@import 'common';
--- a/gtk-3.0/gtk.css
+++ b/gtk-3.0/gtk.css
--- a/gtk-3.0/gtk.scss
+++ b/gtk-3.0/gtk.scss
@@ -3,7 +3,6 @@
 $variant: 'light';

@import 'colors';
-@import 'elementary-colors';
@import 'colors-public';
@import 'drawing';
@import 'common';
--- a/gtk-4.0/_apps.scss
+++ b/gtk-4.0/_apps.scss
@@ -1,19 +0,0 @@
-/**********************
- * DE-Specific Styles *
- **********************/
-
-@import 'apps/budgie';
-@import 'apps/gnome';
-@import 'apps/xfce';
-@import 'apps/pantheon';
-@import 'apps/unity';
-@import 'apps/mate';
-
-/***********************
- * App-Specific Styles *
- ***********************/
-
-@import 'apps/geary';
-@import 'apps/lightdm';
-@import 'apps/nemo';
-@import 'apps/caja';
--- a/gtk-4.0/_colors-public.scss
+++ b/gtk-4.0/_colors-public.scss
@@ -1,185 +0,0 @@
-//apps rely on some named colors to be exported
-/* GTK NAMED COLORS
-   ----------------
-   use responsibly! */
-
-// Sass thinks we're using the colors in the variables as strings and may shoot
-// warning, it's innocuous and can be defeated by using "" + $var
-
-/* widget text/foreground color */
-@define-color theme_fg_color #{"" +$fg_color};
-
-/* text color for entries, views and content in general */
-@define-color theme_text_color #{"" +$text_color};
-
-/* widget base background color */
-@define-color theme_bg_color #{"" +$bg_color};
-
-/* text widgets and the like base background color */
-@define-color theme_base_color #{"" +$base_color};
-
-/* base background color of selections */
-@define-color theme_selected_bg_color #{"" +$selected_bg_color};
-
-/* text/foreground color of selections */
-@define-color theme_selected_fg_color #{"" +$selected_fg_color};
-
-/* base background color of disabled widgets */
-@define-color insensitive_bg_color #{"" +$insensitive_bg_color};
-
-/* text foreground color of disabled widgets */
-@define-color insensitive_fg_color #{"" +$insensitive_fg_color};
-
-/* disabled text widgets and the like base background color */
-@define-color insensitive_base_color #{"" +$base_color};
-
-/* widget text/foreground color on backdrop windows */
-@define-color theme_unfocused_fg_color #{"" +$backdrop_fg_color};
-
-/* text color for entries, views and content in general on backdrop windows */
-@define-color theme_unfocused_text_color #{"" +$text_color};
-
-/* widget base background color on backdrop windows */
-@define-color theme_unfocused_bg_color #{"" +$backdrop_bg_color};
-
-/* text widgets and the like base background color on backdrop windows */
-@define-color theme_unfocused_base_color #{"" +$backdrop_base_color};
-
-/* base background color of selections on backdrop windows */
-@define-color theme_unfocused_selected_bg_color #{"" +$selected_bg_color};
-
-/* text/foreground color of selections on backdrop windows */
-@define-color theme_unfocused_selected_fg_color #{"" + $selected_fg_color};
-
-/* widgets main borders color */
-@define-color borders #{"" +$borders_color};
-
-/* widgets main borders color on backdrop windows */
-@define-color unfocused_borders #{"" +$backdrop_borders_color};
-
-/* these are pretty self explicative */
-@define-color warning_color #{"" +$warning_color};
-@define-color error_color #{"" +$error_color};
-@define-color success_color #{"" +$success_color};
-//@define-color destructive_color #{$destructive_color}
-
-@define-color fg_color #{"" +$fg_color};
-@define-color text_color #{"" +$text_color};
-@define-color bg_color #{"" +$bg_color};
-@define-color base_color #{"" +$base_color};
-@define-color selected_bg_color #{"" +$selected_bg_color};
-@define-color selected_fg_color #{"" +$selected_fg_color};
-@define-color unfocused_fg_color #{"" +$backdrop_fg_color};
-@define-color unfocused_text_color #{"" +$text_color};
-@define-color unfocused_bg_color #{"" +$backdrop_bg_color};
-@define-color unfocused_base_color #{"" +$backdrop_base_color};
-@define-color unfocused_selected_bg_color #{"" +$selected_bg_color};
-@define-color unfocused_selected_fg_color #{"" + $selected_fg_color};
-
-//WM
-
-$_wm_highlight: if($variant=='light', $top_highlight,  // Sass gets mad if this is
-                  transparentize(black,1));          // done directly in the
-                                                     // color definition
-
-/* these colors are exported for the window manager and shouldn't be used in applications,
-read if you used those and something break with a version upgrade you're on your own... */
-@define-color wm_title shade(#{$fg_color}, 1.8);
-@define-color wm_unfocused_title #{$backdrop_fg_color};
-@define-color wm_highlight #{"" + $_wm_highlight};
-@define-color wm_borders_edge #{"" + $borders_edge};
-
-@define-color wm_bg_a shade(#{$bg_color}, 1.2);
-@define-color wm_bg_b #{$bg_color};
-
-@define-color wm_shadow alpha(black, 0.35);
-@define-color wm_border alpha(black, 0.18);
-
-@define-color wm_button_hover_color_a shade(#{$bg_color}, 1.3);
-@define-color wm_button_hover_color_b #{$bg_color};
-@define-color wm_button_active_color_a shade(#{$bg_color}, 0.85);
-@define-color wm_button_active_color_b shade(#{$bg_color}, 0.89);
-@define-color wm_button_active_color_c shade(#{$bg_color}, 0.9);
-
-//FIXME this is really an API
-
-@define-color content_view_bg #{"" + $base_color};
-@define-color text_view_bg #{"" + $base_color};
-
-//Budgie desktop
-@define-color budgie_tasklist_indicator_color #{"" +$selected_bg_color};
-@define-color budgie_tasklist_indicator_color_active #{"" +$selected_bg_color};
-@define-color placeholder_text_color #{"" +$backdrop_text_color};
-
-// Elementary OS colors
-@define-color STRAWBERRY_100 #{$STRAWBERRY_100};
-@define-color STRAWBERRY_300 #{$STRAWBERRY_300};
-@define-color STRAWBERRY_500 #{$STRAWBERRY_500};
-@define-color STRAWBERRY_700 #{$STRAWBERRY_700};
-@define-color STRAWBERRY_900 #{$STRAWBERRY_900};
-
-@define-color ORANGE_100 #{$ORANGE_100};
-@define-color ORANGE_300 #{$ORANGE_300};
-@define-color ORANGE_500 #{$ORANGE_500};
-@define-color ORANGE_700 #{$ORANGE_700};
-@define-color ORANGE_900 #{$ORANGE_900};
-
-@define-color BANANA_100 #{$BANANA_100};
-@define-color BANANA_300 #{$BANANA_300};
-@define-color BANANA_500 #{$BANANA_500};
-@define-color BANANA_700 #{$BANANA_700};
-@define-color BANANA_900 #{$BANANA_900};
-
-@define-color LIME_100 #{$LIME_100};
-@define-color LIME_300 #{$LIME_300};
-@define-color LIME_500 #{$LIME_500};
-@define-color LIME_700 #{$LIME_700};
-@define-color LIME_900 #{$LIME_900};
-
-@define-color MINT_100 #{$MINT_100};
-@define-color MINT_300 #{$MINT_300};
-@define-color MINT_500 #{$MINT_500};
-@define-color MINT_700 #{$MINT_700};
-@define-color MINT_900 #{$MINT_900};
-
-@define-color BLUEBERRY_100 #{$BLUEBERRY_100};
-@define-color BLUEBERRY_300 #{$BLUEBERRY_300};
-@define-color BLUEBERRY_500 #{$BLUEBERRY_500};
-@define-color BLUEBERRY_700 #{$BLUEBERRY_700};
-@define-color BLUEBERRY_900 #{$BLUEBERRY_900};
-
-@define-color BUBBLEGUM_100 #{$BUBBLEGUM_100};
-@define-color BUBBLEGUM_300 #{$BUBBLEGUM_300};
-@define-color BUBBLEGUM_500 #{$BUBBLEGUM_500};
-@define-color BUBBLEGUM_700 #{$BUBBLEGUM_700};
-@define-color BUBBLEGUM_900 #{$BUBBLEGUM_900};
-
-@define-color GRAPE_100 #{$GRAPE_100};
-@define-color GRAPE_300 #{$GRAPE_300};
-@define-color GRAPE_500 #{$GRAPE_500};
-@define-color GRAPE_700 #{$GRAPE_700};
-@define-color GRAPE_900 #{$GRAPE_900};
-
-@define-color COCOA_100 #{$COCOA_100};
-@define-color COCOA_300 #{$COCOA_300};
-@define-color COCOA_500 #{$COCOA_500};
-@define-color COCOA_700 #{$COCOA_700};
-@define-color COCOA_900 #{$COCOA_900};
-
-@define-color SILVER_100 #{$SILVER_100};
-@define-color SILVER_300 #{$SILVER_300};
-@define-color SILVER_500 #{$SILVER_500};
-@define-color SILVER_700 #{$SILVER_700};
-@define-color SILVER_900 #{$SILVER_900};
-
-@define-color SLATE_100 #{$SLATE_100};
-@define-color SLATE_300 #{$SLATE_300};
-@define-color SLATE_500 #{$SLATE_500};
-@define-color SLATE_700 #{$SLATE_700};
-@define-color SLATE_900 #{$SLATE_900};
-
-@define-color BLACK_100 #{$BLACK_100};
-@define-color BLACK_300 #{$BLACK_300};
-@define-color BLACK_500 #{$BLACK_500};
-@define-color BLACK_700 #{$BLACK_700};
-@define-color BLACK_900 #{"" + $BLACK_900};
--- a/gtk-4.0/_colors.scss
+++ b/gtk-4.0/_colors.scss
@@ -1,116 +0,0 @@
-// When color definition differs for dark and light variant
-// it gets @if ed depending on $variant
-
-// Main definitions
-$base_color: if($variant == 'light', #ebf0f5, lighten(#161925, 1%));
-$text_color: if($variant == 'light', #31363D, #C3C7D1);
-$bg_color: if($variant == 'light', darken( #EEEEEE, 3%), #161925);
-$fg_color: if($variant == 'light', #31363d, #C3C7D1);
-$switch_bg: if($variant == 'light', #ffffff, transparentize(black,1));
-$shadow_color: rgba(162, 162, 165, 0.21);
-$_sidebar_color: if($variant == 'light', #222e39, #161925);
-
-// Primary colors
-$lime: #71f79f;
-$red: #ed254e;
-$orange: #ff6a00;
-$yellow: #f9dc5c;
-$purple: #c74ded;
-$darkpurple: #7b7bbd;
-$blue: #7cb7ff;
-$cyan: #00c1e4;
-$slider: #7b7bbd;
-$teal: #00e8c6;
-
-$selected_fg_color: #fefefe;
-$selected_bg_color: #c50ed2;
-//$selected_bg_color: #f7005a;
-/*$selected_bg_color: #00e8c6;06d6a0*/
-$selected_borders_color: darken($selected_bg_color, 10%);
-$borders_color: if($variant == 'light', transparentize(black,0.87), transparentize(#0C0E15,0.2));
-$borders_edge: if($variant == 'light', transparentize(white, 0.8), transparentize(white, 0.9));
-
-$selected-tab-gradient-start: #5800E2;
-$selected-tab-gradient-end: #FF00E6;
-
-$link_color: $blue;
-$link_visited_color:transparentize($link_color,0.5);
-$top_highlight: if($variant == 'light', transparentize(white, 0.8), transparentize(white, 0.9));
-$bottom_highlight: if($variant == 'light', transparentize(black, 0.8), transparentize(black, 0.9));
-$dark_fill: mix($borders_color, $bg_color, 35%);
-$headerbar_color: mix($base_color, darken($bg_color, 8%), 30%);
-$headerbar_fg_color: $text_color;
-$menu_color: if($variant == 'light', $base_color, mix($bg_color, $base_color, 20%));
-$popover_bg_color: $base_color;
-$popover_hover_color: lighten($bg_color, 5%);
-
-$scrollbar_bg_color: mix($base_color, $bg_color, 50%);
-$scrollbar_slider_color: mix($fg_color, $bg_color, 60%);
-$scrollbar_slider_hover_color: mix($fg_color, $bg_color, 80%);
-$scrollbar_slider_active_color: if($variant=='light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 10%));
-
-$warning_color: if($variant == 'light', $orange, darken($orange,10%));
-$error_color: if($variant == 'light', $red, darken($red,5%));
-$success_color: if($variant == 'light', $cyan, darken($cyan,10%));
-$destructive_color: if($variant == 'light', darken($red,5%), darken($red,10%));
-$suggested_color: if($variant == 'light', $selected_bg_color, darken($selected_bg_color,10%));
-
-$osd_fg_color: #fefefe;
-$osd_text_color: white;
-$osd_bg_color:  transparentize(darken($_sidebar_color, 3%), 0.02);
-$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
-$osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%);
-$osd_borders_color: transparentize(black, 0.3);
-
-$sidebar_bg_color: mix($bg_color, $base_color, 50%);
-$base_hover_color: transparentize($fg_color, 0.95);
-
-$tooltip_borders_color: transparentize(white, 0.9);
-$shadow_color: transparentize(black, 0.9);
-
-$drop_target_color: #a1ce4b;
-
-$text_shadow_color: if($variant == 'dark', $shadow_color, transparentize(white, 0.9));
-$icon_shadow_color: $text_shadow_color;
-
-$drop_target_color: $lime;
-
-// Infobar colors
-$info_color: $lime;
-$question_color: $cyan;
-
-// Panel colors
-$panel_bg_color: transparentize($base_color, 0);
-$panel_fg_color: white;
-$panel_borders_color: transparentize($base_color, 0.8);
-
-// Disabled state colors
-$insensitive_fg_color: mix($fg_color, $bg_color, 50%);
-$insensitive_bg_color: mix($bg_color, $base_color, 60%);
-$insensitive_base_color: darken($base_color, 5%);
-$insensitive_borders_color: $borders_color;
-
-// Backdrop state colors
-$backdrop_base_color: if($variant == 'light', darken($base_color, 1%), lighten($base_color, 1%));
-$backdrop_text_color: mix($text_color, $backdrop_base_color, 80%);
-$backdrop_bg_color: $bg_color;
-$backdrop_headerbar_bg_color: $headerbar_color;
-$backdrop_headerbar_fg_color: if($variant == 'light', transparentize($headerbar_fg_color, 0.5), transparentize($headerbar_fg_color, 0.2));
-$backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 50%);
-$backdrop_insensitive_color: if($variant == 'light', darken($backdrop_bg_color, 15%), lighten($backdrop_bg_color, 15%));
-$backdrop_selected_bg_color:  transparentize($selected_bg_color, 0.4);
-$backdrop_selected_fg_color: if($variant == 'light', $selected_fg_color, transparentize($selected_fg_color, 0.5));
-$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
-$backdrop_dark_fill: mix($backdrop_borders_color, $backdrop_bg_color, 35%);
-$backdrop_sidebar_bg_color: mix($backdrop_bg_color, $backdrop_base_color, 50%);
-
-$backdrop_scrollbar_bg_color: darken($backdrop_bg_color, 3%);
-$backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, 40%);
-
-$backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdrop_bg_color, $backdrop_base_color, 20%));
-
-$scale_bg: if($variant == 'light', transparentize(black,0.86) ,transparentize(white,0.86));
-$scale_disabled_bg: if($variant == 'light', transparentize(black, 0.94) ,transparentize(white, 0.94));
-$suggested_bg_color: linear-gradient(to right, #654ea3 0%, #eaafc8 100%);
-$destructive_bg_color: linear-gradient(to right, #FF416C, #FF4B2B);
-$menu_shadow_color: $borders_color;
--- a/gtk-4.0/_common.scss
+++ b/gtk-4.0/_common.scss
@@ -1,26 +0,0 @@
-/*********
-* Common *
-*********/
-
-@function gtkalpha($c,$a) {
-  @return unquote("alpha(#{$c},#{$a})");
-}
-
-$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
-$asset_suffix: if($variant=='dark', '-dark', '');
-$backdrop_transition: 200ms ease-out;
-$button_transition: all 200ms $ease-out-quad;
-
-* {
-  padding: 0;
-  // We use the outline properties to signal the focus properties
-  // to the adwaita engine: using real CSS properties is faster,
-  // and we don't use any outlines for now.
-
-  outline-color: transparentize($fg_color, 0.7);
-  outline-style: dashed;
-  outline-offset: -3px;
-  outline-width: 0px;
-
-  -gtk-secondary-caret-color: $selected_bg_color;
-}
--- a/gtk-4.0/_drawing.scss
+++ b/gtk-4.0/_drawing.scss
@@ -1,613 +0,0 @@
-/*****************
-* Drawing mixins *
-*****************/
-
-// generic drawing of more complex things
-
-@function _widget_edge($c:$borders_edge) {
-// outer highlight "used" on most widgets
-  @if $c == none { @return none; }
-  @else { @return 0 1px $c; }
-}
-
-@mixin lines($t, $c:$selected_bg_color) {
-    @if $t==up {
-      box-shadow: inset 0 -3px 0 0 darken($c,5%);
-    }
-    @if $t==down {
-      box-shadow: inset 0 3px 0 0 darken($c,5%);
-    }
-    @if $t==both {
-      box-shadow: inset 0 -3px 0 0 darken($c,5%),
-                  inset 0 3px 0 0 darken($c,5%);
-    }
-}
-
-@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
-//
-// Helper function to stack up to 4 box-shadows;
-//
-  @if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
-  @else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
-  @else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
-  @else { box-shadow: $shadow1; }
-}
-
-// entries
-
-@function entry_focus_border($fc:$selected_bg_color) {
-  @if $variant == 'light' { @return $fc; }
-  @else { @return if($fc==$selected_bg_color, $selected_borders_color, darken($fc, 35%)); }
-}
-
-
-@function entry_gradient($c) {
-  @if $variant=='light' { @return linear-gradient(to bottom, mix($borders_color, $c, 45%),
-                                                             mix($borders_color, $c, 3%) 2px,
-                                                             $c 90%); }
-  @else { @return linear-gradient(to bottom, mix($borders_color, $c, 95%),
-                                             mix($borders_color, $c, 40%) 3px,
-                                             $c 90%); }
-}
-
-@mixin entry($t, $fc:$selected_bg_color, $edge: none) {
-//
-// Entries drawing function
-//
-// $t: entry type
-// $fc: focus color
-// $edge: set to none to not draw the bottom edge or specify a color to not
-//        use the default one
-//
-// possible $t values:
-// normal, focus, insensitive, backdrop, backdrop-insensitive, osd, osd-focus, osd-backdrop;
-//
-
-  $_blank_edge: if($edge == none, none, 0 1px transparentize($edge, 1));
-  $_entry_edge: if($edge == none, none, _widget_edge($edge));
-
-  @if $t==normal {
-    color: $text_color;
-    border-color: $borders_color;
-    background-color: $base_color;
-    // for the transition to work the number of shadows in different states needs to match, hence the transparent shadow here.
-  }
-  @if $t==focus {
-    border-color: entry_focus_border($fc);
-  }
-  @if $t==insensitive {
-    color: $insensitive_fg_color;
-    border-color: $borders_color;
-    background-color: $insensitive_bg_color;
-    box-shadow: $_entry_edge;
-  }
-  @if $t==backdrop {
-    color: $backdrop_text_color;
-    border-color: $backdrop_borders_color;
-    background-color: $backdrop_base_color;
-    box-shadow: $_blank_edge;
-  }
-  @if $t==backdrop-insensitive {
-    color: $backdrop_insensitive_color;
-    border-color: $backdrop_borders_color;
-    background-color: $insensitive_bg_color;
-    box-shadow: $_blank_edge;
-  }
-  @if $t==osd {
-    color: $osd_text_color;
-    border-color: $osd_borders_color;
-    background-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-    box-shadow: none;
-    text-shadow: 0 1px black;
-    -gtk-icon-shadow: 0 1px black;
-  }
-  @if $t==osd-focus {
-    color: $osd_text_color;
-    border-color: $selected_bg_color;
-    background-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-    background-clip: padding-box;
-    text-shadow: 0 1px black;
-    -gtk-icon-shadow: 0 1px black;
-  }
-  @if $t==osd-insensitive {
-    color: $osd_insensitive_fg_color;
-    border-color: $osd_borders_color;
-    background-color: $osd_insensitive_bg_color;
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-  @if $t==osd-backdrop {
-    color: $osd_text_color;
-    border-color: $osd_borders_color;
-    background-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-}
-
-// buttons
-
-@function _border_color ($c) { @return darken($c, 25%); } // colored buttons want
-                                                         // the border form the
-                                                         // base color
-
-@function _text_shadow_color ($tc: $fg_color, $bg: $bg_color) {
-//
-// calculate the color of text shadows
-//
-// $tc is the text color
-// $bg is the background color
-//
-  $_lbg: lightness($bg)/100%;
-  @if lightness($tc)<50% { @return transparentize(white, 1-$_lbg/($_lbg*1.3)); }
-  @else { @return transparentize(black, $_lbg*0.8); }
-}
-
-@function _button_hilight_color($c) {
-//
-// calculate the right top hilight color for buttons
-//
-// $c: base color;
-//
-  @if lightness($c)>95% { @return white; }
-  @else if lightness($c)>90% { @return transparentize(white, 0.2); }
-  @else if lightness($c)>80% { @return transparentize(white, 0.4); }
-  @else if lightness($c)>50% { @return transparentize(white, 0.6); }
-  @else if lightness($c)>40% { @return transparentize(white, 0.8); }
-  @else { @return transparentize(white, 0.95); }
-}
-
-@mixin _button_text_shadow ($tc:$fg_color, $bg:$bg_color) {
-//
-// helper function for the text emboss effect
-//
-// $tc is the optional text color, not the shadow color
-//
-// TODO: this functions needs a way to deal with special cases
-//
-
-  $_shadow: _text_shadow_color($tc, $bg);
-
-  @if lightness($tc)<50% {
-    text-shadow: 0 1px $_shadow;
-    -gtk-icon-shadow: 0 1px $_shadow;
-  }
-  @else {
-    text-shadow: 0 -1px $_shadow;
-    -gtk-icon-shadow: 0 -1px $_shadow;
-  }
-}
-
-@mixin button($t, $c:$base_color, $tc:$text_color, $edge: none) {
-//
-// Button drawing function
-//
-// $t:    button type,
-// $c:    base button color for colored* types
-// $tc:   optional text color for colored* types
-// $edge: set to none to not draw the bottom edge or specify a color to not
-//        use the default one
-//
-// possible $t values:
-// normal, hover, active, insensitive, insensitive-active,
-// backdrop, backdrop-active, backdrop-insensitive, backdrop-insensitive-active,
-// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
-//
-
-  $_hilight_color: _button_hilight_color($c);
-  $_button_edge: if($edge == none, none, _widget_edge($edge));
-  $_blank_edge: if($edge == none, none, _widget_edge(transparentize($edge,1)));
-
-
-  @if $t==rounded {
-    box-shadow: none;
-  //  border: 1px solid $c;
-    color: white;
-    border-radius: 100px;
-    background: $suggested_bg_color; }
-
-    @if $t==rounded-red {
-      box-shadow: none;
-    //  border: 1px solid $c;
-      color: white;
-      border-radius: 100px;
-      background: $destructive_bg_color; 
-    }
-  
-  @if $t==normal {
-  //
-  // normal button
-  //
-    font-weight: normal;
-    color: $tc;
-    background-color: mix($bg_color, $base_color, 15%);
-    text-shadow: none;
-  }
-
-  @else if $t==hover {
-  //
-  // hovered button
-  //
-    color: $tc;
-    outline-color: transparentize($tc, 0.7);
-    background-color: $c;
-    text-shadow: none;
-  }
-
-  @if $t==normal-header {
-  //
-  // normal button headerbar look
-  //
-  color: if($tc==$text_color, #8b8b8b, $tc);
-  text-shadow: none;
-  box-shadow: none;
-  background: transparent;
-  border: none;
-}
-
-  @else if $t==hover-header {
-  //
-  // hovered button headerbar look
-  //
-  color: if($tc==$text_color, $selected_bg_color, $tc);
-  border-radius: 0;
-  text-shadow: none;
-  border:none;
-}
-
-@else if $t==active-header {
-  border-radius: 23px;
-  background: linear-gradient(to right, #c50ed2, #8500f7);
-  box-shadow: 0px 0px 5px transparentize(#c50ed2, 0.02);
-  color: rgb(255, 255, 255);
-}
-
-@else if $t==backdrop-header {
-//
-// backdrop button headerbar look
-//
-color: if($tc==$text_color, transparentize($tc, 0.6), $tc);
-background-color: transparent;
-border-radius: 0;
-text-shadow: none;
-box-shadow: none;
-}
-
-
-  @else if $t==active {
-  //
-  // pushed button
-  //
-  color: $tc;
-  outline-color: transparentize($tc, 0.7);
-  background-color: if($c==$base_color, $selected_bg_color, $c);
-  text-shadow: none;
-}
-  @else if $t==insensitive {
-  //
-  // insensitive button
-  //
-  color: if($tc==$text_color, $backdrop_text_color, $tc);
-  outline-color: transparentize($tc, 0.7);
-  background-color: if($c==$base_color, $insensitive_bg_color, $c);
-  text-shadow: none;
-}
-  @else if $t==insensitive-active {
-  //
-  // insensitive pushed button
-  //
-  color: transparentize($selected_fg_color, 0.3);
-  outline-color: transparentize($tc, 0.7);
-  background-color: if($c==$base_color, $selected_bg_color, $c);
-  text-shadow: none;
-  label { color: transparentize($selected_fg_color, 0.3); }
-}
-  @else if $t==backdrop {
-  //
-  // backdrop button
-  //
-  color: if($tc==$text_color, $backdrop_text_color, transparentize($tc, 0.6));
-  outline-color: transparentize($tc, 0.7);
-  background-color: if($c==$base_color, $backdrop_base_color, $c);
-  text-shadow: none;
-}
-
-  @else if $t==backdrop-active {
-  //
-  // backdrop pushed button FIXME no colors here!
-  //
-  color: transparentize($selected_fg_color, 0.3);
-  outline-color: transparentize($tc, 0.7);
-  background-color: $selected_bg_color;
-  text-shadow: none;
-  label { color: transparentize($selected_fg_color, 0.3); }
-}
-
-  @else if $t==backdrop-insensitive {
-  //
-  // backdrop insensitive button
-  //
-  color: if($tc==$text_color, $backdrop_text_color, $tc);
-  outline-color: transparentize($tc, 0.7);
-  background-color: if($c==$base_color, $insensitive_bg_color, $c);
-  text-shadow: none;
-}
-
-  @else if $t==backdrop-insensitive-active {
-  //
-  // backdrop insensitive pushed button
-  //
-  color: transparentize($selected_fg_color, 0.3);
-  outline-color: transparentize($tc, 0.7);
-  background-color: $selected_bg_color;
-  text-shadow: none;
-}
-
-  @else if $t==osd {
-  //
-  // normal osd button
-  //
-    $_bg: if($c!=$base_color, transparentize($c, 0.5),
-                            $osd_bg_color);
-
-    color: $osd_fg_color;
-    border-color: $osd_borders_color;
-    background-color: $_bg;
-    background-clip: padding-box;
-    box-shadow: inset 0 1px transparentize(white, 0.9);
-    text-shadow: 0 1px black;
-    -gtk-icon-shadow: 0 1px black;
-    outline-color: transparentize($osd_fg_color, 0.7);
-  }
-  @else if $t==osd-hover {
-  //
-  // active osd button
-  //
-    $_bg: if($c!=$base_color, transparentize($c, 0.3),
-                            lighten($osd_bg_color, 12%));
-
-    color: white;
-    border-color: $osd_borders_color;
-    background-image: linear-gradient(to bottom, $_bg, $_bg);
-    background-clip: padding-box;
-    box-shadow: inset 0 1px transparentize(white, 0.9);
-    text-shadow: 0 1px black;
-    -gtk-icon-shadow: 0 1px black;
-    outline-color: transparentize($osd_fg_color, 0.7);
-  }
-  @else if $t==osd-active {
-  //
-  // active osd button
-  //
-    $_bg: if($c!=$base_color, $c, lighten($osd_bg_color, 6%));
-
-    color: white;
-    border-color: $osd_borders_color;
-    background-image: linear-gradient(to bottom, $_bg, $_bg);
-    background-clip: padding-box;
-    box-shadow: inset 0 1px transparentize(white, 0.9);
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-    outline-color: transparentize($osd_fg_color, 0.7);
-  }
-  @else if $t==osd-insensitive {
-  //
-  // insensitive osd button
-  //
-    color: $osd_insensitive_fg_color;
-    border-color: $osd_borders_color;
-    background-image: linear-gradient(to bottom, $osd_insensitive_bg_color, $osd_insensitive_bg_color);
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-  @else if $t==osd-backdrop {
-  //
-  // backdrop osd button
-  //
-    $_bg: if($c!=$base_color, transparentize($c, 0.5),
-                            $osd_bg_color);
-
-    color: $osd_fg_color;
-    border-color: $osd_borders_color;
-    background-image: linear-gradient(to bottom, $_bg, $_bg);
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-  @else if $t==undecorated {
-  //
-  // reset
-  //
-   // border-color: transparent;
-    background-color: transparent;
-    background-image: none;
-    border-color: transparent;
-    @include _shadows(inset 0 1px transparentize(white, 1),
-                      $_blank_edge);
-
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-}
-
-@mixin trough($flat:false, $c:$bg_color, $tc:$fg_color, $noedge:true) {
-  color: mix($tc, $bg_color, 80%);
-  @if $flat { background-image: linear-gradient(to bottom, $c, $c); }
-  @else {
-    background-image: linear-gradient(to bottom,
-                                      mix(black,$c,15%) 5%,
-                                      mix(black,$c,10%) 20%,
-                                      mix(black,$c,10%) 90%,
-                                      $c);
-  }
-
-  border-color: if($c!=$bg_color, _border_color($c), $border_color);
-
-  @if not($noedge) {
-    @if lightness($c) > 60% {
-      box-shadow: inset 0 -1px $borders_edge,
-                  0 1px $borders_edge;
-    }
-    @else {
-      box-shadow: inset 0 -1px transparentize($borders_edge, 0.5),
-                  0 1px transparentize($borders_edge, 0.5);
-    }
-  }
-  @else { box-shadow: none; }
-}
-
-@mixin headerbar_fill($c:$headerbar_color, $hc:$top_highlight, $ov: none) {
-//
-// headerbar fill
-//
-// $c:  base color
-// $hc: top highlight color
-// $ov: a background layer for background shorthand (hence no commas!)
-//
-  $gradient: linear-gradient(to top, darken($c, 13%), darken($c, 2%) 2px, $c 3px);
-
-  @if $variant == 'dark' { $gradient: linear-gradient(to top, darken($c, 3%), darken($c, 1%) 2px, $c 3px); }
-
-  @if $ov != none { background: $c $ov, $gradient; }
-  @else { background: $c $gradient; }
-
-  box-shadow: inset 0 1px $hc; // top highlight
-}
-
-@mixin overshoot($p, $t:normal, $c:$fg_color) {
-//
-// overshoot
-//
-// $p: position
-// $t: type
-// $c: base color
-//
-// possible $p values:
-// top, bottom, right, left
-//
-// possible $t values:
-// normal, backdrop
-//
-
-  $_small_gradient_length: 5%;
-  $_big_gradient_length: 100%;
-
-  $_position: center top;
-  $_small_gradient_size: 100% $_small_gradient_length;
-  $_big_gradient_size: 100% $_big_gradient_length;
-
-  @if $p==bottom {
-    $_position: center bottom;
-    $_linear_gradient_direction: to top;
-  }
-
-  @else if $p==right {
-    $_position: right center;
-    $_small_gradient_size: $_small_gradient_length 100%;
-    $_big_gradient_size: $_big_gradient_length 100%;
-  }
-
-  @else if $p==left {
-    $_position: left center;
-    $_small_gradient_size: $_small_gradient_length 100%;
-    $_big_gradient_size: $_big_gradient_length 100%;
-  }
-
-  $_small_gradient_color: $c;
-  $_big_gradient_color: $c;
-
-  @if $c==$fg_color {
-    $_small_gradient_color: darken($borders_color, 10%);
-    $_big_gradient_color: $fg_color;
-
-    @if $t==backdrop { $_small_gradient_color: $backdrop_borders_color; }
-  }
-
-  $_small_gradient: radial-gradient(farthest-side at $p,
-                                    $_small_gradient_color 85%,
-                                    transparentize($_small_gradient_color, 1));
-
-  $_big_gradient: radial-gradient(farthest-side at $p,
-                                $_big_gradient_color,
-                                transparentize($_big_gradient_color, 1));
-
-  @if $t==normal {
-    background-image: $_small_gradient, $_big_gradient;
-    background-size: $_small_gradient_size, $_big_gradient_size;
-  }
-
-  @else if $t==backdrop {
-    background-image: $_small_gradient;
-    background-size: $_small_gradient_size;
-  }
-
-  background-repeat: no-repeat;
-  background-position: $_position;
-
-  background-color: transparent; // reset some properties to be sure to not inherit them somehow
-  border: none;                  //
-  box-shadow: none;              //
-}
-
-@mixin undershoot($p) {
-//
-// undershoot
-//
-// $p: position
-//
-// possible $p values:
-// top, bottom, right, left
-//
-
-  $_undershoot_color_dark: transparentize(black, 0.8);
-  $_undershoot_color_light: transparentize(white, 0.8);
-
-  $_gradient_dir: left;
-  $_dash_bg_size: 10px 1px;
-  $_gradient_repeat: repeat-x;
-  $_bg_pos: center $p;
-
-  background-color: transparent; // shouldn't be needed, but better to be sure;
-
-  @if ($p == left) or ($p == right) {
-    $_gradient_dir: top;
-    $_dash_bg_size: 1px 10px;
-    $_gradient_repeat: repeat-y;
-    $_bg_pos: $p center;
-  }
-
-  background-image: linear-gradient(to $_gradient_dir, // this is the dashed line
-                                    $_undershoot_color_light 50%,
-                                    $_undershoot_color_dark 50%);
-
-  padding-#{$p}: 1px;
-  background-size: $_dash_bg_size;
-  background-repeat: $_gradient_repeat;
-  background-origin: content-box;
-  background-position: $_bg_pos;
-  border: none;
-  box-shadow: none;
-}
-
-@mixin scale-highlight($dir) {
-  background: linear-gradient(to $dir, #00f17d, #00f7d2);
-}
-
-@mixin selected-tab($dir) {
-  background:
-  linear-gradient(to $dir, $selected-tab-gradient-start, $selected-tab-gradient-end)
-  left 
-  bottom
-  lighten(mix($base_color, $headerbar_color, 30%), 2%)
-  no-repeat; 
-  @if $dir==right { background-size: 100% 2px; }
-  @else if $dir==bottom { background-size: 2px 100%; } 
-  border: 0;
-}
--- a/gtk-4.0/_elementary-colors.scss
+++ b/gtk-4.0/_elementary-colors.scss
@@ -1,71 +0,0 @@
-$STRAWBERRY_100: #ff8c82;
-$STRAWBERRY_300: #ed5353;
-$STRAWBERRY_500: #c6262e;
-$STRAWBERRY_700: #a10705;
-$STRAWBERRY_900: #7a0000;
-
-$ORANGE_100: #ffc27d;
-$ORANGE_300: #ffa154;
-$ORANGE_500: #f37329;
-$ORANGE_700: #cc3b02;
-$ORANGE_900: #a62100;
-
-$BANANA_100: #fff394;
-$BANANA_300: #ffe16b;
-$BANANA_500: #f9c440;
-$BANANA_700: #d48e15;
-$BANANA_900: #ad5f00;
-
-$LIME_100: #d1ff82;
-$LIME_300: #9bdb4d;
-$LIME_500: #68b723;
-$LIME_700: #3a9104;
-$LIME_900: #206b00;
-
-$MINT_100: #89ffdd;
-$MINT_300: #43d6b5;
-$MINT_500: #28bca3;
-$MINT_700: #0e9a83;
-$MINT_900: #007367;
-
-$BLUEBERRY_100: #8cd5ff;
-$BLUEBERRY_300: #64baff;
-$BLUEBERRY_500: #3689e6;
-$BLUEBERRY_700: #0d52bf;
-$BLUEBERRY_900: #002e99;
-
-$BUBBLEGUM_100: #fe9ab8;
-$BUBBLEGUM_300: #f4679d;
-$BUBBLEGUM_500: #de3e80;
-$BUBBLEGUM_700: #bc245d;
-$BUBBLEGUM_900: #910e38;
-
-$GRAPE_100: #e4c6fa;
-$GRAPE_300: #cd9ef7;
-$GRAPE_500: #a56de2;
-$GRAPE_700: #7239b3;
-$GRAPE_900: #452981;
-
-$COCOA_100: #a3907c;
-$COCOA_300: #8a715e;
-$COCOA_500: #715344;
-$COCOA_700: #57392d;
-$COCOA_900: #3d211b;
-
-$SILVER_100: #fafafa;
-$SILVER_300: #d4d4d4;
-$SILVER_500: #abacae;
-$SILVER_700: #7e8087;
-$SILVER_900: #555761;
-
-$SLATE_100: #95a3ab;
-$SLATE_300: #667885;
-$SLATE_500: #485a6c;
-$SLATE_700: #273445;
-$SLATE_900: #0e141f;
-
-$BLACK_100: #666;
-$BLACK_300: #4d4d4d;
-$BLACK_500: #333;
-$BLACK_700: #1a1a1a;
-$BLACK_900: #000;
--- a/gtk-4.0/_widgets.scss
+++ b/gtk-4.0/_widgets.scss
@@ -1,40 +0,0 @@
-/***********
- * Widgets *
- ***********/
-
-@import 'widgets/action-bars';
-@import 'widgets/app-notifications';
-@import 'widgets/base-states';
-@import 'widgets/buttons';
-@import 'widgets/calendar';
-@import 'widgets/checks-radios';
-@import 'widgets/color-chooser';
-@import 'widgets/comboboxes';
-@import 'widgets/dialogs';
-@import 'widgets/entries';
-@import 'widgets/expanders';
-@import 'widgets/floating-bar';
-@import 'widgets/frames';
-@import 'widgets/granite';
-@import 'widgets/header-bars';
-@import 'widgets/infobars';
-@import 'widgets/level-bars';
-@import 'widgets/links';
-@import 'widgets/lists';
-@import 'widgets/menus';
-@import 'widgets/misc';
-@import 'widgets/notebooks';
-@import 'widgets/paned';
-@import 'widgets/pathbars';
-@import 'widgets/popovers';
-@import 'widgets/progress-bars';
-@import 'widgets/scales';
-@import 'widgets/scrollbars';
-@import 'widgets/sidebar';
-@import 'widgets/spinbuttons';
-@import 'widgets/spinner';
-@import 'widgets/switches';
-@import 'widgets/toolbars';
-@import 'widgets/tooltips';
-@import 'widgets/treeviews';
-@import 'widgets/windows';
--- a/gtk-4.0/apps/_budgie.scss
+++ b/gtk-4.0/apps/_budgie.scss
--- a/gtk-4.0/apps/_caja.scss
+++ b/gtk-4.0/apps/_caja.scss
@@ -1,79 +0,0 @@
-.caja-notebook {
-
-    .frame { border-width: 0 0 1px; }
-
-    .entry {
-        background: $bg_color;
-        color: $fg_color;
-        border-color: $borders_color;
-        &:selected {
-            background: $selected_bg_color;
-            color: $selected_fg_color;
-        }
-    }
-}
-  
-  /**************
-  * Caja sidebar *
-  **************/
-  
-.caja-side-pane {
-
-    .frame { border-width: 1px 0 0; }
-
-    background: $headerbar_color;
-    treeview.view,
-    textview.view text,
-    viewport.frame,
-    widget .vertical {
-        background: $_sidebar_color;
-        padding: 3px 2px;
-        color: #98abb2;
-        &:hover {
-        background-color: transparentize(darken($_sidebar_color, 2%), 0.05);
-        }
-        &:selected {
-        color: $selected_fg_color;
-        background:$selected_bg_color;
-        }
-    }
-}
-  
-  /**************
-  * Caja pathbar *
-  **************/
-  
-.caja-navigation-window paned, .caja-navigation-window .primary-toolbar {
-    background: $headerbar_color;
-}
-  
-.caja-navigation-window   {
-
-    .primary-toolbar button,
-    .vertical  button.image-button.toggle:not(.text-button) {
-        &, &:backdrop { @include button(undecorated); }
-        &:hover,
-        &:active,
-        &:backdrop:active,
-        &:backdrop:checked {
-            background: $selected_bg_color;
-            box-shadow: none;
-            &, & label {
-                color: $selected_fg_color;  
-            }
-        }
-    }
-}
-  
-.caja-pathbar button {
-    @include button(normal-header);
-    margin-top: 7px;
-    margin-bottom: 7px;
-    &:hover { color: $selected_bg_color; }
-    &:checked { @include button(active-header); }
-    &:backdrop:disabled {
-        @include button(backdrop-header,$base_color,transparentize($fg_color,0.8));
-    }
-
-}
-  
--- a/gtk-4.0/apps/_geary.scss
+++ b/gtk-4.0/apps/_geary.scss
@@ -1,36 +0,0 @@
-/*********
- * Geary *
- *********/
-
-.geary-titlebar-left,
-.geary-titlebar-right {
-
-  .separator {
-    opacity: 0;
-  }
-}
-
-ConversationListView {
-
-  .view {
-    &:active,
-    &:selected {
-      background-color: $selected_bg_color;
-      color: $selected_fg_color;
-
-      &:backdrop {
-        background-color: $backdrop_selected_bg_color;
-        color: $backdrop_selected_fg_color;
-      }
-    }
-
-    .cell {
-      border: solid transparentize(black, 0.8);
-      border-width: 0 0 1px 0;
-      &:selected {
-        color: $selected_fg_color;
-        border: 0px solid darken($selected_bg_color, 10% );
-      }
-    }
-  }
-}
--- a/gtk-4.0/apps/_gnome.scss
+++ b/gtk-4.0/apps/_gnome.scss
@@ -1,205 +0,0 @@
-/************
- * Nautilus *
- ************/
-.nautilus-window {
-  .frame{
-    *:selected, *:selected:backdrop{
-      background: transparent;
-      color: $selected_bg_color;
-      label {
-        color: $selected_bg_color;
-      }
-    } 
-  }
-  paned {
-    > separator { background-image: none; }
-  }
-  .sidebar {
-    background-color: transparent;
-    // background-image: none;
-
-    &:backdrop {
-      background-color: transparent;
-      // background-image: none;
-    }
-
-    .list-row {
-      button {
-        border: none;
-        background-color: transparentize(darken($base_color,3%),0.05);
-        &:active {
-          background-color: transparentize($selected_bg_color,0.25);
-        }
-      }
-
-      &:selected {
-        background-color: transparentize($selected_bg_color,0.25);
-        &:hover {
-          background-color: transparentize($selected_bg_color,0.1);
-        }
-      }
-
-      &:hover {
-        background-color: transparentize($base_color,0.5);
-        &:active {
-          background-color: transparentize($selected_bg_color,0.1);
-        }
-      }
-    }
-  }
-  &.background {
-    background-color: transparentize(darken($base_color,3%),0.05);
-    &:backdrop {
-      background-color: transparentize(darken($base_color,3%),0.05);
-    }
-  }
-
-  notebook {
-    > stack:only-child { // the :not(:only-child) is for "hidden" notebooks
-        background-color: $base_color;
-        &:backdrop { background-color: $backdrop_base_color; }
-    }
-  }
-
-  searchbar {
-    border-top: 1px solid rgba(0, 0, 0, 0.12);
-  }
-  
- .searchbar-container {
-    margin-top: -1px;
-  }
-
-  .titlebar {
-    .search {
-      border: 1px solid transparent;
-      border-radius: 10px;
-      box-shadow: none;
-      margin-top: 10px;
-      margin-bottom: 10px;
-    }
-    .path-bar-box {
-      .dim-label {
-        color:transparent;
-      }
-      widget > .text-button:last-child,
-      widget > .text-button:last-child:active,
-      widget > .text-button:last-child:checked,
-      button:active, button:checked {
-          @include button(active-header);
-          &:backdrop{
-            &, label{
-              color: darken(rgb(255, 255, 255), 4%);
-            }
-          }
-      }
-    }
-    .linked:not(.path-bar) {
-      button {
-        &:active, &:checked, &:active:backdrop, &:checked:backdrop {
-          background: transparent;
-          color: $selected_bg_color;
-          box-shadow: none;
-          border: none;      }
-      }
-    }
-  }
-
-  .linked:not(.vertical) > entry { 
-    border-radius: 10px;
-    margin-right: 5px;
-    &:focus {
-      border-color: transparentize($selected_bg_color, 0.4);
-    }
-  }
-}
-
-.nautilus-circular-button {
-  border-radius: 20px;
-}
-
-.disk-space-display {
-  border: 2px solid;
-
-  .unknown {
-    background-color: #888a85;
-    border-color: darken(#888a85, 20%);
-  }
-
-  .used {
-    background-color: #9FB0B9;
-    border-color: darken(#9FB0B9, 20%);
-  }
-
-  .free {
-    background-color: #D8D8D8;
-    border-color: darken(#D8D8D8, 20%);
-  }
-}
-
-.nautilus-desktop {
-
-  color: $fg_color;
-
-  .nautilus-canvas-item {
-    border-radius: 5px;
-    color: $selected_fg_color;
-    text-shadow: 1px 1px transparentize(black, 0.4);
-
-    &:active {
-      color: $fg_color;
-      text-shadow: none;
-    }
-
-    &:hover {
-      color: $fg_color;
-      text-shadow: none;
-    }
-
-    &:selected {
-      color: $selected_fg_color;
-      text-shadow: none;
-    }
-
-    .dim-label {
-      &:selected {
-        color: $selected_fg_color;
-      }
-    }
-  }
-
-  .nautilus-list {
-
-    .dim-label {
-      &:selected {
-        color: $selected_fg_color;
-      }
-    }
-  }
-}
-
-/*********
- * Gedit *
- *********/
-.gedit-search-slider {
-     padding: 4px;
-     border-radius: 0 0 3px 3px;
-     border: 0;
-     background-color: $bg_color;
- }
-
-
- /*********
- * Gnucash *
- *********/
- #gnc-id-main-window {
-  entry.gnc-class-register-foreground {
-    background: transparent;
-    border: none;
-    box-shadow: none;
-  } 
-  .arrow.button.toggle {
-    transition: none;
-    box-shadow: none;
-    &:hover { border-color: $selected_bg_color; }
-  } 
-}
--- a/gtk-4.0/apps/_lightdm.scss
+++ b/gtk-4.0/apps/_lightdm.scss
@@ -1,115 +0,0 @@
-/***********
- * LightDm *
- ***********/
-
-// the panel widget at the top
-#panel_window {
-  background-color: $panel_bg_color;
-  color: $panel_fg_color;
-  font-weight: bold;
-  box-shadow: inset 0 -1px darken($panel_bg_color, 7%);
-
-  // the menubars/menus of the panel, i.e. indicators
-  .menubar,
-  .menubar > .menuitem
-  menubar,
-  menubar > menuitem {
-    background-color: transparent;
-    color: $panel_fg_color;
-    font-weight: bold;
-  }
-
-  .menubar .menuitem:disabled,
-  menubar menuitem:disabled {
-    color: transparentize($panel_fg_color, 0.5);
-
-    GtkLabel { color: inherit; }
-    label { color: inherit; }
-  }
-  .menubar .menu > .menuitem,
-  menubar menu > menuitem { font-weight: normal; }
-}
-
-// the login window
-#login_window,
-#shutdown_dialog,
-#restart_dialog {
-  font-weight: normal;
-  border-style: none;
-  background-color: transparent;
-  color: $fg_color;
-}
-
-// the top half of the login-window, in GtkDialog terms, the content
-#content_frame {
-  padding-bottom: 14px;
-  background-color: $bg_color;
-  border-top-left-radius: 2px;
-  border-top-right-radius: 2px;
-  border: solid transparentize(black, 0.9);
-  border-width: 1px 1px 0 1px;
-}
-
-#content_frame button {
-  @include button(normal);
-
-  &:hover { @include button(hover); }
-  &:active, &:checked { @include button(active); }
-  &:disabled { @include button(insensitive); }
-}
-
-// the lower half of the login-window, in GtkDialog terms the buttonbox or action area
-#buttonbox_frame {
-  padding-top: 20px;
-  padding-bottom: 0px;
-  border-style: none;
-  background-color: if($variant=='light', $osd_bg_color, $headerbar_color);
-  border-bottom-left-radius: 3px;
-  border-bottom-right-radius: 3px;
-  border: solid transparentize(black, 0.9);
-  border-width: 0 1px 1px 1px;
-}
-
-#buttonbox_frame button{
-  @include button(osd);
-
-  &:hover { @include button(osd-hover); }
-  &:active, &:checked { @include button(osd-active); }
-  &:disabled { @include button(osd-insensitive); }
-}
-
-#login_window #user_combobox {
-  color: $fg_color;
-  font-size: 13px;
-
-  .menu,
-  menu { font-weight: normal; }
-}
-
-// the user's avatar box
-#user_image {
-  padding: 3px;
-  border-radius: 2px;
-}
-
-// the shutdown button
-#shutdown_button.button {
-  @include button(suggested_destructive, $destructive_color);
-
-  &:hover { @include button(suggested_destructive, lighten($destructive_color, 10%)); }
-  &:active, &:checked { @include button(suggested_destructive, darken($destructive_color, 10%)); }
-}
-
-// the restart button
-#restart_button.button {
-  @include button(suggested_destructive, $suggested_color);
-
-  &:hover { @include button(suggested_destructive, lighten($suggested_color, 10%)); }
-  &:active, &:checked { @include button(suggested_destructive, darken($suggested_color, 10%)); }
-}
-
-// the warning, in case a wrong password is entered or something else goes wrong according to PAM
-#greeter_infobar {
-  border-bottom-width: 0;
-  font-weight: bold;
-}
--- a/gtk-4.0/apps/_mate.scss
+++ b/gtk-4.0/apps/_mate.scss
@@ -1,20 +0,0 @@
-//
-// Mate OSD Window
-//
-
-MsdOsdWindow.background.osd {
-    border-radius: 2px;
-    border: 1px solid $borders_color;
-  
-    .progressbar {
-      background-color: $selected_bg_color;
-      border: none;
-      border-color: $selected_bg_color;
-      border-radius: 5px;
-    }
-    .trough {
-      background-color: darken($osd_bg_color, 5%);
-      border: none;
-      border-radius: 5px;
-    }
-  }
--- a/gtk-4.0/apps/_nemo.scss
+++ b/gtk-4.0/apps/_nemo.scss
@@ -1,65 +0,0 @@
-.nemo-window {
-    .places-treeview {
-        .view.cell,
-        iconview.cell {
-            &:hover {
-                background: transparentize(darken($_sidebar_color, 3%), 0.3);
-            }
-            &:selected {
-                background: $selected_bg_color;
-            }
-        }
-    }
-
-    .sidebar {
-        color: #98abb2;
-        background-color: $_sidebar_color; 
-        .view, .iconview, row {
-            background-color: transparent;
-        }
-    }
-
-    .nemo-window-pane {
-        widget.entry {
-            background-clip: padding-box;
-            min-height: 28px;
-            padding: 5px;
-            color: $fg_color;
-            border: 1px solid $borders_color;
-            border-radius: 3px;
-            box-shadow: inset 0 1px transparentize(black, 0.1),
-                        inset 1px 0 transparentize(black, 0.04),
-                        inset -1px 0 transparentize(black, 0.04),
-                        inset 0 -1px transparentize(black, 0.02),
-                        0 1px transparentize(white, 0.4);
-            &:selected {
-                background-color: $selected_bg_color;
-                color: $selected_fg_color;
-            }
-        }
-    }
-
-    toolbar.primary-toolbar {
-        margin-bottom: -1px;
-        background: $headerbar_color;
-        button {
-            @include button(normal-header);
-            margin-top: 5px;
-            margin-bottom: 5px;
-            min-height: 24px;
-            &:hover { 
-                background: transparent;
-                color: $selected_bg_color; 
-            }
-            &:selected,
-            &:active,
-            &:checked { @include button(active-header); }
-        }
-    }
-
-    .nemo-inactive-pane .view,
-    .nemo-inactive-pane iconview {
-        background-color: darken($base_color, 2%); 
-    }
-    
-}
--- a/gtk-4.0/apps/_pantheon.scss
+++ b/gtk-4.0/apps/_pantheon.scss
@@ -1,445 +0,0 @@
-/********
- * Gala *
- *******/
-
- .gala-notification {
-  border-width: 0;
-  border-radius: 2px;
-  color: white;
-  border: 1px solid $base_color;
-  background-color: $base_color;
-
-  .title,
-  .label {
-    color: $fg_color;
-  }
-}
-
-.gala-button {
-    padding: 3px;
-    color: $base_color;
-    border: none;
-    border-radius: 50%;
-    background-image: linear-gradient(to bottom,
-                                  #7e7e7e,
-                                  #3e3e3e
-                                  );
-    box-shadow: inset 0 0 0 1px transparentize(white, 0.02),
-                inset 0 1px 0 0 transparentize(white, 0.07),
-                inset 0 -1px 0 0 transparentize(white, 0.01),
-                0 0 0 1px transparentize(black, 0.40),
-                0 3px 6px transparentize(black, 0.16),
-                0 3px 6px transparentize(black, 0.23);
-    text-shadow: 0 1px 1px transparentize(black, 0.6);
-}
-
-/**********
- * Notify *
- *********/
-
-.notify {
-  /*-notify-shadow: 0px 2px 18px transparentize(black, 0.60);*/
-
-  border-radius: 5px;
-  border: 1px solid transparentize(black, 0.30);
-
-  background-color: transparentize($base_color, 0.95);
-
-  .low {}
-  .critical {}
-}
-
-
-/***************
- * SwitchBoard *
- ***************/
-
-.category-label {
-  font-weight: bold;
-  color: $fg_color;
-}
-
-
-/*************
- * Slingshot *
- ************/
-
-.button.app {
-  border: none;
-  border-radius: 0;
-  box-shadow: none;
-  background-image: none;
-
-  .app {
-    &:hover{
-      border-radius: 8px;
-      border: none;
-      background-color: transparentize($selected_bg_color, 0.7);
-      color: white;
-    }
-    &:focus{
-      /*background-color: transparentize(black, 0.20);*/
-    }
-  }
-}
-
-.search-item {
-    border-radius: 0;
-    border: none;
-    color: $fg_color;
-    background: none;
-
-    &:hover,
-    &:focus {
-      border-radius: 0;
-      background-color: transparentize($selected_bg_color, 0.7);
-      color: $selected_fg_color;
-    }
-}
-
-
-.search-entry-large,
-.search-entry-large:focus {
-    border: none;
-    font-size: 18px;
-    font-weight: 300;
-    background-image: none;
-    background: none;
-    box-shadow: none;
-    border-radius: 0;
-}
-
-.search-category-header {
-    font-weight: bold;
-    color: $fg_color;
-}
-
-
-
-/*********
- * Panel *
- ********/
-
-.panel {
-  background-color: transparent;
-  transition: all 100ms ease-in-out;
-
-  &.maximized {
-    background-color: $panel_bg_color;
-  }
-
-  &.translucent {
-    background-color:  transparentize($panel_bg_color, 0.5);;
-  }
-
-  &.color-light.translucent {
-    background-color: transparentize($panel_fg_color, 0.15);
-  }
-}
-
-menubar.panel,
-.panel menubar {
-    box-shadow: none;
-    border: none;
-}
-
-.composited-indicator {
-
-  > revealer,
-  > revealer image,
-  > revealer label,
-  > revealer spinner {
-    color: #fff;
-    font-weight: bold;
-    text-shadow: 0 1px 2px transparentize(black, 0.7), 0 1px 2px transparentize(black, 0.5);
-    transition: all 200ms ease-in-out;
-    -gtk-icon-shadow: 0 1px 2px transparentize(black, 0.7), 0 1px 2px transparentize(black, 0.5);
-  }
-
-  > revealer image:first-child + label {
-    margin-left: 5px;
-  }
-}
-
-.panel.color-light .composited-indicator {
-
-  > revealer,
-  > revealer image,
-  > revealer label,
-  > revealer spinner {
-    color: transparentize(black, 0.4);
-    text-shadow: 0 1px transparentize(white, 0.9);
-    -gtk-icon-shadow: 0 1px transparentize(white, 0.9);
-  }
-}
-
-/**************
- * Calculator *
- **************/
-
-PantheonCalculatorMainWindow {
-  border-radius: 0 0 4px 4px;
-
-  .window-frame {
-    border-radius:3px;
-  }
-}
-
-/*********
- * Cards *
- *********/
-
-.deck {
-  background-color: darken($bg_color, 8%);
-}
-
-.card {
-  background-color: $base_color;
-  border: none;
-  box-shadow: 0 0 0 1px transparentize(black, 0.95),
-              0 3px 3px transparentize(black, 0.8);
-  transition: all 150ms ease-in-out;
-}
-
-.card.collapsed {
-  background-color: darken($base_color, 5%);
-  box-shadow: 0 0 0 1px transparentize(black, 0.95),
-              0 1px 2px transparentize(black, 0.8);
-}
-
-/*********
- * Noise *
- *********/
-
-NoiseLibraryWindow {
-  border-radius: 0 0 4px 4px;
-
-  .action-bar {
-    border-radius: 0 0 4px 4px;
-  }
-
-  .window-frame {
-    border-radius:3px;
-  }
-}
-
-/********
- * Snap *
- ********/
-
-SnapMainWindow,
-SnapSnapWindow {
-
-  .take-button {
-    border-radius: 0;
-  }
-}
-
-
-/*******************
- * Photos/Shotwell *
- *******************/
-
-DirectWindow,
-LibraryWindow {
-
-  .the-button-in-the-combobox {
-    background: none;
-  }
-}
-
-.checkerboard-layout {
-    background-color: $bg_color;
-    background-image: linear-gradient(45deg,
-                                transparentize(black, 0.9) 25%,
-                                transparent 25%,
-                                transparent 75%,
-                                transparentize(black, 0.9) 75%,
-                                transparentize(black, 0.9)),
-                      linear-gradient(45deg,
-                                transparentize(black, 0.9) 25%,
-                                transparent 25%,
-                                transparent 75%,
-                                transparentize(black, 0.9) 75%,
-                                transparentize(black, 0.9));
-    background-size: 24px 24px;
-    background-position: 0 0, 12px 12px
-}
-
-.checkboard-layout .item {
-    background-color: $fg_color;
-}
-
-/*********
-* Avatar *
-*********/
-
-.avatar {
-  border: 1px solid transparentize(#000, 0.77);
-  border-radius: 50%;
-  box-shadow:
-      inset 0 0 0 1px transparentize(#fff, 0.95),
-      inset 0 1px 0 0 transparentize(#fff, 0.55),
-      inset 0 -1px 0 0 transparentize(#fff, 0.85),
-      0 1px 3px transparentize(#000, 0.88),
-      0 1px 2px transparentize(#000, 0.77);
-}
-
-/************
-* Level bar *
-*************/
-
-.source-list.view {
-  &.level-bar {
-    &, &:selected, &:selected:focus {
-      background: linear-gradient(lighten($_sidebar_color, 15%), lighten($_sidebar_color, 15%));
-      border: 1px solid transparentize(black, 0.86);
-      box-shadow: 0 1px 0 transparentize(#000, 0.75);
-      border-radius: 2px;
-    }
-    &.fill-block {
-      border: none;
-      &, &:hover, &:selected, &:selected:focus {
-       @include scale-highlight(right);
-      }
-    }
-  }
-}
-
-
-/**************************
- * Colors in context menu *
-**************************/
-
-checkbutton.color-button {
-  border: 1px solid $borders_color;
-  border-radius: 100px;
-  background-clip: border-box;
-  padding: 0;
-  margin: 2px 1px;
-
-  > check {
-    -gtk-icon-source: none;
-    background: none;
-    margin-right: 0;
-    padding: 2px;
-  }
-
-  &.none {
-    > check {
-      background-color: transparent;
-      border-radius: 100px;
-      -gtk-icon-source: -gtk-icontheme("close-symbolic");
-    }
-  }
-
-}
-
-radiobutton.color-button {
-  > radio {
-    -gtk-icon-source: none;
-    margin-right: 0;
-    border: 1px solid rgba(black, 0.15);
-    border-radius: 100px;
-    background-clip: border-box;
-  }
-
-  &:active > radio {
-    border: 1px solid rgba(black, 0.35);
-  }
-}
-
-.color-button {
-  check,
-  check:checked,
-  radio,
-  radio:checked, {
-      background-image: none;
-      border: 1px solid rgba(black, 0.2);
-      border-radius: 50%;
-      color: $base_color;
-      -gtk-icon-source: -gtk-icontheme("check-active-symbolic");
-  }
-
-  &.red check,
-  &.red radio,
-  &.strawberry check,
-  &.strawberry radio {
-      background-color: #{'@STRAWBERRY_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@STRAWBERRY_500'};
-  }
-
-  &.orange check,
-  &.orange radio {
-      background-color: #{'@ORANGE_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@ORANGE_500'};
-  }
-
-  &.yellow check,
-  &.yellow radio,
-  &.banana check,
-  &.banana radio {
-      background-color: #{'@BANANA_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BANANA_700'};
-  }
-
-  &.green check,
-  &.green radio,
-  &.lime check,
-  &.lime radio {
-      background-color: #{'@LIME_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@LIME_700'};
-  }
-
-  &.blue check,
-  &.blue radio,
-  &.blueberry check,
-  &.blueberry radio {
-      background-color: #{'@BLUEBERRY_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BLUEBERRY_700'};
-  }
-
-  &.purple check,
-  &.purple radio,
-  &.grape check,
-  &.grape radio {
-      background-color: #{'@GRAPE_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@GRAPE_700'};
-  }
-
-  &.brown check,
-  &.brown radio,
-  &.cocoa check,
-  &.cocoa radio {
-      background-color: #{'@COCOA_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@COCOA_500'};
-  }
-
-  &.mint check,
-  &.mint radio  {
-      background-color: #{'@MINT_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@MINT_700'};
-  }
-
-  &.pink check,
-  &.pink radio,
-  &.bubblegum check,
-  &.bubblegum radio  {
-      background-color: #{'@BUBBLEGUM_500'};
-      -gtk-icon-shadow: 0 1px 1px #{'@BUBBLEGUM_700'};
-  }
-
-  &.slate check,
-  &.slate radio  {
-      background-color: #{'@SLATE_300'};
-      -gtk-icon-shadow: 0 1px 1px #{'@SLATE_500'};
-
-  }
-
-  &.auto radio {
-      background-image: url("assets/color-button-auto.png");
-      background-position: -1px -1px;
-      background-repeat: no-repeat;
-      background-size: calc(100% + 2px);
-  }
-}
--- a/gtk-4.0/apps/_unity.scss
+++ b/gtk-4.0/apps/_unity.scss
@@ -1,150 +0,0 @@
-/********
-* Unity *
-*********/
-
-$unity_color: #eeeeee; /* Unity window border color */
-$unity_text_color: #31363D; /* Unity window text color */
-$backdrop_unity_text_color: darken($unity_text_color,10%); /* Backdrop Unity window text color */
-$unity_panel_color: darken($unity_color, 10%); /* Unity panel color #454D50 */
-
-UnityDecoration {
-
-  background-color: $unity_color;
-  color: $unity_text_color;
-
-  .top {
-    padding: 0 5px 0 5px;
-    border-radius: 4px 4px 0px 0px;
-    box-shadow: none;
-    border: 1px solid $unity_color;
-    border-bottom-width: 0;
-    background-color: $unity_color;
-    color: $unity_text_color;
-    border-top: 1px solid rgba(255,255,255,0.1);
-
-    &:backdrop {
-      border-bottom-width: 0;
-      color: $backdrop_unity_text_color;
-      border-top: 1px solid rgba(255,255,255,0.1);
-    }
-
-    .menuitem {
-      color: $unity_text_color;
-
-      &:backdrop {
-        color: $backdrop_unity_text_color;
-      }
-    }
-  }
-}
-
-
-UnityDecoration.left,
-UnityDecoration.right {
-  background-repeat: repeat-x;
-  background-color: darken($unity_color, 0.6);
-  background-size: 1px 120px;
-  background-clip: border-box;
-  background-image: linear-gradient(to bottom,
-                                    $unity_color,
-                                    darken($unity_color, 0.6)
-                                    );
-}
-
-UnityDecoration.bottom {
-  background-size: 1px;
-  background-repeat: repeat-x;
-  background-color: darken($unity_color, 0.6);
-}
-
-UnityDecoration.left:backdrop,
-UnityDecoration.right:backdrop,
-UnityDecoration.bottom:backdrop {
-  background-size: 1px;
-  background-repeat: repeat-x;
-}
-
-
-/**************
-* Unity Panel *
-***************/
-
-UnityPanelWidget,
-.unity-panel {
-background-color: $unity_panel_color;
-color: $unity_text_color;
-}
-
-
-UnityPanelWidget:backdrop,
-.unity-panel:backdrop {
-  color: $backdrop_unity_text_color;
-}
-
-.unity-panel.menuitem,
-.unity-panel .menuitem {
-  border-width: 0 1px;
-  color: $unity_text_color;
-}
-
-.unity-panel.menubar,
-.unity-panel .menubar {
-  color: $unity_text_color;
-}
-
-.unity-panel.menu.menubar,
-.unity-panel .menu .menubar {
-  background-color: $unity_panel_color;
-  color: $unity_text_color;
-}
-
-.unity-panel.menubar:backdrop,
-.unity-panel .menubar *:backdrop {
-  color: $backdrop_fg_color;
-}
-
-.unity-panel.menubar.menuitem,
-.unity-panel.menubar .menuitem {
-  padding: 3px 5px;
-  border-width: 1px;
-  border-style: solid;
-  border: none;
-  background: none;
-  color: $unity_text_color;
-  box-shadow: none;
-}
-
-.unity-panel.menubar.menuitem:hover,
-.unity-panel.menubar .menuitem:hover {
-  border-radius: 0;
-  background-color: darken($unity_color, 1.05);
-  color: $unity_text_color;
-  box-shadow: none;
-}
-
-.unity-panel.menubar .menuitem *:hover {
-  color: white;
-  box-shadow: none;
-}
-
-.unity-panel.menubar .menuitem.separator,
-.unity-panel.menubar.menuitem.separator {
-  border: none;
-  color: $borders_color;
-}
-
-/* Force Quit */
-SheetStyleDialog.unity-force-quit {
-   background-color: $base_color;
-}
-
-
-@keyframes playbackmenuitem_spinner {
-  to { -gtk-icon-transform: rotate(1turn); }
-}
-
-.menu IdoPlaybackMenuItem.menuitem:active {
-  -gtk-icon-source: -gtk-icontheme("process-working-symbolic");
-  animation: playbackmenuitem_spinner 1s infinite linear;
-  color: $selected_bg_color;
-}
--- a/gtk-4.0/apps/_xfce.scss
+++ b/gtk-4.0/apps/_xfce.scss
@@ -1,107 +0,0 @@
-// Xfce Panel
-.xfce4-panel.panel {
-    background-color: $panel_bg_color;
-  
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  
-    button.flat { @extend %panelbutton; }
-  }
-  
-  #tasklist-button {
-    color: transparentize($panel_fg_color, 0.2);
-    border-radius: 0;
-    border: none;
-    background-color: transparentize($panel_bg_color, 1);
-  
-    &:hover {
-      color: lighten($panel_fg_color, 10%);
-      background-color: transparentize(black, 0.83);
-    }
-  
-    &:checked {
-      color: white;
-      background-color: transparentize(black, 0.75);
-      box-shadow: inset 0 -2px $selected_bg_color;
-    }
-  }
-  
-  %panelbutton {
-    color: $panel_fg_color;
-    border-radius: 0;
-    border: none;
-    background-color: transparentize($panel_bg_color, 1);
-  
-    &:hover {
-      border: none;
-      background-color: lighten($panel_bg_color, 10%);
-    }
-    &:active, &:checked {
-      color: $selected_fg_color;
-      border-bottom: 2px solid $selected_bg_color;
-      background-color: lighten($panel_bg_color, 5%);
-  
-      label, image { color: inherit; }
-    }
-  }
-
-
-
-#whiskermenu-window button {
-    background-color:transparent;
-    border: none;
-    border-radius: 0;
-    font-weight: normal;
-    padding: 2px;
-    margin: 1px 0px;
-    &:hover, &:checked {
-        background-color: $selected_bg_color;
-    }
-}
-
-/* thunar */
-.thunar toolbar {
-  background-color: $headerbar_color; 
-}
-
-/* buttons in toolbar */
-.thunar toolbar.horizontal button image {
-  -gtk-icon-transform:scale(0.72);
-}
-
-scrolledwindow.sidebar treeview.view {
-  background: darken($_sidebar_color, 2%);
-  padding: 1.5px;
-}
-
-/* path-bar of thunar */
-window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.toggle.path-bar-button, .thunar toolbar .path-bar-button {
-  margin-top: 7px;
-  margin-bottom: 7px;
-  &:hover { color: $selected_bg_color; }
-  &:checked { @include button(active-header); }
-}
-
-window.thunar toolbar#location-toolbar > toolitem > widget > widget.linked.path-bar > button.path-bar-button, .thunar toolbar .path-bar-button {
-  background: none;
-  outline: none;
-  border: none;
-  box-shadow: none;
-}
-
-/* thunar sidepane */
-window.thunar paned > scrolledwindow treeview.view {
-
-  &:hover {
-    background: darken($_sidebar_color, 3%);
-  }
-  &:selected {
-    @include button(active-header);
-    border-radius: 0;
-    box-shadow: none;
-  }
-}
-
-window.thunar toolbar#location-toolbar entry {
-  border-radius: 10px;
-}
--- a/gtk-4.0/gtk-dark.css
+++ b/gtk-4.0/gtk-dark.css
--- a/gtk-4.0/gtk-dark.scss
+++ b/gtk-4.0/gtk-dark.scss
@@ -1,11 +0,0 @@
-
-
-$variant: 'dark';
-
-@import '../gtk-3.0/colors';
-@import '../gtk-3.0/elementary-colors';
-@import '../gtk-3.0/colors-public';
-@import 'drawing';
-@import 'common';
-@import 'widgets';
-@import 'apps';
--- a/gtk-4.0/gtk.css
+++ b/gtk-4.0/gtk.css
--- a/gtk-4.0/gtk.scss
+++ b/gtk-4.0/gtk.scss
@@ -1,11 +0,0 @@
-
-
-$variant: 'light';
-
-@import '../gtk-3.0/colors';
-@import '../gtk-3.0/elementary-colors';
-@import '../gtk-3.0/colors-public';
-@import 'drawing';
-@import 'common';
-@import 'widgets';
-@import 'apps';
--- a/gtk-4.0/thumbnail.png
+++ b/gtk-4.0/thumbnail.png
--- a/gtk-4.0/widgets/_action-bars.scss
+++ b/gtk-4.0/widgets/_action-bars.scss
@@ -1,26 +0,0 @@
-/***************
-* Action bars *
-***************/
-
-.action-bar {
-  background-color: darken($bg_color, 10%);
-  border: solid $borders_color;
-  border-width: 1px 0 0 0;
-  color: $fg_color;
-  box-shadow: none;
-
-  &:backdrop {
-    background-color: darken($backdrop_bg_color, 10%);
-    box-shadow: none;
-  }
-
-  &:first-child {
-    border-radius: 6px 6px 0px 0px;
-    border-width: 1px 1px 0px 1px;
-  }
-
-  &:last-child {
-    border-radius: 0 0 6px 6px;
-    border-width: 0px 1px 1px 1px;
-  }
-}
--- a/gtk-4.0/widgets/_app-notifications.scss
+++ b/gtk-4.0/widgets/_app-notifications.scss
@@ -1,23 +0,0 @@
-/*********************
- * App Notifications *
- *********************/
-.app-notification,
-.app-notification.frame {
-  @extend %osd;
-
-  padding: 10px;
-  border-radius: 0 0 5px 5px;
-  background-color: $osd_bg_color;
-  background-image: linear-gradient(to bottom, transparentize(black, 0.8),
-                                               transparent 2px);
-  background-clip: padding-box;
-
-  &:backdrop {
-    background-image: none;
-    transition: $backdrop_transition;
-  }
-
-  button { @extend %osd_button; }
-
-  border { border: none; }
-}
--- a/gtk-4.0/widgets/_base-states.scss
+++ b/gtk-4.0/widgets/_base-states.scss
@@ -1,176 +0,0 @@
-/***************
- * Base States *
- ***************/
-.background {
-  color: $fg_color;
-  background-color: $bg_color;
-
-  &:backdrop {
-    color: $backdrop_fg_color;
-    background-color: $backdrop_bg_color;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-}
-
-/*
-   These wildcard seems unavoidable, need to investigate.
-   Wildcards are bad and troublesome, use them with care,
-   or better, just don't.
-   Everytime a wildcard is used a kitten dies, painfully.
-*/
-
-.gtkstyle-fallback {
-  color: $fg_color;
-  background-color: $bg_color;
-
-  &:hover {
-    color: $fg_color;
-    background-color: lighten($bg_color, 10%);
-  }
-
-  &:active {
-    color: $fg_color;
-    background-color: darken($bg_color, 10%);
-  }
-
-  &:disabled {
-    color: $insensitive_fg_color;
-    background-color: $insensitive_bg_color;
-  }
-
-  &:selected {
-    color: $selected_fg_color;
-    background-color: $selected_bg_color;
-  }
-}
-
-.view,
-%view {
-  color: $text_color;
-  background-color: $base_color;
-
-  &:backdrop {
-    color: $backdrop_text_color;
-    background-color: $backdrop_base_color;
-  }
-
-  &:selected {
-    &:focus, & {
-      @extend %selected_items;
-
-      border-radius: 3px;
-    }
-  }
-}
-
-.view,
-textview {
-  text {
-    @extend %view;
-
-    selection { &:focus, & { @extend %selected_items; }}
-  }
-}
-
-textview border { background-color: mix($bg_color, $base_color, 50%); }
-
-iconview { @extend .view; }
-
-.rubberband,
-rubberband {
-  border: 1px solid darken($selected_bg_color, 10%);
-  background-color: transparentize(darken($selected_bg_color, 10%), 0.8);
-}
-
-flowbox {
-  rubberband { @extend rubberband; }
-
-  flowboxchild {
-    padding: 3px;
-    border-radius: 3px;
-
-    &:selected {
-      @extend %selected_items;
-
-      outline-offset: -2px;
-    }
-  }
-}
-
-label {
-  caret-color: currentColor; // this shouldn't be needed.
-
-  &.separator {
-    @extend .dim-label;
-
-    color: $fg_color;
-
-    &:backdrop { color: $backdrop_fg_color; }
-  }
-
-  row:selected &,
-  &:selected { @extend %nobg_selected_items; }
-
-  selection {
-    background-color: $selected_bg_color;
-    color: $selected_fg_color;
-  }
-
-  &:disabled {
-    color: $insensitive_fg_color;
-
-    selection { @extend %selected_items:disabled; }
-
-    &:backdrop { color: $backdrop_insensitive_color; }
-  }
-
-  &:backdrop {
-    color: $backdrop_fg_color;
-
-    selection { @extend %selected_items:backdrop; }
-  }
-}
-
-.dim-label {
-  opacity: 0.55;
-  text-shadow: none;
-}
-
-assistant {
-  .sidebar {
-    background-color: $base_color;
-    border-top: 1px solid $borders_color;
-
-    &:backdrop {
-      background-color: $backdrop_base_color;
-      border-color: $backdrop_borders_color;
-    }
-  }
-
-  &.csd .sidebar { border-top-style: none; }
-
-  .sidebar label { padding: 6px 12px; }
-
-  .sidebar label.highlight { background-color: mix($bg_color, $fg_color, 80%); }
-}
-
-%osd, .osd {
-  color: $osd_fg_color;
-  border: 1px solid #171e27;
-  background-color: $osd_bg_color;
-  background-clip: padding-box;
-  outline-color: transparentize($osd_fg_color, 0.7);
-  text-shadow: 0 1px black;
-  -gtk-icon-shadow: 0 1px black;
-
-  &:backdrop {
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-  }
-}
-
-*:selected {
-  background: $selected_bg_color;
-  color: $selected_fg_color;
-}
--- a/gtk-4.0/widgets/_buttons.scss
+++ b/gtk-4.0/widgets/_buttons.scss
@@ -1,559 +0,0 @@
-/***********
- * Buttons *
- ***********/
-// stuff for .needs-attention
-$_dot_color: if($variant=='light', $selected_bg_color,
-                                   lighten($selected_bg_color,15%));
-@keyframes needs_attention {
-  from { background-image: radial-gradient(farthest-side, $_dot_color 0%, transparentize($_dot_color, 1) 0%); }
-  to { background-image: radial-gradient(farthest-side, $_dot_color 95%, transparentize($_dot_color, 1)); }
-}
-
-%button,
-button {
-  @at-root %button_basic, & {
-    min-height: 20px;
-    min-width: 16px;
-    padding: 2px 6px;
-    border: 1px solid $borders_color;
-    border-radius: 4px;
-    transition: $button_transition;
-
-    @include button(normal);
-
-    &.flat {
-      @include button(undecorated);
-      // to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
-      // to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
-      // it won't fade out when the pointer leave the button allocation area. To make the transition more evident
-      // in this case the duration is increased.
-      transition: none;
-
-      &:hover {
-        transition: $button_transition;
-        transition-duration: 500ms;
-        @include button(hover,$selected_bg_color,$selected_fg_color);
-
-        &:active { transition: $button_transition; }
-      }
-    }
-
-    &:hover {
-      @include button(hover,$selected_bg_color,$selected_fg_color);
-      -gtk-icon-filter: brightness(1.2);
-    }
-
-    &:active,
-    &:checked {
-      @include button(active,darken($selected_bg_color,5%),$selected_fg_color);
-
-      transition-duration: 50ms;
-    }
-
-    &:backdrop {
-      &.flat, & {
-        @include button(backdrop);
-
-        transition: $backdrop_transition;
-        -gtk-icon-filter: none;
-
-        &:active,
-        &:checked { @include button(backdrop-active); }
-
-        &:disabled {
-          @include button(backdrop-insensitive);
-
-          &:active,
-          &:checked { @include button(backdrop-insensitive-active); }
-        }
-      }
-    }
-
-    &.flat { &:backdrop, &:disabled, &:backdrop:disabled { @include button(undecorated); }}
-
-    &:disabled {
-      @include button(insensitive);
-
-      &:active,
-      &:checked { @include button(insensitive-active); }
-    }
-
-    &.image-button {
-      min-width: 24px;
-      padding-left: 4px;
-      padding-right: 4px;
-      &.circular,&.sidebar-button{
-        padding: 6px 4px;
-        border-radius: 50px;
-        box-shadow: none;
-       }
-      &.sidebar-button {
-        background-color: lighten($_sidebar_color, 7.77%); 
-        color: #fff;
-        &:hover{
-          background-color: $selected_bg_color;
-        }
-      }
-    }
-    
-
-    &.text-button {
-      padding-left: 16px;
-      padding-right: 16px;
-    }
-
-    &.text-button.image-button {
-      padding-left: 8px;
-      padding-right: 8px;
-      border-radius: 2px;
-      label {
-        padding-left: 8px;
-        padding-right: 8px;
-      }
-    }
-
-    &:drop(active) {
-      color: $drop_target_color;
-      border-color: $drop_target_color;
-      box-shadow: inset 0 0 0 1px $drop_target_color;
-    }
-  }
-
-  @at-root %button_selected, & {
-    row:selected & {
-      @if $variant == 'light' { border-color: $selected_borders_color; }
-
-      &.flat:not(:active):not(:checked):not(:hover):not(disabled) {
-        color: $selected_fg_color;
-        border-color: transparent;
-
-        &:backdrop { color: if($variant=='light', $backdrop_base_color, $backdrop_fg_color); }
-      }
-    }
-  }
-
-
-  // big standalone buttons like in Documents pager
-  &.osd {
-    min-width: 24px;
-    min-height: 20px;
-
-    &.image-button { min-width: 32px; }
-
-    color: $osd_fg_color;
-    border-radius: 5px;
-    outline-color: transparentize($osd_fg_color, 0.7);  //FIXME: define a color var?
-
-    @include button(osd);
-
-    border: none;
-    box-shadow: none;
-
-    &:hover {
-      @include button(osd-hover);
-
-      border: none;
-      box-shadow: none;
-    }
-
-    &:active,
-    &:checked {
-      @include button(osd-active);
-
-      border: none;
-      box-shadow: none;
-    }
-
-    &:disabled {
-      &:backdrop, & {
-        @include button(osd-insensitive);
-
-        border: none;
-      }
-    }
-
-    &:backdrop {
-      @include button(osd-backdrop);
-
-      border: none;
-    }
-  }
-
-  //overlay / OSD style
-  @at-root %osd_button,
-  .osd & {
-    @include button(osd);
-
-    &:hover { @include button(osd-hover); }
-
-    &:active,
-    &:checked { &:backdrop, & { @include button(osd-active); }}
-
-    &:disabled { &:backdrop, & { @include button(osd-insensitive); }}
-
-    &:backdrop { @include button(osd-backdrop); }
-
-    &.flat {
-      @include button(undecorated);
-
-      box-shadow: none; //FIXME respect no edge on the button mixin
-      text-shadow: 0 1px black;
-      -gtk-icon-shadow: 0 1px black;
-
-      &:hover { @include button(osd-hover); }
-
-      &:disabled {
-        @include button(osd-insensitive);
-        background-image: none;
-        border-color: transparent;
-        box-shadow: none;
-      }
-
-      &:backdrop { @include button(undecorated); }
-
-      &:active,
-      &:checked { @include button(osd-active); }
-    }
-  }
-
-  // Suggested and Destructive Action buttons
-  @each $b_type, $b_color in (suggested-action, $cyan),
-                             (destructive-action, $destructive_color) {
-    &.#{$b_type} {
-      border: none;
-      
-      @if $b_type ==  suggested-action {
-        @include button(rounded, $b_color, white);
-      } @else {
-        @include button(rounded-red, $b_color, white); 
-      }
-
-      &.flat {
-       // @include button(undecorated);
-        @include button(rounded, $b_color, white);
-        //color: $b_color; //FIXME: does it work on the dark variant?
-      }
-
-      &:hover { @include button(hover, $b_color, white); }
-
-      &:active,
-      &:checked { @include button(active, $b_color, white); }
-
-      &:backdrop,
-      &.flat:backdrop {
-        @include button(backdrop, $b_color, white);
-        label { color: transparentize(white, 0.5);}
-        &:active,
-        &:checked { @include button(backdrop-active, $b_color, white); }
-
-        &:disabled {
-          @include button(backdrop-insensitive, $b_color, white);
-          label { color: transparentize(white, 0.5);}
-
-          &:active,
-          &:checked { @include button(backdrop-insensitive-active, $b_color, white); }
-        }
-      }
-
-      &.flat {
-        &:backdrop, &:disabled, &:backdrop:disabled {
-          @include button(undecorated);
-
-          color: transparentize($b_color, 0.2);
-        }
-      }
-
-      &:disabled {
-        @include button(insensitive, $b_color, white);
-
-        &:active,
-        &:checked { @include button(insensitive-active, $b_color, white); }
-      }
-
-      .osd & {
-        @include button(osd, $b_color);
-        
-        &:hover { @include button(osd-hover, $b_color); }
-
-        &:active,
-        &:checked { &:backdrop, & { @include button(osd-active, $b_color); }}
-
-        &:disabled { &:backdrop, & { @include button(osd-insensitive, $b_color); }}
-
-        &:backdrop { @include button(osd-backdrop, $b_color); }
-      }
-    }
-  }
-
-  .stack-switcher > & {
-    // to position the needs attention dot, padding is added to the button
-    // child, a label needs just lateral padding while an icon needs vertical
-    // padding added too.
-
-    outline-offset: -3px; // needs to be set or it gets overriden by GtkRadioButton outline-offset
-
-    > label {
-      padding-left: 6px;  // label padding
-      padding-right: 6px; //
-    }
-
-    > image {
-      padding-left: 6px;   // image padding
-      padding-right: 6px;  //
-      padding-top: 3px;    //
-      padding-bottom: 3px; //
-    }
-
-    &.text-button {
-      // compensate text-button paddings
-      padding-left: 10px;
-      padding-right: 10px;
-    }
-
-    &.image-button {
-      // we want image buttons to have a 1:1 aspect ratio, so compensation
-      // of the padding added to the GtkImage is needed
-      padding-left: 2px;
-      padding-right: 2px;
-    }
-
-    &.needs-attention {
-      > label,
-      > image { @extend %needs_attention; }
-
-      &:active,
-      &:checked {
-        > label,
-        > image {
-          animation: none;
-          background-image: none;
-        }
-      }
-    }
-  }
-
-  //inline-toolbar buttons
-  .inline-toolbar &, .inline-toolbar &:backdrop {
-    border-radius: 2px;
-    border-width: 1px;
-    @extend %linked;
-  }
-
-  .primary-toolbar &, .primary-toolbar .raised & { // tango icons don't need shadows
-    -gtk-icon-shadow: none; 
- 
-    &:hover,
-    &:focus {
-      @include button(hover,$selected_bg_color,$selected_fg_color);
-    }
-
-  } 
-
-  .linked > &,
-  .linked > &:hover,
-  .linked > &:active,
-  .linked > &:checked,
-  .linked > &:backdrop { @extend %linked; }
-
-  .linked.vertical > &,
-  .linked.vertical > &:hover,
-  .linked.vertical > &:active,
-  .linked.vertical > &:checked,
-  .linked.vertical > &:backdrop { @extend %linked_vertical; }
-}
-
-%needs_attention {
-  animation: needs_attention 150ms ease-in;
-  $_dot_shadow: _text_shadow_color();
-  $_dot_shadow_r: if($variant=='light',0.5,0.45);
-  background-image: radial-gradient(farthest-side, $_dot_color 96%, transparentize($_dot_color,1 ));
-  background-size: 6px 6px, 6px 6px;
-  background-repeat: no-repeat;
-
-  @if $variant == 'light' { background-position: right 3px, right 4px; }
-
-  @else { background-position: right 3px, right 2px; }
-
-  &:backdrop { background-size: 6px 6px, 0 0;}
-
-  &:dir(rtl) {
-    @if $variant == 'light' { background-position: left 3px, left 4px; }
-
-    @else { background-position: left 3px, left 2px; }
-  }
-}
-
-toolbar {
-  button {
-    &:hover { @include button(normal,darken($bg_color,7%));}
-    &:active { @include button(normal,darken($bg_color,12%));}
-  }
-}
-// all the following is for the +|- buttons on inline toolbars, that way
-// should really be deprecated...
-.inline-toolbar toolbutton > button { // redefining the button look is
-                                      // needed since those are flat...
-  @include button(undecorated);
-
-  &:hover { color: $selected_fg_color; }
-
-  &:active,
-  &:checked{ color: darken($selected_bg_color, 5%); }
-
-  &:disabled {
-    color: $backdrop_text_color;
-
-    &:active,
-    &:checked { color: transparentize(darken($selected_bg_color, 5%),0.7); }
-  }
-
-  &:backdrop {
-    color: $backdrop_text_color;
-
-    &:active,
-    &:checked { color: darken($selected_bg_color, 5%); }
-
-    &:disabled {
-      color: $backdrop_text_color;
-
-      &:active,
-      &:checked { color: transparentize(darken($selected_bg_color, 5%),0.7); }
-    }
-  }
-}
-
-// More inline toolbar buttons
-toolbar.inline-toolbar toolbutton,
-toolbar.inline-toolbar toolbutton:backdrop {
-  > button.flat {
-    &:backdrop {
-      border-color: transparent;
-      box-shadow: none;
-    }
-  }
-}
-
-%linked_middle {
-  border: 1px solid $borders_color;
-  border-radius: 0;
-  border-right-style: none;
-  box-shadow: inset 0px 1px 0px 0px $top_highlight;
-}
-
-%linked {
-  @extend %linked_middle;
-
-  &:first-child {
-    border-top-left-radius: 3px;
-    border-bottom-left-radius: 3px;
-  }
-
-  &:last-child {
-    border-top-right-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-right-style: solid;
-  }
-
-  &:only-child {
-    border-radius: 3px;
-    border-style: solid;
-  }
-}
-
-%linked_vertical_middle {
-  border-style: solid solid none solid;
-  border-radius: 0;
-}
-
-%linked_vertical{
-  @extend %linked_vertical_middle;
-
-  &:first-child {
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
-  }
-
-  &:last-child {
-    border-bottom-left-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-style: solid;
-  }
-
-  &:only-child {
-    border-radius: 3px;
-    border-style: solid;
-  }
-}
-
-%undecorated_button {
-  background-color: transparent;
-  background-image: none;
-  border-color: transparent;
-  box-shadow: inset 0 1px transparentize(white,1),
-              0 1px transparentize(white, 1);
-  text-shadow: none;
-  -gtk-icon-shadow: none;
-}
-
-/* menu buttons */
-modelbutton.flat,
-.menuitem.button.flat {
-  min-height: 26px;
-  padding-left: 5px;
-  padding-right: 5px;
-  border-radius: 3px;
-  outline-offset: -2px;
-
-  @extend %undecorated_button;
-
-  &:hover { background-color: $popover_hover_color; }
-
-  &:selected { @extend %selected_items; }
-
-  &:backdrop,
-  &:backdrop:hover { @extend %undecorated_button; }
-
-  // FIXME: remove the following when the checks/radios rewrite lands
-  check:last-child,
-  radio:last-child { margin-left: 8px; }
-
-  check:first-child,
-  radio:first-child { margin-right: 8px; }
-}
-
-modelbutton.flat arrow {
-  background: none;
-
-  &:hover { background: none; }
-
-  &.left { -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
-
-  &.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
-}
-
-button.color {
-  padding: 4px;
-
-  colorswatch:only-child {
-    &, overlay { border-radius: 0; }
-
-    @if $variant == 'light' {
-      box-shadow: none;
-
-      &:disabled,
-      &:backdrop { box-shadow: none; }
-    }
-  }
-}
-
-notebook, list, .view, popover {
-  button {
-    box-shadow: none;
-    &:backdrop {
-      box-shadow: none;
-    }
-  }
-  .linked > button {
-    box-shadow: none;
-  }
-}
--- a/gtk-4.0/widgets/_calendar.scss
+++ b/gtk-4.0/widgets/_calendar.scss
@@ -1,59 +0,0 @@
-/************
- * Calendar *
- ***********/
-calendar {
-  color: $text_color;
-  border: 1px solid $borders_color;
-
-  &:selected {
-    @extend %selected_items;
-
-    border-radius: 3px;
-  }
-
-  &.header {
-    border-bottom: 1px solid transparentize(black, 0.9);
-    border-radius: 0;
-
-    &:backdrop { border-color: transparentize(black, 0.9); }
-  }
-
-  &.button {
-    @extend %undecorated_button;
-
-    color: transparentize($fg_color, 0.55);
-
-    &:hover {
-      @extend %undecorated_button;
-
-      color: $fg_color;
-    }
-
-    &:backdrop {
-      @extend %undecorated_button;
-
-      color: transparentize($backdrop_fg_color,0.55);
-    }
-
-    &:disabled {
-      @extend %undecorated_button;
-
-      color:  transparentize($insensitive_fg_color,0.55);
-    }
-  }
-
-  &:indeterminate,
-  &:indeterminate:backdrop { color: gtkalpha(currentColor, 0.55); }
-
-  &.highlight,
-  &.highlight:backdrop {
-    font-size: smaller;
-    color: $fg_color;
-  }
-
-
-  &:backdrop {
-    color: $backdrop_text_color;
-    border-color: $backdrop_borders_color;
-  }
-}
--- a/gtk-4.0/widgets/_checks-radios.scss
+++ b/gtk-4.0/widgets/_checks-radios.scss
@@ -1,165 +0,0 @@
-/*************************
- * Check and Radio Items *
- *************************/
-// draw regular check and radio items using our PNG assets
-// all assets are rendered from assets.svg. never add pngs directly
-
-
-// unchecked
-@each $s,$un in ('','-unchecked'),
-                  (':hover', '-unchecked-hover'),
-                  (':active', '-unchecked-active'),
-                  (':backdrop', '-unchecked-backdrop'),
-                  (':disabled', '-unchecked-insensitive'),
-                  (':disabled:backdrop', '-unchecked-insensitive') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/checkbox#{$un}.png"),url("../assets/checkbox#{$un}@2.png")), -gtk-scaled(url("../assets/checkbox#{$un}-dark.png"),url("../assets/checkbox#{$un}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/radio#{$un}.png"),url("../assets/radio#{$un}@2.png")), -gtk-scaled(url("../assets/radio#{$un}-dark.png"),url("../assets/radio#{$un}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-// checked
-@each $s,$ch in (':checked', '-checked'),
-                  (':checked:hover', '-checked-hover'),
-                  (':checked:active', '-checked-active'),
-                  (':checked:backdrop', '-checked-backdrop'),
-                  (':checked:disabled', '-checked-insensitive'),
-                  (':checked:disabled:backdrop', '-checked-insensitive') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/checkbox#{$ch}.png"),url("../assets/checkbox#{$ch}@2.png")), -gtk-scaled(url("../assets/checkbox#{$ch}-dark.png"),url("../assets/checkbox#{$ch}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/radio#{$ch}.png"),url("../assets/radio#{$ch}@2.png")), -gtk-scaled(url("../assets/radio#{$ch}-dark.png"),url("../assets/radio#{$ch}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-// mixed
-@each $s,$mx in (':indeterminate', '-mixed'),
-                  (':indeterminate:hover', '-mixed-hover'),
-                  (':indeterminate:active', '-mixed-active'),
-                  (':indeterminate:backdrop', '-mixed-backdrop'),
-                  (':indeterminate:disabled', '-mixed-insensitive'),
-                  (':indeterminate:disabled:backdrop', '-mixed-insensitive') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/checkbox#{$mx}.png"),url("../assets/checkbox#{$mx}@2.png")), -gtk-scaled(url("../assets/checkbox#{$mx}.png"),url("../assets/checkbox#{$mx}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/radio#{$mx}.png"),url("../assets/radio#{$mx}@2.png")), -gtk-scaled(url("../assets/radio#{$mx}.png"),url("../assets/radio#{$mx}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-// unchecked:selected
-@each $s,$un in (':selected','-unchecked'),
-                  (':hover:selected', '-unchecked'),
-                  (':active:selected', '-unchecked'),
-                  (':backdrop:selected', '-unchecked'),
-                  (':disabled:selected', '-unchecked'),
-                  (':disabled:backdrop:selected', '-unchecked') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/checkbox#{$un}.png"),url("../assets/checkbox#{$un}@2.png")), -gtk-scaled(url("../assets/checkbox#{$un}-dark.png"),url("../assets/checkbox#{$un}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/selected-radio#{$un}.png"),url("../assets/selected-radio#{$un}@2.png")), -gtk-scaled(url("../assets/selected-radio#{$un}-dark.png"),url("../assets/selected-radio#{$un}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-// checked:selected
-@each $s,$ch in (':checked:selected', '-checked'),
-                  (':checked:hover:selected', '-checked'),
-                  (':checked:active:selected', '-checked'),
-                  (':checked:backdrop:selected', '-checked'),
-                  (':checked:disabled:selected', '-checked'),
-                  (':checked:disabled:backdrop:selected', '-checked') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/checkbox#{$ch}.png"),url("../assets/checkbox#{$ch}@2.png")), -gtk-scaled(url("../assets/checkbox#{$ch}-dark.png"),url("../assets/checkbox#{$ch}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/selected-radio#{$ch}.png"),url("../assets/selected-radio#{$ch}@2.png")), -gtk-scaled(url("../assets/selected-radio#{$ch}-dark.png"),url("../assets/selected-radio#{$ch}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-
-// mixed:selected
-@each $s,$mx in (':indeterminate:selected', '-mixed'),
-                  (':indeterminate:hover:selected', '-mixed'),
-                  (':indeterminate:active:selected', '-mixed'),
-                  (':indeterminate:backdrop:selected', '-mixed'),
-                  (':indeterminate:disabled:selected', '-mixed'),
-                  (':indeterminate:disabled:backdrop:selected', '-mixed') {
-  check#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/selected-checkbox#{$mx}.png"),url("../assets/selected-checkbox#{$mx}@2.png")), -gtk-scaled(url("../assets/selected-checkbox#{$mx}.png"),url("../assets/selected-checkbox#{$mx}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-  radio#{$s}{
-    -gtk-icon-source: if($variant == 'light', -gtk-scaled(url("../assets/selected-radio#{$mx}.png"),url("../assets/selected-radio#{$mx}@2.png")), -gtk-scaled(url("../assets/selected-radio#{$mx}.png"),url("../assets/selected-radio#{$mx}@2.png")));
-    -gtk-icon-shadow: none;
-  }
-}
-
-
-// selection-mode unchecked
-@each $s,$un in ('','-unchecked'),
-                  (':hover', '-unchecked-hover'),
-                  (':active', '-unchecked-active'),
-                  (':backdrop', '-unchecked-backdrop'),
-                  (':disabled', '-unchecked-insensitive'),
-                  (':disabled:backdrop', '-unchecked-backdrop-insensitive') {
-  .view.content-view check#{$s},
-  .view.content-view.check#{$s}{
-    -gtk-icon-source: -gtk-scaled(url("../assets/selection-mode-checkbox#{$un}.png"),url("../assets/checkbox#{$un}@2.png"));
-    -gtk-icon-shadow: none;
-  }
-  .view.content-view radio#{$s},
-  .view.content-view.radio#{$s}{
-    -gtk-icon-source: -gtk-scaled(url("../assets/selection-mode-radio#{$un}.png"),url("../assets/radio#{$un}@2.png"));
-    -gtk-icon-shadow: none;
-  }
-}
-
-checkbutton.text-button, radiobutton.text-button {
-  // this is for a nice focus on check and radios text
-  padding: 2px 0;
-  outline-offset: 0;
-
-  label:not(:only-child) {
-    &:first-child { margin-left: 4px; }
-    &:last-child { margin-right: 4px; }
-  }
-}
-
-check,
-radio {
-  margin: 0 4px;
-
-  min-height: 16px;
-  min-width: 16px;
-  border: none;
-
-  menu menuitem & {
-    margin: 0; // this is a workaround for a menu check/radio size allocation issue
-
-    &, &:hover, &:disabled { //FIXME use button reset mixin
-      min-height: 14px;
-      min-width: 14px;
-      background-image: none;
-      background-color: transparent;
-      box-shadow: none;
-      -gtk-icon-shadow: none;
-      color: inherit;
-      border-color: currentColor;
-      animation: none;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_color-chooser.scss
+++ b/gtk-4.0/widgets/_color-chooser.scss
@@ -1,139 +0,0 @@
-/*****************
- * Color Chooser *
- *****************/
-colorswatch {
-  // This widget is made of two boxes one on top of the other, the lower box is colorswatch {} the other one
-  // is colorswatch overlay {}, colorswatch has the programmatically set background, so most of the style is
-  // applied to the overlay box.
-
-  &, &:drop(active) { border-style: none; } // FIXME: implement a proper drop(active) state
-
-  $_colorswatch_radius: 5px;
-  $_colorswatch_overlay_shadow: if($variant == 'light', inset 0 2px 2px -3px transparentize(black, 0.3),
-                                                        inset 0 3px 2px -2px transparentize(black, 0.5));
-
-  // base color corners rounding
-  // to avoid the artifacts caused by rounded corner anti-aliasing the base color
-  // sports a bigger radius.
-  // nth-child is needed by the custom color strip.
-
-  &.top {
-    border-top-left-radius: $_colorswatch_radius + 0.5px;
-    border-top-right-radius: $_colorswatch_radius + 0.5px;
-
-    overlay {
-      border-top-left-radius: $_colorswatch_radius;
-      border-top-right-radius: $_colorswatch_radius;
-    }
-  }
-
-  &.bottom {
-    border-bottom-left-radius: $_colorswatch_radius + 0.5px;
-    border-bottom-right-radius: $_colorswatch_radius + 0.5px;
-
-    overlay {
-      border-bottom-left-radius: $_colorswatch_radius;
-      border-bottom-right-radius: $_colorswatch_radius;
-    }
-  }
-
-  &.left,
-  &:first-child:not(.top) {
-    border-top-left-radius: $_colorswatch_radius + 0.5px;
-    border-bottom-left-radius: $_colorswatch_radius + 0.5px;
-
-    overlay {
-      border-top-left-radius: $_colorswatch_radius;
-      border-bottom-left-radius: $_colorswatch_radius;
-    }
-  }
-
-  &.right,
-  &:last-child:not(.bottom) {
-    border-top-right-radius: $_colorswatch_radius + 0.5px;
-    border-bottom-right-radius: $_colorswatch_radius + 0.5px;
-
-    overlay {
-      border-top-right-radius: $_colorswatch_radius;
-      border-bottom-right-radius: $_colorswatch_radius;
-    }
-  }
-
-  &.dark overlay {
-    color: $selected_fg_color;
-
-    &:hover { border-color: if($variant == 'light', transparentize(black, 0.2), $borders_color); }
-
-    &:backdrop { color: $backdrop_selected_fg_color; }
-  }
-
-  &.light overlay {
-    color: $text_color;
-
-    &:hover { border-color: if($variant == 'light', transparentize(black, 0.5), $borders_color); }
-
-    &:backdrop { color: $backdrop_text_color; }
-  }
-
-  &:drop(active) {
-    box-shadow: none;
-
-    &.light overlay {
-      border-color: $drop_target_color;
-      box-shadow: inset 0 0 0 2px if($variant == 'light', darken($drop_target_color, 7%), $borders_color),
-                  inset 0 0 0 1px $drop_target_color;
-    }
-
-    &.dark overlay {
-      border-color: $drop_target_color;
-      box-shadow: inset 0 0 0 2px if($variant == 'light', transparentize(black, 0.7), $borders_color),
-                  inset 0 0 0 1px $drop_target_color;
-    }
-  }
-
-  overlay {
-    box-shadow: $_colorswatch_overlay_shadow;
-    border: 1px solid if($variant == 'light', transparentize(black, 0.7), $borders_color);
-
-    &:hover { box-shadow: inset 0 1px transparentize(white, 0.7); }
-
-    &:backdrop, &:backdrop:hover {
-      border-color: if($variant == 'light', transparentize(black, 0.7), $borders_color);
-      box-shadow: none;
-    }
-  }
-
-  &#add-color-button {
-    border-radius: $_colorswatch_radius $_colorswatch_radius 0 0;
-
-    &:only-child { border-radius: $_colorswatch_radius; }
-
-    overlay {
-      @include button(normal);
-
-      &:hover { @include button(hover); }
-
-      &:backdrop { @include button(backdrop); }
-    }
-  }
-
-  &:disabled {
-    opacity: 0.5;
-
-    overlay {
-      border-color: transparentize(black, 0.4);
-      box-shadow: none;
-    }
-  }
-
-  row:selected & { box-shadow: 0 0 0 2px $selected_fg_color; }
-
-  &#editor-color-sample {
-    border-radius: 4px;
-
-    overlay { border-radius: 4.5px; }
-  }
-}
-
-// colorscale popup
-colorchooser .popover.osd { border-radius: 5px; }
--- a/gtk-4.0/widgets/_comboboxes.scss
+++ b/gtk-4.0/widgets/_comboboxes.scss
@@ -1,41 +0,0 @@
-/**************
- * ComboBoxes *
- **************/
-combobox {
-  arrow {
-    -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
-    min-height: 16px;
-    min-width: 16px;
-  }
-
-  &.linked {
-    button:nth-child(2) {
-      &:dir(ltr) { @extend %linked:last-child; }
-      &:dir(rtl) { @extend %linked:first-child; }
-    }
-  }
-
-  &:drop(active) { // FIXME: untested
-    box-shadow: none;
-
-    button.combo { @extend %button_basic:drop(active); }
-  }
-}
-
-.linked > combobox > box > button.combo {
-  // the combo is a composite widget so the way we do button linking doesn't
-  // work, special case needed. See
-  // https://bugzilla.gnome.org/show_bug.cgi?id=733979
-
-  &:dir(ltr),
-  &:dir(rtl) { @extend %linked_middle; } // specificity bump
-}
-
-.linked:not(.vertical) > combobox:first-child > box > button.combo { @extend %linked:first-child; }
-.linked:not(.vertical) > combobox:last-child > box > button.combo { @extend %linked:last-child; }
-.linked:not(.vertical) > combobox:only-child > box > button.combo {@extend %linked:only-child; }
-
-.linked.vertical > combobox > box > button.combo { @extend %linked_vertical_middle; }
-.linked.vertical > combobox:first-child > box > button.combo { @extend %linked_vertical:first-child;}
-.linked.vertical > combobox:last-child > box > button.combo { @extend %linked_vertical:last-child; }
-.linked.vertical > combobox:only-child > box > button.combo { @extend %linked_vertical:only-child; }
--- a/gtk-4.0/widgets/_dialogs.scss
+++ b/gtk-4.0/widgets/_dialogs.scss
@@ -1,70 +0,0 @@
-/***********
- * Dialogs *
- ***********/
-messagedialog { // Message Dialog styling
-  .titlebar:not(headerbar) {
-    background-color: transparentize(if($variant=='light', $headerbar_color, $bg_color), 0.05);
-  }
-  .titlebar {
-    min-height: 20px;
-    background-image: none;
-    background-color: transparentize(if($variant=='light', $headerbar_color, $bg_color), 0.05);
-    border-style: none;
-    border-top-left-radius: 4px;
-    border-top-right-radius: 4px;
-  }
-
-  &.csd { // rounded bottom border styling for csd version
-    &.background {
-      background-color: transparentize(if($variant=='light', $headerbar_color, $bg_color), 0.05);
-      color: if($variant=='light', $headerbar_fg_color, $fg_color);
-
-      // bigger radius for better antialiasing
-      border-bottom-left-radius: 5px;
-      border-bottom-right-radius: 5px;
-    }
-
-    .dialog-action-area button {
-      padding: 10px 14px; // labels are not vertically centered on message dialog, this is a workaround
-      border-radius: 0;
-      border-left-style: solid;
-      border-right-style: none;
-      border-bottom-style: none;
-      background-color: transparent;
-      color: if($variant=='light', $headerbar_fg_color, $fg_color);
-      box-shadow: none;
-
-      &:hover {
-        background-color: transparentize($selected_bg_color, 0.1);
-        color: white;
-      }
-
-      &:first-child{
-        border-left-style: none;
-        border-bottom-left-radius: 4px;
-      }
-
-      &:last-child {
-        border-bottom-right-radius: 4px;
-      }
-      &.destructive-action, &.suggested-action{
-        color:white;
-      }
-    }
-  }
-}
-
-filechooser {
-  .dialog-action-box {
-    border-top: 1px solid $borders_color;
-
-    &:backdrop { border-top-color: $backdrop_borders_color; }
-  }
-
-  #pathbarbox { border-bottom: 1px solid $bg_color; }
-}
-
-filechooserbutton:drop(active) {
-  box-shadow: none;
-  border-color: transparent;
-}
--- a/gtk-4.0/widgets/_entries.scss
+++ b/gtk-4.0/widgets/_entries.scss
@@ -1,182 +0,0 @@
-/****************
- * Text Entries *
- ****************/
-
- %entry,
- entry {
-   %entry_basic, & {
-     min-height: 28px;
-     padding-left: 8px;
-     padding-right: 8px;
-     border: 1px solid;
-     border-radius: 3px;
-     transition: all 200ms $ease-out-quad;
- 
-     @include entry(normal);
- 
-     image { // icons inside the entry
-       &.left { padding-left: 0; padding-right: 6px; }
-       &.right { padding-left: 6px; padding-right: 0; }
-     }
- 
-     undershoot {
-       &.left { @include undershoot(left); }
-       &.right { @include undershoot(right); }
-     }
- 
-     &.flat {
-       &:focus-within, & {
-         min-height: 0;
-         padding: 2px;
-         background-image: none;
-         border-color: transparent;
-         box-shadow: none;
-         border-radius: 0;
-       }
-     }
- 
-     &:focus-within { @include entry(focus); }
- 
-     &:disabled { @include entry(insensitive); }
- 
-     &:backdrop {
-       @include entry(backdrop);
- 
-       transition: $backdrop_transition;
-     }
- 
-     &:backdrop:disabled { @include entry(backdrop-insensitive); }
- 
-     selection { &:focus, & { @extend %selected_items; }}
- 
-     // entry error and warning style
-     @each $e_type, $e_color in (error, $error_color),
-                                (warning, $warning_color) {
-       &.#{$e_type} {
-         @include entry(normal);
-         color: $e_color;
-         border-color: entry_focus_border($e_color);
- 
-         &:focus-within { @include entry(focus, $e_color); }
- 
-         &:selected { &:focus, & { background-color: $e_color; }}
-       }
-     }
- 
-     & image { // entry icons colors
-       color: mix($fg_color, $base_color, 80%);
- 
-       &:hover { color: $fg_color; }
- 
-       &:active { color: $selected_bg_color; }
- 
-       &:backdrop { color: mix($backdrop_fg_color, $backdrop_base_color, 80%); }
-     }
- 
-     &:drop(active) {
-       &:focus-within, & {
-         border-color: $drop_target_color;
-         box-shadow: inset 0 0 0 1px $drop_target_color;
-       }
-     }
- 
-     .osd & {
-       @include entry(osd);
- 
-       &:focus-within { @include entry(osd-focus); }
- 
-       &:backdrop { @include entry(osd-backdrop); }
- 
-       &:disabled { @include entry(osd-insensitive); }
-     }
-   }
- 
-   progress {
-     margin: 2px -6px;
-     background-color: transparent;
-     background-image: none;
-     border-radius: 0;
-     border-width: 0 0 2px;
-     border-color: $selected_bg_color;
-     border-style: solid;
-     box-shadow: none;
- 
-     &:backdrop { background-color: transparent; }
-   }
- 
-    // linked entries
-   .linked:not(.vertical) > & { @extend %linked; }
-   .linked:not(.vertical) > &:focus-within + &,
-   .linked:not(.vertical) > &:focus-within + button,
-   .linked:not(.vertical) > &:focus-within + combobox > box > button.combo { border-left-color: entry_focus_border(); }
- 
-   .linked:not(.vertical) > &:focus-within { border-color: entry_focus_border(); }
- 
-   .linked:not(.vertical) > &:drop(active) + &,
-   .linked:not(.vertical) > &:drop(active) + button,
-   .linked:not(.vertical) > &:drop(active) + combobox > box > button.combo { border-left-color: $drop_target_color; }
- 
-   // Vertically linked entries
-   // FIXME: take care of "colored" entries
-   .linked.vertical > & {
-     @extend %linked_vertical;
- 
-     // brighter border between linked entries
-     &:not(:disabled) + entry:not(:disabled),
-     &:not(:disabled) + %entry:not(:disabled) {
-       border-top-color: mix($borders_color, $base_color, 30%);
-       background-image: linear-gradient(to bottom, $base_color, $base_color);
- 
-       &:backdrop {
-         border-top-color: mix($backdrop_borders_color, $backdrop_base_color, 30%);
-         background-image: linear-gradient(to bottom, $backdrop_base_color, $backdrop_base_color);
-       }
-     }
- 
-     // brighter border between linked insensitive entries
-     &:disabled + %entry:disabled,
-     &:disabled + entry:disabled { border-top-color: mix($borders_color, $base_color, 30%); }
- 
-     // color back the top border of a linked focused entry following another entry and add back the focus shadow.
-     // :not(:only-child) is a specificity bump hack.
-     + %entry:focus:not(:only-child),
-     + entry:focus:not(:only-child) { border-top-color: entry_focus_border(); }
- 
-     + %entry:drop(active):not(:only-child),
-     + entry:drop(active):not(:only-child) { border-top-color: $drop_target_color; }
- 
-     // this takes care of coloring the top border of the focused entry subsequent widget.
-     // :not(:only-child) is a specificity bump hack.
-     &:focus:not(:only-child) {
-       + %entry,
-       + entry,
-       + button,
-       + combobox > box > button.combo { border-top-color: entry_focus_border(); }
-     }
- 
-     &:drop(active):not(:only-child) {
-       + %entry,
-       + entry,
-       + button,
-       + combobox > box > button.combo { border-top-color: $drop_target_color; }
-     }
-   }
- }
- 
- treeview entry {
-   &:focus-within {
-     &:dir(rtl), &:dir(ltr) { // specificity bump hack
-       background-color: $base_color;
-       transition-property: color, background;
-     }
-   }
- 
-   &.flat, & {
-     border-radius: 0;
-     background-image: none;
-     background-color: $base_color;
- 
-     &:focus-within { border-color: $selected_bg_color; }
-   }
- }
- 
--- a/gtk-4.0/widgets/_expanders.scss
+++ b/gtk-4.0/widgets/_expanders.scss
@@ -1,16 +0,0 @@
-/*************
- * Expanders *
- *************/
-expander {
-  arrow {
-    min-width: 16px;
-    min-height: 16px;
-    -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-
-    &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
-
-    &:hover { color: lighten($fg_color,30%); } //only lightens the arrow
-
-    &:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
-  }
-}
--- a/gtk-4.0/widgets/_file-chooser.scss
+++ b/gtk-4.0/widgets/_file-chooser.scss
@@ -1,102 +0,0 @@
-/****************
- * File chooser *
- ****************/
-$_placesidebar_icons_opacity: 0.7;
-
-placessidebar {
-  > viewport.frame { border-style: none; }
-
-  row {
-    // Needs overriding of the GtkListBoxRow padding
-    min-height: 36px;
-    padding: 0px;
-
-    // Using margins/padding directly in the SidebarRow
-    // will make the animation of the new bookmark row jump
-    > revealer { padding: 0 14px; }
-
-    &:selected { color: $selected_fg_color; }
-
-    &:disabled { color: $insensitive_fg_color; }
-
-    &:backdrop {
-      color: $backdrop_fg_color;
-
-      &:selected { color: $backdrop_selected_fg_color; }
-
-      &:disabled { color: $backdrop_insensitive_color; }
-    }
-
-    image.sidebar-icon {
-      opacity: $_placesidebar_icons_opacity; // dim the device icons
-
-      &:dir(ltr) { padding-right: 8px; }
-      &:dir(rtl) { padding-left: 8px; }
-    }
-
-    label.sidebar-label {
-      &:dir(ltr) { padding-right: 2px; }
-      &:dir(rtl) { padding-left: 2px; }
-    }
-
-    @at-root button.sidebar-button {
-      @extend %button_basic.flat;
-
-      @extend %button_selected.flat;
-
-      min-height: 26px;
-      min-width: 26px;
-      margin-top: 3px;
-      margin-bottom: 3px;
-      padding: 0;
-      border-radius: 100%;
-      -gtk-outline-radius: 100%;
-
-      &:not(:hover):not(:active),
-      &:backdrop { > image { opacity: $_placesidebar_icons_opacity; }}
-    }
-
-    // in the sidebar case it makes no sense to click the selected row
-    &:selected:active { box-shadow: none; }
-
-    &.sidebar-placeholder-row {
-      padding: 0 8px;
-      min-height: 2px;
-      background-image: image($drop_target_color);
-      background-clip: content-box;
-    }
-
-    &.sidebar-new-bookmark-row { color: $selected_bg_color; }
-
-    &:drop(active):not(:disabled) {
-      color: $drop_target_color;
-      box-shadow: inset 0 1px $drop_target_color,
-                  inset 0 -1px $drop_target_color;
-
-      &:selected {
-        color: $selected_fg_color;
-        background-color: $drop_target_color;
-      }
-    }
-  }
-}
-
-placesview {
-  .server-list-button > image {
-    transition: 200ms $ease-out-quad;
-    -gtk-icon-transform: rotate(0turn);
-  }
-
-  .server-list-button:checked > image {
-    transition: 200ms $ease-out-quad;
-    -gtk-icon-transform: rotate(-0.5turn);
-  }
-
-  row.activatable:hover { background-color: transparent; }
-
-  // this selects the "connect to server" label
-  > actionbar > revealer > box > label {
-    padding-left: 8px;
-    padding-right: 8px;
-  }
-}
--- a/gtk-4.0/widgets/_floating-bar.scss
+++ b/gtk-4.0/widgets/_floating-bar.scss
@@ -1,33 +0,0 @@
-/****************
- * Floating Bar *
- ****************/
-.floating-bar {
-  background-color: $bg_color;
-  border-width: 1px;
-  border-style: solid solid none;
-  border-color: $borders_color;
-  border-radius: 3px 3px 0 0;
-  box-shadow: inset 0 1px $top_highlight;
-
-  &.bottom {
-
-    &.left {
-      border-left-style: none;
-      border-top-left-radius: 0;
-    }
-
-    &.right {
-      border-right-style: none;
-      border-top-right-radius: 0;
-    }
-  }
-
-  > button {
-    padding:4px;
-  }
-
-  &:backdrop {
-    background-color: $backdrop_bg_color;
-    border-color: $backdrop_borders_color;
-  }
-}
--- a/gtk-4.0/widgets/_frames.scss
+++ b/gtk-4.0/widgets/_frames.scss
@@ -1,87 +0,0 @@
-/**********
- * Frames *
- **********/
-frame > border,
-.frame {
-  box-shadow: none;
-  margin: 0;
-  padding: 0;
-  border-radius: 0;
-  border: 1px solid $borders_color;
-
-  &.flat { border-style: none; }
-
-  &:backdrop { border-color: $backdrop_borders_color; }
-}
-
-actionbar > revealer >  box {
-  padding: 6px;
-  border-top: 1px solid $borders_color;
-
-  &:backdrop { border-color: $backdrop_borders_color; }
-}
-
-scrolledwindow {
-  viewport.frame { // avoid double borders when viewport inside scrolled window
-    border-style: none;
-  }
-
-  // This is used when content is touch-dragged past boundaries.
-  // draws a box on top of the content, the size changes programmatically.
-  overshoot {
-    &.top {
-      @include overshoot(top);
-
-      &:backdrop { @include overshoot(top, backdrop); }
-    }
-
-    &.bottom {
-      @include overshoot(bottom);
-
-      &:backdrop { @include overshoot(bottom, backdrop); }
-    }
-
-    &.left {
-      @include overshoot(left);
-
-      &:backdrop { @include overshoot(left, backdrop); }
-    }
-
-    &.right {
-      @include overshoot(right);
-
-      &:backdrop { @include overshoot(right, backdrop); }
-    }
-  }
-
-  // Overflow indication, works similarly to the overshoot, the size if fixed tho.
-  undershoot {
-    &.top { @include undershoot(top); }
-
-    &.bottom { @include undershoot(bottom); }
-
-    &.left { @include undershoot(left); }
-
-    &.right { @include undershoot(right); }
-  }
-
-  junction { // the small square between two scrollbars
-    border-color: transparent;
-    // the border image is used to add the missing dot between the borders, details, details, details...
-    border-image: linear-gradient(to bottom, $borders_color 1px, transparent 1px) 0 0 0 1 / 0 1px stretch;
-    background-color: $scrollbar_bg_color;
-
-    &:dir(rtl) { border-image-slice: 0 1 0 0; }
-
-    &:backdrop {
-      border-image-source: linear-gradient(to bottom, $backdrop_borders_color 1px, transparent 1px);
-      background-color: $backdrop_scrollbar_bg_color;
-      transition: $backdrop_transition;
-    }
-  }
-}
-
-//vbox and hbox separators
-separator {
-  background: transparentize(black, 0.9);
-}
--- a/gtk-4.0/widgets/_granite.scss
+++ b/gtk-4.0/widgets/_granite.scss
@@ -1,198 +0,0 @@
-/************
- * Popovers *
- ************/
-
-GraniteWidgetsPopOver {
-  
-  border: 1px solid $base_color;
-  background: $base_color;
-  color: $fg_color;
-
-  .button {
-    background-image: none;
-    background: none;
-    border: none;
-
-    &:active,
-    &:active:hover, {
-      color: $selected_bg_color;
-    }
-  }
-
-  > .frame {
-    border:none;
-  }
-
-  .sidebar.view {
-    border: none;
-    background: none;
-  }
-}
-
-GraniteWidgetsStaticNotebook .frame {
-  border: none;
-}
-
-.popover_bg {
-  background-color: $base_color;
-  background-image: none;
-  border: 1px solid $base_color;
-  color: $fg_color;
-}
-
-
-/***********
- * Welcome *
- **********/
-
-GraniteWidgetsWelcome {
-  background-color: $base_color;
-
-  GtkLabel {
-    color: $fg_color;
-  }
-
-  .h1,.h3 {
-    color: transparentize($fg_color, 0.2);
-  }
-}
-
-/**************
-* Source List *
-***************/
-
-.source-list {
-
-  background-color: $bg_color;
-  border: solid $borders_color;
-  color: $fg_color;
-  border-right-width: 1px;
-
-  &:backdrop {}
-
-  .category-expander {
-    color: transparent;
-  }
-
-  .badge {
-    background-image: none;
-    background-color: transparentize(black, 0.6);
-    color: $bg_color;
-    border-radius: 10px;
-    padding: 0 6px;
-    margin: 0 3px;
-    border-width: 0;
-
-    &:selected:backdrop,
-    &:selected:hover:backdrop {
-      background-color: transparentize(black, 0.8);
-      color: darken($bg_color, 5%);
-    }
-  }
-
-  row,
-  .list-row {
-    border:none;
-    padding: 0;
-
-    > GtkLabel,
-    > label {
-      padding-left: 6px;
-      padding-right: 6px;
-    }
-  }
-}
-
-
-/**************
-* Text Styles *
-**************/
-
-.h1 {
-  font-size: 24px;
-}
-
-.h2 {
-  font-weight: 300;
-  font-size: 18px;
-}
-
-.h3 {
-  font-size: 11px;
-}
-
-.h4,
-.category-label {
-  font-size: 12px;
-  padding: 6px;
-  color: transparentize($fg_color, 0.7);
-  font-weight: bold;
-  text-shadow: 0 1px transparentize(white,0.8);
-}
-
-
-/**************
-* Storage Bar *
-**************/
-.storage-bar {
-
-  .trough {
-    border: none;
-    box-shadow:0 1px 0 0 $bottom_highlight;
-    background-image: none;
-    background-color: transparent;
-    padding: 8px 6px;
-  }
-
-  .fill-block {
-    background-color: $yellow;
-    border:none;
-    box-shadow: inset 0 1px 0 0 transparentize(black, 0.9), inset 0 -1px 0 0 transparentize(black, 0.9);
-
-    transition: all 200ms ease-in-out;
-
-    padding: 8px 6px;
-  
-    &:first-child {
-      border-top-left-radius: 4px;
-      border-bottom-left-radius: 4px;
-      border-left-width: 1px;
-      box-shadow: inset 0 1px 0 0 transparentize(black, 0.9),
-                  inset 1px 0 0 transparentize(black, 0.9),
-                  inset 0 -1px 0 0 transparentize(black, 0.9);
-    }
-    
-    &:last-child {
-      border-top-right-radius: 4px;
-      border-bottom-right-radius: 4px;
-      box-shadow: inset 0 1px 0 0 transparentize(black, 0.9),
-                  inset -1px 0 0 transparentize(black, 0.9),
-                  inset 0 -1px 0 0 transparentize(black, 0.9);
-    }
-
-    &.empty-block {
-      background-color: $base_color;
-    }
-    
-    &.app {
-      background-color: $blue;
-    }
-
-    &.audio {
-      background-color: $orange;
-    }
-
-    &.photo {
-      background-color: $red;
-    }
-
-    &.video {
-      background-color: $purple;
-    }
-
-    .legend {
-      padding: 12px;
-      border-radius: 4px;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_header-bars.scss
+++ b/gtk-4.0/widgets/_header-bars.scss
@@ -1,283 +0,0 @@
-/***************
- * Header bars *
- ***************/
-%titlebar,
-headerbar {
-  padding: 0px 13px;
-  min-height: 34px;
-  background: $headerbar_color;
-  color: $headerbar_fg_color;
-  border-radius: 0;
-  &:backdrop {
-    border-color: $backdrop_borders_color;
-   // background-image: none;
-
-    transition: $backdrop_transition;
-  }
-
-  .title {
-    font-weight: bold;
-    padding-left: 12px;
-    padding-right: 12px;
-  }
-
-  .subtitle {
-    font-size: smaller;
-    padding-left: 12px;
-    padding-right: 12px;
-
-    @extend .dim-label;
-  }
- 
-  entry { min-height: 24px;}  
-  
-  button {
-    @include button(normal-header);
-    min-height: 14px;
-    margin-top: 5px;
-    margin-bottom: 5px;
-    box-shadow: none;
-    &.image-button{
-       padding: 3px 4px;
-    }
-    &.suggested-action{
-      box-shadow: none;
-      border: none;
-      background-image: $suggested_bg_color;
-        &:disabled, &:disabled:backdrop, &:backdrop {
-          border: none;
-          background-image: $suggested_bg_color;
-          &:hover,
-          &:active,
-          &:checked {
-            border: none;
-            background-image: $suggested_bg_color;
-          }
-        }
-        
-      }
-      
-      &.appmenu{
-      background: transparent;
-      &:backdrop{background: transparent;}
-    }
-    &:hover,
-    &:active,
-    &:checked {
-      background-color: transparent;
-      color: $selected_bg_color;
-      box-shadow: none;
-      border: none;
-      //@include button(hover-header);
-    }
-
-    &:backdrop,
-    &:disabled,
-    &:backdrop:disabled {
-      @include button(backdrop-header,red,transparentize($fg_color,0.8));
-      border: none;
-    }
-
-    &:backdrop {
-      &:hover,
-      &:active,
-      &:checked {
-      background-color: transparent;
-      color: $selected_bg_color; 
-      label {color: $selected_bg_color;}
-      box-shadow: none;
-      }
-    }
-
-    @each $b_type, $b_color in (suggested-action, $cyan),
-                               (destructive-action, $destructive_color) {
-      &.#{$b_type} {
-        font-weight: bold;
-        min-height: 24px;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        border-radius: 4px;
-        @include button(normal, $b_color, white);
-        box-shadow: none;
-
-        &:hover { @include button(hover, $b_color, white); }
-
-        &:active { @include button(active, $b_color, white); }
-
-        &:disabled {
-          @include button(insensitive, $b_color, white);
-          label {color: transparentize(white,0.5);}
-        }
-
-        &:backdrop {
-          @include button(backdrop, $b_color, white);
-          border-radius: 3px;
-        }
-
-        &:backdrop:disabled { @include button(backdrop-insensitive, $b_color, white); }
-
-      }
-    }
-
-    //Reset style
-    &.titlebutton {
-      color: transparent;
-      box-shadow: none;
-      border: none;
-      background-color: transparent;
-      background-image: none;
-      background-repeat: no-repeat;
-      &:hover,
-      &:active,
-      &:checked,
-      &:backdrop,
-      &:backdrop:hover,* {
-        color: transparent;
-        box-shadow: none;
-        background-color: transparent;
-      }
-    }
-  }
-  %linked-header {
-    border-radius: 23px;
-    border-right-style: none;
-    border: none;
-    box-shadow: none;
-    margin: 10px 0px;
-    min-height: 20px;
-    &:first-child {
-    }
-
-    &:last-child {
-    }
-
-    &:only-child {
-      border-radius: 13px;
-      border-style: none;
-    }
-    transition: all .1s ease-in;
-  }
-  .linked > button {
-    @extend %linked-header;
-  }
-  .linked > button:active{
-    @extend %linked-header;
-    background: linear-gradient(to right, #c50ed2, #8500f7) ;
-    color: rgb(255, 250, 250);
-  }
-  .linked > button:checked{
-    @extend %linked-header;
-    border-radius: 23px;
-    background: linear-gradient(to right, #c50ed2, #8500f7);
-    box-shadow: 0px 0px 5px transparentize(#c50ed2, 0.02);
-    color: rgb(255, 250, 250);
-    &:backdrop{
-      color: darken(rgb(255, 250, 250), 4%);
-      label{
-        color: darken(rgb(255, 250, 250), 4%);;
-      }
-    }
-  }
-  .linked > button:hover,
-  .linked > button:backdrop { 
-    @extend %linked-header; 
-  }
-  // End reset style
-
-  &.selection-mode {
-    button {
-
-      &:backdrop {
-        &.flat, & {
-          &:active,
-          &:checked {
-            //@include button(backdrop-active, $selected_bg_color, $selected_fg_color);
-            label{
-              color:$backdrop_selected_bg_color;
-            }
-            border-color: $selected_borders_color;
-          }
-        }
-      }
-    }
-
-  }
-
-  .tiled &,
-  .maximized & {
-    &.titlebar {
-      @if $variant == 'light' { box-shadow: none; }
-      @else { box-shadow: inset 0 -1px $bottom_highlight; }
-    }
-    &:backdrop, & { border-radius: 0; }
-  } // squared corners when the window is maximized or tiled
-
-  &.default-decoration {
-    padding: 5px 4px; 
-    min-height: 20px;
-
-    button.titlebutton {
-      min-height: 20px;
-      min-width: 20px;
-      margin: 0;
-      padding: 0;
-    }
-  }
-}
-
-headerbar {
-  // add vertical margins to common widget on the headerbar to avoid them spanning the whole height
-  entry,
-  spinbutton,
-  separator {
-    margin-top: 5px;
-    margin-bottom: 5px;
-  }
-  switch {
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-  separator { background: transparent; }
-}
-
-.background:not(.tiled):not(.maximized) .titlebar {
-  @if $variant == 'light' { box-shadow: inset 0 1px $top_highlight; }
-  @else { box-shadow: inset 0 1px $top_highlight,inset 0 -1px $bottom_highlight; }
-
-
-  &:backdrop, & {
-    border-top-left-radius: 4px;
-    border-top-right-radius: 4px;
-  }
-}
-
-headerbar {
-  window:not(.tiled):not(.maximized) separator:first-child + &, // tackles the paned container case
-  window:not(.tiled):not(.maximized) &:first-child { &:backdrop, & { border-top-left-radius: 4px; }}
-
-  window:not(.tiled):not(.maximized) &:last-child { &:backdrop, & { border-top-right-radius: 4px; }}
-}
-
-.titlebar:not(headerbar) {
-  window.csd > & {
-    // in csd we assume every titlebar is a headerbar so reset anything, this is needed for split toolbars cases
-    padding: 0;
-    background-color: transparent;
-    background-image: none;
-    border-style: none;
-    border-color: transparent;
-    box-shadow: none;
-  }
-
-  > separator {
-    &, &:backdrop {
-      background: $headerbar_color;
-    }
-  }
-
-  @extend %titlebar;
-}
-
-.titlebar{
-  @extend %titlebar;
-}
--- a/gtk-4.0/widgets/_infobars.scss
+++ b/gtk-4.0/widgets/_infobars.scss
@@ -1,115 +0,0 @@
-/**************
- * GtkInfoBar *
- **************/
- %infobar,
- infobar {
-   text-shadow: none;
-   color: $fg_color;
-   background-color: $bg_color;
-   border-bottom:1px solid darken($bg_color,10%);
-   box-shadow: none;
- 
- }
- 
- %color_infobar {
- 
-   @extend %infobar;
- 
-   text-shadow: none;
-   color: $selected_fg_color;
-   border:none;
- 
-   .label {
-     color: $selected_fg_color;
- 
-     &:backdrop {
-       color: $backdrop_selected_fg_color;
-     }
-   }
- 
-   button {
-     border-radius: 2px;
-     border: none;
-     background: transparentize($base_color, 0.02);
-     color: $fg_color;
-     box-shadow: 0 1px 0 0 transparentize(black, 0.8);
- 
-     .label {
-       color: $fg_color;
-     }
- 
-     &:active {
-       background: $base_color;
-       color: $fg_color;
- 
-       box-shadow: 0 1px 2px 0 transparentize(black, 0.6);
- 
-       &:backdrop {
-         background: transparentize($base_color, 0.2);
-         color: transparentize($fg_color, 0.5);
-         box-shadow: none;
-       }
-     }
- 
-     &:hover,
-     &:focus {
-       box-shadow: 0 1px 2px 0 transparentize(black, 0.6);
-     }
- 
-     &:disabled {
-       background: transparentize($base_color, 0.4);
-       color: transparentize($fg_color, 0.5);
-       box-shadow: none;
- 
-         &:backdrop {
-           background: transparentize($base_color, 0.5);
-           color: transparentize($fg_color, 0.5);
-           box-shadow: none;
-         }
-     }
- 
-     &:backdrop {
-       background: transparentize($base_color, 0.2);
-       color: transparentize($fg_color, 0.5);
-       box-shadow: none;
-     }
-   }
- }
- 
- .info {
-   @extend %color_infobar;
-   
-   &, &:backdrop {
-     color: $info_color;
-     background-color: transparent;
-   }
- }
- 
- .warning {
-   @extend %color_infobar;
- 
-   &, &:backdrop {
-     color: $warning_color;
-     background-color: transparent;
-   }
- }
- 
- .question {
-   @extend %color_infobar;
- 
-   &, &:backdrop {
-     color: $question_color;
-     background-color: transparent;
-   }
- 
- }
- 
- .error {
-   @extend %color_infobar;
- 
-   &, &:backdrop {
-     color: $error_color;
-     background-color: transparent;
-   }
- }
- 
--- a/gtk-4.0/widgets/_level-bars.scss
+++ b/gtk-4.0/widgets/_level-bars.scss
@@ -1,62 +0,0 @@
-/*************
- * Level Bar *
- *************/
-levelbar {
-  block {
-    min-width: 32px;
-    min-height: 6px;
-  }
-
-  &.vertical block {
-    min-width: 6px;
-    min-height: 32px;
-  }
-
-  &:backdrop { transition: $backdrop_transition; }
-
-  trough {
-    padding: 3px;
-    border-radius: 3px;
-    background-color: if($variant == 'light' ,transparentize(white,0.2),transparentize(white,0.8));
-    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
-
-    &:backdrop {
-      background-color: if($variant == 'light' ,transparentize(white,0.4),transparentize(white,0.94));
-      box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
-    }
-  }
-
-  &.horizontal.discrete block { margin: 0 1px; }
-
-  &.vertical.discrete block { margin: 1px 0; }
-
-  block {
-    border-radius: 2px;
-
-    &:backdrop { box-shadow: none; }
-
-    &.low {
-      background-color: $warning_color;
-
-      &:backdrop { border-color: $warning_color; };
-    }
-
-    &.high,
-    &:not(.empty) {
-      background-color: $cyan;
-
-      &:backdrop { border-color: $cyan; }
-    }
-
-    &.full {
-      background-color: $success_color;
-
-      &:backdrop { border-color: $success_color; };
-    }
-
-    &.empty {
-      background-color:  if($variant == 'light' ,transparentize(black, 0.86),transparentize(black,0.65));
-      box-shadow: none;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_links.scss
+++ b/gtk-4.0/widgets/_links.scss
@@ -1,49 +0,0 @@
-/*********
- * Links *
- *********/
-*:link {
-  color: $link_color;
-
-  &:visited {
-    color: $link_visited_color;
-
-    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 60%); }
-  }
-
-  &:hover {
-    color: lighten($link_color,10%);
-
-    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 90%); }
-  }
-
-  &:active {
-    color: $link_color;
-
-    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
-  }
-
-  &:backdrop { &:backdrop:hover, &:backdrop:hover:selected, & { color: $selected_bg_color; }}
-
-  @at-root %link_selected,
-  &:selected,
-  *:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
-}
-
-button:link,
-button:visited {
-  @extend %undecorated_button;
-
-  @extend *:link;
-
-  text-shadow: none;
-
-  &:hover,
-  &:active,
-  &:checked {
-    @extend %undecorated_button;
-
-    text-shadow: none;
-  }
-
-  > label { text-decoration-line: underline; }
-}
--- a/gtk-4.0/widgets/_lists.scss
+++ b/gtk-4.0/widgets/_lists.scss
@@ -1,60 +0,0 @@
-/*********
- * Lists *
- *********/
-list, listview {
-  color: $text_color;
-  background-color: $base_color;
-  border-color: $borders_color;
-
-  &:backdrop {
-    background-color: $backdrop_base_color;
-    border-color: $backdrop_borders_color;
-  }
-
-  &.horizontal row.separator,
-  &.separators.horizontal > row:not(.separator) {
-    border-left: 1px solid $borders_color;
-  }
-  &:not(.horizontal) row.separator,
-  &.separators:not(.horizontal) > row:not(.separator) {
-    border-bottom: 1px solid $borders_color;
-  }
-}
-
-row {
-  padding: 5px 11px;
-  transition: all 150ms $ease-out-quad;
-
-  label {
-    padding-left: 8px;
-  }
-
-  &:hover { transition: none; }
-
-  &:backdrop { transition: $backdrop_transition; }
-
-  &.activatable {
-    &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
-
-    &:hover { background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); }
-
-    &:active { box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8); }
-
-    &:backdrop:hover { background-color: transparent; }
-
-    &:selected {
-      &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
-
-      &.has-open-popup,
-      &:hover { background-color: transparentize($selected_bg_color, 0.5); }
-
-      &:backdrop { background-color: $backdrop_selected_bg_color; }
-    }
-    
-    button.flat{
-      background-color: transparent;
-    }
-  }
-
-  &:selected { @extend %selected_items; }
-}
--- a/gtk-4.0/widgets/_menus.scss
+++ b/gtk-4.0/widgets/_menus.scss
@@ -1,132 +0,0 @@
-/*********
- * Menus *
- *********/
-menubar,
-.menubar {
-  background-color: $headerbar_color;
-  color: $headerbar_fg_color;
-  padding: 0px;
-  box-shadow: inset 0 -1px transparentize(black, 0.9);
-
-  > item {
-    min-height: 16px;
-    padding: 4px 8px;
-
-    &:hover { //Seems like it :hover even with keyboard focus
-      box-shadow: inset 0 -3px $selected_bg_color;
-    }
-
-    &:disabled {
-      color: $insensitive_fg_color;
-      box-shadow: none;
-    }
-  }
-}
-
-menu,
-.menu,
-.context-menu {
-  font: initial;
-  margin: 4px;
-  padding: 2px 0px;
-  background: if( $variant == 'light',  linear-gradient(to bottom, #fff 20%, #fff), linear-gradient(to bottom, lighten($bg_color, 2%), darken($bg_color, 2%)));
-  border: 1px solid $borders_color; // adds borders in a non composited env
-  border-radius: 5px;
-
-  .csd & { border: none; }  // axes borders in a composited env
-
-  &:backdrop { background-color: $backdrop_menu_color; }
-
-  menuitem {
-    min-height: 17px;
-    min-width: 40px;
-    padding: 4px 6px;
-    text-shadow: none;
-
-    &:hover {
-      color: $selected_fg_color;
-      background-color: $selected_bg_color;
-    }
-
-    &:disabled {
-      color: $insensitive_fg_color;
-      &:backdrop { color: $backdrop_insensitive_color; }
-    }
-
-    &:backdrop,
-    &:backdrop:hover {
-      color: $backdrop_fg_color;
-      background-color: transparent;
-    }
-
-    // submenu indicators
-    arrow {
-      min-height: 16px;
-      min-width: 16px;
-
-      &:dir(ltr) {
-        -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-        margin-left: 10px;
-      }
-
-      &:dir(rtl) {
-        -gtk-icon-source:-gtk-icontheme('pan-end-symbolic-rtl');
-        margin-right: 10px;
-      }
-    }
-
-    // avoids labels color being overridden, see
-    // https://bugzilla.gnome.org/show_bug.cgi?id=767058
-    label { &:dir(rtl), &:dir(ltr) { color: inherit; }}
-  }
-
-  // overflow arrows
-  > arrow {
-    @include button(undecorated);
-
-    min-height: 16px;
-    min-width: 16px;
-    padding: 4px;
-    background-color: $menu_color;
-    border-radius: 0;
-
-    &.top {
-      margin-top: -6px;
-      border-bottom: 1px solid mix($fg_color, $base_color, 10%);
-      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
-    }
-
-    &.bottom {
-      margin-bottom: -6px;
-      border-top: 1px solid mix($fg_color, $base_color, 10%);
-      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
-    }
-
-    &:hover { background-color: mix($fg_color, $base_color, 10%); }
-
-    &:backdrop { background-color: $backdrop_menu_color; }
-
-    &:disabled {
-      color: transparent;
-      background-color: transparent;
-      border-color: transparent ;
-    }
-  }
-}
-
-menuitem {
-  accelerator { color: gtkalpha(currentColor,0.55); }
-
-  check,
-  radio {
-    min-height: 16px;
-    min-width: 16px;
-
-    &:dir(ltr) { margin-right: 7px; }
-    &:dir(rtl) { margin-left: 7px; }
-  }
-}
-
-.csd.popup {
-  background: transparent;
-}
--- a/gtk-4.0/widgets/_misc.scss
+++ b/gtk-4.0/widgets/_misc.scss
@@ -1,62 +0,0 @@
-/********
- * Misc *
- ********/
-//content view (grid/list)
-.content-view {
-  background-color: darken($bg_color,7%);
-
-  &:hover { -gtk-icon-filter: brightness(1.2); }
-
-  &:backdrop { background-color: darken($bg_color,7%); }
-
-  rubberband { @extend rubberband; }
-}
-
-.scale-popup {
-  .osd & { @extend %osd; }
-
-  .osd & button.flat {  //FIXME: quick hack, redo properly
-    border-style: none;
-    border-radius: 5px;
-  }
-
-  button { // +/- buttons on GtkVolumeButton popup
-    &:hover {
-      @extend %undecorated_button;
-      background-color: transparentize($fg_color,0.9);
-      border-radius: 5px;
-    }
-
-    &:backdrop { &:hover, &:disabled, & { @extend %undecorated_button; }}
-  }
-}
-
-/************
-* Assistant *
-*************/
-
-assistant {
-
-  border-bottom-left-radius:4px;
-  border-bottom-right-radius:4px;
-
-  .sidebar {
-    background-color: $base_color;
-    border-top: 1px solid $borders_color;
-
-    border-bottom-left-radius:4px;
-
-    &:backdrop {
-      background-color: $backdrop_base_color;
-      border-color: $backdrop_borders_color;
-    }
-  }
-
-  &.csd .sidebar { border-top-style: none; }
-
-  .sidebar GtkLabel,
-  .sidebar label { padding: 6px 12px; }
-
-  .sidebar GtkLabel.highlight,
-  .sidebar label.highlight { background-color: mix($bg_color, $fg_color, 80%); }
-}
--- a/gtk-4.0/widgets/_notebooks.scss
+++ b/gtk-4.0/widgets/_notebooks.scss
@@ -1,276 +0,0 @@
-/*************
- * Notebooks *
- *************/
-notebook {
-  > header {
-    padding: 1px;
-    border-color: transparent;
-    border-width: 1px;
-    background-color: mix($base_color, $headerbar_color, 30%);
-
-    &:backdrop {
-      border-color: $backdrop_borders_color;
-      background-color: $backdrop_bg_color;
-    }
-
-    tabs { margin: 0px; }
-
-    &.top {
-      border-bottom-style: solid;
-      > tabs {
-        margin-bottom: -2px;
-        > tab {
-
-
-          &:backdrop { box-shadow: none; }
-
-          &:checked {
-            @include selected-tab(right);
-          }
-        }
-      }
-    }
-
-    &.bottom {
-      border-top-style: solid;
-      > tabs {
-        margin-top: -2px;
-        > tab {
-
-
-          &:backdrop { box-shadow: none; }
-
-          &:checked { 
-            @include selected-tab(right);
-          }
-        }
-      }
-    }
-
-    &.left {
-      border-right-style: solid;
-      > tabs {
-        margin-right: -2px;
-        > tab {
-
-
-          &:backdrop { box-shadow: none; }
-
-          &:checked { 
-            @include selected-tab(bottom);
-          }
-        }
-      }
-    }
-
-    &.right {
-      border-left-style: solid;
-      > tabs {
-        margin-left: -2px;
-        > tab {
-
-
-          &:backdrop { box-shadow: none; }
-
-          &:checked { 
-            @include selected-tab(bottom);
-          }
-        }
-      }
-    }
-
-    &.top > tabs > arrow {
-      @extend %notebook_vert_arrows;
-
-      border-top-style: none;
-    }
-
-    &.bottom > tabs > arrow {
-      @extend %notebook_vert_arrows;
-
-      border-bottom-style: none;
-    }
-
-    @at-root %notebook_vert_arrows {
-      margin-left: -5px;
-      margin-right: -5px;
-      padding-left: 4px;
-      padding-right: 4px;
-
-      &.down { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); }
-
-      &.up { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic'); }
-    }
-
-    &.left > tabs > arrow {
-      @extend %notebook_horz_arrows;
-
-      border-left-style: none;
-    }
-
-    &.right > tabs > arrow {
-      @extend %notebook_horz_arrows;
-
-      border-right-style: none;
-    }
-
-    @at-root %notebook_horz_arrows {
-      margin-top: -5px;
-      margin-bottom: -5px;
-      padding-top: 4px;
-      padding-bottom: 4px;
-
-      &.down { -gtk-icon-source: -gtk-icontheme('pan-up-symbolic'); }
-
-      &.up { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
-    }
-
-    > tabs > arrow {
-      @extend %button_basic;
-
-      @extend %button_basic.flat;
-
-      min-height: 14px;
-      min-width: 14px;
-      border-radius: 0;
-
-      &:hover:not(:active):not(:backdrop) {
-        background-clip: padding-box;
-        background-image: none;
-        background-color: transparentize(white, 0.7);
-        border-color: transparent;
-        box-shadow: none;
-      }
-
-      &:disabled { @include button(undecorated); }
-    }
-
-    tab {
-      min-height: 24px;
-      min-width: 24px;
-      padding: 1px 12px;
-
-      outline-offset: -5px;
-
-      color: $insensitive_fg_color;
-      font-weight: normal;
-
-      border-width: 1px;         // for reorderable tabs
-      border-color: transparent; //
-
-      &:hover {
-        color: mix($insensitive_fg_color, $fg_color, 50%);
-
-        &.reorderable-page {
-          border-color: transparentize($borders_color, 0.7);
-          background-color: transparentize($bg_color, 0.8);
-        }
-      }
-
-      &:backdrop {
-        color: mix($backdrop_fg_color, $backdrop_bg_color, 60%);
-
-        &.reorderable-page {
-          border-color: transparent;
-          background-color: transparent;
-        }
-      }
-
-      &:checked {
-        color: $fg_color;
-        &.reorderable-page {
-          border-color: transparentize($borders_color, 0.5);
-          background-color: transparentize($bg_color, 0.5);
-
-          &:hover { background-color: transparentize($bg_color, 0.3); }
-        }
-      }
-
-      &:backdrop:checked {
-        color: $backdrop_fg_color;
-        &.reorderable-page {
-          border-color: $backdrop_borders_color;
-          background-color: $backdrop_base_color;
-        }
-      }
-
-      // colors the button like the label, overridden otherwise
-      button.flat {
-        &:hover {  
-          background: transparent;
-          box-shadow: none;
-          color: $red; 
-        }
-
-        &, &:backdrop { color: gtkalpha(currentColor, 0.3); }
-
-        padding: 0;
-        margin-top: 4px;
-        margin-bottom: 4px;
-        // FIXME: generalize .small-button?
-        min-width: 20px;
-        min-height: 20px;
-      }
-    }
-
-    &.top,
-    &.bottom {
-      tabs {
-        padding-left: 0px;
-        padding-right: 0px;
-
-        &:not(:only-child) {
-          margin-left: 0.5px;
-          margin-right: 0.5px;
-
-          &:first-child { margin-left: -1px; }
-          &:last-child { margin-right: -1px; }
-        }
-
-        tab {
-          margin-left: 0.5px;
-          margin-right: 0.5px;
-
-          &.reorderable-page { border-style: none solid; }
-        }
-      }
-    }
-
-    &.left,
-    &.right {
-      tabs {
-        padding-top: 4px;
-        padding-bottom: 4px;
-
-        &:not(:only-child) {
-          margin-top: 3px;
-          margin-bottom: 3px;
-
-          &:first-child { margin-top: -1px; }
-          &:last-child { margin-bottom: -1px; }
-        }
-
-        tab {
-          margin-top: 4px;
-          margin-bottom: 4px;
-
-          &.reorderable-page { border-style: solid none; }
-        }
-      }
-    }
-
-    &.top tab { padding-bottom: 3px; }
-    &.bottom tab { padding-top: 3px; }
-    button{
-      margin-top: 1px;
-      margin-bottom: 1px;
-      padding: 1px 1px;
-    }
-  }
-
-  > stack:not(:only-child) { // the :not(:only-child) is for "hidden" notebooks
-    background-color: $base_color;
-
-    &:backdrop { background-color: $backdrop_base_color; }
-  }
-}
--- a/gtk-4.0/widgets/_paned.scss
+++ b/gtk-4.0/widgets/_paned.scss
@@ -1,69 +0,0 @@
-/*********
- * Paned *
- *********/
-paned {
-  > separator {
-    min-width: 1px;
-    min-height: 1px;
-    -gtk-icon-source: none; // defeats the ugly default handle decoration
-    border-style: none; // just to be sure
-    background-color: transparent;
-    // workaround, using background istead of a border since the border will get rendered twice (?)
-    background-image: image($borders_color);
-    background-size: 1px 1px;
-
-    &:selected { background-image: image($selected_bg_color); } // FIXME is this needed?
-
-    &:backdrop { background-image: image($backdrop_borders_color); }
-
-    &.wide {
-      min-width: 5px;
-      min-height: 5px;
-      background-color: $bg_color;
-      background-image: image($borders_color), image($borders_color);
-      background-size: 1px 1px, 1px 1px;
-
-      &:backdrop {
-        background-color: $backdrop_bg_color;
-        background-image: image($backdrop_borders_color),
-                          image($backdrop_borders_color);
-      }
-    }
-  }
-
-  &.horizontal > separator {
-    background-repeat: repeat-y;
-
-    &:dir(ltr) {
-      margin: 0 -8px 0 0;
-      padding: 0 8px 0 0;
-      background-position: left;
-    }
-    &:dir(rtl) {
-      margin: 0 0 0 -8px;
-      padding: 0 0 0 8px;
-      background-position: right;
-    }
-
-    &.wide {
-      margin: 0;
-      padding: 0;
-      background-repeat: repeat-y, repeat-y;
-      background-position: left, right;
-    }
-  }
-
-  &.vertical > separator {
-    margin: 0 0 -8px 0;
-    padding: 0 0 8px 0;
-    background-repeat: repeat-x;
-    background-position: top;
-
-    &.wide {
-      margin: 0;
-      padding: 0;
-      background-repeat: repeat-x, repeat-x;
-      background-position: bottom, top;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_pathbars.scss
+++ b/gtk-4.0/widgets/_pathbars.scss
@@ -1,29 +0,0 @@
-/************
- * Pathbars *
- ************/
-.path-bar button {
-  &.text-button, &.image-button, & {
-    padding-left: 4px;
-    padding-right: 4px;
-  }
-
-  &.text-button.image-button label {
-    padding-left: 0;
-    padding-right: 0;
-  }
-
-  &.text-button.image-button, & {
-    label:last-child { padding-right: 8px; }
-    label:first-child { padding-left: 8px; }
-  }
-
-  image {
-    padding-left: 4px;
-    padding-right: 4px;
-  }
-
-  &.slider-button {
-    padding-left: 0;
-    padding-right: 0;
-  }
-}
--- a/gtk-4.0/widgets/_popovers.scss
+++ b/gtk-4.0/widgets/_popovers.scss
@@ -1,66 +0,0 @@
-/***************
- * Popovers   *
- ***************/
-
- popover.background {
-
-  background: transparent;
-  font: initial;
-
-  > arrow,
-  > contents {
-    $_popover_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
-
-    background: if( $variant == 'light', linear-gradient(to bottom, #fff 20%, #fff), linear-gradient(to bottom, lighten($bg_color, 2%), darken($bg_color, 2%)));
-    background-clip: padding-box;
-    border: 1px solid $borders_color;
-    box-shadow: 0 4px 6px $menu_shadow_color;
-  }
-
-  &:backdrop {
-    background-color: transparent;
-    box-shadow: none;
-  }
-
-  > contents {
-    padding: 8px;
-    border-radius: 5px;
-
-    > list,
-    > .view,
-    > toolbar {
-      border-style: none;
-      background-color: transparent;
-    }
-
-    separator {
-      background-color: mix($bg_color, $borders_color, 30%);
-      margin: 3px;
-    }
-
-    list separator { margin: 0; }
-  }
-
-  .osd &,
-  &.touch-selection,
-  &.magnifier {
-    background-color: transparent;
-
-    > arrow,
-    > contents {
-      @extend %osd;
-
-      border: 1px solid transparentize(white, 0.9);
-      box-shadow: none;
-    }
-  }
-
-  &.touch-selection,
-  &.magnifier {
-    button { @extend %osd_button; }
-  }
-}
-
-magnifier {
-  background-color: $base_color;
-}
--- a/gtk-4.0/widgets/_print-dialog.scss
+++ b/gtk-4.0/widgets/_print-dialog.scss
@@ -1,18 +0,0 @@
-/****************
- * Print dialog *
-*****************/
-printdialog {
-  paper {
-    color: $fg_color;
-    border: 1px solid $borders_color;
-    background: white;
-    padding: 0;
-
-    &:backdrop {
-      color: $backdrop_fg_color;
-      border-color: $backdrop_borders_color;
-    }
-  }
-
-  .dialog-action-box { margin: 12px; }
-}
--- a/gtk-4.0/widgets/_progress-bars.scss
+++ b/gtk-4.0/widgets/_progress-bars.scss
@@ -1,56 +0,0 @@
-/*****************
- * Progress bars *
- *****************/
-progressbar {
-  // sizing
-  &.horizontal {
-    trough,
-    progress { min-height: 6px; }
-  }
-
-  &.vertical {
-    trough,
-    progress { min-width: 6px; }
-  }
-
-  &.horizontal progress { margin: 0;} // the progress node is positioned after the trough border
-  &.vertical progress { margin: 0; @include scale-highlight(bottom);}   // this moves it over it.
-
-
-  // FIXME: insensitive state missing and some other state should be set probably
-  font-size: smaller;
-  color: transparentize($fg_color, 0.6);
-
-  &:backdrop {
-    box-shadow: none;
-    transition: $backdrop_transition;
-  }
-
-  trough { @extend %scale_trough; }
-
-  &:backdrop trough { @extend %scale_trough:backdrop; } // looks like states are not passed to the trough component here
-
-  progress {
-    @extend %scale_highlight;
-  }
-
-  &:backdrop progress { @extend %scale_highlight:backdrop; } // states not passed here as well
-
-  &.osd { // progressbar.osd used for epiphany page loading progress
-    min-width: 3px;
-    min-height: 3px;
-    background-color: transparent;
-
-    trough {
-      border-style: none;
-      border-radius: 0;
-      background-color: transparent;
-      box-shadow: none;
-    }
-
-    progress {
-      border-style: none;
-      border-radius: 0;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_scales.scss
+++ b/gtk-4.0/widgets/_scales.scss
@@ -1,418 +0,0 @@
-/************
- * GtkScale *
- ************/
-%scale_trough {
-  background-color: $scale_bg;
-  border: none;
-  border-radius: 3px;
-  margin: 0;
-
-  &:disabled { background-color: $scale_disabled_bg; }
-
-  &:backdrop {
-    background-color: $scale_disabled_bg; 
-    transition: $backdrop_transition;
-
-    &:disabled { background-color: $scale_disabled_bg;  }
-  }
-}
-
-%scale_highlight {
-  border: none;
-  @include scale-highlight(right);
-  border-radius: 3px;
-  margin: 0;
-
-  &:disabled {
-    border: none;
-    background-color: $scale_bg;
-  }
-
-  &:backdrop,
-  &:active:backdrop {
-    border-color: lighten($selected_bg_color, 5%);
-    background-color: lighten($selected_bg_color, 5%);
-    &:disabled {
-      background-color: $scale_disabled_bg;
-    }
-  }
-}
-
-scale {
-  // sizing
-  $_marks_lenght: 6px;
-  $_marks_distance: 6px;
-
-  min-height: 16px;
-  min-width: 16px;
-  padding: 8px;
-
-  &.horizontal {
-    trough,
-    progress { min-height: 6px; }
-  }
-
-  &.vertical {
-    trough,
-    progress { min-width: 6px;}
-    highlight { @include scale-highlight(bottom); }
-  }
-
-  // the slider is inside the trough, so to have make it bigger there's a negative margin
-
-  slider {
-    min-height: 15px;
-    min-width: 15px;
-    margin: -7px;
-
-    background-color: $base_color;
-    box-shadow: inset 0 1px $top_highlight;
-              //  0px 0px 1px 1px rgba(0,0,0,0.1);
-    border-radius: 12px;
-
-    transition: $button_transition;
-    transition-property: background, border, box-shadow;
-
-    &:active {
-      background-color: $selected_bg_color;
-
-      &:disabled {
-        background-color: $insensitive_bg_color;
-        box-shadow: inset 0 1px $top_highlight;
-                    //0px 0px 1px 1px rgba(0,0,0,0.05);
-      }
-    }
-  }
-
-  // click-and-hold the slider to activate
-  &.fine-tune {
-    &.horizontal {
-      padding-top: 9px;
-      padding-bottom: 9px;
-      min-height: 16px;
-    }
-
-    &.vertical {
-      padding-left: 9px;
-      padding-right: 9px;
-      min-width: 16px;
-    }
-
-    // to make the trough grow in fine-tune mode
-    slider { margin: -6px; }
-
-    fill,
-    highlight,
-    trough {
-      border-radius: 5px;
-    }
-  }
-
-  // the backing bit
-  trough {
-    @extend %scale_trough;
-
-    outline-offset: 2px;
-    outline-color: transparent;
-  }
-
-  // the colored part of the backing bit
-  highlight { @extend %scale_highlight; }
-
-  // this is another differently styled part of the backing bit, the most relevant use case is for example
-  // in media player to indicate how much video stream as been cached
-  fill {
-    @extend %scale_trough;
-
-    &:backdrop, & { background-color: $borders_color; }
-
-    &:disabled {
-      &:backdrop, & {
-        border-color: transparent;
-        background-color: transparent;
-      }
-    }
-
-    // OSD
-    .osd & {
-      background-color: mix($osd_fg_color, $osd_borders_color, 25%);
-
-      &:disabled {
-        &:backdrop, & {
-          border-color: transparent;
-          background-color: transparent;
-        }
-      }
-    }
-  }
-
-  $_scale_bg: if($variant == 'light', #fff, lighten($bg_color, 10%));
-  $_scale_disabled_bg: darken($_scale_bg, 15%);
-  slider {
-    border-color: $base_color;
-    border: 2px solid #00f17d;
-    border-radius: 12px;
-
-    background-color: $_scale_bg;
-    // box-shadow: inset 0 1px $top_highlight,
-    //             0px 0px 1px 1px rgba(0,0,0,0.1);
-
-    &:hover { @include button(hover-alt, $edge: $shadow_color); }
-
-    &:active { border-color: $selected_borders_color; }
-
-    &:disabled {
-      background-color: $_scale_disabled_bg;
-      box-shadow: inset 0 1px $top_highlight,
-                  0px 0px 1px 1px rgba(0,0,0,0.1);
-      }
-
-    &:backdrop,
-    &:backdrop:disabled {
-      transition: $backdrop_transition;
-
-      background-color: $_scale_disabled_bg;
-      box-shadow: inset 0 1px $top_highlight,
-                  0px 0px 1px 1px rgba(0,0,0,0.1);
-    }
-
-    // ...on selected list rows
-    row:selected & { &:disabled, & { border-color: $selected_borders_color; } }
-
-    // OSD
-    .osd & {
-      @include button(osd);
-      border-color: darken($osd_borders_color, 3%);
-      background-color: opacify($osd_bg_color, 1); // solid background needed here
-
-      &:hover {
-        @include button(osd-hover);
-        background-color: opacify($osd_bg_color, 1); // solid background needed here
-      }
-
-      &:active {
-        @include button(osd-active);
-        background-color: opacify($osd_bg_color, 1); // solid background needed here
-      }
-
-      &:disabled {
-        @include button(osd-insensitive);
-        background-color: opacify($osd_bg_color, 1); // solid background needed here
-      }
-
-      &:backdrop {
-        @include button(osd-backdrop);
-        background-color: opacify($osd_bg_color, 1); // solid background needed here
-
-        &:disabled {
-          @include button(osd-backdrop-insensitive);
-          background-color: opacify($osd_bg_color, 1); // solid background needed here
-        }
-      }
-    }
-  }
-
-  value { color: gtkalpha(currentColor, 0.4); }
-
-  marks {
-    color: gtkalpha(currentColor, 0.4);
-
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
-      &.#{$marks_class} {
-        margin-#{$marks_margin}: $_marks_distance;
-        margin-#{$marks_pos}: -($_marks_distance + $_marks_lenght);
-      }
-    }
-  }
-
-  &.fine-tune marks {
-    @each $marks_class, $marks_pos, $marks_margin in (top, top, bottom),
-                                                     (bottom, bottom, top),
-                                                     (top, left, right),
-                                                     (bottom, right, left) {
-      &.#{$marks_class} {
-        margin-#{$marks_margin}: $_marks_distance;
-        margin-#{$marks_pos}: -($_marks_distance + $_marks_lenght - 3px);
-      }
-    }
-  }
-
-  &.horizontal {
-    indicator {
-      min-height: $_marks_lenght;
-      min-width: 1px;
-    }
-
-    &.fine-tune indicator { min-height: ($_marks_lenght - 3px); }
-  }
-
-  &.vertical {
-    indicator {
-      min-height: 1px;
-      min-width: $_marks_lenght;
-    }
-
-    &.fine-tune indicator { min-width: ($_marks_lenght - 3px); }
-  }
-
-  // *WARNING* scale with marks madness following
-
-  // FIXME: OSD and selected list rows missing, I don't feel like adding the other 144 assets needed for those...
-  $suffix: if($variant == 'light', '', '-dark');
-
-  @each $dir_class, $dir_infix in ('horizontal', 'horz'),
-                                  ('vertical', 'vert') {
-    @each $marks_infix, $marks_class in ('scale-has-marks-above', 'marks-before:not(.marks-after)'),
-                                        ('scale-has-marks-below', 'marks-after:not(.marks-before)') {
-      @each $state, $state_infix in ('', ''),
-                                    (':hover', '-hover'),
-                                    (':active', '-active'),
-                                    (':disabled', '-insensitive'),
-                                    (':backdrop', '-backdrop'),
-                                    (':backdrop:disabled', '-backdrop-insensitive') {
-        &.#{$dir_class}.#{$marks_class} {
-
-          slider {
-            &#{$state} {
-              // an asymmetric slider asset is used here, so the margins are uneven, the smaller
-              // margin is set on the point side.
-              min-height: 15px;
-              min-width: 15px;
-              margin: -7px;
-              border: 2px solid #00f17d;
-              border-radius: 50%;
-
-              background-color: $_scale_bg;
-              box-shadow: inset 0 1px $top_highlight;
-                      
-              }
-          }
-
-          &.fine-tune slider {
-            // bigger negative margins to make the trough grow here as well
-            margin: -7px;
-          }
-        }
-      }
-    }
-  }
-
-  &.color {
-    min-height: 0;
-    min-width: 0;
-
-    trough {
-      background-image: image($borders_color);
-      background-repeat: no-repeat;
-    }
-
-    &.horizontal {
-      padding: 0 0 15px 0;
-
-      trough {
-        padding-bottom: 4px;
-        background-position: 0 -3px;
-        border-top-left-radius: 0;
-        border-top-right-radius: 0;
-      }
-
-      slider {
-        &:dir(ltr), &:dir(rtl) { // specificity bumb
-          &:hover, &:backdrop, &:disabled, &:backdrop:disabled, & {
-            margin-bottom: -15px;
-            margin-top: 6px;
-          }
-        }
-      }
-    }
-
-    &.vertical {
-      &:dir(ltr) {
-        padding: 0 0 0 15px;
-
-        trough {
-          padding-left: 4px;
-          background-position: 3px 0;
-          border-bottom-right-radius: 0;
-          border-top-right-radius: 0;
-        }
-
-        slider {
-          &:hover, &:backdrop, &:disabled, &:backdrop:disabled, & {
-            margin-left: -15px;
-            margin-right: 6px;
-          }
-        }
-      }
-
-      &:dir(rtl) {
-        padding: 0 15px 0 0;
-
-        trough {
-          padding-right: 4px;
-          background-position: -3px 0;
-          border-bottom-left-radius: 0;
-          border-top-left-radius: 0;
-        }
-
-        slider {
-          &:hover, &:backdrop, &:disabled, &:backdrop:disabled, & {
-            margin-right: -15px;
-            margin-left: 6px;
-          }
-        }
-      }
-    }
-
-    &.fine-tune {
-      &.horizontal {
-        &:dir(ltr), &:dir(rtl) { // specificity bump
-          padding: 0 0 12px 0;
-
-          trough {
-            padding-bottom: 7px;
-            background-position: 0 -6px;
-          }
-
-          slider {
-            margin-bottom: -15px;
-            margin-top: 6px;
-          }
-        }
-      }
-
-      &.vertical {
-        &:dir(ltr) {
-          padding: 0 0 0 12px;
-
-          trough {
-            padding-left: 7px;
-            background-position: 6px 0;
-          }
-
-          slider {
-            margin-left: -15px;
-            margin-right: 6px;
-          }
-        }
-
-        &:dir(rtl) {
-          padding: 0 12px 0 0;
-
-          trough {
-            padding-right: 7px;
-            background-position: -6px 0;
-          }
-
-          slider {
-            margin-right: -15px;
-            margin-left: 6px;
-          }
-        }
-      }
-    }
-  }
-}
--- a/gtk-4.0/widgets/_scrollbars.scss
+++ b/gtk-4.0/widgets/_scrollbars.scss
@@ -1,170 +0,0 @@
-/**************
- * Scrollbars *
- **************/
-scrollbar {
-  $_slider_min_length: 40px;
-
-  background-color: $scrollbar_bg_color;
-  transition: 300ms $ease-out-quad;
-
-  // scrollbar border
-  &.top { border-bottom: 1px solid $borders_color; }
-  &.bottom { border-top: 1px solid $borders_color; }
-  &.left { border-right: 1px solid $borders_color; }
-  &.right { border-left: 1px solid $borders_color; }
-
-  &:backdrop {
-    background-color: $backdrop_scrollbar_bg_color;
-    border-color: $backdrop_borders_color;
-    transition: $backdrop_transition;
-  }
-
-  // slider
-  slider {
-    min-width: 6px;
-    min-height: 6px;
-    margin: -1px;
-    border: 4px solid transparent;
-    border-radius: 8px;
-    background-clip: padding-box;
-    background-color: $scrollbar_slider_color;
-
-    &:hover { background-color: $scrollbar_slider_hover_color; }
-
-    &:hover:active { background-color: $scrollbar_slider_active_color; }
-
-    &:backdrop { background-color: $backdrop_scrollbar_slider_color; }
-
-    &:disabled { background-color: transparent; }
-  }
-
-  &.fine-tune {
-    slider {
-      min-width: 4px;
-      min-height: 4px;
-    }
-
-    &.horizontal slider { border-width: 5px 4px; }
-    &.vertical slider { border-width: 4px 5px; }
-  }
-
-  &.overlay-indicator {
-    &:not(.dragging):not(.hovering) {
-      border-color: transparent;
-      opacity: 0.4;
-      background-color: transparent;
-
-      slider {
-        margin: 0;
-        min-width: 3px;
-        min-height: 3px;
-        background-color: $fg_color;
-        border: 1px solid if($variant == 'light', white, black);
-      }
-
-      button {
-        min-width: 5px;
-        min-height: 5px;
-        background-color: $fg_color;
-        background-clip: padding-box;
-        border-radius: 100%;
-        border: 1px solid if($variant == 'light', white, black);
-        -gtk-icon-source: none;
-      }
-
-      &.horizontal {
-        slider {
-          margin: 0 2px;
-          min-width: $_slider_min_length;
-        }
-
-        button {
-          margin: 1px 2px;
-          min-width: 5px;
-        }
-      }
-
-      &.vertical {
-        slider {
-          margin: 2px 0;
-          min-height: $_slider_min_length;
-        }
-
-        button {
-          margin: 2px 1px;
-          min-height: 5px;
-        }
-      }
-    }
-
-    &.dragging,
-    &.hovering { opacity: 0.8; }
-  }
-
-  &.horizontal slider { min-width: $_slider_min_length; }
-
-  &.vertical slider { min-height: $_slider_min_length; }
-
-  // button styling
-  button {
-    padding: 0;
-    min-width: 12px;
-    min-height: 12px;
-    border-style: none;
-    border-radius: 0;
-    transition-property: min-height, min-width, color;
-
-    @include button(undecorated);
-
-    color: $scrollbar_slider_color;
-
-    &:hover {
-      @include button(undecorated);
-
-      color: $scrollbar_slider_hover_color;
-    }
-    &:active, &:checked {
-      @include button(undecorated);
-
-      color: $scrollbar_slider_active_color;
-    }
-    &:disabled {
-      @include button(undecorated);
-
-      color: transparentize($scrollbar_slider_color, 0.8);
-    }
-    &:backdrop {
-      @include button(undecorated);
-
-      color: $backdrop_scrollbar_slider_color;
-
-      &:disabled {
-        @include button(undecorated);
-
-        color: transparentize($backdrop_scrollbar_slider_color, 0.8);
-      }
-    }
-  }
-
-  // button icons
-  &.vertical {
-    button {
-      &.down { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
-
-      &.up { -gtk-icon-source: -gtk-icontheme('pan-up-symbolic'); }
-    }
-  }
-
-  &.horizontal {
-    button {
-      &.down { -gtk-icon-source: -gtk-icontheme('pan-right-symbolic'); }
-
-      &.up { -gtk-icon-source: -gtk-icontheme('pan-left-symbolic'); }
-    }
-  }
-}
-
-treeview ~ scrollbar.vertical {
-  border-top: 1px solid $borders_color;
-  margin-top: -1px;
-}
--- a/gtk-4.0/widgets/_sidebar.scss
+++ b/gtk-4.0/widgets/_sidebar.scss
@@ -1,209 +0,0 @@
-/***********
- * Sidebar *
- ***********/
-.sidebar {
-  border-style: none;
-  border-width: 0;
-  background-color: mix($bg_color, $base_color, 50%);
-
-  .frame{
-    border: none;
-  }
-
-  @at-root %sidebar_left,
-  &:dir(ltr),
-  &.left,
-  &.left:dir(rtl) {
-    border-right: none;
-    border-left-style: none;
-  }
-
-  @at-root %sidebar_right
-  &:dir(rtl),
-  &.right {
-    border-left: 1px solid $borders_color;
-    border-right-style: none;
-  }
-
-  &:backdrop {
-    background-color: $backdrop_sidebar_bg_color;
-    border-color: $backdrop_borders_color;
-  }
-
-  row{
-    padding: 8px 12px;
-    transition: all .12s ease-in;
-    label{
-      color: #98abb2;
-    }
-    &:selected{
-      color: $selected_fg_color;
-      // border-left: 4px solid $selected_bg_color;
-      &:backdrop{
-        color: $backdrop_selected_fg_color;
-        background: $backdrop_selected_bg_color;
-        label{
-          color: $selected_fg_color;
-        }  
-      }
-      &:hover{
-        // background-color: transparentize($selected_bg_color, 0.8);
-      }
-      label{
-        color: $selected_fg_color;
-      }
-    }
-  }
-
-    //elementary os file manager
-    &.source-list{
-      background: $_sidebar_color;
-      padding: 4px 0px;
-      &.view{
-        transition: all .12s ease-in;
-        &:selected {
-          background-color: $selected_bg_color;
-          color: $selected_fg_color;
-          &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
-    
-          &.has-open-popup,
-          &:hover { background-color: transparentize($selected_bg_color, 0.1); }
-    
-          &:backdrop { background-color: $backdrop_selected_bg_color; }
-        }
-        &:hover, iconview.source-list:hover { 
-            background-color: transparentize(black, 0.87); 
-        }
-      }
-    }
-    
-
-  paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & {
-    border-style: none;
-    border-color: $borders_color;
-  }
-}
-}
-
-stacksidebar {
-  &.sidebar {
-    &:dir(ltr),
-    &.left,
-    &.left:dir(rtl) { list { @extend %sidebar_left; }}
-
-    &:dir(rtl),
-    &.right { list { @extend %sidebar_right; }}
-  }
-
-  row {
-    padding: 10px 4px;
-
-    > label {
-      padding-left: 6px;
-      padding-right: 6px;
-    }
-
-    &.needs-attention > label {
-      @extend %needs_attention;
-
-      background-size: 6px 6px, 0 0;
-    }
-  }
-}
-
-/*******************************************************************/
-/*                  PLACESSIDEBAR                                  */
-/*******************************************************************/
-
-/*--*/
-
-placessidebar{
-	&.sidebar{
-		background-color: transparent;
-		background-image:linear-gradient(to right, #171e27 40px,
-												$_sidebar_color 35px,$_sidebar_color 36px,
-												$_sidebar_color 36px,$_sidebar_color 99%, 
-												$_sidebar_color 100%);
-		row{
-			&.sidebar-row {
-				&.sidebar-row{
-					.sidebar-icon {
-						margin-left:-14px;
-						margin-right: 12px;
-						padding-left: 14px;
-						padding-right: 12px;
-						color: #9ecfa2;
-					}
-				}
-				&:hover{
-					transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
-					color: rgba(0,0,0,0.76);
-					background-color: transparent; /*rgba(65,67,75,0.4); */
-					background-image:linear-gradient(to right, rgba(65,67,75,0) 40px, rgba(0,0,0,0.12) 40px,rgba(0,0,0,0.12) 97%);
-				}
-
-				&:active{
-					&:hover{
-						color: rgba(0,0,0,0.76);
-						background-color: rgba(0,0,0,0.23);
-					}
-				}
-
-				&:selected{
-					color: rgba(255, 255, 255, 0.938);
-					background-color: transparent;
-					background-image:linear-gradient(to right, $selected_bg_color 40px,
-																rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%);
-					&:hover{
-						color: #ffffff;
-						background-color: rgba(0,0,0,0.24);
-						.sidebar-icon {
-							color: #ffffff;
-						}
-          }
-          &:backdrop{
-            color: rgba(0,0,0,0.54);;
-            background-color: transparent;
-            background-image:linear-gradient(to right, $selected_bg_color 40px,
-                                  rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%);
-
-            .sidebar-icon {
-              color: $backdrop_selected_fg_color;
-              -gtk-icon-shadow: 0 1px transparentize($backdrop_selected_fg_color, 0.2);
-            }
-          }
-
-					.sidebar-icon {
-						-gtk-icon-shadow: 0 1px transparentize(#fff, 0.2);
-						color: inherit; 
-					}
-				}
-
-        &.sidebar-new-bookmark-row { 
-          &, label, .sidebar-icon {
-            color: $yellow; 
-          }
-        }
-
-        &:drop(active):not(:disabled) {
-          &, label, image { color: $drop_target_color; }
-    
-          box-shadow: inset 0 1px $drop_target_color,
-                      inset 0 -1px $drop_target_color;
-    
-          &:selected {
-            &, label, image { color: $selected_fg_color; }
-            background: $drop_target_color;
-          }
-        }
-
-			}
-		}
-	}
-	list{ 
-		background-color: transparent; 
-		&:backdrop { background-color: transparent; }
-	}
-  
-  
-}
--- a/gtk-4.0/widgets/_spinbuttons.scss
+++ b/gtk-4.0/widgets/_spinbuttons.scss
@@ -1,192 +0,0 @@
-/*****************
- * GtkSpinButton *
- *****************/
-spinbutton {
-  &:not(.vertical) {
-    // in this horizontal configuration, the whole spinbutton
-    // behaves as the entry, so we extend the entry styling
-    // and nuke the style on the internal entry
-    @extend %entry;
-
-    padding: 0;
-
-    entry {
-      min-width: 28px;
-      // reset all the other props since the spinbutton node is styled here
-      margin: 0;
-      background: none;
-      background-color: transparent;
-      border: none;
-      border-radius: 0;
-      box-shadow: none;
-    }
-
-    button {
-      min-height: 16px;
-      margin: 0;
-      padding-bottom: 0;
-      padding-top: 0;
-      color: mix($fg_color, $base_color, 90%);
-      background-image: none;
-      border-style: none none none solid;
-      border-color: transparentize($borders_color, 0.7);
-      border-radius: 0;
-      box-shadow: inset 1px 0px 0px 0px rgba(0,0,0,0.07);
-
-      &:dir(rtl) { border-style: none solid none none; }
-
-      &:hover {
-        color: $fg_color;
-        background-color: $base_hover_color;
-      }
-
-      &:disabled { color: transparentize($insensitive_fg_color, 0.7); }
-
-      &:active {
-        background-color: transparentize(black, 0.9);
-        box-shadow: inset 0 2px 3px -1px transparentize(black, 0.8);
-      }
-
-      &:backdrop {
-        color: mix($backdrop_fg_color, $backdrop_base_color, 90%);
-        background-color: transparent;
-        border-color: transparentize($backdrop_borders_color, 0.7);
-        transition: $backdrop_transition;
-      }
-
-      &:backdrop:disabled {
-        color: transparentize($backdrop_insensitive_color,0.7);
-        background-image: none;
-        border-style: none none none solid; // It is needed or it gets overridden
-        box-shadow: inset 1px 0px 0px 0px rgba(0,0,0,0.07);
-
-        &:dir(rtl) { border-style: none solid none none; }
-      }
-
-      &:last-child {
-        border-top-right-radius: 2px;
-        border-bottom-right-radius: 2px;
-      }
-    }
-  }
-
-  // OSD horizontal
-  .osd &:not(.vertical) {
-    button {
-      @include button(undecorated);
-
-      color: $osd_fg_color;
-      border-style: none none none solid;
-      border-color: transparentize($osd_borders_color, 0.3);
-      border-radius: 0;
-      box-shadow: none;
-      -gtk-icon-shadow: 0 1px black;
-
-      &:dir(rtl) { border-style: none solid none none; }
-
-      &:hover {
-        @include button(undecorated);
-
-        color: $osd_fg_color;
-        border-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-        background-color: transparentize($osd_fg_color, 0.9);
-        -gtk-icon-shadow: 0 1px black;
-        box-shadow: none;
-      }
-
-      &:backdrop {
-        @include button(undecorated);
-
-        color: $osd_fg_color;
-        border-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-        -gtk-icon-shadow: none;
-        box-shadow: none;
-      }
-
-      &:disabled {
-        @include button(undecorated);
-
-        color: $osd_insensitive_fg_color;
-        border-color: transparentize(opacify($osd_borders_color, 1), 0.5);
-        -gtk-icon-shadow: none;
-        box-shadow: none;
-      }
-
-      &:last-child { border-radius: 0 3px 3px 0; }
-
-      &:dir(rtl):first-child { border-radius: 3px 0 0 3px; }
-    }
-  }
-
-  // Vertical
-  &.vertical {
-    // in the vertical configuration, we treat the spinbutton
-    // as a box, and tweak the style of the entry in the middle
-    // so that it's linked
-
-    // FIXME: this should not be set at all, but otherwise it gets the wrong
-    // color
-    &:disabled { color: $insensitive_fg_color; }
-    &:backdrop:disabled { color: $backdrop_insensitive_color; }
-
-    &:drop(active) {
-      border-color: transparent;
-      box-shadow: none;
-    }
-
-    entry {
-      min-height: 32px;
-      min-width: 32px;
-      padding: 0;
-      border-radius: 0;
-    }
-
-    button {
-      min-height: 32px;
-      min-width: 32px;
-      padding: 0;
-      border-width: 1px;
-      border-color: $borders_color;
-      box-shadow: 0 1px $top_highlight;
-
-      &.up { @extend %top_button; }
-
-      &.down { @extend %bottom_button; }
-    }
-
-    %top_button {
-      border-radius: 3px 3px 0 0;
-      border-style: solid solid none solid;
-    }
-
-    %bottom_button {
-      border-radius: 0 0 3px 3px;
-      border-style: none solid solid solid;
-    }
-  }
-
-  // OSD vertical
-  .osd &.vertical button:first-child {
-    @include button(osd);
-
-    &:hover { @include button(osd-hover);}
-
-    &:active { @include button(osd-active); }
-
-    &:disabled { @include button(osd-insensitive); }
-
-    &:backdrop { @include button(osd-backdrop); }
-  }
-
-  // Misc
-  treeview &:not(.vertical) {
-    min-height: 0;
-    border-style: none;
-    border-radius: 0;
-
-    entry {
-      min-height: 0;
-      padding: 1px 2px;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_spinner.scss
+++ b/gtk-4.0/widgets/_spinner.scss
@@ -1,27 +0,0 @@
-/***********
- * Spinner *
- ***********/
-
-menu spinner {
-    color: $selected_bg_color;
-}
-
-/*********************
- * Spinner Animation *
- *********************/
-@keyframes spin {
-  to { -gtk-icon-transform: rotate(1turn); }
-}
-
-spinner {
-  background: none;
-  opacity: 0; // non spinning spinner makes no sense
-  -gtk-icon-source: -gtk-icontheme('process-working-symbolic');
-
-  &:checked {
-    opacity: 1;
-    animation: spin 1s linear infinite;
-
-    &:disabled { opacity: 0.5; }
-  }
-}
--- a/gtk-4.0/widgets/_switches.scss
+++ b/gtk-4.0/widgets/_switches.scss
@@ -1,99 +0,0 @@
-/**********
- * Switch *
- **********/
- switch {
-  font-size: 1px;
-  font-weight: bold;
-  outline-offset: -4px;
-  transition: all 200ms ease-in;
-
-  border: none;
-  border-radius: 14px;
-  color: transparent;
-  padding: 2.3px 0px;
-
-  background:  linear-gradient(to right, #859398, #859398);
- // border: 1px solid rgba(170, 170, 170, 0.4);
-  box-shadow: 0px 2px 3px rgba(138, 138, 138, 0.753);
-  &:disabled {
-    background-color: $insensitive_bg_color;
-  }
-
-  &:backdrop {
-    background-color: $backdrop_bg_color;
-    transition: $backdrop_transition;
-
-    &:disabled { background-color: $insensitive_bg_color; }
-  }
-
-
-  &:active,
-  &:checked {
-   // border: 1px solid $teal;
-   background:  linear-gradient(to right, #ff9200, #fadd00);
-    slider{
-      background: #fff;
-    }
-    &:backdrop {
-      //border: 1px solid $teal;
-      background:  linear-gradient(to right, darken(#ff9200, 5%), darken(#fadd00, 5%));
-      slider {
-        &:backdrop {
-          box-shadow:none;
-          background-color:transparentize($base_color, 0.1);
-          border:none;
-        }
-      }
-    }
-  }
-
-  // Handle
-  slider {
-    padding:2px;
-    margin: 0 2.3px;
-    min-width: 12px;
-    min-height: 12px;
-
-    border-radius: 100%;
-    transition: $button_transition;
-    background-color: lighten(#859398, 20%);
-
-    &:backdrop {
-      padding:2px;
-      box-shadow:none;
-      background-color:$base_color;
-    }
-  }
-
-  &:checked slider { }
-
-  &:backdrop {
-  }
-
-  row:selected & {
-    @if $variant == 'light' {
-      box-shadow: none;
-      border-color: $selected_borders_color;
-
-      &:backdrop { border-color: $selected_borders_color; }
-
-      &.slider:dir(rtl) { border-left-color: $borders_color; }
-      &.slider:dir(ltr) { border-right-color: $borders_color; }
-
-      &.slider { &:checked, & { border-color: $selected_borders_color; } }
-    }
-  }
-
-  // Trough
-  trough {
-
-    &:active,
-    &:checked {
-      background-color: $selected_bg_color;
-
-      &:backdrop {
-        background-color: $backdrop_selected_bg_color;
-      }
-    }
-  }
-}
--- a/gtk-4.0/widgets/_toolbars.scss
+++ b/gtk-4.0/widgets/_toolbars.scss
@@ -1,83 +0,0 @@
-/************
- * Toolbars *
- ************/
-%toolbar {
-  padding: 4px;
-  background-color: $bg_color;
-}
-
-toolbar {
-  @extend %toolbar;
-
-  padding: 4px 3px 3px 4px;
-
-  // on OSD
-  .osd & { background-color: transparent; }
-
-  // stand-alone OSD toolbars
-  &.osd {
-    padding: 13px;
-    border: none;
-    border-radius: 5px;
-    background-color: $osd_bg_color;
-
-    &.left,
-    &.right,
-    &.top,
-    &.bottom { border-radius: 0; } // positional classes for `attached` osd toolbars
-  }
-
-  // toolbar separators
-  &.horizontal separator { margin: 0 7px 1px 6px; }
-  &.vertical separator { margin: 6px 1px 7px 0; }
-
-  &:not(.inline-toolbar):not(.osd) {
-    switch,
-    scale,
-    entry,
-    spinbutton,
-    button {
-      margin-right: 1px;
-      margin-bottom: 1px;
-    }
-  }
-}
-
-//searchbar, location-bar & inline-toolbar
-.inline-toolbar {
-  @extend %toolbar;
-
-  @extend %darkbar;
-
-  padding: 3px;
-  border-width: 0 1px 1px;
-  border-radius: 0  0 5px 5px;
-}
-
-searchbar,
-.location-bar {
-  @extend %toolbar;
-
-  @extend %darkbar;
-
-  border-width: 0 0 1px;
-  padding: 3px;
-}
-
-%darkbar {
-  border-style: solid;
-  border-color: $borders_color;
-  $_bg: mix($bg_color, $borders_color, 70%);
-  background-color: $_bg;
-
-  &:backdrop {
-    border-color: $backdrop_borders_color;
-    background-color: $backdrop_dark_fill;
-    box-shadow: none;
-    transition: $backdrop_transition;
-  }
-}
-
-searchbar{
-  background: $base_color;
-}
--- a/gtk-4.0/widgets/_tooltips.scss
+++ b/gtk-4.0/widgets/_tooltips.scss
@@ -1,28 +0,0 @@
-/************
- * Tooltips *
- ************/
-tooltip {
-  &.background {
-    // background-color needs to be set this way otherwise it gets drawn twice
-    // see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
-    background-color: darken($_sidebar_color, 5%);
-    background-clip: padding-box;
-    border: 1px solid $tooltip_borders_color; // this suble border is meant to
-                                              // not make the tooltip melt with
-                                              // very dark backgrounds
-  }
-
-  padding: 4px; /* not working */
-  border-radius: 4px;
-  box-shadow: none; // otherwise it gets inherited by windowframe.csd
-  text-shadow: 0 1px black;
-
-  // FIXME: we need a border or tooltips vanish on black background.
-  decoration { background-color: transparent; }
-
-  * { // Yeah this is ugly
-    padding: 4px;
-    background-color: transparent;
-    color: white;
-  }
-}
--- a/gtk-4.0/widgets/_touch-copy-paste.scss
+++ b/gtk-4.0/widgets/_touch-copy-paste.scss
@@ -1,82 +0,0 @@
-/**********************
- * Touch Copy & Paste *
- *********************/
-//touch selection handlebars for the Popover.osd above
-cursor-handle {
-  background-color: transparent;
-  background-image: none;
-  box-shadow: none;
-  border-style: none;
-
-  @each $s,$as in ('',''),
-                  (':hover','-hover'),
-                  (':active','-active') { //no need for insensitive and backdrop
-    &.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) {
-      $_url: 'assets/text-select-start#{$as}#{$asset_suffix}';
-      -gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
-                                    url('#{$_url}@2.png'));
-      padding-left: 10px;
-    }
-
-    &.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) {
-      $_url: 'assets/text-select-end#{$as}#{$asset_suffix}';
-      -gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
-                                    url('#{$_url}@2.png'));
-      padding-right: 10px;
-    }
-
-    &.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) {
-      $_url: 'assets/slider-horz-scale-has-marks-above#{$as}#{$asset_suffix}';
-      -gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
-                                    url('#{$_url}@2.png'));
-    }
-  }
-}
-
-.context-menu { font: initial; } // Decouple the font of context menus from their entry/textview
-
-button.circular { // FIXME: aggregate to buttons
-  border-radius: 20px;
-  -gtk-outline-radius: 20px;
-
-  label { padding: 0; }
-}
-
-// shortcut window keys
-.keycap {
-  min-width: 20px;
-  min-height: 25px;
-  margin-top: 2px;
-  padding-bottom: 3px;
-  padding-left: 6px;
-  padding-right: 6px;
-
-  color: $fg_color;
-  background-color: $base_color;
-  border: 1px solid;
-  border-color: if($variant == 'light', mix($borders_color, $bg_color, 50%), $borders_color);
-  border-radius: 5px;
-  box-shadow: if($variant == 'light', inset 0 -3px mix($base_color, $bg_color, 20%), inset 0 -3px mix($borders_color, $base_color, 60%));
-  font-size: smaller;
-
-  &:backdrop {
-    background-color: $backdrop_base_color;
-    color: $backdrop_fg_color;
-    transition: $backdrop_transition;
-  }
-}
-
-*:drop(active):focus,
-*:drop(active) { // FIXME needs to be done widget by widget, this wildcard should really die
-  border-color: $drop_target_color;
-  box-shadow: inset 0 0 0 1px $drop_target_color;
-}
-
-stackswitcher button.text-button { min-width: 100px; } // FIXME aggregate with buttons
-
-stackswitcher button.circular,
-stackswitcher button.text-button.circular { // FIXME aggregate with buttons
-  min-width: 32px;
-  min-height: 32px;
-  padding: 0;
-}
--- a/gtk-4.0/widgets/_treeviews.scss
+++ b/gtk-4.0/widgets/_treeviews.scss
@@ -1,225 +0,0 @@
-/**************
- * Tree Views *
- **************/
-treeview.view {
-
-  border-left-color: mix($fg_color, $base_color, 50%); // this is actually the tree lines color,
-  border-top-color: $bg_color;                         // while this is the grid lines color, better then nothing
-
-  rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props
-
-  &:selected {
-    &:focus, & {
-      border-radius: 0;
-
-      @extend %selected_items;
-    }
-
-    &:backdrop, & {
-      border-left-color: mix($selected_fg_color, $selected_bg_color, 50%);
-      border-top-color: transparentize($fg_color, 0.9); // doesn't work unfortunatelly
-    }
-  }
-
-  &:disabled {
-    color: $insensitive_fg_color;
-
-    &:selected {
-      color: mix($selected_fg_color, $selected_bg_color, 40%);
-      &:backdrop { color: mix($backdrop_selected_fg_color, $selected_bg_color, 30%); }
-    }
-
-    &:backdrop { color: $backdrop_insensitive_color; }
-  }
-
-  &.separator {
-    min-height: 2px;
-    color: $bg_color;
-
-    &:backdrop { color: transparentize($bg_color, 0.9); }
-  }
-
-  &:backdrop {
-    border-left-color: mix($backdrop_fg_color, $backdrop_bg_color, 50%);
-    border-top: $backdrop_bg_color;
-  }
-  &:drop(active) {
-    border-style: solid none;
-    border-width: 1px;
-    border-color: $selected_borders_color;
-
-    &.after { border-top-style: none; }
-
-    &.before { border-bottom-style: none; }
-  }
-
-  &.expander {
-    -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-
-    &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
-
-    color: mix($fg_color, $base_color, 70%);
-
-    &:hover { color: $fg_color; }
-
-    &:selected {
-      color: mix($selected_fg_color, $selected_bg_color, 70%);
-
-      &:hover { color: $selected_fg_color; }
-
-      &:backdrop { color: mix($backdrop_selected_fg_color, $selected_bg_color, 70%); }
-    }
-
-    &:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
-
-    &:backdrop { color: mix($backdrop_fg_color, $backdrop_base_color, 70%); }
-  }
-
-  &.progressbar { // progress bar in treeviews
-    @if $variant == light { color: $base_color; }
-
-    border: 1px solid $selected_borders_color;
-    border-radius: 4px;
-    background-color: $selected_bg_color;
-    background-image: linear-gradient(to bottom,
-                                      $selected_bg_color,
-                                      darken($selected_bg_color,10%));
-    box-shadow: inset 0 1px if($variant=='light', transparentize(white,0.7),
-                                                  transparentize(white,0.85)),
-                      0 1px if($variant=='light', transparentize(black, 0.8),
-                                                  transparentize(black,0.9));
-
-    &:selected {
-      &:focus, & {
-        border-radius: 4px;
-
-        @if $variant == 'light' {
-          color: $selected_bg_color;
-          box-shadow: none;
-        }
-
-        @else { box-shadow: inset 0 1px transparentize(white, 0.95); }
-
-        background-image: linear-gradient(to bottom,
-                                          $base_color,
-                                          darken($base_color,10%));
-
-        &:backdrop {
-          @if $variant == 'light' {
-            color: $selected_bg_color;
-            border-color: $selected_borders_color; // otherwise it gets inherited by .view(?!?)
-          }
-
-          @else { border-color: $backdrop_base_color; }
-
-          background-color: $backdrop_base_color;
-        }
-      }
-    }
-
-    &:backdrop {
-      @if $variant == 'light' { color: $backdrop_base_color; }
-
-      @else { border-color: $backdrop_base_color; }
-
-      background-image: none;
-      box-shadow: none;
-    }
-  }
-
-  &.trough { // progress bar trough in treeviews
-    background-color: transparentize($fg_color,0.9);
-    border-radius: 4px;
-
-    &:selected {
-      &:focus, & {
-        background-color: if($variant == 'light',
-                             transparentize($selected_fg_color, 0.7),
-                             darken($selected_bg_color, 10%));
-        border-radius: 4px;
-
-        @if $variant == 'light' {
-          border-width: 1px 0;
-          border-style: solid;
-          border-color: $selected_bg_color;
-        }
-      }
-    }
-  }
-
-  header {
-    button {
-      $_column_header_color: mix($fg_color, $base_color, 50%);
-
-      @extend %column_header_button;
-
-      color: $_column_header_color;
-      background-color: $base_color;
-      font-weight: bold;
-      text-shadow: none;
-      box-shadow: none;
-
-      &:hover {
-        @extend %column_header_button;
-
-        color: mix($_column_header_color, $fg_color, 50%);
-        box-shadow: none;
-        transition: none; //I shouldn't need this
-      }
-
-      &:active {
-        @extend %column_header_button;
-
-        color: $fg_color;
-        transition: none; //I shouldn't need this
-      }
-    }
-
-    button:last-child { &:backdrop, & { border-right-style: none; }}
-  }
-
-  button.dnd,
-  header.button.dnd { // for treeview-like derive widgets
-    &:active, &:selected, &:hover, & {
-      padding: 0 6px;
-      transition: none;
-      background-image: none;
-      background-color: $selected_bg_color;
-      color: $base_color;
-      border-radius: 0;
-      border-style: none;
-      box-shadow: inset 0 0 0 1px $base_color;
-      text-shadow: none;
-    }
-  }
-
-  acceleditor > label { background-color: $selected_bg_color; } // see tests/testaccel to test
-}
-
-%column_header_button {
-  padding: 0 6px;
-  border-radius: 0;
-  background-image: none;
-  text-shadow: none;
-  border-width: 1px;
-  border-style: none solid solid none;
-  border-color: $bg_color;
-
-  &:disabled {
-    border-color: $bg_color;
-    background-image: none;
-  }
-
-  &:backdrop {
-    border-color: $backdrop_bg_color;
-    border-style: none solid solid none;
-    color: mix($backdrop_fg_color, $backdrop_bg_color, 50%);
-    background-image: none;
-    background-color: $backdrop_base_color;
-
-    &:disabled {
-      border-color: $backdrop_bg_color;
-      background-image: none;
-    }
-  }
-}
--- a/gtk-4.0/widgets/_windows.scss
+++ b/gtk-4.0/widgets/_windows.scss
@@ -1,151 +0,0 @@
-/**********************
- * Window Decorations *
- *********************/
-decoration, window {
-  border-radius: 4px 4px 0 0;
-
-  // lamefun trick to get rounded borders regardless of CSD use
-  border-width: 0px;
-
-  // this needs to be transparent
-  // see bug #722563
-  $_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
-  $_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize($borders_color, 0.1));
-
-    // lamefun trick to get rounded borders regardless of CSD use
-  border-width: 0px;
-
-  box-shadow: 0 4px 10px 2px transparentize(#211A1E, 0.6);
-  // FIXME rationalize shadows
-
-  // this is used for the resize cursor area
-  margin: 10px;
-
-  &:backdrop {
-    // the transparent shadow here is to enforce that the shadow extents don't
-    // change when we go to backdrop, to prevent jumping windows.
-    // The biggest shadow should be in the same order then in the active state
-    // or the jumping will happen during the transition.
-    box-shadow: 0 4px 10px 2px transparentize($borders_color, 0.4);
-    transition: $backdrop_transition;
-  }
-
-  .maximized &,
-  .fullscreen &,
-  .tiled & { border-radius: 0; }
-
-  .popup & { box-shadow: none; }
-
-  // server-side decorations as used by mutter
-  .ssd & { box-shadow: none; } //just doing borders, wm draws actual shadows
-
-  .csd.popup & {
-    border-radius: 7px;
-    box-shadow: 0 4px 8px $menu_shadow_color;
-    border: 1px solid $borders_color;
-  }
-
-  tooltip.csd & {
-    border-radius: 5px;
-    box-shadow: none;
-  }
-
-  messagedialog.csd & {
-    border-radius: 7px;
-    box-shadow: 0 1px 2px transparentize(black, 0.8),
-                  0 0 0 1px transparentize($_wm_border,0.1);
-  }
-
-  .solid-csd & {
-    border-radius: 0;
-    margin: 0px;
-    background-color: $backdrop_bg_color;
-    border: solid 1px $backdrop_borders_color;
-    box-shadow: none;
-  }
-}
-
-// Window Close button
-windowcontrols {
-  button {
-    &.close, &.maximize, &.minimize {
-      min-width: 20px;
-      min-height: 20px;
-      margin: 0;
-      padding: 0 1px;
-      background-position: center;
-      background-repeat: no-repeat;
-      background-size: 16px 16px;
-  
-      &, &:hover, &:focus, &:active, &:backdrop, &:backdrop:hover {
-       background-color: transparent;
-       border: none;
-       box-shadow: none;
-        color: transparent;
-      }
-  
-    }
-    
-    &.close {
-      background-image: -gtk-scaled(url("../assets/close.png"),url("../assets/close@2.png"));
-      &:hover,&:active {
-        background-image: -gtk-scaled(url("../assets/close_prelight.png"),url("../assets/close_prelight@2.png"));
-      }
-    }
-    &.maximize {
-      background-image: -gtk-scaled(url("../assets/maximize.png"),url("../assets/maximize@2.png"));
-      &:hover,&:active {
-        background-image: -gtk-scaled(url("../assets/maximize_prelight.png"),url("../assets/maximize_prelight@2.png"));
-      }
-    }
-    &.minimize {
-      background-image: -gtk-scaled(url("../assets/min.png"),url("../assets/min@2.png"));
-      &:hover,&:active {
-        background-image: -gtk-scaled(url("../assets/min_prelight.png"),url("../assets/min_prelight@2.png"));
-      }
-    }
-  
-    .selection-mode & {
-      @extend %button.flat.suggested-action;
-  
-      @extend %nobg_selected_items;
-    }
-  
-    &:backdrop { 
-      -gtk-icon-shadow: none; 
-      background-image: -gtk-scaled(url("../assets/close_unfocused.png"),url("../assets/close_unfocused@2.png"));
-    }
-  }
-}
-
-
-headerbar.selection-mode button.titlebutton,
-.titlebar.selection-mode button.titlebutton {
-  @include _button_text_shadow(white, $selected_bg_color);
-
-  &:backdrop { -gtk-icon-shadow: none; }
-}
-
-
-// catch all extend :)
-
-%selected_items {
-  background-color: $selected_bg_color;
-
-  @at-root %nobg_selected_items, & {
-    color: $selected_fg_color;
-    font-weight: normal;
-    //&:hover{background-color: transparent;}
-    @if $variant == 'light' { outline-color: transparentize($selected_fg_color, 0.7); }
-
-    &:disabled { color: mix($selected_fg_color, $selected_bg_color, 50%); }
-
-    &:backdrop {
-      color: $backdrop_selected_fg_color;
-
-      &:disabled { color: mix($backdrop_selected_fg_color, $selected_bg_color, 30%); }
-    }
-  }
-}
-
-.monospace { font-family: Monospace; }
--- a/package-lock.json
+++ b/package-lock.json
@@ -2883,9 +2883,9 @@
      }
    },
    "lodash": {
-      "version": "4.17.15",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
-      "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
    },
    "lodash._basecopy": {
      "version": "3.0.1",
--- a/src/render-gtk3-assets-hidpi.py
+++ b/src/render-gtk3-assets-hidpi.py
@@ -1,5 +1,7 @@
 #!/usr/bin/python3

+# Thanks to the GNOME theme nerds for the original source of this script
+
 import os
 import sys
 import xml.sax
@@ -30,9 +32,9 @@ def wait_for_prompt(process, command=None):
        return

    output += process.stdout.read(1)
-    # while output != b'\n>':
-    #     output += process.stdout.read(1)
-    #     output = output[1:]
+    while output != b'\n>':
+        output += process.stdout.read(1)
+        output = output[1:]


 def start_inkscape():
@@ -49,8 +51,9 @@ def inkscape_render_rect(icon_file, rect, output_file):
    if inkscape_process is None:
        inkscape_process = start_inkscape()
    wait_for_prompt(inkscape_process,
-                    'file-open:%s; export-id:%s; export-filename:%s; export-dpi:180; export-do' %
-                    (icon_file, rect, output_file))
+                    '--export-dpi=180 %s -i %s -e %s'
+                    % (icon_file, rect, output_file)
+                    )
    optimize_png(output_file)


--- a/src/render-gtk3-assets.py
+++ b/src/render-gtk3-assets.py
@@ -1,5 +1,7 @@
 #!/usr/bin/python3

+# Thanks to the GNOME theme nerds for the original source of this script
+
 import os
 import sys
 import xml.sax
@@ -30,9 +32,9 @@ def wait_for_prompt(process, command=None):
        return

    output += process.stdout.read(1)
-    # while output != b'\n>':
-    #     output += process.stdout.read(1)
-    #     output = output[1:]
+    while output != b'\n>':
+        output += process.stdout.read(1)
+        output = output[1:]


 def start_inkscape():
@@ -49,7 +51,7 @@ def inkscape_render_rect(icon_file, rect, output_file):
    if inkscape_process is None:
        inkscape_process = start_inkscape()
    wait_for_prompt(inkscape_process,
-                    'file-open:%s; export-id:%s; export-filename:%s; export-do' %
+                    '%s -i %s -e %s' %
                    (icon_file, rect, output_file))
    optimize_png(output_file)