:import {
  -st-from: "../Foundation/stylable/colors.st.css";
  -st-named: THEME-DIVIDER-COLOR, D20, B30, Y30, R30, G30, P30;
}

.root {
  -st-states:
    direction(enum(horizontal, vertical)),
    skin(enum(light, dark, standard, warning, destructive, success, premium));

  margin: 0;
  border: 0;
}

.root:direction(horizontal) {
  min-height: 1px;
  width: 100%;
}

.root:direction(vertical) {
  display: inline-block;
  min-height: 100%;
  min-width: 1px;
}

/* Themes */

.root:skin(light) {
  background-color: value(THEME-DIVIDER-COLOR);
}

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

.root:skin(standard) {
  background-color: value(B30);
}

.root:skin(warning) {
  background-color: value(Y30);
}

.root:skin(destructive) {
  background-color: value(R30);
}

.root:skin(success) {
  background-color: value(G30);
}

.root:skin(premium) {
  background-color: value(P30);
}