@charset "UTF-8";

/********
 * Misc *
 ********/

/****************
* Print dialog *
*****************/
printdialog {
  paper {
    color: gtk("@theme_fg_color");
    border: 1px solid gtk("@borders");
    background: white;
    padding: 0;

    &:backdrop {
      color: gtk("@theme_unfocused_fg_color");
      border-color: gtk("@unfocused_borders");
      background: gtk("@print_paper_backdrop");
    }
  }

  .dialog-action-box {
    margin: 12px;
  }
}

/**********
* Frames *
**********/
frame > border,
.frame {
  box-shadow: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  border: 1px solid gtk("@borders");

  &.flat {
    border-style: none;
  }

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

actionbar > revealer > box {
  padding: 6px;
  border-top: 1px solid gtk("@borders");

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

scrolledwindow {
  viewport.frame {
    // avoid double borders when viewport inside scrolled window
    border-style: none;
  }

  junction {
    // the small square between two scrollbars
    border-color: transparent;
    background-color: transparent;
    background-image: none;
  }
}

//vbox and hbox separators
separator {
  background: gtk("@borders");
  min-width: 1px;
  min-height: 1px;
}

/*************
* Expanders *
*************/

expander {
  arrow {
    min-width: 16px;
    min-height: 16px;
    -gtk-icon-source: -gtk-icontheme($arrow_right);
    &:dir(rtl) {
      -gtk-icon-source: -gtk-icontheme("go-next-rtl-symbolic");
    }
    &:hover {
      color: gtkshade(gtk("@theme_fg_color"), 1.3);
    } //only lightens the arrow
    &:checked {
      -gtk-icon-source: -gtk-icontheme($arrow_down);
    }
  }
}

/*********
* Paned *
*********/

paned {
  > separator {
    min-width: 1px;
    min-height: 1px;
    -gtk-icon-source: none; // defeats the ugly default handle decoration
    border-style: none; // just to be sure
    background-color: transparent;
    // workaround, using background istead of a border since the border will get rendered twice (?)
    background-image: image(gtk("@borders"));
    background-size: 1px 1px;

    //&:selected { background-image: image($selected_bg_color); } // FIXME is this needed?

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

    &.wide {
      min-width: 5px;
      min-height: 5px;
      background-color: gtk("@theme_bg_color");
      background-image: image(gtk("@borders")), image(gtk("@borders"));
      background-size: 1px 1px, 1px 1px;

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

  &.horizontal > separator {
    background-repeat: repeat-y;

    &:dir(ltr) {
      margin: 0 -8px 0 0;
      padding: 0 8px 0 0;
      background-position: left;
    }
    &:dir(rtl) {
      margin: 0 0 0 -8px;
      padding: 0 0 0 8px;
      background-position: right;
    }

    &.wide {
      margin: 0;
      padding: 0;
      background-repeat: repeat-y, repeat-y;
      background-position: left, right;
    }
  }

  &.vertical > separator {
    margin: 0 0 -8px 0;
    padding: 0 0 8px 0;
    background-repeat: repeat-x;
    background-position: top;

    &.wide {
      margin: 0;
      padding: 0;
      background-repeat: repeat-x, repeat-x;
      background-position: bottom, top;
    }
  }
}

/*********************
* Spinner Animation *
*********************/

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

spinner {
  background-image: none;
  opacity: 0; // non spinning spinner makes no sense
  -gtk-icon-source: -gtk-icontheme("process-working-symbolic");
  &:checked {
    opacity: 1;
    animation: spin 1s linear infinite;
    &:disabled {
      opacity: 0.5;
    }
  }
}
