
//
// GNOME Terminal, MATE Terminal
//
terminal-window,
.mate-terminal {
  notebook {
    // padding: 0 1px 1px;

    > header.top {
      button {
        padding: 0;
        min-width: 24px;
        min-height: 24px;
      }
    }

    scrollbar {
      background: none;
    }
  }

  &.background.csd {
    border-radius: 0;

    &.maximized, &.tiled, &.fullscreen { border-radius: 0; } // Fixed gnome 3.32 issue: Unable to restore window size after maximization
  }

  decoration {
    border-radius: $corner_radius $corner_radius 0 0;
  }
}

window.background { // gnome-terminal 3.32
  > box.vertical > box.horizontal > frame {
    > border {
      border-width: 0 1px 0 0;
    }
  }

  > box.vertical > box.horizontal > stack {
    > widget > notebook.frame {
      border-width: 0 0 0 1px;
    }
  }
}

//
// Nautilus
//
%nautilus_background_image {
  background-image: -gtk-scaled(url("assets/backimage#{$asset_suffix}.png"), url("assets/backimage#{$asset_suffix}@2.png"));
  background-repeat: no-repeat;
  background-position: bottom right;
}

%pathbar_box_button {
  background: none;
  border: none;
  margin-top: 0;
  margin-bottom: 0;
  padding: 0 $cont_padding 2px $cont_padding;
  border-radius: 0;

  &:hover {
    color: $alt_header_fg;
    background: none;
    box-shadow: inset 0 -1px rgba($selected_bg_color, 0.5), 0 1px rgba($selected_bg_color, 0.5);
  }

  &:checked, &:active {
    color: $header_fg;
    background: none;
    box-shadow: inset 0 -1px $selected_bg_color, 0 1px $selected_bg_color;
  }

  &:disabled { color: rgba($header_fg, 0.4); }

  &:checked:disabled {
    color: rgba($header_fg, 0.4);
    box-shadow: inset 0 -1px rgba($selected_bg_color, 0.4), 0 1px rgba($selected_bg_color, 0.4);
  }
}

%nautilus_dir_buttons {
  border-radius: $bt_radius;
  border: none;

  &:hover {
    color: $header_fg;
    background-color: rgba($header_fg, 0.1);
  }

  &:active {
    color: $header_fg;
    background-color: rgba($header_fg, 0.2);
  }

  &:checked {
    color: $header_fg;
    background-color: rgba($header_fg, 0.15);
  }
}

.nautilus-window {
  &.background.csd {
    border-radius: 0 0 $corner_radius $corner_radius;

    &.unified { // >= 40.0
      border-radius: $corner_radius;
    }

    placessidebar.sidebar {
      border-bottom-left-radius: $corner_radius;
    }

    notebook, notebook > stack {
      border-radius: 0 0 $corner_radius $corner_radius;
    }
  }

  headerbar.titlebar {
    .path-bar-box {
      margin-top: $cont_padding;
      margin-bottom: $cont_padding;
      color: $header_fg;
      background-color: transparent;
      border: none;

      .path-bar { // for ≥ 3.30.1
        button.flat.text-button.toggle,
        button.flat.image-button.text-button.toggle {
          @extend %pathbar_box_button;
        }
      }

      .linked.nautilus-path-bar { // for ≥ 3.31.90
        button.text-button,
        button.image-button.text-button {
          padding: 3px $cont_padding;
          margin-top: 0;
          margin-bottom: 0;
          @extend %headerbar_pathbar_button;

          &:not(:only-child):last-child {
            border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
                                          $selected_bg_color 100%,
                                          transparent 0%)
                                          0 0 2 / 0 0 2px;
          }
        }

        button.text-button.image-button {
          padding: 3px $cont_padding * 2;

          label {
            padding-left: 0;
            padding-right: 0;
          }

          image {
            padding-left: 0;
            padding-right: 0;
          }
        }

        button.text-button label {
          padding-right: $cont_padding;
          padding-left: $cont_padding;
        }
      }

      &.width-maximized {
        border: none;
        box-shadow: inset 0 0 0 1px if($titlebar == 'light', rgba(black, 0.12), rgba(white, 0.12));
        background-color: rgba($header_fg, 0.06);
        border-radius: $bt_radius;
        padding: 0 $cont_padding;
      }

      // workaround for 3.30.1
      &.background.frame {
        border: none;
        background-color: transparent;
      }
    }

    &.windowhandle .linked.nautilus-path-bar {
      background-color: rgba($header_fg, 0.06);
      border-radius: $bt_radius + 1px;
      margin: $cont_padding 0;
      border: 1px solid if($titlebar == 'light', rgba(black, 0.12), rgba(white, 0.12));

      > button.popup {
        margin-top: 0;
        margin-bottom: 0;

        @extend %nautilus_dir_buttons;
      }

      .path-buttons-box {
        padding: 0 2px;

        > box > button {
          margin-top: 2px;
          margin-bottom: 2px;
          padding: 0 $cont_padding;

          @extend %nautilus_dir_buttons;

          > box > label.dim-label {
            color: $alt_header_fg;

            &:hover, &:active, &:checked {
              color: $header_fg;
            }
          }

          &:hover {
            color: $header_fg;
            background-color: rgba($header_fg, 0.1);
          }

          &:active, &:checked {
            color: $header_fg;
            background-color: rgba($header_fg, 0.2);
          }

          &.current-dir {
            color: $header_fg;

            &:hover, &:active {
              background: none;
              box-shadow: none;
              border-image: none;
            }
          }
        }
      }
    }
  }
}

