.pill{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .625rem;border-radius:9999px;border:1px solid var(--color-border, rgb(226, 232, 240));background-color:var(--color-surface, rgb(248, 250, 252));color:var(--color-text, rgb(51, 65, 85));font-size:.8125rem;font-weight:500;line-height:1.4;white-space:nowrap;cursor:default;transition:all .15s ease;text-decoration:none}.pill svg{width:.875rem;height:.875rem;flex-shrink:0}.pill--sm{padding:.125rem .5rem;font-size:.75rem;gap:.25rem}.pill--sm svg{width:.75rem;height:.75rem}.pill--primary{background-color:#2ac8641a;border-color:#2ac8644d;color:#1a7f3e}.pill--secondary{background-color:#f1f5f9;border-color:#e2e8f0;color:#475569}.pill--info{background-color:#3b82f61a;border-color:#3b82f64d;color:#1d4ed8}.pill--success{background-color:#22c55e1a;border-color:#22c55e4d;color:#15803d}.pill--warning{background-color:#eab3081a;border-color:#eab3084d;color:#a16207}.pill--error{background-color:#ef44441a;border-color:#ef44444d;color:#b91c1c}.pill--interactive{cursor:pointer}.pill--interactive:hover{border-color:var(--color-primary, #2AC864);background-color:#2ac8640d}.pill--interactive:active{transform:scale(.97)}.pill--selected{background-color:var(--color-primary, #2AC864);border-color:var(--color-primary, #2AC864);color:#fff}.pill--selected:hover{background-color:var(--color-secondary, #25B858);border-color:var(--color-secondary, #25B858)}.pill--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.pill--closable{padding-right:.375rem}.pill__close{display:inline-flex;align-items:center;justify-content:center;width:1.125rem;height:1.125rem;margin-left:.125rem;border:none;background:#0000001a;border-radius:50%;color:currentColor;cursor:pointer;opacity:.7;transition:all .15s;padding:0}.pill__close:hover{opacity:1;background:#0003}.pill__close svg{width:.625rem;height:.625rem}.pill--sm .pill__close{width:.875rem;height:.875rem}.pill--sm .pill__close svg{width:.5rem;height:.5rem}.pill__icon{display:flex;align-items:center;flex-shrink:0}.pill-group{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.pill-group--compact{gap:.25rem}.pill:focus-visible{outline:2px solid var(--color-primary, #2AC864);outline-offset:2px}@media (prefers-color-scheme: dark){.pill{background-color:#ffffff0d;border-color:#ffffff1a;color:#e2e8f0}.pill__close{background:#ffffff1a}.pill__close:hover{background:#fff3}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/component-pill.css.map */