/*********
 * Tilix *
 *********/
overlay > revealer {
  &.left > scrolledwindow.frame,
  &.right > scrolledwindow.frame {
    border-style: none;
    box-shadow: $shadow-z16;
  }

  &.left > scrolledwindow.frame { margin-right: 32px; }

  &.right > scrolledwindow.frame { margin-left: 32px; }
}

.terminix-session-sidebar, // for backward compatibility
.tilix-session-sidebar { background-image: image($surface); }

.terminal-titlebar button { border-radius: 0; }

button.image-button.session-new-button { min-width: $medium-size - 4px; }

// Remove extra padding
notebook.tilix-background tab > box > stack { margin: -6px; }

button.flat.tilix-small-button {
  // NOTE: padding is hard-coded with:
  // padding: 2px 4px;
  min-height: $small-size - 2px * 2;
  min-width: $small-size - 4px * 2;
}


/**************
 * Terminator *
 **************/
.terminator-terminal-window {
  paned > separator { background-color: $background; }

  // this should be fixed by the upstream
  notebook.frame { border-style: none; }
}


/*************
 * Ubitquity *
 *************/
#live_installer .menubar progressbar trough {
  border-radius: 4px; // Adjust to hard-coded progress border-radius
  background-color: $titlebar-track-disabled;
}


/***********
 * Eclipse *
 ***********/
window.background > box.vertical > scrolledwindow > widget toolbar {
  padding: 2px;

  separator,
  button { margin: 2px; }

  button { border-radius: $corner-radius; }
}


/********
 * Meld *
 ********/

notebook.meld-notebook {
  background-color: $base;
  border-radius: 0 0 $window-radius $window-radius;

  > stack {
    background-color: $base;
    border-radius: 0 0 $window-radius $window-radius;
  }
}

.meld-notebook-child {
  background-color: $base;
  border-radius: 0 0 $window-radius $window-radius;
}

.meld-status-bar {
  background-color: transparent;

  button { border-radius: 0; }
}

/************
 * Chromium *
 ************/
window.background.chromium {
  background-color: $surface;

  // FIXME: There is no way to change the color of the toolbar buttons
  // toolbar button { color: $text-secondary; }

  // toolbar's border-bottom refers to button's border
  // FIXME: Chrome's button border ignores theme's alpha value :(
  entry,
  > button { border: 1px solid $solid-border; }

  > button {
    color: $primary;

    &:disabled { color: $text-secondary-disabled; }
  }

  menubar, headerbar { color: $titlebar-text-secondary; }

  menu {
    padding: 0;
    border: 1px solid $divider;
    box-shadow: none;

    menuitem { border-radius: 0; }
  }

  headerbar {
    padding: 0 $space-size * 2;
  }

  // Workaround for non-animatable buttons in headerbar
  // headerbar button:active { background-color: $overlay-active; }

  spinner { color: $primary; }

  // For text field
  textview.view { background-color: transparent; }

  // For prominent button, starred icon, etc.
  treeview.view.cell:selected:focus {
    background-color: $primary;
    color: on($primary);
  }

  // For table header
  treeview.view button {
    border: 1px solid $track;
    background-color: $base; // FIXME: This should not be necessary
    // color: $text-secondary;
  }
}

tooltip.background.chromium {
  color: white;
  background-color: rgba($tooltip, 1);
}


/***********
 * Firefox *
 ***********/
#MozillaGtkWidget {
  > widget {
    // For popover, entry in toolbar, etc.
    text { background-color: $surface; }

    // For selection, active tab indicator, etc.
    text:selected {
      // Use traditional selection style as workaround
      background-color: $primary;
      color: on($primary);
    }

    // For separators in bookmark toolbar
    > separator { color: $solid-border; }

    // avoid black border
    > scrollbar { background-clip: border-box; }

    // Emphasize toolbar's border-bottom
    > frame > border { border-color: $solid-border; }

    > entry,
    > button > button {
      border: 1px solid $solid-border;
      border-radius: $corner-radius;
      box-shadow: none;

      &:disabled { border-color: $track-disabled; }
    }

    > entry {
      min-height: 32px - 2px;
      background-color: $base;

      &:focus {
        border-color: $primary;
        box-shadow: inset 0 0 0 1px $primary;
      }

      &:disabled { background-color: $base-alt; }
    }

    > button > button {
      padding: 4px 8px;
      background-size: auto;

      &:hover { box-shadow: inset 0 0 0 9999px $overlay-hover; }

      &:active { background-image: image($overlay-active); }
    }

    // use 16px assets for hard-coded sizing
    > checkbutton > check { @extend %small_check; }

    > radiobutton > radio { @extend %small_radio; }

    > checkbutton > check,
    > radiobutton > radio {
      margin: 0;
      padding: 0;
    }

    // make check/radio visible regardless of whether the background is bright or dark
    > checkbutton > check:not(:checked):not(:indeterminate),
    > radiobutton > radio:not(:checked):not(:indeterminate) {
      color: $grey-600;

      &:hover, &:active { color: $grey-500; }

      &:disabled { color: rgba($grey-600, 0.5); }
    }
  }

  // remove ugly border around the menus
  menu { border: none; }
}