.nautilus-canvas-item {
  border-radius: $bt_radius;
}

%nautilus-desktop-canvas-item,
.nautilus-desktop.nautilus-canvas-item {
  color: $selected_fg_color;
  text-shadow: 1px 1px transparentize(black, 0.4);

  &:active { color: $fg_color; }

  &:selected {
    color: $selected_fg_color;
    text-shadow: none;
  }
}

.nautilus-canvas-item.dim-label,
.nautilus-list-dim-label {
  color: mix($fg_color, $bg_color, 50%);

  &:selected, &:selected:focus { color: mix($selected_fg_color, $selected_bg_color, 80%); }
}

%file_manager_img,
.nautilus-window notebook > stack {
  @if $background == 'image' {
    @extend %nautilus_background_image;
  } @else {
    background-image: none;
  }
}

.nautilus-window {
  .searchbar-container { margin-top: -1px; }

  > menubar { // For wayland
    border: none;
    box-shadow: none;
    background: none;
  }
}

.nautilus-window notebook,
.nautilus-window notebook > stack:not(:only-child) searchbar {
  background-color: $base_color;
}

.nautilus-list-view {
  treeview.view:not(:selected):not(:hover):not(:focus) {
    background: none;
  }
}

button.nautilus-circular-button.image-button {
  @extend %circular_button;
}

$disk_space_unknown: transparentize($fg_color, 0.5);
$disk_space_used: transparentize($selected_bg_color, 0.2);
$disk_space_free: darken($bg_color, 3%);

.disk-space-display {
  border-style: solid;
  border-width: 1px;

  &.unknown {
    background-color: $disk_space_unknown;
    border-color: darken($disk_space_unknown, 10%);
  }

  &.used {
    background-color: $disk_space_used;
    border-color: darken($disk_space_used, 10%);
  }

  &.free {
    background-color: $disk_space_free;
    border-color: darken($disk_space_free, 10%);
  }
}

@keyframes needs_attention_keyframes {
  0% { @include button(header-hover); }
  100% { @include button(header-active) }
}

.nautilus-operations-button-needs-attention {
  animation: needs_attention_keyframes 2s ease-in-out;
}
.nautilus-operations-button-needs-attention-multiple {
  animation: needs_attention_keyframes 3s ease-in-out;
  animation-iteration-count: 3;
}

// Batch renaming dialog
.conflict-row.activatable {
  &, &:active {
    color: $error_fg_color;
    background-color: $error_color;
  }

  &:hover { background-color: lighten($error_color, 10%); }

  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
  }
}

//
// Floating Bar
//
.nautilus-window .floating-bar {
  padding: 1px;
  background-color: $selected_bg_color;
  color: $selected_fg_color;
  border-radius: $bt_radius $bt_radius 0 0;

  &.bottom.left { border-top-left-radius: 0; }
  &.bottom.right { border-top-right-radius: 0; }

  button {
    border: none;
    border-radius: $circular_radius;
    min-height: 0;
    min-width: 0;
    padding: 0;
    margin-right: $cont_padding;
    -gtk-icon-shadow: none;
    @extend %selected-button;
  }
}

//
// gnome-sound-recorder
//
stack {
  grid.vertical {
    scrolledwindow.frame,
    scrolledwindow.frame.emptyGrid { border: none; } // Removed ugly borders
  }
}

