/* src/lozenge/src/Lozenge.css */
.o-ui-lozenge {
  display: inline-flex;
  align-items: center;
  background-color: var(--hop-decorative-option5-surface);
  color: var(--hop-decorative-option5-text);
  padding: 0 var(--hop-space-inset-sm);
  border-radius: var(--hop-shape-pill);
  min-height: 1.25rem;
  width: max-content;
  height: max-content;
}
.o-ui-lozenge-text {
  text-transform: inherit;
}
.o-ui-lozenge.o-ui-lozenge-highlight {
  background-color: var(--hop-decorative-option5-surface-strong);
}
.o-ui-lozenge-sm {
  min-height: 1rem;
}
.o-ui-lozenge-sm .o-ui-lozenge-text {
  text-transform: uppercase;
}
.o-ui-lozenge-lg {
  min-height: 1.5rem;
}
.o-ui-lozenge-fluid {
  width: 100%;
  justify-content: center;
}
.o-ui-lozenge-has-icon {
  padding-left: var(--hop-space-inset-xs);
}
.o-ui-lozenge-icon {
  margin-right: calc(var(--hop-space-inline-xs) / 2);
}
svg.o-ui-lozenge-icon,
.o-ui-lozenge-icon svg {
  width: 1rem;
  height: 1rem;
}
.o-ui-lozenge.o-ui-lozenge-informative {
  background-color: var(--hop-decorative-option5-surface);
}
.o-ui-lozenge.o-ui-lozenge-informative.o-ui-lozenge-highlight {
  background-color: var(--hop-decorative-option5-surface-strong);
}
.o-ui-lozenge.o-ui-lozenge-positive {
  background-color: var(--hop-decorative-option4-surface);
  color: var(--hop-decorative-option4-text);
}
.o-ui-lozenge.o-ui-lozenge-positive.o-ui-lozenge-highlight {
  background-color: var(--hop-decorative-option4-surface-strong);
}
.o-ui-lozenge.o-ui-lozenge-positive.o-ui-lozenge-highlight .o-ui-lozenge-text {
  color: inherit;
}
.o-ui-lozenge.o-ui-lozenge-positive.o-ui-lozenge-highlight .o-ui-lozenge-icon {
  color: inherit;
}
.o-ui-lozenge.o-ui-lozenge-warning {
  background-color: var(--hop-decorative-option6-surface);
  color: var(--hop-decorative-option6-text);
}
.o-ui-lozenge.o-ui-lozenge-warning.o-ui-lozenge-highlight {
  background-color: var(--hop-decorative-option6-surface-strong);
}
.o-ui-lozenge.o-ui-lozenge-warning.o-ui-lozenge-highlight .o-ui-lozenge-icon {
  color: inherit;
}
.o-ui-lozenge.o-ui-lozenge-negative {
  background-color: var(--hop-decorative-option8-surface);
  color: var(--hop-decorative-option8-text);
}
.o-ui-lozenge.o-ui-lozenge-negative.o-ui-lozenge-highlight {
  background-color: var(--hop-decorative-option8-surface-strong);
}
.o-ui-lozenge.o-ui-lozenge-negative.o-ui-lozenge-highlight .o-ui-lozenge-icon {
  color: inherit;
}