SDivider {
  display: block;
}

SDivider[use='primary'] {
  background-color: var(--theme, var(--intergalactic-border-primary, #c4c7cf));
}

SDivider[use='primary']SDivider[theme='default'] {
  background: var(--intergalactic-border-primary, #c4c7cf);
}
SDivider[use='primary']SDivider[theme='invert'] {
  background-color: var(--intergalactic-border-primary-invert, #ffffff);
  opacity: 0.2;
}

SDivider[orientation='horizontal']SDivider[use='secondary'] {
  background-image: linear-gradient(
    to right,
    var(--intergalactic-border-primary, #c4c7cf) 3px,
    transparent 1px
  );
  background-size: 5px 1px;
}

SDivider[orientation='horizontal']SDivider[use='secondary']SDivider[theme='default'] {
  background: linear-gradient(
    to right,
    var(--intergalactic-border-primary, #c4c7cf) 3px,
    transparent 1px
  );
  background-size: 5px 1px;
}
SDivider[orientation='horizontal']SDivider[use='secondary']SDivider[theme='invert'] {
  background-image: linear-gradient(
    to right,
    var(--intergalactic-border-primary-invert, #ffffff) 3px,
    transparent 1px
  );
  opacity: 0.2;
  background-size: 5px 1px;
}

SDivider[orientation='vertical']SDivider[use='secondary'] {
  background-image: linear-gradient(
    to bottom,
    var(--intergalactic-border-primary, #c4c7cf) 3px,
    transparent 1px
  );
  background-size: 1px 5px;
}

SDivider[orientation='vertical']SDivider[use='secondary']SDivider[theme='default'] {
  background-image: linear-gradient(
    to bottom,
    var(--intergalactic-border-primary, #c4c7cf) 3px,
    transparent 1px
  );
  background-size: 1px 5px;
}
SDivider[orientation='vertical']SDivider[use='secondary']SDivider[theme='invert'] {
  background-image: linear-gradient(
    to bottom,
    var(--intergalactic-border-primary-invert, #ffffff) 3px,
    transparent 1px
  );
  opacity: 0.2;
  background-size: 1px 5px;
}

SDivider[orientation='horizontal'] {
  width: 100%;
  height: 1px;
}

SDivider[orientation='vertical'] {
  width: 1px;
  height: auto;
  min-height: 100%;
  align-self: stretch;
  flex-shrink: 0;
}

SDivider[theme]:not([theme='default']):not([theme='invert']) {
  &[use='primary'] {
    background-color: var(--theme);
  }
  &[use='secondary'] {
    background-image: linear-gradient(to right, var(--theme) 3px, transparent 1px);
  }
}