//
// Eog
//
eog-thumb-nav,
#eog-thumb-nav {

  scrolledwindow {
    &, &.frame {
      border-top: none;
    }
  }

  button {
    border-radius: $bt_radius;
    border-top: none;
  }
}

//
// Gnome Documents
//
.documents-scrolledwin.frame { border-width: 0; }

button.documents-load-more {
  border-width: 1px 0 0;
  border-radius: 0;
}

.documents-icon-bg {
  background-color: $selected_bg_color;
  color: $selected_fg_color;
  border-radius: $bt_radius;
}

.documents-collection-icon {
  background-color: transparentize($fg_color, 0.7);
  border-radius: $bt_radius;
}

button.documents-favorite:active,
button.documents-favorite:active:hover {
  color: lighten($selected_bg_color, 20%);
}

.documents-entry-tag {
  color: $selected_fg_color;
  background: $selected_bg_color;
  border-radius: $bt_radius;
  border-width: 0;
  margin: 2px;
  padding: 4px;

  &:hover {
    color: $selected_fg_color;
    background: lighten($selected_bg_color, 4%);
  }

  &:active {
    color: $selected_fg_color;
    background: darken($selected_bg_color, 4%);
  }

  &.button {
    box-shadow: none;
    border: none;
    background-color: transparent;
  }
}

.content-view.document-page {
  border-style: solid;
  border-width: 3px 3px 6px 4px;
  border-image: url("assets/thumbnail-frame.png") 3 3 6 4;
}

//
// Gnome Photos
//
.photos-entry-tag { @extend .documents-entry-tag; }

.photos-collection-icon { @extend .documents-collection-icon; }

.photos-fade-in {
  opacity: 1.0;
  transition: opacity 0.2s ease-out;
}

.photos-fade-out {
  opacity: 0.0;
  transition: opacity 0.2s ease-out;
}

//
// Gnome Contacts
//
window.background.csd {
  > overlay > grid.horizontal {
    > frame:dir(ltr) > border { // Removed ugly borders
      border-top-width: 0;
      border-left-width: 0;
      border-bottom-width: 0;
    }
  }
}

//
// Empathy
//
frame.sidebar.chat-sidebar > border {
  border-right: none;
}

frame.sidebar.chat-sidebar {
  frame.chat-status-area > border {
    border-style: none;
    border-top-style: solid;
  }
}

//
// Gnome-Usage
//

// FIXME: why was 'adwaita.css' used for all user-themes? :/
widget {
  &#PROCESSOR,
  &#MEMORY {
    list {
      row {
        margin: -1px; // kill ugly parent borders
        border: 1px solid $solid_borders_color;

        &.max {
          color: $osd_bg_color; // enforce dark foreground
          // FIXME: we can't override the salmon-pinky background
          // background-image: image($destructive_color);
          // border: 1px solid $destructive_color;
        }
      }

      // kill ugly separators
      separator.list {
        box-shadow: inset 0 0 0 1px $solid_borders_color;
      }
    }
  }

  &#STORAGE {
    list {
      margin: -1px; // kill ugly borders

      row.activatable {
        color: $alt_fg_color;
        &:hover,
        &:active { color: $alt_fg_color; }
      }

      // kill ugly separators
      separator.list {
        box-shadow: inset 0 0 0 1px $solid_borders_color;
      }
    }
  }
}

graph-switcher-button.toggle {
  color: $alt_fg_color;
  font-weight: 500;

  &:hover { // use opaque
    color: $fg_color;
    background-image: image(if($variant == 'light', rgba(black, 0.05), rgba(white, 0.03)));
  }
}

rg-graph.big {
  // FIXME: We need to re-define these properties to prevent weird
  // 'non-repeated' imaging behind the main graph.
  background-position: left top;
  background-origin: border-box;
  background-repeat: repeat;
}

box.speedometer {
  // FIXME: 'outter' meant 'outer'?
  // circular progress should be drawn with our $accent_color though,
  // damned adwaita.css picks @theme_selected_bg_color up.
  &-outter { opacity: 0.8; } // reduce alpha for our troughs

  &-content-area { // cover up meter troughs with selection colour
    box-shadow: 0 0 0 4px rgba($selected_bg_color, 0.2);
  }
}

//
// Gnome Builder
//
// TODO: Merge this with the upstream stylesheet
.gb-search-entry-occurrences-tag { background: none; }

window.org-gnome-Builder > menubar { // For wayland
  border: none;
  box-shadow: none;
  background: none;
}

workbench.csd > stack.titlebar:not(headerbar) {
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;

  headerbar {
    &,
    &:first-child,
    &:last-child { border-radius: $corner_radius $corner_radius 0 0; }
  }
}

