@st-namespace "SidebarColors";

:import {
  -st-from: '../Foundation/stylable/colors.st.css';
  -st-named: D80, D80-42, D80-66, D20, D10-42, D10-66, B50, B40, B30, B00, B10
}

/* At the moment, it was decided by UX to not include the missing colors below as part of the design system palette */
:vars {
  /* Dark skin */
  sidebarBackgroundColor:#23263c;
  textColor: value(D80);
  hoveredBackgroundColor:#2e3149;
  selectedBackgroundColor:#3b3f57;
  selectedTextColor: value(B10);
  disabledBackgroundColor:#23263c;
  dividerColor: #434567;
  darkScrollbarThumbColor: value(D80-42);
  darkScrollbarThumbHoverColor: value(D80-66);

  /* Light skin */
  sidebarLightBackgroundColor: value(D80);
  lightTextColor: value(D20);
  hoveredLightBackgroundColor: value(B50);
  selectedLightBackgroundColor: value(B40);
  selectedLightTextColor: value(B00);
  disabledLightBackgroundColor: value(D80);
  lightScrollbarThumbColor: value(D10-42);
  lightScrollbarThumbHoverColor: value(D10-66);
}

/* st-namespace-reference="../../../../src/Sidebar/colors.st.css" */