

:root {
  --badge-space-gap: var(--space-inline-xs);
  --badge-space-x: var(--space-2);
  --badge-space-y: var(--space-1);

  --badge-radius: var(--radius-md);
  --badge-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));

  --badge-line-height: calc(1 / 0.75);

  --badge-icon-size: var(--icon-size-xs);

  --badge-space-x-removable: var(--space-1);
  --badge-remove-offset-inline-end: calc(-1 * var(--space-1));
  --badge-remove-icon-size: var(--badge-icon-size);
  --badge-remove-rest-alpha: 0.7;
  --badge-remove-hover-alpha: 1;

  --badge-tint-fill: 18%;
  --badge-tint-edge: 45%;

  --badge-tint-surface: hsl(var(--card));
  --badge-tint-foreground: hsl(var(--card-foreground));

  --badge-color: var(--badge-tint-surface);
}