editortweak .linked > entry.search:focus + .gb-linked-scroller { border-top-color: $selected_bg_color; }

layouttab {
  background-color: $base_color;
}

layout {
  border: 1px solid $borders_color;
}

eggsearchbar box.search-bar {
  border-bottom: 1px solid $borders_color;
}

pillbox {
  color: $selected_fg_color;
  background-color: $selected_bg_color;
  border-radius: $bt_radius;

  &:disabled label { color: transparentize($selected_fg_color, 0.5) }
}

docktabstrip {
  padding: 0 $cont_padding;

  background-color: $bg_color;
  border-bottom: 1px solid $borders_color;

  docktab {
    min-height: 28px;
    border: solid transparent;
    border-width: 0 1px;

    label { opacity: 0.5; }
    &:checked, &:hover { label { opacity: 1; }}

    &:checked {
      border-color: $borders_color;
      background-color: $base_color;
    }
  }
}

dockbin {
  border: 1px solid $borders_color;
}

dockpaned {
  border: 1px solid $borders_color;
}

dockoverlayedge {
  background-color: $bg_color;

  docktabstrip {
    padding: 0;
    border: none;
  }

  &.left-edge tab:checked,
  &.right-edge tab:checked {
    border-width: 1px 0;
  }
}

popover.messagepopover {
  &.background { padding: 0; }

  .popover-content-area { margin: 16px; }
  .popover-action-area {
    margin: 8px;

    button:not(:first-child):not(:last-child) { margin: 0 4px; }
  }
}

popover.popover-selector {
  padding: 0;

  list {
    row { padding: 5px 0; }
    row image { margin-left: 3px; margin-right: 10px; }
  }
}

button.dzlmenubuttonitem.check { // menuitem buttons
  label {
    color: $fg_color;
    &.dim-label { color: $fg_color; }
  }

  box > image { opacity: 0.87; }
}

entry.search.preferences-search {
  border: none;
  border-right: 1px solid $borders_color;
  border-bottom: 1px solid $borders_color;
  border-radius: 0;
}

preferences stacksidebar.sidebar {
  list { background-image: _solid($base_color); }

  list separator { background-color: transparent; }
}

devhelppanel entry:focus,
symboltreepanel entry:focus {
  border-color: $borders_color
}

button.run-arrow-button {
  min-width: 12px;
}

omnibar.linked > entry:not(:only-child) {
  border-style: solid;
  border-radius: $bt_radius;
  margin-left: 1px;
  margin-right: 1px;
}

gstyleslidein {
  #scale_box,
  #strings_controls,
  #palette_controls,
  #components_controls {
    button.toggle:checked { color: $fg_color; }
  }
}

configurationview {
  entry.flat { background: none; }
  list { border-width: 0; }
}

preferencesbin {
  spinbutton {
    border-radius: $bt_radius;
    border: 1px solid $borders_color;
    &:focus { border-color: $selected_bg_color; }

    entry, button { border: none; box-shadow: none; }
  }
}

//
// Gnome Tweak Tool ( Gnome tweaks )
//

// sidebar on gnome tweak
.tweak-categories {
  border-radius: 0 0 0 $corner_radius;

  .maximized &,
  .fullscreen &,
  .tiled &,
  .tiled-top &,
  .tiled-right &,
  .tiled-bottom &,
  .tiled-left & { border-radius: 0; }
}

window.background.csd {
  > hdyleaflet > box.vertical > stack.main-container,
  > leaflet > box.vertical > stack.main-container { // Right side
    border-bottom-right-radius: $corner_radius;
  }

  &.maximized, &.tiled, &.fullscreen {
    > hdyleaflet > box.vertical > stack.main-container {
      border-bottom-right-radius: 0;
    }

    // sidebar on gnome tweak
    .tweak-categories {
      border-radius: 0;
    }
  }
}

