/************
 * Toolbars *
 ************/
%toolbar {
  padding: 0px;
  background-color: $headerbar_bg_color;
  color: $headerbar_fg_color;

  &:backdrop {
    background-color:$backdrop_headerbar_bg_color;
    color:$backdrop_headerbar_fg_color;
  }
}

toolbar {
  @extend %toolbar;

  // on OSD
  .osd & { box-shadow:none; background-color: transparent; }
  
  // Buttons
  button {
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: none;
    box-shadow: none;
    -gtk-icon-shadow: none;
    margin: 0;
    padding: 10px;
    text-shadow: none;

    &.suggested-action,
    &.text-button,
    &.menu-button,
    &.image-button,
    &.linked,
    &.flat {
      background-color: transparent;
      background-image: none;
      border-radius: 0px;
      border: none;
      box-shadow: none;
      -gtk-icon-shadow: none;
      margin: 0;
      padding: 10px;
      text-shadow: none;
      color: $headerbar_fg_color;

      &:backdrop {
        background-color: transparent;
        background-image: none;
        text-shadow: none;
        color: $backdrop_headerbar_fg_color;
      }

      &:hover { 
        background-image:none;
        background-color: transparentize(black, 0.85);
        color:lighten($headerbar_fg_color, 10%);
        box-shadow:none;
        text-shadow:none;
      }

      &:disabled {
        color: $backdrop_headerbar_fg_color;
        -gtk-icon-effect: dim;
      }
    }

    label,
    image {
      color: $headerbar_fg_color;

      &:disabled,
      &:backdrop {
        color: $backdrop_headerbar_fg_color;
        -gtk-icon-effect: dim;
      }
    }

    &:focus,
    &:hover { 
      background-image:none;
      background-color: transparentize(black, 0.85);
      color:lighten($headerbar_fg_color, 10%);
      box-shadow:none;
      text-shadow:none;
    }

    &:backdrop {
      background-color: transparent;
      background-image: none;
      color: $backdrop_headerbar_fg_color;

      image {
        color: $backdrop_headerbar_fg_color;
      }
    }

    &:active,
    &:checked {
      border-radius: 0px;

      text-shadow: none;
      -gtk-icon-shadow: none;
      
      box-shadow: inset 0 -2px 0 0 $headerbar_fg_color;

      background-color: transparent;
      background-image: none;
      color: $headerbar_fg_color;

      &:backdrop {
        background-color: transparent;
        background-image: none;
        color: $backdrop_headerbar_fg_color;

        box-shadow: inset 0 -2px 0 0 $backdrop_headerbar_fg_color;
      }

      &:focus,
      &:hover { 
        background-image:none;
        background-color: transparentize(black, 0.85);
        color:lighten($headerbar_fg_color, 10%);
        box-shadow: inset 0 -2px 0 0 $headerbar_fg_color;
      }
    }

    &:disabled,
    &:disabled:backdrop {
      color: $backdrop_headerbar_fg_color;
      background-color: transparent;
      background-image: none;

      image,
      image {
        -gtk-icon-effect: dim;
      }
    }


    // Menu Button
    &.menu-button {
      .menu {
        .menuitem {
          label {
            color: $fg_color;
            &:disabled { color: $insensitive_fg_color; }
          }
          .separator { color: $borders_color;}
          &:hover { label {color: $selected_fg_color;}}
        }
      }
    }
  }

  .separator {
    color: transparent;
    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; }

}


/*******************
 * Inline Toolbars *
 *******************/

%inline-toolbar,
.inline-toolbar {
  -GtkWidget-window-dragging: true;

  background-color: darken($bg_color, 2%);
  color: $fg_color;

  border: 1px solid $borders_color;
  border-top-width: 0;
  border-radius: 0 0 5px 5px;

  box-shadow: inset 0 -1px 1px -2px transparentize(black, 0.5);
  
  padding: 0px;

  &:backdrop {
    background-color: darken($bg_color, 5%);
  }

  // buttons
  button {
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: none;
    box-shadow: none;
    -gtk-icon-shadow: none;
    margin: 0;
    padding: 10px;
    text-shadow: none; 

    &.suggested-action,
    &.text-button,
    &.menu-button,
    &.image-button,
    &.linked,
    &.flat  {
      border: none;
      background: none;
      text-shadow: none;
      box-shadow: none;
      background-color: transparent;
      color: $fg_color;
      border-radius: 0px;
      padding: 10px;
    }

    &:focus,
    &:active {
      font:bold;
      color: $fg_color; 
      text-shadow: none;
      box-shadow: none;
      background-color: transparentize(black, 0.95);

      &:backdrop {
        border: none;
        background-color: transparent;
        color: $backdrop_fg_color;
      }
    }

    &:hover {
      background-color: transparentize(black, 0.95);
      text-shadow: none;
      color: $fg_color;
      box-shadow: none;
    }

    &:disabled {
      background:none;
      background-color: transparent;
      color: transparentize($fg_color,0.5);
    }

    &:backdrop {
      border: none;
      background:none;
      background-color: transparent;
      color: $backdrop_fg_color;
    }  

    label,
    image {
      color: $fg_color;

      &:disabled,
      &:backdrop {
        color: $backdrop_fg_color;
        -gtk-icon-effect: dim;
      }
    }
  }

  .entry,
  entry {
    background: none;
    color: $fg_color;
    border-radius: 0px;
    border: none;
    box-shadow: none;

    &.image {
      color: $fg_color;

      &.left{
        padding-right: 6px;
      }
    }

    &:backdrop {
      color: $backdrop_fg_color;
    }

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


%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;
  }
}


// search-bar
searchbar,
.search-bar {
  @extend %darkbar;
  @extend %inline-toolbar;

  padding:3px 0px;
  border-width: 0;
  border-radius:0;

}

// location-bar
.location-bar {
  @extend %darkbar;
  @extend %inline-toolbar;

  border-width: 0 0 1px;
  padding: 3px;
}