/* -----------------------------------------------------------------------------

   ComboViewer / Viewer / FlipBook

----------------------------------------------------------------------------- */

#ComboViewerPanel {

  & Toolbar {

    border-bottom: 1 solid @accent; // accent line against viewport

    &::separator:horizontal {

      // workaround for first tool button

      // which helps with alignment

      margin: 0 0 0 2;

    }

    & QToolButton {

      margin: 2 0 3 2;

    }

  }

}

#ComboViewerToolOptions {

  border-bottom: 1 solid @accent; // accent line against viewport & ToolBar

}

#ComboViewer,

#ViewerPanel,

FlipBook {

  & #ToolBarContainer {

    background-color: transparent;

    border-top: 2 solid @accent;

    border-bottom: 1 solid @accent;

    padding-right: -1; // hides right border on #ScrollRightButton when

                       // fps slider is disabled

  }

}

#flipCustomize {

  // options menu

  &:extend(.button-tool all);

  margin-left: 3;

  &::menu-button {

    background-color: transparent;

    width: 35;

  }

  &::menu-arrow {

    image: none;

  }

}

QToolBar#FlipConsolePlayToolBar {

  &::separator:horizontal {

    margin: 0 3;

  }

  & QToolButton {

    margin-top: 2;

    margin-bottom: 2;

    height: 16;

    padding-left: 1;

    padding-right: 1;

  }

}

#ViewerFpsSlider {

  background-color: transparent;

  background-image: url('@{img-url}/@{slider-groove-img}');

  background-position: center center;

  background-repeat: repeat-x;

  border: 0;

  height: 19;

  margin: 0 3 0 37;

  max-width: 300;

  min-width: 0;

  &::sub-line:horizontal {

    subcontrol-origin: absolute;

    background-color: @button-bg-color;

    border: 1 solid @button-border-color;

    border-top-left-radius: 2;

    border-bottom-left-radius: 2;

    height: 16;

    left: -33;

    width: 14;

  }

  &::add-line:horizontal {

    subcontrol-position: left;

    background-color: @button-bg-color;

    border: 1 solid @button-border-color;

    border-top-right-radius: 2;

    border-bottom-right-radius: 2;

    left: 18;

    height: 16;

    image-position: center center;

    width: 13;

  }

  &::sub-line:horizontal,

  &::add-line:horizontal {

    &:hover {

      &:extend(.Button:hover all);

    }

    &:pressed {

      &:extend(.Button:pressed all);

    }

    &:disabled {

      &:extend(.Button:disabled all);

    }

  }

  &::handle {

    &::horizontal {

      @size: 9;

      background-color: @slider-handle-bg-color;

      border: 1 solid @slider-handle-border-color;

      border-radius: 2;

      margin: 2 0 3 0;

      min-width: @size;

      width: @size;

      max-width: @size;

    }

  }

}

FlipSlider {

  qproperty-PBHeight: 15;

  // slider

  qproperty-PBOverlay: url('@{img-url}/@{flipslider-img}');

  qproperty-PBColorMarginLeft: 1;

  qproperty-PBColorMarginTop: 2;

  qproperty-PBColorMarginRight: 1;

  qproperty-PBColorMarginBottom: 2;

  // marker

  qproperty-PBMarker: url('@{img-url}/@{flipmarker-img}');

  qproperty-PBMarkerMarginLeft: 3;

  qproperty-PBMarkerMarginRight: 3;

  qproperty-notStartedColor: @flipslider-notstarted-color;

  qproperty-startedColor: @flipslider-started-color;

  qproperty-baseColor: @flipslider-base-color;

  qproperty-finishedColor: @flipslider-finished-color;

}

Ruler {

  qproperty-ParentBGColor: @viewer-ruler-bg-color;

  qproperty-ScaleColor: @viewer-ruler-scale-color;

}

#RulerToolOptionValues {

  color: @viewer-ruler-ToolOptionValues-color;

}