//
//  Gnome Control Center
//
window.background.csd {
  > box.horizontal > stack.background > widget {
    > scrolledwindow.frame {
      border: none; // Remove ubuntu-dock setting page border
    }
  }

  > leaflet > stack.background, // > 3.38.0
  > hdyleaflet > stack.background, // > 3.34.0
  > box.horizontal > stack.background {
    border-bottom-right-radius: $corner_radius;

    > widget {
      > box.vertical > box.vertical { // Gnome 3.34 Wallpaper setting
        > scrolledwindow > viewport.frame {
          border-bottom-right-radius: $corner_radius + 1px;
          > .view {
            background: none;
          }
        }
      }

      > scrolledwindow > viewport > clamp.medium {
        > box > box > box > frame > box > box.vertical {
          > separator {
            background: none;
            min-height: 2px;
          }
          > list { border-radius: 4px; }
          &:first-child:last-child > list { border-radius: $corner_radius; }
          &:first-child > list { border-radius: $corner_radius $corner_radius 4px 4px; }
          &:not(:first-child):last-child > list { border-radius: 4px 4px $corner_radius $corner_radius; }
        }
      }
    }

    button.osd.remove-button {
      padding: 0;
      margin: 6px;
      min-width: 24px;
      min-height: 22px;
      border: none;
      background-color: rgba(black, 0.45);
      color: rgba(white, 0.75);

      &:hover {
        background-color: rgba(black, 0.65);
        color: white;
      }

      &:active {
        background-color: rgba(black, 0.75);
        color: white;
      }
    }
  }

  > leaflet > box.vertical > scrolledwindow.view, // > 3.38.0
  > hdyleaflet > box.vertical > scrolledwindow.view, // > 3.34.0
  > box.horizontal > box.vertical > scrolledwindow.view { // > 3.25.90
    border-bottom-left-radius: $corner_radius;
  }

  &.maximized, &.tiled, &.fullscreen {
    > leaflet > stack.background, // > 3.38.0
    > hdyleaflet > stack.background, // > 3.34.0
    > box.horizontal > stack.background {
      border-bottom-right-radius: 0;

      > widget {
        > box.vertical > box.vertical { // Gnome 3.34 Wallpaper setting
          > scrolledwindow > viewport.frame {
            border-bottom-right-radius: 0;
          }
        }
      }
    }

    > leaflet > box.vertical > scrolledwindow.view, // > 3.38.0
    > hdyleaflet > box.vertical > scrolledwindow.view, // > 3.34.0
    > box.horizontal > box.vertical > scrolledwindow.view { // > 3.25.90
      border-bottom-left-radius: 0;
    }
  }
}

//
// Gnome-Software
//
button.round-button { // categories expander button
  // > 3.25.90, dropped from upstream CSS
  min-height: 28px;
  min-width: 28px;
  padding: 0;
}

window.background > box.vertical > searchbar { box-shadow: none; }
window.background > box.vertical > overlay > stack > widget > stack {

  // "Installed" stack
  > box.vertical > scrolledwindow > viewport.frame > widget > list {
    background-color: $bg_color; // override $base_color

    // use asymmetrical separators
    > separator {
      border-left: 100px solid transparent;
      border-right: 100px solid transparent;
    }
  }

  // "Updates" stack
  widget > box.vertical.app-list {
    // override $base_color
    background-image: image($bg_color);

    > box.vertical > list { background-color: $bg_color; }

    // use asymmetrical separators
    separator {
      border-left: 100px solid transparent;
      border-right: 100px solid transparent;
    }
  }
}

.category_page_header_filter_box {
  background-image: image($bg_color);
  border-image: linear-gradient(to bottom, $solid_borders_color, $solid_borders_color) 0 0 1 0 / 0 0 1px 0 stretch;

  button {
    color: $insensitive_fg_color;
    background-image: image($bg_color);

    &:hover { color: mix($fg_color, rgba($fg_color, 0.5), 50%); }
    &:checked { color: $fg_color; }
    &:disabled { color: rgba($insensitive_fg_color, 0.65); }
  }
}

.application-details-infobar {
  background-image: image($base_color);
  border-image: linear-gradient(to bottom, $solid_borders_color, $solid_borders_color) 1 1 1 1 / 1px 1px 1px 1px stretch;
}

// version >= 41.1
button.osd.featured-button-left,
button.osd.featured-button-right {
  background-image: image(rgba(white, 0.15));

  image {
    color: white;
  }
}

label {
  &.title-1 {
    color: $fg_color;
  }

  &:backdrop.title-1 { opacity: 0.5; }

  &.caption {
    color: rgba($fg_color, 0.65);
  }

  &:backdrop.caption { opacity: 0.5; }
}

//
// Gnome map
//
.maps-popover {
  button.radio.layer-radio-button {
    &:checked {
      box-shadow: 0 0 0 2px $selected_bg_color;
    }
  }
}

//
// Transmission
//
.tr-workarea undershoot,
.tr-workarea overshoot {
  border-color: transparent; // Remove black border on over- and undershoot
}

