%toolbar {
  button:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
    &.arrow-button,
    &.image-button,
    &.image-text-button {
      @extend %button_basic_flat;
    }
  }

  &.osd button:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
    &:focus:focus-visible {
      outline-color: $osd_focus_color;
    }
  }

  menubutton:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
    &.image-button > button {
      @extend %button_basic_flat;
    }
  }

  .linked button:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
    &.arrow-button,
    &.image-button,
    &.image-text-button {
      @extend %button_basic_raised;
    }
  }

  menubutton.raised > button:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
    &.arrow-button,
    &.image-button,
    &.image-text-button {
      @extend %button_basic_raised;
    }
  }

  menubutton.suggested-action,
  menubutton.destructive-action,
  menubutton.opaque {
    > button:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
      @extend %opaque_button;

      color: inherit;
      background-color: transparent;
    }
  }

  splitbutton {
    // Specificity bump
    > separator.vertical {
      margin-top: 6px;
      margin-bottom: 6px;
    }

    &:not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
      @extend %flat_split_button;
    }
  }

  // add vertical margins to common widgets on toolbars to avoid them spanning
  // the whole height
  entry,
  spinbutton,
  splitbutton,
  separator:not(.sidebar),
  button,
  menubutton,
  scalebutton {
    margin-top: 6px;
    margin-bottom: 6px;
  }

  // Reset margins for buttons inside menubutton
  menubutton > button,
  splitbutton > button,
  splitbutton > menubutton,
  scalebutton > button {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  switch {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  // Reset styles for popovers
  popover {
    button:not(.flat):not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
      &.arrow-button,
      &.image-button,
      &.image-text-button {
        @extend %button_basic_raised;
      }
    }

    menubutton:not(.flat):not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque) {
      &.image-button > button {
        @extend %button_basic_raised;
      }
    }

    entry,
    spinbutton,
    splitbutton,
    separator:not(.sidebar),
    button,
    menubutton,
    scalebutton,
    switch {
      margin-top: 0;
      margin-bottom: 0;
    }

    &.menu separator:not(.sidebar) {
      margin-top: 6px;
      margin-bottom: 6px;
    }
  }
}

.toolbar {
  padding: 0 6px;
  border-spacing: 6px;

  @extend %toolbar;

  // stand-alone OSD toolbars
  &.osd {
    padding: 6px 12px;
    border-radius: $card_radius;
  }
}

/****************
 * GtkSearchBar *
 ****************/

searchbar {
  &:not(.inline) > revealer > box {
    background-color: $headerbar_bg_color;
    color: $headerbar_fg_color;
    box-shadow: inset 0 -1px $headerbar_border_color;
    padding-bottom: 1px;

    &:backdrop {
      background-color: $headerbar_backdrop_color;
      transition: $backdrop_transition;
    }
  }

  > revealer > box {
    padding: 0px 6px;
    border-spacing: 6px;

    @extend %toolbar;

   .close {
      min-width: 18px;
      min-height: 18px;
      padding: 4px;
      border-radius: 50%;
      @extend %button_basic_flat;
    }
  }
}

/****************
 * GtkActionBar *
 ****************/

actionbar > revealer > box {
  padding: 1px 6px 0px 6px;
  box-shadow: inset 0 1px $border_color;
  @extend %toolbar;

  &, > box.start, > box.end {
    border-spacing: 6px;
  }
}

/**************
 * GtkInfoBar *
 **************/

infobar {
  > revealer > box {
    padding: 8px 8px 9px 8px;
    border-spacing: 12px;
    box-shadow: inset 0 -1px $border_color;
  }

  &.action:hover > revealer > box {
    background-image: image(gtkalpha(currentColor, .05));
  }

  &.action:hover:active > revealer > box {
    background-image: image(gtkalpha(currentColor, .1));
  }

  @each $i_type, $i_color in (info, $accent_bg_color),
                             (question, $accent_bg_color),
                             (warning, $warning_bg_color),
                             (error, $error_bg_color) {
    &.#{$i_type} > revealer > box {
      background-color: gtkmix($i_color, $window_bg_color, 30%);
      color: $window_fg_color;
    }
  }

 .close {
    min-width: 18px;
    min-height: 18px;
    padding: 4px;
    border-radius: 50%;
    @extend %button_basic_flat;
  }
}
