/* Shade */
#Mixxx {
  background-color: #191919;
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-position:center top;
}

#Deck WPushButton {
  font-family: "Open Sans";
  font-size: 14px;
}

WBeatSpinBox,
/* For some mysterious reason #DlgAutoDJ QSpinBox
wouldn't style the respective spinbox in Shade (anymore),
that's why we do it in another way here */
#spinBoxTransition {
  color: #060613;
  background-color: #aab2b7;
  font: 13px;
  padding: 0px;
}
WBeatSpinBox {
  border: 1px solid #060613;
}
#spinBoxTransition {
/* omitting the border definition miraculously makes the spinbox grow */
/* 0px border OTOH makes the spinbox shrink disproportionately
  border: 0px; */
  border: 1px solid #72777A;
  margin: 0px 0px 2px 1px;
}
/*
QSpinBox:editable {
  font-size: 10pt;
  background: transparent;
  color: #ACACAC; }
QSpinBox { min-height: 20px; max-height: 20px;min-width: 40px; max-width: 40px;}*/

WBeatSpinBox::up-button, 
#spinBoxTransition::up-button {
  height: 9px;
  border-left: 1px solid #060613;
  image: url(skin:/btn/btn_spin_up.png) no-repeat;
}

WBeatSpinBox::down-button,
#spinBoxTransition::down-button {
  height: 9px;
  border-left: 1px solid #060613;
  image: url(skin:/btn/btn_spin_down.png) no-repeat;
}


WEffectSelector {
  color: #060613;
  background-color: #aab2b7;
  /* Fixes the white bars on the top/bottom of the popup on Mac OS X */
  margin-top: 0px;
  margin-bottom: 0px;
  border: 1px solid #060613;
  padding-left: 3px;
  font: 13px;
}

WEffectSelector::drop-down {
  /* This causes the Qt theme's widget style to magically not apply. Go figure. */
  border: 0;
}

WEffectSelector::down-arrow {
  height: 20px;
  border-style: solid;
  border-color: #060613;
  border-width: 0px 0px 0px 1px;
  image: url(skin:/btn/btn_spin_down.png) no-repeat;
}

WEffectSelector QAbstractItemView {
  color: #060613;
  background-color: #aab2b7;
  border: 2px solid #060613;
  selection-background-color: lightgray;
}

WEffectSelector::item:selected {
  background-color: lightgray;
}

WEffectSelector::checked {
  color: #EC4522;
}

#EffectSelectorGroup[highlight="1"] {
  border: 1px solid #52f864;
  margin: 0px 0px 0px 0px;
}
#EffectSelectorGroup[highlight="0"] {
  border: 0px solid #52f864;
  margin: 0px 0px 0px 0px;
}

#EffectUnit {
  qproperty-layoutAlignment:AlignTop;
}



/*################################################################
######  Library styling is hard  ################################
################### most of it was LateNight & Deere & Tango ###
############ added styling for AutoDJ & Recording etc ###### */

QTableView,
QTextBrowser,
QTreeView {
  border: 1px solid #585858;
  font-weight: normal;
  color: #9e9e9e;
  background-color: #0f0f0f;
  alternate-background-color: #1a1a1a;
  selection-color: #e6e6e6;
  selection-background-color: #666;
}

QTreeView {
  min-height: 90px;
  min-width: 90px;
  border-style: solid;
  border-color: #585858;
  show-decoration-selected: 0;
  /* Don't define top margin here, it won't shift ScrollBar.
  Defined by SearchBox	*/
  margin: 0px;
  }
  QTreeView:focus,
  QTableView:focus { /*
    New Library navigation COs only work if TreeView or TableView have focus.
    Clicking on buttons, sliders and visuals elsewhere removes focus from Library.
    In conjunction with [Library],MoveFocusBackward/..Forward, this helps a lot. */
    border-color: #ff6600;
  }

/*  Closed branch of tree 	*/
QTreeView::branch:has-children:!has-siblings:closed,
QTreeView::branch:closed:has-children:has-siblings {
  image: url(skin:/style/style_branch_closed.png);
  }
  QTreeView::branch:has-children:!has-siblings:closed:selected,
  QTreeView::branch:closed:has-children:has-siblings:selected {
    image: url(skin:/style/style_branch_closed_selected.png);
    background-color: #666;
  }

/*  Open branch of tree 	*/
QTreeView::branch:open:has-children:!has-siblings,
QTreeView::branch:open:has-children:has-siblings {
  image: url(skin:/style/style_branch_open.png);
  }
  QTreeView::branch:open:has-children:!has-siblings:selected,
  QTreeView::branch:open:has-children:has-siblings:selected {
    border-image: none;
    image: url(skin:/style/style_branch_open_selected.png);
    background-color: #666;
  }
  /* space left of selected child item */
  QTreeView::branch:!has-children:!has-siblings:closed:selected,
  QTreeView::branch:closed:!has-children:has-siblings:selected,
  QTreeView::branch:open:!has-children:!has-siblings:selected,
  QTreeView::branch:open:!has-children:has-siblings:selected {
    border-image: none;
    background-color: #0f0f0f;
  }

