/* -----------------------------------------------------------------------------
   Main
----------------------------------------------------------------------------- */

QWidget {
  background-color: @bg;
  color: @text-color;
  &:disabled {
    color: @text-color-disabled;
  }
}

QFrame { border: 0; margin: 0; padding: 0; }

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 @accent;
  height: 21;
  & #EditToolLockButton {
    background: @topbar-bg-color;
    spacing: 0;
    &::indicator {
      // inherits from #ToolOptions
      background: none;
      border: none;
      height: 18;
      margin: 1 2 0 0;
      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 {
  &::tab {
    margin: 0;
    padding: 2 7 3 8;
    border-bottom: 0;
    &:hover, &:selected {
      border-bottom: 0;
    }
    &:selected {
      color: @rooms-tab-text-color-selected;
      background-color: @rooms-tab-bg-color-selected;
    }
  }
  & 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 {
    padding: 3 28;
    &:selected {
      .hl-color;
    }
    &:checked {
      color: @menu-checkbox-text-color-selected;
      &:selected {
        .hl-color;
      }
    }
    &:disabled {
      background: none;
      color: @text-color-disabled;
      &:selected {
        background-color: @menu-item-bg-color-disabled-hover;
        border-color: transparent;
        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;
    margin: 0 0 0 3;
    padding: 1;
    &:checked {
      background-color: @hl-bg-color;
    }
  }
  &::indicator {
    &:non-exclusive {
      &:extend(.CheckBox::indicator all);
    }
    &:exclusive {
      &:extend(.RadioButton::indicator all);
    }
    margin-left: 7;
    &:non-exclusive {
      &:extend(.CheckBox::indicator all);
    }
    &:exclusive {
      &:extend(.RadioButton::indicator all);
    }
  }
}

/* -----------------------------------------------------------------------------
   Titlebars
----------------------------------------------------------------------------- */

TPanelTitleBar {
  background-color: @title-bg-color;
  border-color: @accent;
  border-style: solid;
  border-width: 0 0 1 0;
  height: 20;
  min-height: 20;
  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-RolloverColor: @title-button-rollover-color;
  qproperty-PressedColor: @title-button-pressed-color;
  qproperty-FreezeColor: @title-button-freeze-color;
  qproperty-PreviewColor: @title-button-preview-color;
}

/* -----------------------------------------------------------------------------
   Scrollbars
----------------------------------------------------------------------------- */

QAbstractScrollArea::corner {
  background-color: @scrollbar-bg-color;
}

QScrollBar {
  background-color: @scrollbar-bg-color;
  border: 0;
  &:horizontal {
    height: 16;
    margin: 0;
  }
  &:vertical {
    margin: 0;
    width: 16;
  }

  &::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;
      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 on pressed event

  &::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;
    }
  }
}

/* -----------------------------------------------------------------------------
   Tool Bars
----------------------------------------------------------------------------- */

// this applies to QToolBar
// !!!! this is not the #ToolBar window !!!!
// look in [layouts/toolbar] for the window

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);
  &::menu-indicator {
    image: none;
  }
  &::menu-button {
    border-image: none;
  }
}

/* -------------------------------------------------------------------------- */
/* Scrollable QToolBar Buttons
/* -------------------------------------------------------------------------- */

.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 {
  // Can't extend to a Qt selector so we use
  // a mixin 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');
}

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

#keyFrameNavigator {
  background: transparent;
  margin: 0;
  padding: 0;
  & QToolButton {
    max-width: 20;
    max-height: 20;
    border: 0;
  }
  #PreviousKey {
    image: url('@{img-url}/prevkey.svg');
    &:hover {
      image: url('@{img-url}/prevkey_over.svg');
    }
	  &:disabled {
		  image: url('@{img-url}/prevkey_disabled.svg');
	  }
  }
  #NextKey {
    image: url('@{img-url}/nextkey.svg');
    &:hover {
      image: url('@{img-url}/nextkey_over.svg');
    }
	  &:disabled {
		  image: url('@{img-url}/nextkey_disabled.svg');
	  }
  }
  #KeyNo,
  #KeyPartial,
  #KeyTotal {
    image: url(':Resources/keyframe.svg');
  }
  #KeyNo {
    background-color: @keyframe-off-color;
    &:hover {
      background-color: @keyframe-off-color-hover;
    }
  }
  #KeyPartial {
    background-color: @keyframe-partial-color;
    &:hover {
      background-color: @keyframe-partial-color-hover;
    }
  }
  #KeyTotal {
    background-color: @keyframe-total-color;
    &:hover {
      background-color: @keyframe-total-color-hover;
    }
  }
}

/* -----------------------------------------------------------------------------
   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 {
    &:adjoins-item {
      // Adding a blank URL hides in-built branch design
      // where it is not wanted.
      border-image: url('');
    }
    &:has-siblings {
      border-image: url('');
      &:adjoins-item {
        border-image: url('');
      }
    }
    &: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;
}

/* -----------------------------------------------------------------------------
   Tabs
----------------------------------------------------------------------------- */

#TabBarContainer {
  background-color: @tabbar-bg-color;
  qproperty-BottomAboveLineColor: @tabbar-bg-color;
  qproperty-BottomBelowLineColor: @accent;
}
QTabBar {
  background-color: @tabbar-bg-color;
  margin-bottom: 1;
  &::tear {}
  & QToolButton {
    background-color: @bg;
    border-radius: 0;
    margin-right: 0;
    margin-top: -1;
    margin-bottom: 0;
    border-bottom: 1 solid @accent;
    border-left: 1 solid @accent;
    padding: 3 2 2 2;
    &:hover {
      border-bottom: 1 solid @accent;
      border-left: 1 solid @accent;
    }
    &:disabled {
      color: @text-color-disabled;
    }
  }
  &::tab {
    margin-top: -1; // hide top border
    background-color: @tabbar-bg-color;
    border: 1 solid @tab-border-color;
    border-right: 0;
    color: @tab-text-color;
    min-width: 8ex;
    padding: 3 4 4 4; // y = helps borders to show for the TabBar
    &:selected {
      background-color: @tab-bg-color-selected;
      border-bottom-color: @bg;
      color: @tab-text-color-selected;
    }
    &:hover {
      background-color: @tab-bg-color-hover;
    }
    &:last, &:only-one {
      border-right: 1 solid @tab-border-color;
    }
  }
}

/* -----------------------------------------------------------------------------
   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;
    }
  }
}

/* -----------------------------------------------------------------------------
   Status Bar - Bottom of Main Window
----------------------------------------------------------------------------- */

#StatusBar {
  background-color: @bg;
  color: @status-hl-color;
  border-top: 1px outset @dock-bg-color;
  &:disabled {
    color: @text-color-disabled;
  }
}

#MainWindowMessageLabel {
  background-color: @bg;
  padding-left: 10px; 
  padding-right: 10px;
  color: @hl-bg-color;
  &:disabled {
    color: @text-color-disabled;
  }
}

#MainWindowPlainLabel {
  background-color: @bg;
  padding-left: 10px; 
  padding-right: 10px;
  color: @text-color;
  &:disabled {
    color: @text-color-disabled;
  }
}