@layer components.badge{._M5ipq_badge{box-sizing:border-box;gap:var(--spacing-xs);inline-size:max-content;font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);vertical-align:middle;white-space:nowrap;transition:all var(--duration-quick) var(--easing-interactive);justify-content:center;align-items:center;line-height:1;display:inline-flex;& *,& :before,& :after{box-sizing:border-box}&[data-variant=default]{color:var(--color-text-primary);background:var(--color-surface-tertiary)}&[data-variant=secondary]{color:var(--color-text-secondary);background:var(--color-border-secondary)}&[data-variant=success]{color:var(--color-success-hover);background:var(--color-success-surface);border:var(--border-width-thin) solid var(--color-success)}&[data-variant=warning]{color:var(--color-warning-hover);background:var(--color-warning-surface);border:var(--border-width-thin) solid var(--color-warning)}&[data-variant=error]{color:var(--color-danger-hover);background:var(--color-danger-surface);border:var(--border-width-thin) solid var(--color-danger)}&[data-variant=brand]{color:var(--color-badge-brand-default-text);background:var(--color-badge-brand-default-bg)}:where([data-background=accent],[data-background=accent-emphasis]) &[data-variant=brand]{color:var(--color-badge-brand-on-accent-text);background:var(--color-badge-brand-on-accent-bg)}:where([data-background=primary]) &[data-variant=brand]{color:var(--color-badge-brand-default-text);background:var(--color-badge-brand-default-bg)}&[data-variant=danger]{color:var(--color-white);background:var(--color-danger);box-shadow:var(--elevation-2);animation:2s infinite _M5ipq_pulse}&[data-variant=accent]{color:var(--color-badge-accent-default-text);background:var(--color-badge-accent-default-bg);box-shadow:var(--elevation-1)}:where([data-background=accent],[data-background=accent-emphasis]) &[data-variant=accent]{color:var(--color-badge-accent-on-accent-text);background:var(--color-badge-accent-on-accent-bg)}:where([data-background=primary]) &[data-variant=accent]{color:var(--color-badge-accent-default-text);background:var(--color-badge-accent-default-bg)}&[data-size=sm]{padding:var(--spacing-2xs) var(--spacing-xs);font-size:var(--font-size-xs)}&[data-size=md]{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}&[data-size=lg]{padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-sm)}&[data-shape=rounded]{border-radius:var(--radii-sm)}&[data-shape=pill]{border-radius:var(--radii-full)}&[data-shape=square]{border-radius:0}&[data-closable]{padding-inline-end:var(--spacing-xs)}&[data-position=top-left]{position:absolute;inset-block-start:var(--spacing-sm);inset-inline-start:var(--spacing-sm)}&[data-position=top-right]{position:absolute;inset-block-start:var(--spacing-sm);inset-inline-end:var(--spacing-sm)}&[data-position=bottom-left]{position:absolute;inset-block-end:var(--spacing-sm);inset-inline-start:var(--spacing-sm)}&[data-position=bottom-right]{position:absolute;inset-block-end:var(--spacing-sm);inset-inline-end:var(--spacing-sm)}}._M5ipq_badge__content{align-items:center;display:inline-flex}._M5ipq_badge__close{color:currentColor;cursor:pointer;opacity:var(--opacity-75);transition:opacity var(--duration-quick) var(--easing-interactive);background:0 0;border:none;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex;&:hover{opacity:1}&:focus-visible{outline:var(--border-width-thin) solid currentcolor;outline-offset:var(--spacing-xs);opacity:1}&:disabled{cursor:not-allowed;opacity:var(--opacity-50)}}._M5ipq_badge__closeIcon{inline-size:var(--spacing-md);block-size:var(--spacing-md)}}@layer animations{@keyframes _M5ipq_pulse{0%,to{opacity:1}50%{opacity:var(--opacity-75)}}}@media (prefers-reduced-motion:reduce){@layer components.badge{._M5ipq_badge{transition:none;&[data-variant=danger]{animation:none}}}}@media (prefers-contrast:high){@layer components.badge{._M5ipq_badge{&[data-variant=default]{color:var(--color-text-primary);background:var(--color-surface-primary);border:var(--border-width-thin) solid var(--color-text-primary)}&[data-variant=secondary]{color:var(--color-text-secondary);background:var(--color-surface-primary);border:var(--border-width-thin) solid var(--color-text-secondary)}&[data-variant=success]{color:var(--color-success);background:var(--color-surface-primary);border:var(--border-width-regular) solid var(--color-success)}&[data-variant=warning]{color:var(--color-warning);background:var(--color-surface-primary);border:var(--border-width-regular) solid var(--color-warning)}&[data-variant=error],&[data-variant=danger]{color:var(--color-danger);background:var(--color-surface-primary);border:var(--border-width-regular) solid var(--color-danger)}&[data-variant=brand],&[data-variant=accent]{color:var(--color-primary);background:var(--color-surface-primary);border:var(--border-width-regular) solid var(--color-primary)}}}}