.pill {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-xtight);

  border: var(--border-width-thin) var(--border-style-solid);
  border-radius: var(--radius-sm);
  padding: var(--spacing-2);

  height: auto;
  width: fit-content;
}

/* Start - Pill Sizes */

.pill-sm {
  height: var(--spacing-6);
}

.pill-md {
  height: var(--spacing-7);
}

.pill-lg {
  height: var(--spacing-8);
}

/* End - Pill Sizes */

/* Start - Pill Colors */

.pill-primary {
  background-color: var(--primary-100);
  border-color: var(--primary-500);
  color: var(--primary-900);
}

.pill-secondary {
  background-color: var(--gray-100);
  border-color: var(--gray-500);
  color: var(--gray-900);
}

.pill-warning {
  background-color: var(--warning-100);
  border-color: var(--warning-500);
  color: var(--warning-900);
}

.pill-success {
  background-color: var(--success-100);
  border-color: var(--success-500);
  color: var(--success-900);
}

.pill-info {
  background-color: var(--blue-100);
  border-color: var(--blue-500);
  color: var(--blue-900);
}

.pill-error {
  background-color: var(--error-100);
  border-color: var(--error-500);
  color: var(--error-900);
}

/* End - Pill Colors */

/* Start - Pill Hovers */

.pill-primary:hover {
  background-color: var(--primary-200);
}

.pill-secondary:hover {
  background-color: var(--gray-200);
}

.pill-warning:hover {
  background-color: var(--warning-200);
}

.pill-success:hover {
  background-color: var(--success-200);
}

.pill-info:hover {
  background-color: var(--blue-200);
}

.pill-error:hover {
  background-color: var(--error-200);
}

/* End - Pill Colors */

/* Start - Pill Active */

.pill:active {
  box-shadow: 0 0 0 2px var(--blue-300);
}

/* End - Pill Active */

/* Start - Pill Disabled */

.pill-disabled,
.pill-disabled:hover,
.pill-disabled:active {
  background-color: var(--gray-200);
  border-color: var(--gray-300);
  color: var(--gray-500);
}

/* End - Pill Disabled */
