:import {
  -st-from: '../Foundation/stylable/colors.st.css';
  -st-named: D20, D70, D80;
}

:import {
  -st-from: '../Text/Text.st.css';
  -st-default: Text;
}

.root {
  -st-states: skin(enum(dark, light, neutral));

  padding: 27px 24px;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.root:skin(dark) {
  background-color: #131720;
  color: #CFD0D2;
}

.root:skin(light) {
  background-color: value(D80);
  color: value(D20);
}


.root:skin(neutral) {
  background-color: value(D70);
  color: value(D20);
}

.title {
  -st-extends: Text;
}

.title:size(medium):weight(bold) {
  font-size: 20px;
  line-height: 24px;
}

/* st-namespace-reference="../../../../src/SidebarHeaderNext/SidebarHeaderNext.st.css" */