QTreeView::item:selected,
QTableView::item:selected {
  border-image: none;
  background-image: none;
  color: #fff;
  background-color: #666;
  }

QTreeView::item:!selected {
  border-image: none;
  background-image: none;
  background-color: #0f0f0f;
  color: #999;
  }

  /* BPM lock icon in the library "BPM" column. */
  #LibraryBPMButton::indicator:checked {
    image: url(skin:/btn/btn_lib_bpm_locked.svg);
    }
    #LibraryBPMButton::indicator:unchecked {
      image: url(skin:/btn/btn_lib_bpm_unlocked.svg);
      }
  #LibraryBPMButton::item {
    color: #cfcfcf;
    }
    #LibraryBPMButton::item:selected {
      color: #ededed;
      background-color: #666;
      }

  #LibraryBPMSpinBox {
    color: #fff;
    selection-color: #0f0f0f;
    background-color: #0f0f0f;
    selection-background-color: #888;
    /* This combination of negative top/bottom padding & margin
    creates a 1px border around the spinbox' text area.
    Increased left/right padding/margin removes the overlap of
    text of activated spinbox and left-over text from regular
    BPM value display. */
    padding: -1px -8px -1px -4px;
    margin: -2px 0px -2px -2px;
    /* As soon as any border property is set, the up/down buttons
    lose their style & icons
    border: 0px;
    border-radius: 2px; */
  }

  #LibraryTimesPlayed::item {
    color: #cfcfcf;
    }

  /* Button in library "Preview" column */
  #LibraryPreviewButton {
    background: transparent;
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
  }
  #LibraryPreviewButton:!checked{
    image: url(skin:/btn/btn_lib_preview_play.svg);
  }
  #LibraryPreviewButton:!checked:hover {
    border: 1px solid #666;
    background: #0f0f0f;
  }
  #LibraryPreviewButton:checked {
    image: url(skin:/btn/btn_lib_preview_pause.svg);
    background-color: #0f0f0f;
    border: 1px solid #444;
  }
  #LibraryPreviewButton:checked:hover {
    border: 1px solid #666;
  }


  /* checkbox in library "Played" column */
  QTableView::indicator {
    width: 10px;
    height: 10px;
    margin: 0px;
    padding: 0px;
    color: #cfcfcf;
    border: 1px solid transparent;
    }
    QTableView::indicator:checked {
      background: transparent url(skin:/btn/btn_lib_checkmark.svg) no-repeat center center;
      color: #cfcfcf;
      border: 1px solid #ff6600;
      }
    QTableView::indicator:unchecked {
      background: none;
      color: #cfcfcf;
      border: 1px solid rgba(151,151,151,128);
      }

/* library search text box */
WSearchLineEdit {
  padding: 2px;
  margin-top: 2px;
  border: 1px solid #656565;
  font-size: 10pt;
  font-family: "Open Sans";
  background: #0f0f0f;
  color: #cfcfcf;
  selection-background-color: #d2d2d2;
  selection-color: #0f0f0f;
  margin-bottom: 5px;
  }
  WSearchLineEdit:focus {
    border: 2px solid #ff6600;
    color: #eeeeee;
    padding: 2px;
  }
  /* Clear button next to text field */
  WSearchLineEdit QToolButton {
    margin-bottom: 4px;
  }

QHeaderView {
  /* Note(ronso0)
  Interferes with skin scaling
  font-size: 13px/13px;	*/
  font-size: 10pt;
  font-weight: bold;
  color: #0f0f0f;
  background-color: #8D98A3;
  border-radius: 0px;
}
/*	Library header 'buttons'	*/
QHeaderView::section {
  padding: 2px;
  /*	set right border so that first column header
  on the left doesn't have double border on the left	*/
  border-right: 1px solid #0f0f0f;
  background-color: #8D98A3;
  border-radius: 0px;
}

QHeaderView::up-arrow,
QHeaderView::down-arrow {
  width: 12px;
  padding-right: 2px;
  background-color: rgba(141,152,163,160);
}
QHeaderView::up-arrow {
  image: url(skin:/btn/btn_lib_sort_up.png)
}
QHeaderView::down-arrow {
  image: url(skin:/btn/btn_lib_sort_down.png)
}