// for backward compatibility
#MozillaGtkWidget {
  > widget {
    > menubar {
      color: $titlebar-text-secondary;

      &:hover { color: $titlebar-text; }

      &:disabled { color: $titlebar-text-secondary-disabled; }
    }

    > frame { color: $solid-border; }
  }

  menu > separator { color: $solid-border; }
}

//
// plank
//

window.background:not(.csd) {
  > window > menu {
    menuitem {
      transition: none; // Fixed plank menu background issue
    }
  }
}

//
// Xapp popup
//

.background.popup.xapp-status-icon-menu-window {
  decoration {
    border-radius: $menu-radius;
    box-shadow: $shadow-z4;
  }
}

/************
 * Inkscape *
 ************/
#ToolboxCommon {
  > #AuxToolbox {
    #StyleSwatch { font-size: smaller; }

    #Kludge { padding: 0; }

    spinbutton,
    entry { min-height: 32px; }

    button:not(.up):not(.down) {
      min-height: 24px;
      min-width: 16px;
      padding: 4px 8px;
      border-radius: $corner-radius;
    }

    spinbutton button { border-width: 4px; }
  }

  > toolbar.vertical {
    margin-top: -4px;

    button {
      min-height: 24px;
      min-width: 24px;
      padding: 4px;
      border-radius: $corner-radius;
    }
  }
}

#CanvasTable {
  button {
    min-height: 16px;
    min-width: 16px;
    padding: 0;
  }

  #HorizontalScrollbar { border-top: 1px solid $divider; }

  #VerticalScrollbar {
    &:dir(ltr) { border-left: 1px solid $divider; }

    &:dir(rtl) { border-right: 1px solid $divider; }
  }
}

#Canvas_and_Dock {
  frame > border { border: none; }

  // each canvases' titlebar
  widget > widget {
    > button.flat {
      min-height: 16px;
      min-width: 16px;
      padding: 4px;
    }

    > box.horizontal image { padding: 4px; }
  }

  // vertical dock buttons
  box.horizontal > box.vertical > button.flat {
    min-height: 16px;
    min-width: 24px;
    padding: 8px 4px;
  }
}


/***********
 * Synapse *
 ***********/
box.vertical > widget > widget:selected { @extend %selected_items; }

/*********
 * Pamac *
 *********/
window.background.csd {
  > box.vertical > overlay > stack > box.vertical > box.horizontal {
    > revealer > stack {
      &, // Search left side
      > scrolledwindow > viewport.frame, // Installed left side
      > box.vertical > stack > scrolledwindow > viewport.frame { // Browse left side
        > list {
          border: none;
          border-radius: 0;

          > row.activatable {
            @extend %sidebar_row;
          }
        }
      }
    }

    > box.vertical > stack > scrolledwindow > viewport.frame { // App lists
      > list {
        border: none;
        border-radius: 0;

        > row.activatable {
          &:first-child, &:last-child { border-radius: 0; }
        }
      }
    }
  }

  > box.vertical > overlay > stack > scrolledwindow.frame {  // >= 10.0
    border: none;

    > viewport.frame > box.vertical > stack > scrolledwindow {
      border-top: 1px solid $divider;
    }
  }
}

//
// LibreOffice
//

