@use '../../styles';
@use '../../themes/defaults';

.jse-value {
  &.jse-string {
    color: defaults.$value-color-string;
  }

  &.jse-object,
  &.jse-array {
    min-width: 16px;
    color: defaults.$delimiter-color;
  }

  &.jse-number {
    color: defaults.$value-color-number;
  }

  &.jse-boolean {
    color: defaults.$value-color-boolean;
  }

  &.jse-null {
    color: defaults.$value-color-null;
  }

  &.jse-invalid {
    color: defaults.$text-color;
  }

  &.jse-url {
    color: defaults.$value-color-url;
    text-decoration: underline;
  }
}