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

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

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

.terminix-session-sidebar { background-image: image($lighter_bg_color); }

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


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

  separator,
  button { margin: 2px; }

  button { border-radius: 2px; }
}


/***********
 * Firefox *
 ***********/
window.background:not(.csd) {
  // for the bookmark toolbar's separators
  > widget > separator { color: rgba(0, 0, 0, 0.2); }

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

  // use 16px assets for hard-coded sizing
  > window.background > menu > menuitem > check,
  > widget > checkbutton > check {
    & {
      border-radius: 2px;
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.png")));
    }

    &:checked {
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.png")));
    }

    &:indeterminate {
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.png")));
    }
  }

  > window.background > menu > menuitem > radio,
  > widget > radiobutton > radio {
    & {
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.png")));
    }

    &:checked {
      border-image: none;
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.png")));
    }

    &:indeterminate {
      -gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")),
                              -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.png")));
    }
  }
}

// Firefox now uses this for selected items
text:selected { @extend %selected_items; }


/***********
 * Synapse *
 ***********/
box.vertical > widget > widget:selected { background-color: $primary_color; }