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

   Main

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

QWidget {

  background-color: @bg;

  color: @text-color;

  &:disabled {

    color: @text-color-disabled;

  }

}

QFrame {

  border: 0;

  margin: 0;

  padding: 0;

  alternate-background-color: @text-color;

}

QToolTip,

#helpToolTip {

  background-color: @tooltip-bg-color;

  border: 1 solid @tooltip-border-color;

  color: @tooltip-text-color;

  padding: 1 1;

}

#DockSeparator,

QMainWindow::separator,

QSplitter::handle {

  background-color: @dock-bg-color;

  height: 4;

  width: 4;

}

#TDockPlaceholder {

  background-color: @dock-placeholder-color;

}

TPanel {

  background-color: @dock-bg-color;

}

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

   Topbar

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

#TopBar {

  background: @topbar-bg-color;

  border: 0;

  border-bottom: 1 solid @topbar-border-color;

  & #EditToolLockButton {

    background: @topbar-bg-color;

    spacing: 0;

    &::indicator {

      // inherits from #ToolOptions window

      background: none;

      border: none;

      padding-left: 0;

      padding-right: 0;

    }

  }

}

#TopBarTabContainer {

  background-color: @topbar-bg-color;

  margin-bottom: 1; // Required for #TopBar border-bottom to show

}

#StackedMenuBar {

  border: 0;

  margin: 0;

  padding: 0;

}

QMenuBar {

  background-color: @topbar-bg-color;

  border: 0;

  &::item {

    background-color: @topbar-bg-color;

    border-left: 1 solid @topbar-bg-color; // Helps to align with QMenu

    margin: 0;

    padding: 3 5 3 5;

    &:selected {

      .hl-color-secondary;

    }

    &:pressed {

      .hl-color;

    }

  }

}

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

   Workspaces

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

#TopBarTab {

  margin: 0;

  padding: 0;

  background-color: transparent;

  &::tab {

    &:extend(.tab-flat all);

    border-top: 1 solid @tab-border-color;

    margin: 0 0 -1 0;

    padding: 2 8 3 8;

    &:selected {

      background-color: @hl-bg-color;

    }

    &:first {

      border-left: 1 solid @tab-border-color;

    }

  }

  & QToolButton {

    border-left: 2 solid @accent;

    border-top: 1 solid @accent;

    border-right: 1 solid @accent;

    border-bottom: 0;

    margin-left: -1;

    margin-top: 0;

  }

}

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

   Menu

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

QMenu {

  background-color: @menu-bg-color;

  border: 1 solid @menu-border-color;

  color: @menu-text-color;

  padding: 2 0;

  &::item {

    border: 0;

    padding: 3 28 3 14;

    &:selected {

      background-color: @menu-item-bg-color-selected;

      color: @menu-item-text-color-selected;

    }

    &:checked {

      color: @menu-checkbox-text-color-selected;

      &:selected {

        background-color: @menu-item-bg-color-selected;

        color: @menu-item-text-color-selected;

      }

    }

    &:disabled {

      background: none;

      color: @text-color-disabled;

      &:selected {

        color: @text-color-disabled; /* fix for disabled indicator */

      }

    }

  }

  &::separator {

    border-top: 1 solid @menu-separator-color;

    height: 0;

    margin: 2 0;

  }

  &::icon {

    border-radius: 2;

    position: absolute;

    left: 7;

    padding: 0;

    margin: 0;

    qproperty-icon: url('@{img-url}/none');

    &:checked {

      background-color: @menu-icon-checked-bg-color;

      border: 1 solid @menu-icon-checked-border-color;

    }

  }

  &::indicator {

    &:non-exclusive {

      &:extend(.CheckBox::indicator all);

    }

    &:exclusive {

      &:extend(.RadioButton::indicator all);

    }

    margin-left: 8;

  }

}

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

   Titlebars

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

