@charset "UTF-8";

/*****************
 * Notebooks and *
 * Tabs          *
 *****************/
/*************
  * Notebooks *
  *************/
notebook {
  &.frame {
    border: none;
    padding: 0px;
    box-shadow: inset 0px 0px 0px 1px gtk("@borders");
  }

  > header {
    padding: 0px;
    border: none;
    background-color: gtk("@theme_bg_color");
    //box-shadow: inset 0 -1px gtk("@borders");

    &.top {
      box-shadow: inset 0 -1px gtk("@borders"); // border
      &:backdrop {
        box-shadow: inset 0 -1px gtk("@unfocused_borders");
      }
    }
    &.bottom {
      box-shadow: inset 0 1px gtk("@borders");
      &:backdrop {
        box-shadow: inset 0 1px gtk("@unfocused_borders");
      }
    }
    &.right {
      box-shadow: inset 1px 0 gtk("@borders");
      &:backdrop {
        box-shadow: inset 1px 0 gtk("@unfocused_borders");
      }
    }
    &.left {
      box-shadow: inset -1px 0 gtk("@borders");
      &:backdrop {
        box-shadow: inset -1px 0 gtk("@unfocused_borders");
      }
    }
    &:backdrop {
      background-color: gtk("@theme_unfocused_bg_color");
    }

    tabs {
      margin: 0px;
    }

    @each $_tab, $_border, $_radius in (top, bottom, 3px 3px 0px 0px),
      (bottom, top, 0px 0px 3px 3px), (left, right, 3px 0px 0px 3px),
      (right, left, 0px 3px 3px 0px)
    {
      &.#{$_tab} {
        > tabs {
          > tab {
            padding: 4px 6px;
            border: 1px solid gtkalpha(gtk("@theme_fg_color"), 0.2);
            background-color: gtkalpha(gtk("@theme_fg_color"), 0.2);
            border-radius: #{$_radius};
            border-#{$_border}-color: transparent;
            &:hover,
            &.prelight-page {
              background-color: gtkalpha(gtk("@theme_selected_bg_color"), 0.2);
              border-color: gtkalpha(gtk("@theme_selected_bg_color"), 0.2);
            }
            &:checked {
              border-color: gtk("@borders");
              border-#{$_border}-color: gtk("@theme_bg_color");
              background-color: gtk("@theme_bg_color");
              &:backdrop {
                border-color: gtk("@unfocused_borders");
                border-#{$_border}-color: gtk("@theme_unfocused_bg_color");
                background-color: gtk("@theme_unfocused_bg_color");
              }
            }
          }
        }
      }
    }

    @each $_tab, $_border, $_shadow1 in (top, right, -3px 0px 0px 0px),
      (bottom, right, -3px 0px 0px 0px), (left, bottom, 0px -3px 0px 0px),
      (right, bottom, 0px -3px 0px 0px)
    {
      &.#{$_tab} {
        > tabs {
          > tab {
            &.reorderable-page {
              border-width: 3px;
              border-style: solid;
              border-color: transparent;
              background-color: gtk("@theme_bg_color");
              background-clip: padding-box;
              border-#{$_border}-width: 1px;
              border-#{$_border}-color: gtk("@borders");
              box-shadow: inset #{$_shadow1} gtk("@theme_bg_color");
              &:hover,
              &.prelight-page {
                box-shadow: inset
                    0px -3px
                    0px
                    0px
                    gtkalpha(gtk("@theme_selected_bg_color"), 0.2),
                  inset $_shadow1 gtk("@theme_bg_color");
              }
              &:checked {
                box-shadow: inset
                    0px -3px
                    0px
                    0px
                    gtk("@theme_selected_bg_color"),
                  inset $_shadow1 gtk("@theme_bg_color");
                &:backdrop {
                  background-color: gtk("@theme_unfocused_bg_color");
                  border-color: transparent;
                  border-#{$_border}-color: gtk("@unfocused_borders");
                  box-shadow: none;
                }
              }
              &:backdrop {
                background-color: gtk("@theme_unfocused_bg_color");
                border-#{$_border}-color: gtk("@unfocused_borders");
                box-shadow: none;
              }
            }
          }
        }
      }
    }

    &.top > tabs > arrow {
      @extend %notebook_vert_arrows;

      border-top-style: none;
    }

    &.bottom > tabs > arrow {
      @extend %notebook_vert_arrows;

      border-bottom-style: none;
    }

    @at-root %notebook_vert_arrows {
      margin-left: -5px;
      margin-right: -5px;
      padding-left: 4px;
      padding-right: 4px;

      &.down {
        -gtk-icon-source: -gtk-icontheme($arrow_left);
      }

      &.up {
        -gtk-icon-source: -gtk-icontheme($arrow_right);
      }
    }

    &.left > tabs > arrow {
      @extend %notebook_horz_arrows;

      border-left-style: none;
    }

    &.right > tabs > arrow {
      @extend %notebook_horz_arrows;

      border-right-style: none;
    }

    @at-root %notebook_horz_arrows {
      margin-top: -5px;
      margin-bottom: -5px;
      padding-top: 4px;
      padding-bottom: 4px;

      &.down {
        -gtk-icon-source: -gtk-icontheme($arrow_up);
      }

      &.up {
        -gtk-icon-source: -gtk-icontheme($arrow_down);
      }
    }

    > tabs > arrow {
      @extend %button_basic;

      @extend %button_basic.flat;

      min-height: 16px;
      min-width: 16px;
      border-radius: 0;

      &:hover:not(:active):not(:backdrop) {
        background-clip: padding-box;
        background-image: none;
        background-color: transparentize(white, 0.7);
        border-color: transparent;
        box-shadow: none;
      }

      &:disabled {
        @include button(undecorated);
      }
    }

    // colors the button like the label, overridden otherwise
    button.flat {
      padding: 0;
      margin: 4px;
      // FIXME: generalize .small-button?
      min-width: 12px;
      min-height: 12px;
      border: 0px solid;
      border-radius: 50%;
      color: gtk("@theme_bg_color");
      background-color: gtk("@borders");
      background-image: none;
      &:hover {
        background-color: $error_color;
      }
      &:active {
        background-color: $error_color;
      }

      &:backdrop {
        background-color: gtk("@unfocused_borders");
        color: gtk("@theme_unfocused_bg_color");
      }
    }
  }

  > stack:not(:only-child) {
    // the :not(:only-child) is for "hidden" notebooks
    background-color: transparent;
    border-style: solid;
    border-color: gtk("@borders");
    border-width: 0px;
  }
}