//
// Gnome Flashback
//
#gf-bubble,
#gf-osd-window,
#gf-input-source-popup,
#gf-candidate-popup {
  &, &.solid {
    color: lighten($osd_fg_color, 7%);
    background-color: $osd_bg_color;
    border: 1px solid darken($osd_bg_color, 8%);
    border-radius: $bt_radius;
  }

  levelbar {
    block {
      &.low, &.high, &.full {
        background-color: $selected_bg_color;
        border-color: $selected_bg_color;
      }

      &.empty { background-color: darken($osd_bg_color, 5%); }
    }

    trough { background: none; }
  }

  // FIXME still needs button styling
}

#gf-input-source {
  min-height: 32px;
  min-width: 40px;

  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    border-radius: $bt_radius;
  }
}

gf-candidate-box {
  label { padding: 3px; }

  &:hover,
  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    border-radius: $bt_radius;
  }
}

//
// Gnome-Logs
//

$em-base: 16px;

@function strip-units($value) {
  @return ($value / ($value * 0 + 1));
}

@function rem($pxval) {
  $pxval: strip-units($pxval);

  $base: $em-base;
  $base: strip-units($base);

  @return ($pxval / $base) * 1rem;
}

// titles inside the button!?
headerbar > button.flat.popup.title-menu-button.toggle {
  border-radius: $bt_radius;

  > grid {
    .title {
      margin: rem(-2.7px) 0;
      padding: rem(1.3px) rem(13.3px) 0;
      font-size: 90%;
    }

    .subtitle {
      margin: rem(-2.7px) 0;
      padding: 0 rem(13.3px) rem(1.3px);
      font-size: 80%;
    }
  }
}

window.background > box.vertical box.horizontal {
  list.categories { // side-pane
    background-color: $bg_color;
    border: none;
    color: $fg_color;

    row.activatable.category { // use side-bar styling
      // paddings in row were hard-coded with crazy large values...
      // padding: rem(2.7px) rem(8px) rem(4px);
      color: $fg_color;
      background-color: transparent;
      font-weight: 500;

      &:hover {
        color: $fg_color;
        background-color: rgba($fg_color, 0.08);
      }

      &:selected {
        color: $selected_fg_color;
        background-color: $selected_bg_color;

        label { color: $selected_fg_color; }
      }

      > label {
        padding-left: 0;
        padding-right: 0;
      }
    }
  }

  > box.vertical > scrolledwindow > viewport.frame > list { // right-pane
    > separator {
      background-color: transparent; // hide single-line separators

      &.compressed-rows-group-separator { // use opaque colour
        background-image : image($borders_color);
      }
    }

    // > 3.25.90
    row.event.activatable {
      color: $fg_color;
      transition-duration: 0.1s;

      &:hover,
      &:active { color: $fg_color; }

      label.compressed-entries-label { // hard-coded background-color?
        background-image: image($suggested_color);
        color: $selected_fg_color;
        font-weight: 700;
      }

      &.compressed-row {
        background-image: image(darken($bg_color, 3%));
        color: darken($fg_color, 20%);
        transition-property: opacity, // exclude background-color
                             border-image,
                             background-image,
                             box-shadow;
        &:hover {
          background-image: image(mix($fg_color, $bg_color, 5%));
          color: $fg_color;
        }

        &:active {
          &, &:focus {
            background-image: image(mix($fg_color,
                                        $bg_color, 10%));
            color: $fg_color;
            animation: none;
          }
        }

        &.popover-activated-row {
          background-image: image($selected_bg_color);
          color: $selected_fg_color;
        }

        &-header {
          background-image: image($base_color); // stop highlighting
          color: $selected_bg_color;

          &:hover {
            background-image: image(mix($selected_bg_color,
                                        $base_color, 5%));
          }

          &:active {
            &, &:focus {
              background-image: image(mix($selected_bg_color,
                                          $base_color, 10%));
              color: $selected_bg_color;
              animation: none;
            }
          }

          label.compressed-entries-label {
            background-image: image($selected_bg_color);
            color: $selected_fg_color;
            transition-duration: 0s;
          }
        }
      }
    }
  }
}

//
// Epiphany (Gnome Web)
//

$question_bg_color: #FFEA00;

// incognito-mode styling
//
// most of widget styling are hard-coded by ephy's stylesheet,
// but we should force using dark foregrounds at least...

//EphyWindow .floating-bar { // Epiphany overrides the floating-bar style, so reset it
//  color: $fg_color;
//}