/* Scroll bars */
QScrollBar:horizontal {
  min-width: 40px;
  height: 18px;
  padding: 1px 0px 0px 0px;
  background-color: #5C5B5D;
}
QScrollBar:vertical {
  min-height: 40px;
  width: 18px;
  padding: 0px 0px 0px 1px;
  background-color: #5C5B5D;
}
/* "add-page" and "sub-page" are the gutter of the scrollbar */
QScrollBar::add-page,
QScrollBar::sub-page {
  min-width: 14px;
  min-height: 14px;
  background-color: #191919;
}
QScrollBar::handle:vertical,
QScrollBar::handle:horizontal {
  background: #8D98A3;
  border: 1px solid #1e1e1e;
  border-radius: 1px;
}
QScrollBar::handle:horizontal {
  min-width: 40px;
}
QScrollBar::handle:vertical {
  min-height: 40px;
}
/* Turn off scroll buttons */
QScrollBar::add-line:horizontal,
QScrollBar::add-line:vertical {
  width: 0px;
  height: 0px;
}
QScrollBar::sub-line:horizontal,
QScrollBar::sub-line:vertical {
  width: 0px;
  height: 0px;
}

/* Corner in between two scrollbars */
QAbstractScrollArea::corner {
  background-color: #0f0f0f;
  border-top: 1px solid #585858;
  border-left: 1px solid #585858;
  border-bottom: none;
  border-right: none;
}

/* Styling a QSpinbox is complex and it took ages to figure out how to remove the surrounding frame and make the background transparent without affecting the subcontrols (up/down-buttons).
You could easily style a subcontrol like in the QT-Docs, but if you want to have the OS-native subcontrols, this is the only way i found ( there are probably others ).
In our case make sure that the "frame"-property in the corresponding dlgautodj.ui file is set to "false"
The general rule when it comes to stylesheets is always to remember that if you style part of a widget, then you usually have to style all of it.
*/
/* transition time in Auto DJ tab*/
QSpinBox:editable,
/* or addressed directly */
#spinBoxTransition {}

/* Cover Art*/
WCoverArt {
  font: 11px/15px sans-serif;
  font-family: "Open Sans";
  background: transparent;
  color: #ACACAC;
}

/* splitter between treeview and library*/
QSplitter::handle { image: url(skin:/style/style_handle_unchecked.png); background: none; }
QSplitter::handle:pressed { image: url(skin:/style/style_handle_checked.png); background: none; }
QSplitter::handle:horizontal { width: 6px; }
QSplitter::handle:vertical { height: 6px;}

QPushButton { font-size: 10pt;
  font-family: "Open Sans";}
/* Extra declaration for QRadionButton otherwise it shows up with wrong colors in Linux with Gnome */
QLabel, QRadioButton {
  font-size: 10pt;
  background: transparent;
  color: #C1C1C1;}


WLibrary { margin: 2px 3px 0px 0px; }

/* Additional space for QRadionButtons */
WLibrary QRadioButton { margin: 9px 3px 6px 3px; }
/* Additional space for QLabels */
WLibrary QLabel { margin: 6px 3px 9px 3px; }

/* Additional space for the first QRadionButton in the row*/
WLibrary QRadioButton#radioButtonRecentlyAdded { margin: 9px 3px 6px 12px; }

WLibrary QRadioButton::indicator:checked {
  background: transparent url(skin:/btn/btn_lib_radio_button_on.svg) center center;
}

WLibrary QRadioButton::indicator:unchecked {
  background: transparent url(skin:/btn/btn_lib_radio_button_off.svg) center center;
}

WLibrary QPushButton {
  text-align: center;
  font-size: 9pt;
  font-weight: normal;
  /* Note(ronso0)
  Interferes with skin scaling, system font size respectively
  font-size: 14px/14px;
  Setting height/width here will prevent the buttons being scaled properly
  min-height: 22px;
  max-height: 22px;
  height: 22px;	*/
  color: #0f0f0f;
  margin: 1px 2px 3px 1px;
  padding: 1px 3px 0px 3px;
  background-color: #99A0A4;
  background-position: center;
  border: 1px solid #99A0A4;
  }
  WLibrary QPushButton:!enabled {
    background-color: #72777A;
    border: 1px solid #72777A;
    }
  WLibrary QPushButton:unchecked {
    color: #888;
    background-color: #444;
    }
  WLibrary QPushButton:checked {
    color: #000;
    background-color: #F90562;
    }
  /* 'Enable AutoDJ' button	*/
  QPushButton#pushButtonAutoDJ:hover,
  QPushButton#pushButtonRecording:hover,
  QPushButton#pushButtonAnalyze:hover {
    border: 1px solid #F90562;
  }
  /* Push 'Start/Stop Recording' button and
    'Enable AutoDJ' button away from skin border	*/
  QPushButton#pushButtonAutoDJ,
  QPushButton#pushButtonRecording {
    margin: 1px 20px 3px 1px;
  }


