// floating status bar
.floating-bar {
  @extend %osd;

  // @extend .toolbar.osd;

  min-height: 32px;
  padding: 0;
  border-style: solid solid none;
  border-width: 1px;
  border-color: $borders_color;
  border-radius: (2px + 1px) (2px + 1px) 0 0;
  background-color: $base_color;
  background-clip: $extra_background_clip;
  transition: $longer_transition, border-width 0;

  &.left {
    margin-right: 8px - 1px;
    border-left-style: none;
    border-top-left-radius: 0;
  }

  &.right {
    margin-left: 8px - 1px;
    border-right-style: none;
    border-top-right-radius: 0;
  }

  button {
    min-height: 24px;
    min-width: 24px;
    margin: 4px;
    padding: 0;
  }
}


/************
 * Nautilus *
 ************/
.nautilus-window,
.nautilus-window notebook,
.nautilus-window notebook > stack {
  background: $base_color;
}

.nautilus-desktop-window,
.nautilus-desktop-window notebook,
.nautilus-desktop-window notebook > stack {
  background: transparent;
}

.nautilus-canvas-item {
  // border-radius: 2px;
}

.nautilus-canvas-item.dim-label,
.nautilus-list-dim-label {
  // @extend .dim-label;
}

.nautilus-canvas-item.dim-label:selected,
.nautilus-list-dim-label:selected {
}

.nautilus-desktop.nautilus-canvas-item {
  // background-color: scale-alpha(#000000, $lower_opacity);
  color: $inversed_fg_color;
  text-shadow: $z-depth-1;
}

.nautilus-desktop.nautilus-canvas-item:selected {
  // color: $inversed_fg_color;
  text-shadow: none;
}

.nautilus-circular-button {
  @extend %circular_button;
}

// Toolbar
@keyframes needs_attention_keyframes {
  0% {background-color: transparent; }
  50% {background-color: $track_color; }
  100% {background-color: transparent; }
}

.nautilus-operations-button-needs-attention {
  color: $accent_color;
  animation: needs_attention_keyframes 2s $standard_curve;
}

.nautilus-operations-button-needs-attention-multiple {
  color: $accent_color;
  animation: needs_attention_keyframes 2s $standard_curve;
  animation-iteration-count: 2;
}

.disk-space-display {
  // border-style: solid;
  // border-width: 2px;
}

.disk-space-display.unknown {
  background-color: $warning_color;
}

.disk-space-display.used {
  background-color: $primary_color;
}

.disk-space-display.free {
  background-color: $track_color;
  color: $disabled_fg_color;
}

// View
.nautilus-list-view .view {
  // border-bottom: 1px solid $borders_color;
}

// Hide superfluous treeview drop target indication
.nautilus-list-view .view.dnd {
  // border-style: none;
}

// Libgd tag entries in the search. Sadly it requires this copy pasted css style.
// https://git.gnome.org/browse/libgd/tree/libgd/gd-tagged-entry-default.css
.documents-entry-tag {
  // min-height: 24px;
  margin: 3px -2px 3px 8px;
  padding: 0 8px;
  border-radius: $circular_radius;
  box-shadow: none;
  background-color: $primary_color;
  color: $inversed_fg_color;

  &:hover { box-shadow: $z-depth-1; }
}

.documents-entry-tag.button {
  // @extend %simple_flat_button;

  // min-height: 24px;
  // min-width: 24px;
  margin: 0 -2px;
  padding: 4px;
  border-radius: $circular_radius;
  box-shadow: none;
  color: $secondary_inversed_fg_color;

  &:hover, &:active { color: $inversed_fg_color; }
}

// Workaround for the double border of the searchbar since we use a revealer which
// always allocates at least 1 pixel
.nautilus-window searchbar { border-top: 1px solid $borders_color; }

.nautilus-window .searchbar-container { margin-top: -1px; }


/*********
 * gedit *
 *********/
.open-document-selector-treeview:hover {
}