window.background:not(.solid-csd):not(.csd) {
  // reserved area at the most-right side of GtkMenuBar
  > grid.horizontal > grid.horizontal {
    box-shadow: inset 0 -1px $titlebar-divider;
    background-color: $titlebar;

    // > button.flat.small-button { // 'close' button
    // }
  }

  > grid.horizontal > widget > widget {
    viewport.frame > box > box > box > grid toolbar {
      background: none;
      border: none;
      padding: 3px;
    }

    > scrolledwindow > viewport.frame {
      background: $base; // Not Use ?

      > grid > box.horizontal {
        background: $base;

        > box.vertical > toolbar {
          background: $base;
        }
      }

      > grid > box.vertical {
        > toolbar {
          background: none;
          border: none;
          padding: 6px;
        }
      }

      > grid > box.horizontal > #combobox.linked,
      > grid > box.horizontal > grid.horizontal > box.horizontal { background: $base; }
    }

    toolbar.small-button {
      border: none;
    }
  }

  // for 'Notebookbar' toolbar
  > notebook:not(.frame) {
    border: 1px solid $border; // unset borders
    border-left: none;
    border-right: none;
    background-color: $base;
    box-shadow: none;

    > stack {
      border: none;
      box-shadow: none;
      background-color: $base;
    }

    > header {
      box-shadow: none;
      margin: 0;
      border: none;
      background-color: transparent;

      > tabs > tab { margin: 3px 0 0; }
    }
  }
}

#combobox {
  // background-color: $base;

  // > entry { }
  // > button { }
}

#gtk-combobox-popup-window {
  scrolledwindow.frame { border: none; }

  treeview.view {
    &:selected, &:hover {
      background-image: image($primary);
      &, label { color: on($primary); }
    }
  }
}

//
// Cinnamon setting
//

stack > scrolledwindow > viewport > box {
  > box > box,
  > stack > box > revealer > box > box,
  > stack > box > stack > box > box,
  > revealer > box > stack > box > box {
    > frame.view {
      &, > border {
        border-radius: $corner-radius;
      }

      > box > box {
        > list {
          background-color: transparent;
        }

        &:first-child > list {
          &, > row {
            border-radius: $corner-radius $corner-radius 0 0;
          }
        }

        &:last-child > list {
          &, > row {
            border-radius: 0 0 $corner-radius $corner-radius;
          }
        }

        &:only-child > list {
          &, > row {
            border-radius: $corner-radius;
          }
        }
      }
    }
  }

  > box > box,
  > stack > box > box,
  > box > revealer > box > box {
    > frame.view {
      &, > border {
        border-radius: $corner-radius;
      }

      > box > box {
        > list {
          background-color: transparent;
        }

        &:first-child > list {
          &, > row {
            border-radius: $corner-radius $corner-radius 0 0;
          }
        }

        &:last-child > list {
          &, > row {
            border-radius: 0 0 $corner-radius $corner-radius;
          }
        }

        &:only-child > list {
          &, > row {
            border-radius: $corner-radius;
          }
        }
      }

      > box > revealer {
        > box > box > list {
          background-color: transparent;
        }

        &:first-child > box > box > list {
          &, > row {
            border-radius: $corner-radius $corner-radius 0 0;
          }
        }

        &:last-child > box > box > list {
          &, > row {
            border-radius: 0 0 $corner-radius $corner-radius;
          }
        }
      }
    }
  }

  > box > widget > overlay > scrolledwindow > viewport > grid > box {
    > frame {
      &, > border {
        border-radius: $corner-radius;
      }

      > list {
        border-radius: $corner-radius;

        > row {
          &:first-child {
            border-radius: $corner-radius $corner-radius 0 0;
          }

          &:last-child {
            border-radius: 0 0 $corner-radius $corner-radius;
          }
        }
      }
    }
  }

  > stack > box > box > frame.view {
    &, > border {
      border-radius: $corner-radius;
    }

    frame.view {
      background-color: transparent;
    }

    > box > scrolledwindow > viewport.frame > box {
      > list {
        border-radius: $corner-radius;

        > row {
          &:first-child {
            border-radius: $corner-radius $corner-radius 0 0;
          }

          &:last-child {
            border-radius: 0 0 $corner-radius $corner-radius;
          }
        }
      }
    }
  }

  > widget > box > frame.view {
    &, > border,
    > widget > box > box > list {
      border-radius: $corner-radius;
    }
  }

  #c_box {
    notebook {
      background-color: transparent;
    }
  }
}

// Waybar
#workspaces button {
  min-width: 20px;
}

//
// KiCad / SLADE
//

window.background:not(.csd):not(.solid-csd) {
  > button:not(:hover):not(:active):not(:checked):not(:disabled):not(.flat) { // Why this ?
    background-color: $base-alt;
  }
}
