[data-theme]{--badge-bg:color-mix(in oklch, var(--ui-primary), transparent 88%);--badge-fg:var(--ui-primary);--badge-border:color-mix(in oklch, var(--ui-primary), transparent 75%);--badge-border-width:var(--ui-border-width);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-primary), transparent 70%);--badge-height-sm:calc(var(--ui-base-spacing) * 6);--badge-height-md:calc(var(--ui-base-spacing) * 7);--badge-height-lg:calc(var(--ui-base-spacing) * 8);--badge-padding-x-sm:calc(var(--ui-base-spacing) * 2.5);--badge-padding-x-md:calc(var(--ui-base-spacing) * 3);--badge-padding-x-lg:calc(var(--ui-base-spacing) * 4);--badge-font-size-sm:var(--ui-text-xs);--badge-font-size-md:var(--ui-text-sm);--badge-font-size-lg:var(--ui-text-base);--badge-gap:calc(var(--ui-base-spacing) * 1);--badge-border-radius:calc(var(--ui-base-radius) * 10);--badge-remove-size:calc(var(--ui-base-spacing) * 5);--badge-transition:var(--ui-base-duration) var(--ui-base-easing)}[data-theme] .badge--secondary{--badge-bg:color-mix(in oklch, var(--ui-secondary), transparent 88%);--badge-fg:var(--ui-secondary);--badge-border:color-mix(in oklch, var(--ui-secondary), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-secondary), transparent 70%)}[data-theme] .badge--accent{--badge-bg:color-mix(in oklch, var(--ui-accent), transparent 88%);--badge-fg:var(--ui-accent);--badge-border:color-mix(in oklch, var(--ui-accent), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-accent), transparent 70%)}[data-theme] .badge--success{--badge-bg:color-mix(in oklch, var(--ui-success), transparent 88%);--badge-fg:var(--ui-success);--badge-border:color-mix(in oklch, var(--ui-success), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-success), transparent 70%)}[data-theme] .badge--danger{--badge-bg:color-mix(in oklch, var(--ui-danger), transparent 88%);--badge-fg:var(--ui-danger);--badge-border:color-mix(in oklch, var(--ui-danger), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-danger), transparent 70%)}[data-theme] .badge--warning{--badge-bg:color-mix(in oklch, var(--ui-warning), transparent 88%);--badge-fg:color-mix(in oklab, var(--ui-warning), var(--ui-surface-foreground) 45%);--badge-border:color-mix(in oklch, var(--ui-warning), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-warning), transparent 70%)}[data-theme] .badge--info{--badge-bg:color-mix(in oklch, var(--ui-info), transparent 88%);--badge-fg:var(--ui-info);--badge-border:color-mix(in oklch, var(--ui-info), transparent 75%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-info), transparent 70%)}[data-theme] .badge--neutral{--badge-bg:color-mix(in oklch, var(--ui-neutral), transparent 88%);--badge-fg:var(--ui-surface-foreground);--badge-border:color-mix(in oklch, var(--ui-neutral), transparent 70%);--badge-remove-hover-bg:color-mix(in oklch, var(--ui-neutral), transparent 65%)}.badge{align-items:center;gap:var(--badge-gap);background-color:var(--badge-bg);max-width:100%;color:var(--badge-fg);border:var(--badge-border-width) solid var(--badge-border);border-radius:var(--badge-border-radius);font-family:var(--ui-font-sans);font-weight:var(--ui-weight-medium);white-space:nowrap;-webkit-user-select:none;user-select:none;display:inline-flex}.badge--sm{height:var(--badge-height-sm);padding:0 var(--badge-padding-x-sm);font-size:var(--badge-font-size-sm)}.badge--md{height:var(--badge-height-md);padding:0 var(--badge-padding-x-md);font-size:var(--badge-font-size-md)}.badge--lg{height:var(--badge-height-lg);padding:0 var(--badge-padding-x-lg);font-size:var(--badge-font-size-lg)}.badge--has-remove.badge--sm{padding-right:calc(var(--badge-padding-x-sm) * .5)}.badge--has-remove.badge--md{padding-right:calc(var(--badge-padding-x-md) * .5)}.badge--has-remove.badge--lg{padding-right:calc(var(--badge-padding-x-lg) * .5)}.badge--disabled{opacity:.5;cursor:not-allowed}.badge__label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.badge__remove{all:unset;width:var(--badge-remove-size);height:var(--badge-remove-size);color:inherit;cursor:pointer;transition:background-color var(--badge-transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.badge__remove:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--badge-remove-hover-bg)}.badge__remove:focus-visible{outline:var(--ui-ring-width) solid currentColor;outline-offset:1px}.badge__remove:disabled,.badge__remove[aria-disabled=true]{cursor:not-allowed}