.open-document-selector-treeview:selected:hover {
}

/* Only normal state is handle */
.open-document-selector-name-label {
  font-weight: bold;
}

/* Only normal state is handle */
.open-document-selector-path-label {
  color: gtkalpha(currentColor, $hint_opacity);
  font-size: smaller;

  // @extend .dim-label;
}

.gedit-document-panel {
  background-color: $lighter_bg_color;
}

.gedit-document-panel row:selected {
}

.gedit-document-panel-group-row,
.gedit-document-panel-group-row:hover {
  border-top: 1px solid gtkalpha(currentColor, 0.3);
}

.gedit-document-panel-group-row:first-child,
.gedit-document-panel-group-row:first-child:hover {
  border-top: 0px;
}

/* Try to look as the notebook tab close button */
.gedit-document-panel row button.flat {
  margin-top: 8px;
  margin-bottom: 8px;

  @extend %small_button;
}

.gedit-side-panel-paned statusbar {
  border-top: 1px solid $borders_color;
}

.gedit-search-slider {
  margin: 4px 4px 8px;

  .gedit-search-entry-occurrences-tag {
    all: unset;
    padding: 0 4px;
    color: gtkalpha(currentColor, $hint_opacity);
  }

  entry {
    &:dir(ltr) {
      margin-right: -$medium_size * 2;
      padding-right: $medium_size * 2 + 8px;

      .gedit-search-entry-occurrences-tag { margin-right: -8px; }
    }

    &:dir(rtl) {
      margin-left: -$medium_size * 2;
      padding-left: $medium_size * 2 + 8px;

      .gedit-search-entry-occurrences-tag { margin-left: -8px; }
    }

    &.error ~ button {
      color: $secondary_inversed_fg_color;

      &:hover, &:active { color: $inversed_fg_color; }

      &:disabled { color: $disabled_secondary_inversed_fg_color; }
    }
  }

  button {
    @extend %simple_flat_button;

    &:dir(ltr),
    &:dir(rtl) { @extend %linked; }
  }
}

// Yeah this is ugly
.gedit-search-slider .linked:not(.vertical) > entry,
notebook > stack:not(:only-child) revealer .gedit-search-slider .linked:not(.vertical) > entry {
  border-radius: 2px;
}


/**************
 * Tweak Tool *
 **************/
// the sidebar
.tweak-categories {
  // padding: 4px 0;
  // background-color: shade(@theme_bg_color, 0.99);
  background-image: image($lighter_bg_color);

  // hide separators
  separator {
    min-width: 0;
    min-height: 0;
    background: transparent;
  }
}

.tweak-category {
  // padding: 10px;
}

// the container and tweaks in a group
.tweak-group {
  // background-color: rgba(0, 0, 0, 0);
}

.tweak {
  padding: 3px;
  // padding-top: 3px;
  // background-color: rgba(0, 0, 0, 0);
}

.tweak:hover {
  // background-color: rgba(0, 0, 0, 0);
}

.tweak.title {
  // padding-top: 10px;

  &:hover { box-shadow: none; }
}

.tweak-titlebar-left:dir(ltr),
.tweak-titlebar-right:dir(rtl) {
  // border-top-right-radius: 0;
}

.tweak-titlebar-right:dir(ltr),
.tweak-titlebar-left:dir(rtl) {
  // border-top-left-radius: 0;
}

// individual tweak theme changes
.tweak.title#title-theme {
  // padding-top: 3px;
}

.tweak#hinting,
.tweak#text-scaling-factor {
  // padding-top: 20px;
}

.tweak-group-white,
.tweak-white,
.tweak-white:hover {
  // background-color: white;
  background-image: image($base_color);
}

.tweak-startup,
.tweak-startup:hover {
  // background-color: lighter(shade(@theme_bg_color, 0.9));
  background-image: image($base_color);
}

.tweak-group-startup {
  // background-color: @view_separators;
  background-image: image($base_color);
  border: 1px solid $borders_color;
}