headerbar.titlebar.incognito-mode {
  entry {
    @include entry(header-normal);

    &:focus { @include entry(header-focus); }
    &:disabled { @include entry(header-insensitive); }
  }
}

// reset inverted foreground colour
notebook > box > stack > box.vertical > paned.vertical > overlay {
  > .floating-bar { color: rgba($fg_color, 0.75); }
}

.background:not(.csd) > box.vertical > headerbar {
  // conflicts with .primary-toolbar styling?
  .linked > button.image-button { // = 'back/forward' button

  }
}

// overrides foregrounds for 3.24's ssd-mode
.background headerbar entry {
  &.starred,
  &.non-starred {
    @include entry(header-normal);

    &:focus { @include entry(header-focus); }
    &:disabled { @include entry(header-insensitive); }
  }

  // render yellow 'star' icon if bookmarked
  &.starred > image.right {
    color: darken($question_bg_color, 10%);
    &:hover,
    &:active,
    &:checked { color: $question_bg_color; }
  }
}

// popover for downloaded lists
popover.background:not(.emoji-picker) > box.vertical > scrolledwindow {
  // re-define background colours for GtkListBox
  > viewport.frame > list.background {
    background-color: transparent;

    > row.activatable {
      background-color: if($variant=='light', $bg_color, lighten($bg_color, 10%));
      color: rgba($fg_color, 0.85);
      border-radius: $bt_radius;
      border: 1px solid $borders_color;
      margin: 2px;

      &:hover { @include button(hover); }
    }
  }
}

// popover for bookmarks
popover.background:not(.emoji-picker) > box.vertical > stack > box.vertical {
  margin: 0;
  padding: 0;

  scrolledwindow > viewport.frame {
    border: 1px solid $borders_color;

    > list.background > row.activatable.bookmarks-row {
      background-color: rgba($base_color, 0.35);
      color: rgba($fg_color, 0.85);
      border-bottom: 1px dashed rgba($borders_color, 0.05);
      padding: 6px 0;
      margin: 0;

      &:hover,
      &:active,
      &:checked { color: $fg_color; background-color: rgba($fg_color, 0.05); }

      button.flat {
        min-width: 16px;
        min-height: 16px;
        padding: 4px; // Same as of image.sidebar-icon
        margin: 0 6px;
        border-radius: 100px;
      }
    }
  }
}

popover.background {
  > scrolledwindow > viewport.frame {
    > list > row.activatable {
      border-radius: $bt_radius;

      button.page-row-close-button {
        @extend %circular_button;
        margin: 3px 6px;
      }

      &:selected {
        button.page-row-close-button {
          @extend %selected-button;
        }
      }
    }
  }
}

// bookmark-tag flowbox-childs (almost hard-coded)
flowboxchild.bookmark-tag-widget {
  color: $bg_color; // unchecked
  font-weight: 500;

  label { margin-bottom: 2px; }

  &-selected { color: $selected_fg_color; } // checked
}

// 40.0
tabbox {
  background-color: $bg_color;
  box-shadow: inset 0 -1px $borders_color;

  > tab {
    padding: 2px 16px 4px 16px;
    min-width: 24px;
    min-height: 24px;
    border-radius: 0;
    border: none;
    color: $insensitive_fg_color;
    background-color: transparentize($bg_color, 1);

    &:not(:only-child) {
      &:first-child { margin-left: $cont_padding; }
      &:last-child { margin-right: $cont_padding; }
    }

    &:hover {
      color: mix($fg_color, rgba($fg_color, 0.5), 50%);
      transition: 200ms $ease-out-quad;
      box-shadow: inset 0 -2px rgba($selected_bg_color, 0.5);
    }

    &:checked {
      color: $fg_color;
      transition: 300ms $ease-out-quad;
      box-shadow: inset 0 -2px $selected_bg_color;
    }

    button {
      border-radius: 100%;
      min-height: 16px;
      min-width: 16px;
      padding: 0;
      margin: 4px 0;
      color: mix($bg_color, $fg_color, 35%);
      @extend %undecorated_button;

      &:hover {
        @extend %undecorated_button;
        color: lighten(red, 15%);
        background-color: darken($bg_color, 5%);
      }

      &:active {
        @extend %undecorated_button;
        color: $selected_bg_color;
        background-color: darken($bg_color, 8%);

        image { color: $selected_bg_color; }
      }
    }
  }
}

//
// gnome-system-monitor
//
window#gnome-system-monitor {
  > menubar { // For wayland
    border: none;
    box-shadow: none;
    background: none;
  }
}

