@mixin overshoot($p, $t:normal, $c:w_color(text)) {
//
// overshoot
//
// $p: position
// $t: type
// $c: base color
//
// possible $p values:
// top, bottom, right, left
//
// possible $t values:
// normal, backdrop
//

  $_small_gradient_length: 5%;
  $_big_gradient_length: 100%;

  $_position: center top;
  $_small_gradient_size: 100% $_small_gradient_length;
  $_big_gradient_size: 100% $_big_gradient_length;

  @if $p==bottom {
    $_position: center bottom;
    $_linear_gradient_direction: to top;
  }

  @else if $p==right {
    $_position: right center;
    $_small_gradient_size: $_small_gradient_length 100%;
    $_big_gradient_size: $_big_gradient_length 100%;
  }

  @else if $p==left {
    $_position: left center;
    $_small_gradient_size: $_small_gradient_length 100%;
    $_big_gradient_size: $_big_gradient_length 100%;
  }

  $_small_gradient_color: $c;
  $_big_gradient_color: $c;

  @if $c==w_color(text) {
    $_small_gradient_color: darken($border_color, 10%);
    $_big_gradient_color: w_color(text);

    @if $t==backdrop { $_small_gradient_color: backdrop($border_color); }
  }

  $_small_gradient: -gtk-gradient(radial,
                                  $_position, 0,
                                  $_position, 0.5,
                                  to($_small_gradient_color),
                                  to(transparentize($_small_gradient_color, 1)));

  $_big_gradient: -gtk-gradient(radial,
                                $_position, 0,
                                $_position, 0.6,
                                from(transparentize($_big_gradient_color, 0.93)),
                                to(transparentize($_big_gradient_color, 1)));

  @if $t==normal {
    background-image: $_small_gradient, $_big_gradient;
    background-size: $_small_gradient_size, $_big_gradient_size;
  }

  @else if $t==backdrop {
    background-image: $_small_gradient;
    background-size: $_small_gradient_size;
  }

  background-repeat: no-repeat;
  background-position: $_position;

  background-color: transparent; // reset some properties to be sure to not inherit them somehow
  border: none;                  //
  box-shadow: none;              //
}

/* Decouple the font of context menus from their entry/textview */
.touch-selection,
.context-menu {
  font: initial;
}

.monospace {
  font: Monospace;
}

// This is used by GtkScrolledWindow, when content is touch-dragged past boundaries.
// This draws a box on top of the content, the size changes programmatically.
.overshoot {
  &.top {
    @include overshoot(top);
    &:backdrop { @include overshoot(top, backdrop); }
  }
  &.bottom {
    @include overshoot(bottom);
    &:backdrop { @include overshoot(bottom, backdrop); }
  }
  &.left {
    @include overshoot(left);
    &:backdrop { @include overshoot(left, backdrop); }
  }
  &.right {
    @include overshoot(right);
    &:backdrop { @include overshoot(right, backdrop); }
  }
}