// NOT WORKING 
.main-container {
  // padding: 20px;
}


/***********
 * Builder *
 ***********/
//
// Titlebar adjustments for workbench
//
// This is needed due to our placement of headerbar inside of a
// stack. We were seeing black edges around the header bar, and
// improper radius on the headerbar.
//
workbench stack.titlebar {
  padding: 0;
  // box-shadow: none;
}

workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
  border-radius: 2px 2px 0 0;
  // box-shadow: none;
}

perspectiveswitcher {
  background-color: $bg_color;
}

perspectiveswitcher button {
}

perspectiveswitcher button:hover {
}

perspectiveswitcher button:checked {
  color: $primary_color;
}

//
// Layout tab and tab bar tweaks
//
// The following makes the layout stack header look similar to a tab bar.
//
layouttabbar {
  border-bottom: 1px solid $borders_color;
  background-color: $bg_color;
}

layouttabbar button { @extend %flat_button; }

layouttabbar > box > button {
  margin: (40px - $medium_size) / 2 0;
  // border-radius: 0;
}

layouttab {
  margin: 0 8px; // not working
  border-style: none solid;
  border-width: 1px;
  border-color: $borders_color;
  box-shadow: inset 0 -2px $primary_color;
  background-color: $base_color;
}

layouttab separator.vertical {
  margin: 8px 4px;
}

layouttab button {
  &.text-button, &.image-button, & {
    margin-top: 8px;
    margin-bottom: 8px;
    padding: 0 4px;
  }
}

//
// Close button styling for layouttab.
//
layouttab > box > button.close {
  border-radius: $circular_radius;
}

layout {
  border: 1px solid $borders_color;
  -PnlDockBin-handle-size: 1;
}

entry.search-missing {
  background-color: $error_color;
  color: $inversed_fg_color;
}

// tweak icons for treeviews
workbench treeview.image { color: gtkalpha(currentColor, $hint_opacity); }
workbench treeview.image:selected { color: $tertiary_inversed_fg_color; }

dockbin {
  border: 1px solid $borders_color;
  -PnlDockBin-handle-size: 1;
}

dockpaned {
  border: 1px solid $borders_color;
}

eggsearchbar box.search-bar {
  padding: 0 8px;
  border-bottom: 1px solid $borders_color;
  background-color: $bg_color;
}

docktabstrip {
  padding: 0 8px;
  border-bottom: 1px solid $borders_color;
  background-color: $bg_color;
}

docktab {
  transition: $longer_transition;
  min-height: $small_size;
  min-width: $small_size;
  margin-bottom: -1px;
  padding: $container_padding 6px;

  outline-offset: -6px;

  border-width: 1px;         // for reorderable tabs
  border-color: transparent; //

  color: $secondary_fg_color;
  font-weight: 500;

  &:hover {
    box-shadow: inset 0 -2px $track_color;
    color: $fg_color;
  }

  &:checked {
    animation: tab_ripple_effect $longer_duration * 3 $deceleration_curve;
    box-shadow: inset 0 -2px $primary_color;
    color: $fg_color;
  }
}

dockoverlayedge {
  background-color: $bg_color;
}

dockoverlayedge docktabstrip {
  padding: 0;
  border: none;
}

dockoverlayedge.left-edge docktab:checked {
  border-right-color: $primary_color;
  border-bottom-color: transparent;
}

dockoverlayedge.right-edge docktab:checked {
  border-left-color: $primary_color;
  border-bottom-color: transparent;
}

pillbox {
  background-color: $bg_color;
  border-radius: 2px;
}

layoutpane entry.search {
  @extend %entry.flat;

  box-shadow: inset 0 -1px $borders_color;
  background-color: $base_color;
}

editortweak entry.search {
  @extend %entry.flat;

  margin-bottom: -1px;
  box-shadow: none;
}

// work around some gtk padding issue
filechooser actionbar button.combo {
  // padding: 0;
}