//
// RhythmBox
//

// add top-border to inline-toolbar
.sidebar-paned .inline-toolbar.horizontal.sidebar-toolbar {
  box-shadow: inset 0 1px $borders_color;
  padding: 4px;
  background-color: darken($bg_color, 3%);
}

// tweak border and frame in alt-toolbar
window.csd > box.vertical > box.vertical,
window.solid-csd > box.vertical > box.vertical {
  > toolbar.horizontal {
    margin-top: -1px;
    border-top: 1px solid $borders_color;
    box-shadow: none;
    background-color: transparent;

    > toolitem > .linked > button,
    > toolitem > box.horizontal > button {
      min-height: 36px;
      min-width: 36px;
      padding: 0;
      margin-top: 8px;
      margin-bottom: 8px;
    }
  }

  > frame {
    margin-top: -1px;
    padding: 0;

    > border { border: none; }
  }
}

// hard-coded spacing depends on non-scalable unit,
// seems cover-art widget is the most biggest thing?
window.background > box.vertical > toolbar.primary-toolbar {
  > toolitem {
    > .linked > button.image-button.raised { // 'shuffle/repeat'
      min-height: 36px;
      min-width: 36px;
      padding: 0;
      margin: 0;

      > widget > box > image { padding: 0; }
    }

    button.flat.scale { // 'volume'
      min-height: 20px;
      min-width: 36px;
      padding: 0;
      margin-top: 8px;
      margin-bottom: 8px;
    }

    > box.horizontal:not(.linked) > button.toggle,
    > .linked > button:not(.toggle):not(.raised):not(.flat) {
      min-height: 28px;
      min-width: 28px;
      padding: 0;
      margin: 0;
    }
  }
}

//
// Gnome Clocks
//
window.background.csd.unified {
  > deck > deck > deck {
    > box.vertical > headerbar.titlebar.windowhandle {
      > viewswitchertitle > squeezer {
        > viewswitcher > box.horizontal {
          > button.radio {
            margin: 0;
            border-radius: 0;
            padding: 0 6px;
            border-width: 0;

            &:hover {
              box-shadow: inset 0 -1px $borders_color;
            }
          }
        }
      }
    }
  }
}

hdyviewswitcherbar > actionbar,
viewswitcherbar > actionbar { // Gnome 3.38
  background: none;
  border: none;
}

//
// Dialogs
//
dialog.background.csd {
  > box.dialog-vbox {
    > grid.horizontal {
      > scrolledwindow.frame { //removed ugly boders for nautilus batch renaming dialog
        border: none;

        > viewport.frame {
          border: none;
        }
      }

      > stack {
        > scrolledwindow.frame { // reset border for totem setting dialog
          border: 1px solid $borders_color;
        }
      }
    }

    > filechooser > actionbar {
      > revealer > box.horizontal > box.horizontal > box.horizontal {
        > combobox > .linked > button.combo {
          margin: 24px 6px 24px 120px;
          background-position: right bottom;
        }
      }
    }
  }

  headerbar.default-decoration { // Add box-shadow as bottom border for default-decoration headerbar of dialog
    box-shadow: inset 0 -1px $borders_color;
  }
}

//
// seahorse
//
window.background.csd {
  > paned.horizontal {
    > scrolledwindow.frame.sidebar {
      border-top: none;
    }
  }
}

//
// gtk3-widgets-tool
//
stack {
  > overlay {
    > frame {
      > scrolledwindow.frame { // removed double borders
        border-left-width: 0;
        border-right-width: 0;
      }
    }
  }
}

//
// Unified window (> = Gnome 40)
//

window.background.csd.unified {
  headerbar {
    // box-shadow: none;
    border-radius: $corner_radius $corner_radius 0 0;

    // &.selection-mode {
    //   box-shadow: none;
    // }
  }

  // > deck > box > headerbar {
  //   border-radius: $corner_radius $corner_radius 0 0;
  // }

  // ...and add it on the window itself
  // > decoration-overlay {
  //   box-shadow: inset 0 0 0 1px $highlight_color;
  // }

  &,
  > decoration,
  > decoration-overlay {
    border-radius: $corner_radius;
  }

  &.tiled,
  &.tiled-top,
  &.tiled-right,
  &.tiled-bottom,
  &.tiled-left,
  &.maximized,
  &.fullscreen {
    // > decoration-overlay {
    //   box-shadow: none;
    // }

    &,
    > decoration,
    > decoration-overlay {
      border-radius: 0;
    }
  }
}
