Divider

.divider:empty {
  gap: 0;
}

.divider::before, .divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--tone);
}

.divider-vertical::before, .divider-vertical::after {
  width: 1px;
  height: auto;
}

.divider-vertical {
  flex-direction: column;
  align-self: stretch;
  margin: 0 1.25rem;
}

.divider-start::before, .divider-end::after {
  flex: 0 0 1.25rem;
}

.divider-start::before, .divider-end::after {
  flex: 0 0 1.25rem;
}

.divider-primary {
  --tone: var(--primary);
}

.divider-accent {
  --tone: var(--accent);
}

.divider-success {
  --tone: var(--success);
}

.divider-warning {
  --tone: var(--warning);
}

.divider-danger {
  --tone: var(--danger);
}

.divider-info {
  --tone: var(--info);
}