// styling for editor search
frame.gb-search-frame {
  // background-image: linear-gradient(shade(@theme_bg_color,1.05), @theme_bg_color);
  // padding: 6px;
  // border-style: solid;
  // border-color: @borders;
  // border-left-width: 1px;
  // border-right-width: 1px;
  // border-bottom-width: 1px;
  // border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

frame.gb-search-frame border {
  // border: none;
}

// styling for NautilusFloatingBar
.floating-bar {
  // padding: 2px;
  // background-color: @theme_base_color;
  // border-width: 1px;
  // border-style: solid solid none;
  // border-color: @borders;
  // border-radius: 3px 3px 0 0;
}

.floating-bar.bottom.left { // axes left border and border radius
  // border-left-style: none;
  // border-top-left-radius: 0;
}

.floating-bar.bottom.right { // axes right border and border radius
  // border-right-style: none;
  // border-top-right-radius: 0;
}

.floating-bar:backdrop {
  // background-color: @theme_unfocused_base_color;
  // border-color: @unfocused_borders;
}

.floating-bar button {
  // padding: 4px;
}

.gb-search-entry-occurrences-tag {
  // color: shade (@theme_unfocused_fg_color, 0.8);
  // border: 0px;
  // margin: 2px;
  // padding: 2px;
  box-shadow: none;
  background-color: transparent;
}

//
// For our pattern of popover with lists (and close buttons).
//
popover list row {
  // padding: 6px;
}

popover list row button {
  // background: transparent;
  // border: none;
  // box-shadow: none;
  // margin: 0;
  // padding: 0;
  // opacity: 0.25;
}

popover list row:selected button,
popover list row:selected button:hover {
  // color: @theme_selected_fg_color;
}

popover list row button:hover {
  // opacity: 1;
}

//
// Tweaks for the editortweak popover in the editor.
//
editortweak button {
  // padding: 0 6px 0 6px;
}

editortweak list row {
  // padding: 0;
}

//
// Keep search bar and layouttab height in sync.
//
docktabstrip {
  min-height: 39px;
}

layouttabbar > box {
  // min-height: 39px;
}

eggsearchbar > revealer > box {
  // min-height: 39px;
}

eggsearchbar entry {
  // min-height: 24px;
}

//
// Pillbox is used to render "languages" in the greeter.
//
pillbox {
  // border-radius: 3px;
}

//
// Styling in the genesis (create project) perspective.
//
genesisperspective stack > box:first-child list row {
  // padding: 10px;
  // border-bottom: 1px solid alpha(@borders, 0.2);
}

genesisperspective stack > box:first-child list row:last-child {
  // border-bottom: none;
}

//
// Greeter tweaks
//
// The following tweaks the greeter perspective by adding
// separator lines to the list box.
//
greeter list row {
  // border-bottom: 1px solid alpha(@borders, 0.2);
}

greeter list row:last-child {
  // border-bottom: none;
}

greeter frame border {
  // border-color: alpha(@borders, 0.6);
}

//
// Global search results styling
//
// The following tweaks the sizing of listbox rows in the
// global search results to have a bit more padding and
// row separators after each line. Additionally, we tweak
// the selection color to ensure it has priority.
//
omnisearchdisplay omnisearchgroup omnisearchrow {
  // background: transparent;
  // padding: 9px 12px 9px 12px;
  // border-bottom: 1px solid alpha(@borders, 0.2);
}

omnisearchdisplay omnisearchgroup omnisearchrow:last-child {
  // border-bottom: none;
}

omnisearchdisplay omnisearchgroup omnisearchrow:selected {
  // background-color: @theme_selected_bg_color;
  // color: @theme_selected_fg_color;
}

//
// Preferences styling
//
// The following tweaks our preferences styling in the
// preferences perspective, including groups, rows,
// sidebar, etc.
//
workbench preferences stacksidebar list {
  // border-right: 1px solid alpha(@borders, 0.4);
  // background-color: @theme_base_color;
}

workbench preferences preferencesgroup list row {
  // padding: 10px;
  // border-bottom: 1px solid alpha(@borders, 0.2);
}

workbench preferences preferencesgroup list row:last-child {
  // border-bottom: none;
}

workbench preferences preferencesgroup list entry {
  // background: none;
  // min-height: 0px;
  padding-top: 8px;
  padding-bottom: 8px;
}

//
// Perspectives switcher
//
// The following tweaks the left-most sidebar containing
// the list of perspectives.
//
perspectiveswitcher {
  // border-right: 1px solid alpha(@borders, 0.5);
}

perspectiveswitcher button {
  // background: transparent;
  // border-radius: 0;
  // border: none;
  // box-shadow: none;
  // padding: 6px;
}

// Workaround Adwaita adding borders we don't want
textview border.left {
  // background: none;
}

treeview.dim-label {
  // color: alpha(currentColor, 0.5);
}


/***********
 * Firefox *
 ***********/
menubar {
  color: $secondary_inversed_fg_color;

  &:hover { color: $inversed_fg_color; }
}

separator { color: $borders_color; }

/* FIXME: not working */
window.background > widget > check,
window.background > widget > radio {
  margin: 0;
  padding: 0;
}

window.background > widget > radio:checked {
  -gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")),
                          -gtk-recolor(url("assets/radio-checked-symbolic.png")));
  border-image: none;
}


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