TPanelTitleBar {

  background-color: @title-bg-color;

  border-bottom: @title-border-width solid @title-border-color;

  height: 18;

  min-height: 18;

  qproperty-TitleColor: @title-text-color;

  qproperty-ActiveTitleColor: @title-text-color-active;

  // QSS only works when pixmaps are set to 'none'

  qproperty-BorderPixmap: url('none');

  qproperty-ActiveBorderPixmap: url('@{img-url}/@{title-active-border-pixmap}');

  qproperty-FloatBorderPixmap: url('none');

  qproperty-FloatActiveBorderPixmap: url('@{img-url}/@{title-active-border-pixmap}');

}

TPanelTitleBarButton {

  qproperty-PressedColor: @title-button-pressed-color;

  qproperty-FreezeColor: @title-button-freeze-color;

  qproperty-PreviewColor: @title-button-preview-color;

  qproperty-OverColor: @title-button-rollover-color;

}

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

   Scrollbars

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

QAbstractScrollArea::corner {

  background-color: @scrollbar-bg-color;

}

QScrollBar {

  background-color: @scrollbar-bg-color;

  border: 0;

  &:horizontal {

    height: 15;

    margin: 0;

  }

  &:vertical {

    margin: 0;

    width: 15;

  }

  &::handle {

    border: @scrollbar-handle-border-size solid @scrollbar-handle-border-color;

    border-radius: @scrollbar-handle-radius;

    &:horizontal,

    &:vertical {

      &:hover {

        background-color: @scrollbar-handle-bg-color-hover;

        border-color: @scrollbar-handle-border-color-hover;

      }

      &:pressed {

        background-color: @scrollbar-handle-bg-color-pressed;

        border-color: @scrollbar-handle-border-color-pressed;

      }

    }

    &:horizontal {

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

      margin: @scrollbar-handle-margin 16;

      min-width: 20;

    }

    &:vertical {

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

      margin: 16 @scrollbar-handle-margin 16 @scrollbar-handle-margin;

      min-height: 20;

    }

  }

  &::add-line {

    subcontrol-origin: margin;

    border: 0;

    &:horizontal { // right

      subcontrol-position: right;

      background-color: @scrollbar-bg-color;

      margin: 0;

      width: 16;

    }

    &:vertical { // down

      subcontrol-position: bottom;

      background-color: @scrollbar-bg-color;

      margin: 0;

      height: 16;

    }

  }

  &::sub-line {

    border: 0;

    subcontrol-origin: margin;

    &:horizontal { // left

      subcontrol-position: left;

      background-color: @scrollbar-bg-color;

      margin: 0;

      width: 16;

    }

    &:vertical { // up

      subcontrol-position: top;

      background-color: @scrollbar-bg-color;

      margin: 0;

      height: 16;

    }

  }

  @arrow-pressed: 1 0 0 0; // press effect shortcut, nudge arrow down 1

  &::up-arrow:vertical {

    image: url('@{img-url}/scroll-up.svg');

    image-position: center center;

    &:pressed {

      margin: @arrow-pressed;

    }

  }

  &::down-arrow:vertical {

    image: url('@{img-url}/scroll-down.svg');

    image-position: center center;

    &:pressed {

      margin: @arrow-pressed;

    }

  }

  &::left-arrow:horizontal {

    image: url('@{img-url}/scroll-left.svg');

    image-position: center center;

    &:pressed {

      margin: @arrow-pressed;

    }

  }

  &::right-arrow:horizontal {

    image: url('@{img-url}/scroll-right.svg');

    image-position: center center;

    &:pressed {

      margin: @arrow-pressed;

    }

  }

  &::sub-page,

  &::add-page {

    &:horizontal,

    &:vertical {

      background: none;

    }

  }

}

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

   QToolBar

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

/* This applies to QToolBar, this is not the #ToolBar window, although the

  properties here also apply in the window, you should look in

  [layouts/toolbar] if you want window control. */

