:host {
  display: block;
  font-family: var(--ls-font-family);
  color: var(--ls-font-primary-color);
}

.ls-status-item {
  margin: 0;
  padding: var(--ls-status-item-padding, 0);
  border-width: var(--ls-status-item-border-width, 0);
  border-style: solid;
  border-color: var(--ls-status-item-border-color, currentColor);
  box-shadow: var(--ls-status-item-box-shadow, none);
  border-radius: var(--ls-status-item-border-radius, 0);
  background-color: var(--ls-status-item-background, transparent);
  color: var(--ls-status-item-foreground, inherit);
  box-shadow: var(--ls-status-item-box-shadow, none);
  display: grid;
  gap: calc(var(--spacing, 0));
  box-sizing: border-box;
}

.ls-status-item .label {
  font-size: var(--ls-text-base);
  line-height: var(--ls-line-base);
  font-weight: var(--font-weight-normal, 400);
  color: var(--ls-font-primary-color);
  margin: 0;
  text-align: var(--ls-status-item-text-align, inherit);
}

.ls-status-item .value {
  font-size: var(--ls-text-2xl);
  line-height: var(--ls-line-2xl);
  font-weight: 600;
  margin: 0;
  text-align: var(--ls-status-item-text-align, inherit);
}

.ls-status-item .timestamp {
  font-size: var(--ls-text-sm);
  line-height: var(--ls-line-sm);
  color: var(--ls-gray-600);
  margin: 0;
  text-align: var(--ls-status-item-text-align, inherit);
}