/*********
 * Unity *
 *********/
// Decorations
UnityDecoration {
  -UnityDecoration-extents: 32px 0 0 0;
  -UnityDecoration-input-extents: 8px;

  -UnityDecoration-shadow-offset-x: 0;
  -UnityDecoration-shadow-offset-y: 3px;
  -UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
  -UnityDecoration-active-shadow-radius: 18px;
  -UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
  -UnityDecoration-inactive-shadow-radius: 6px;

  -UnityDecoration-glow-size: 8px;
  -UnityDecoration-glow-color: $primary_color;

  -UnityDecoration-title-indent: 4px;
  -UnityDecoration-title-fade: 32px;
  -UnityDecoration-title-alignment: 0.0;
}

UnityDecoration.top {
  padding: 0 4px;
  border-style: none;
  border-radius: 2px 2px 0 0;
  box-shadow: inset 0 1px $secondary_highlight_color;
  background-color: $headerbar_color;
  // color: $inversed_fg_color;
}

UnityDecoration.top:backdrop {
  // color: $secondary_inversed_fg_color;
}

UnityDecoration.left,
UnityDecoration.right {
}

UnityDecoration.bottom {
}

UnityDecoration.menubar.menuitem:hover,
UnityDecoration.menubar .menuitem *:hover {
  box-shadow: inset 0 -2px $primary_color;
  background-color: transparent;
}

.background:not(.csd) .header-bar {
  border-radius: 0;
  box-shadow: none;
}

SheetStyleDialog.unity-force-quit {
  // background-color: $bg_color;
}

// Panel Style
UnityPanelWidget,
.unity-panel {
  background-color: $headerbar_color;
  background-image: image($headerbar_color);
  // color: $inversed_fg_color;
}

UnityPanelWidget:backdrop,
.unity-panel:backdrop {
  // color: $secondary_inversed_fg_color;
}

.unity-panel.menubar,
.unity-panel .menubar {
}

.unity-panel.menuitem,
.unity-panel .menuitem {
}

.unity-panel.menubar.menuitem:hover,
.unity-panel.menubar .menuitem *:hover {
  box-shadow: inset 0 -2px $primary_color;
  background-color: transparent;
}

@keyframes playbackmenuitem_spinner {
  to { -gtk-icon-transform: rotate(1turn); }
}

.menu IdoPlaybackMenuItem.menuitem:active {
  -gtk-icon-source: -gtk-icontheme("process-working-symbolic");
  animation: playbackmenuitem_spinner 1s infinite linear;
  color: $primary_color;
}