QToolBar {

  padding: 0;

  &::separator {

    &:horizontal {

      border-left: 1 solid @accent;

      margin: 0 1;

      width: 0;

    }

    &:vertical {

      border-top: 1 solid @accent;

      height: 0;

      margin: 1 0;

    }

  }

  & QLabel {

    margin-top: 1;

  }

  & QToolBar {

    border: 0;

  }

}

QToolButton {

  &:extend(.button-tool all);

  margin-left: 1;

  margin-right: 1;

  padding: 0;

  &::menu-indicator {

    image: none;

  }

  &::menu-button {

    border-image: none;

  }

  &#qt_toolbar_ext_button {

    padding: 0;

    border: 0;

    margin: 0;

    qproperty-icon: url('@{img-url}/toolbar_extension_horizontal.png');

    &:hover {

      background-color: @button-bg-color-hover;

    }

    &:pressed {

      background-color: @button-bg-color-checked;

    }

  }

}

.DvScrollWidget {

  & QPushButton {

    background-color: @button-bg-color;

    border: 0 solid @accent;

    border-radius: 0;

    padding: 0;

    max-width: 16;

    &:hover {

      background-color: @button-bg-color-hover;

    }

    &:pressed {

      background-color: @button-bg-color-pressed;

    }

  }

}

DvScrollWidget {

  /* Multiple classes can use the same style as DvScrollWidget, and

    since the compiler can't handle extending to Qt names we place the

    style in a mixin and extend the name to it instead. */

  &:extend(.DvScrollWidget all);

}

#ScrollLeftButton,

#ScrollRightButton,

#ScrollUpButton,

#ScrollDownButton {

  &:extend(.DvScrollWidget all);

  margin: 0;

  min-width: 16;

}

#ScrollLeftButton {

  border-right: 1 solid @accent;

  image: url('@{img-url}/scroll-left.svg');

}

#ScrollRightButton {

  border-left: 1 solid @accent;

  margin-left: 3;

  image: url('@{img-url}/scroll-right.svg');

}

#ScrollUpButton {

  image: url('@{img-url}/scroll-up.svg');

}

#ScrollDownButton {

  image: url('@{img-url}/scroll-down.svg');

}

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

/* For the buttons to display a BG color we need to set a blank image, setting

   an empty URL solves this. */

#keyFrameNavigator {

  background: transparent;

  margin: 0;

  padding: 0;

  #PreviousKey {

    margin: 0 2;

    padding-right: -1;

    width: 20px;

    height: 20px;

    image: url('');

	  &:disabled {

		  image: url('');

	  }

  }

  #NextKey {

    margin: 0 2;

    padding-right: -1;

    width: 20px;

    height: 20px;

    image: url('');

	  &:disabled {

		  image: url('');

	  }

  }

  #KeyNo,

  #KeyPartial,

  #KeyTotal {

    margin: 0;

    padding-right: -1;

    width: 20px;

    height: 20px;

    image: url('');

    &:disabled {

      image: url('');

    }

  }

  #KeyNo {

    background-color: @keyframe-off-color;

    border: 1 solid @keyframe-off-border-color;

    image: url('');

    &:disabled {

      image: url('');

    }

    &:hover {

      background-color: @keyframe-off-color-hover;

      border-color: @keyframe-off-border-color-hover;

    }

  }

  #KeyPartial {

    background-color: @keyframe-partial-color;

    border: 1 solid @keyframe-partial-border-color;

    image: url('');

    &:hover {

      background-color: @keyframe-partial-color-hover;

      border-color: @keyframe-partial-border-color-hover;

    }

  }

  #KeyTotal {

    background-color: @keyframe-total-color;

    border: 1 solid @keyframe-total-border-color;

    &:hover {

      background-color: @keyframe-total-color-hover;

      border-color: @keyframe-total-border-color-hover;

    }

  }

  & QToolButton#qt_toolbar_ext_button {

    // adjust for style

    padding-bottom: 3;

    border-radius: 2;

  }

}

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

   Tabs

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

