// Granite Widgets

//
// Overlay Bar
//
.overlay-bar {
  background-color: $selected_bg_color;
  border-color: $selected_bg_color;
  border-radius: 2px;
  padding: 3px 6px;
  margin: 3px;

  GtkLabel { color: $selected_fg_color; }
}

//
// Thin Pane Separator
//
GraniteWidgetsThinPaned {
  background-color: transparent;
  background-image: none;
  margin: 0;
  border-left: 1px solid $borders_color;
  border-right: 1px solid $borders_color;

}

// avoid borders when a viewport is
// packed into a Static Notebook, or Popover
GraniteWidgetsPopOver .frame,
GraniteWidgetsStaticNotebook .frame {
  border: none;
}

//
// Help Button
//
.help_button {
    border-radius: 100px;
    padding: 3px 9px;
}

//
// Secondary Toolbars
//
.secondary-toolbar.toolbar {
  padding: 3px;
  border-bottom: 1px solid $borders_color;

  .button { padding: 0 3px 0 3px; }
}

//
// Bottom Toolbars
//
.bottom-toolbar.toolbar {
  padding: 5px;
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: $borders_color;
  background-color: $bg_color;

  .button { padding: 2px 3px 2px 3px; }
}

//
// Sidebar & Source List
//
.source-list {
  -GtkTreeView-horizontal-separator: 1px;
  -GtkTreeView-vertical-separator: 6px;
}

.source-list,
.source-list.view {
  background-color: $bg_color;
  color: $fg_color;
  -gtk-icon-style: regular;
}

.source-list.category-expander {
  color: transparent;
}

.source-list.view:prelight {
  background-color: lighten($bg_color, 5%);
}

.source-list.view:selected,
.source-list.view:prelight:selected,
.source-list.view:selected:focus,
.source-list.category-expander:hover {
  color: $selected_fg_color;
  background-color: $selected_bg_color;
}

.source-list .scrollbar.trough,
.source-list .scrollbars-junction {
  border-image: none;
	border-color: transparent;
	background-color: $bg_color;
	background-image: none;
}

.source-list.badge,
.source-list.badge:prelight,
.source-list.badge:selected,
.source-list.badge:selected:focus,
.source-list.badge:prelight:selected {
  background-image: none;
  background-color: $selected_bg_color;
  color: $selected_fg_color;
  border-radius: 10px;
  padding: 0 6px;
  margin: 0 3px;
  border-width: 0;
}

.source-list.badge:selected,
.source-list.badge:selected:focus,
.source-list.badge:prelight:selected {
  background-color: $selected_fg_color;
  color: $selected_bg_color;
}

//
// Expander
//
.source-list.category-expander {
    color: $fg_color;
    -gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
    -GtkTreeView-expander-size: 16;
}

.source-list.category-expander,
.source-list.category-expander:backdrop {
    color: transparent;
    border: none;
}

.source-list.category-expander:checked {
    -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}

//
// Notebook
//
.dynamic-notebook .notebook tab {
  .button > GtkImage { padding: 0; }
}

//
// Welcome
//
GraniteWidgetsWelcome {
  background-color: $base_color;
}

GraniteWidgetsWelcome GtkLabel {
  color: mix($fg_color, $bg_color, 50%);
  font: open sans 11;
  text-shadow: none;
}

GraniteWidgetsWelcome .h1,
GraniteWidgetsWelcome .h3 {
  color: transparentize($fg_color, 0.2);
}

//
// Help Button
//
.help_button {
  border-radius: 0;
}

//
// Popover
//
GraniteWidgetsPopOver {
  -GraniteWidgetsPopOver-arrow-width: 21;
  -GraniteWidgetsPopOver-arrow-height: 10;
  -GraniteWidgetsPopOver-border-radius: 2px;
  -GraniteWidgetsPopOver-border-width: 1;
  -GraniteWidgetsPopOver-shadow-size: 12;

  border: 1px solid transparentize(black, 0.7);
  margin: 0;
}

.popover_bg {
  background-image: linear-gradient(to bottom, $base_color);
  border: 1px solid transparentize(black, 0.7);
}

GraniteWidgetsPopOver .sidebar.view,
GraniteWidgetsPopOver * {
  background-color: transparent;
}

//
// Xs Entry
//
GraniteWidgetsXsEntry.entry { padding: 4px; }

//
// Text Styles
//
.h1 { font: open sans 24px; }
.h2 { font: open sans light 18px; }
.h3 { font: open sans 11px; }
.h4,
.category-label {
    color: mix($bg_color, $text_color, 30%);
    font-weight: 600;
}

.h4 {
    padding-bottom: 6px;
    padding-top: 6px;
}

GtkListBox .h4{
	padding-left: 6px;
}