QTabWidget::Pane {

  position: absolute;

  top: -1; // move border under tabs

  &:extend(.frame all); // frame border

  margin: 0 3 3 3;

}

QTabBar {

  background-color: transparent;

  &::tab {

    &:extend(.tab-round all);

    &::first {

      margin-left: 3px;

    }

  }

  & QToolButton {

    /* Scroll buttons */

    margin: 0;

    background-color: @bg;

    border-radius: 0;

    border: 1 solid @accent;

    border-top: 0;

    padding: 3 2 2 2;

    &:hover, &:pressed {

      border-color: @accent;

    }

    &:disabled {

      color: @text-color-disabled;

    }

  }

}

#TabBarContainer {

  // Panels: Palette, Style Editor, Fx Editor, etc.

  .tab-container;

  & QTabBar {

    &::tab {

      &:extend(.tab-flat all);

    }

  }

}

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

   Item Tree

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

.treeview {

  background-color: @tree-bg-color;

  alternate-background-color: @tree-bg-color-alt;

  border: 0;

  margin: 0;

  outline: 0;

  &::item {

    &:selected {

      .hl-color;

    }

  }

  &::branch {

    /* A blank URL may not hide the Qt branch style in Linux, so we add

       a transparent PNG which does. */

    @blank_img: '@{img-url}/transparent_16x16.png';

    &:adjoins-item {

      border-image: url('@{blank_img}');

    }

    &:has-siblings {

      border-image: url('@{blank_img}');

      &:adjoins-item {

        border-image: url('@{blank_img}');

      }

    }

    &:has-children {

      &:closed {

        background: url('@{img-url}/treebranch-closed.svg') no-repeat;

        background-position: center center;

        border-image: none;

        image: none;

      }

      &:open {

        background: url('@{img-url}/treebranch-open.svg') no-repeat;

        background-position: center center;

        image: none;

      }

      &:has-siblings {

        &:closed {

          background: url('@{img-url}/treebranch-closed.svg') no-repeat;

          background-position: center center;

          border-image: none;

          image: none;

        }

        &:open {

          background: url('@{img-url}/treebranch-open.svg') no-repeat;

          background-position: center center;

          border-image: none;

          image: none;

        }

      }

    }

  }

}

QTreeWidget,

QTreeView {

  &:extend(.treeview all);

}

QListView {

  outline: 0; // hide focus border

  background: @tree-bg-color;

  alternate-background-color: @tree-bg-color-alt;

}

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

   Tool Options - Override DvScroll Widget

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

#toolOptionsPanel {

  QPushButton {

    background-color: @button-bg-color;

    border: 1 solid @button-border-color;

    border-radius: 2;

    color: @button-text-color;

    margin: 0;

    padding: 0;

    &:hover {

      background-color: @button-bg-color-hover;

      border-color: @button-border-color-hover;

      color: @button-text-color-hover;

    } 

    &:pressed {

      background-color: @button-bg-color-pressed;

      border-color: @button-border-color-pressed;

      color: @button-text-color-pressed;

    }

    &:checked {

      background-color: @button-bg-color-checked;

      border-color: @button-border-color-checked;

      color: @button-text-color-checked;

      &:hover {

        background-color: @button-bg-color-checked-hover;

        &:pressed {

          background: @button-bg-color-checked-hover-pressed;

        }

      }

    }

    &:disabled {

      background-color: @button-bg-color-disabled;

      border-color: @button-border-color-disabled;

      color: @button-text-color-disabled;

    }

  }

}

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

   QHeaderView

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

QHeaderView::section {

  background-color: @browser-itemview-col-color;

  border: 1 solid @browser-itemview-col-border-color;

  padding-left: 4;

  margin-left: -1;

  margin-top: -1;

}

QTreeWidget {

  background-color: @browser-itemview-bg-color-alt;

  border: 1 solid @accent;

}