@layer design-system.components{.vds-chip{--chip-height:var(--vds-size-md,2.25rem);--chip-gap:var(--vds-gap-icon,.5rem);--chip-padding-inline:var(--vds-space-3,.75rem);--chip-padding-block:0;--chip-radius:var(--vds-radius-chip,9999px);--chip-border-width:1px;--chip-font-family:var(--vds-font-sans,ui-sans-serif, system-ui, sans-serif);--chip-font-size:var(--vds-text-sm,.875rem);--chip-font-weight:var(--vds-font-weight-medium,500);--chip-line-height:var(--vds-control-line-height,1.5);--chip-letter-spacing:var(--vds-tracking-normal,0);--chip-icon-size:1rem;--chip-icon-radius:var(--vds-radius-full,9999px);--chip-icon-inset-inline-start:calc(var(--vds-space-1,.25rem) * -1);--chip-remove-size:1rem;--chip-remove-radius:var(--vds-radius-full,9999px);--chip-remove-icon-size:.625rem;--chip-remove-inset-inline-end:calc(var(--vds-space-1,.25rem) * -1);--chip-remove-bg:transparent;--chip-remove-bg-hover:color-mix(in oklch, currentColor 20%, transparent);--chip-remove-bg-active:color-mix(in oklch, currentColor 30%, transparent);--chip-transition-duration:var(--vds-duration-fast,.1s);--chip-transition-easing:var(--vds-ease-out,cubic-bezier(0, 0, .2, 1));--chip-focus-ring-color:var(--vds-color-ring,#6366f1);--chip-focus-ring-width:2px;--chip-focus-ring-offset:2px;--chip-background:var(--vds-color-bg-muted,#e5e7eb);--chip-background-hover:var(--vds-color-surface-hover,#f3f4f6);--chip-background-active:var(--vds-color-surface-active,#e5e7eb);--chip-border-color:transparent;--chip-text-color:var(--vds-color-text,#111827);--chip-icon-color:var(--vds-color-text-muted,#6b7280)}.vds-chip[data-variant=primary]{--chip-background:var(--vds-color-primary-bg,#e0e7ff);--chip-background-hover:color-mix(in oklch, var(--vds-color-primary-bg,#e0e7ff), var(--vds-color-primary-solid,#6366f1) 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-primary-bg,#e0e7ff), var(--vds-color-primary-solid,#6366f1) 18%);--chip-text-color:var(--vds-color-primary-text,#3730a3);--chip-icon-color:var(--vds-color-primary-solid,#6366f1)}.vds-chip[data-variant=success]{--chip-background:var(--vds-color-success-bg,#dcfce7);--chip-background-hover:color-mix(in oklch, var(--vds-color-success-bg,#dcfce7), var(--vds-color-success-solid,#22c55e) 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-success-bg,#dcfce7), var(--vds-color-success-solid,#22c55e) 18%);--chip-text-color:var(--vds-color-success-text,#166534);--chip-icon-color:var(--vds-color-success-solid,#22c55e)}.vds-chip[data-variant=warning]{--chip-background:var(--vds-color-warning-bg,#fef3c7);--chip-background-hover:color-mix(in oklch, var(--vds-color-warning-bg,#fef3c7), var(--vds-color-warning-solid,#f59e0b) 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-warning-bg,#fef3c7), var(--vds-color-warning-solid,#f59e0b) 18%);--chip-text-color:var(--vds-color-warning-text,#78350f);--chip-icon-color:var(--vds-color-warning-solid,#f59e0b)}.vds-chip[data-variant=danger]{--chip-background:var(--vds-color-danger-bg,#fee2e2);--chip-background-hover:color-mix(in oklch, var(--vds-color-danger-bg,#fee2e2), var(--vds-color-danger-solid,#ef4444) 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-danger-bg,#fee2e2), var(--vds-color-danger-solid,#ef4444) 18%);--chip-text-color:var(--vds-color-danger-text,#991b1b);--chip-icon-color:var(--vds-color-danger-solid,#ef4444)}.vds-chip[data-variant=info]{--chip-background:var(--vds-color-info-bg,#cffafe);--chip-background-hover:color-mix(in oklch, var(--vds-color-info-bg,#cffafe), var(--vds-color-info-solid,#06b6d4) 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-info-bg,#cffafe), var(--vds-color-info-solid,#06b6d4) 18%);--chip-text-color:var(--vds-color-info-text,#155e75);--chip-icon-color:var(--vds-color-info-solid,#06b6d4)}.vds-chip[data-appearance=solid][data-variant=default],.vds-chip[data-appearance=solid]:not([data-variant]){--chip-background:var(--vds-color-text,#111827);--chip-background-hover:color-mix(in oklch, var(--vds-color-text,#111827), white 10%);--chip-background-active:color-mix(in oklch, var(--vds-color-text,#111827), white 18%);--chip-text-color:var(--vds-color-surface,#fff);--chip-icon-color:var(--vds-color-surface,#fff)}.vds-chip[data-appearance=solid][data-variant=primary]{--chip-background:var(--vds-color-primary-solid,#6366f1);--chip-background-hover:var(--vds-color-primary-solid-hover,#4f46e5);--chip-background-active:var(--vds-color-primary-solid-active,#4338ca);--chip-text-color:var(--vds-color-on-primary,#fff);--chip-icon-color:var(--vds-color-on-primary,#fff)}.vds-chip[data-appearance=solid][data-variant=success]{--chip-background:var(--vds-color-success-solid,#22c55e);--chip-background-hover:var(--vds-color-success-solid-hover,#16a34a);--chip-background-active:var(--vds-color-success-solid-active,#15803d);--chip-text-color:var(--vds-color-on-success,#fff);--chip-icon-color:var(--vds-color-on-success,#fff)}.vds-chip[data-appearance=solid][data-variant=warning]{--chip-background:var(--vds-color-warning-solid,#f59e0b);--chip-background-hover:var(--vds-color-warning-solid-hover,#d97706);--chip-background-active:var(--vds-color-warning-solid-active,#b45309);--chip-text-color:var(--vds-color-on-warning,#111827);--chip-icon-color:var(--vds-color-on-warning,#111827)}.vds-chip[data-appearance=solid][data-variant=danger]{--chip-background:var(--vds-color-danger-solid,#ef4444);--chip-background-hover:var(--vds-color-danger-solid-hover,#dc2626);--chip-background-active:var(--vds-color-danger-solid-active,#b91c1c);--chip-text-color:var(--vds-color-on-danger,#fff);--chip-icon-color:var(--vds-color-on-danger,#fff)}.vds-chip[data-appearance=solid][data-variant=info]{--chip-background:var(--vds-color-info-solid,#06b6d4);--chip-background-hover:var(--vds-color-info-solid-hover,#0891b2);--chip-background-active:var(--vds-color-info-solid-active,#0e7490);--chip-text-color:var(--vds-color-on-info,#fff);--chip-icon-color:var(--vds-color-on-info,#fff)}.vds-chip[data-appearance=outline]{--chip-background:transparent;--chip-background-hover:color-mix(in oklch, currentColor 8%, transparent);--chip-background-active:color-mix(in oklch, currentColor 14%, transparent);--chip-border-color:var(--vds-color-border,#d1d5db)}.vds-chip[data-appearance=outline][data-variant=primary]{--chip-border-color:var(--vds-color-primary-solid,#6366f1);--chip-text-color:var(--vds-color-primary-solid,#6366f1);--chip-icon-color:var(--vds-color-primary-solid,#6366f1)}.vds-chip[data-appearance=outline][data-variant=success]{--chip-border-color:var(--vds-color-success-solid,#22c55e);--chip-text-color:var(--vds-color-success-solid,#22c55e);--chip-icon-color:var(--vds-color-success-solid,#22c55e)}.vds-chip[data-appearance=outline][data-variant=warning]{--chip-border-color:var(--vds-color-warning-solid,#f59e0b);--chip-text-color:var(--vds-color-warning-solid,#f59e0b);--chip-icon-color:var(--vds-color-warning-solid,#f59e0b)}.vds-chip[data-appearance=outline][data-variant=danger]{--chip-border-color:var(--vds-color-danger-solid,#ef4444);--chip-text-color:var(--vds-color-danger-solid,#ef4444);--chip-icon-color:var(--vds-color-danger-solid,#ef4444)}.vds-chip[data-appearance=outline][data-variant=info]{--chip-border-color:var(--vds-color-info-solid,#06b6d4);--chip-text-color:var(--vds-color-info-solid,#06b6d4);--chip-icon-color:var(--vds-color-info-solid,#06b6d4)}.vds-chip[data-size=sm]{--chip-height:var(--vds-size-sm,2rem);--chip-padding-inline:var(--vds-space-2-5,.625rem);--chip-gap:var(--vds-gap-icon-compact,.25rem);--chip-font-size:var(--vds-text-xs,.75rem);--chip-icon-size:.875rem;--chip-remove-size:.875rem;--chip-remove-icon-size:.5rem}.vds-chip[data-size=lg]{--chip-height:var(--vds-size-lg,2.5rem);--chip-padding-inline:var(--vds-space-4,1rem);--chip-gap:var(--vds-gap-icon,.5rem);--chip-font-size:var(--vds-text-base,1rem);--chip-icon-size:1.25rem;--chip-remove-size:1.25rem;--chip-remove-icon-size:.75rem}.vds-chip[data-interactive=true]:hover{--chip-background:var(--chip-background-hover)}.vds-chip[data-interactive=true]:active{--chip-background:var(--chip-background-active)}.vds-chip[aria-disabled=true]{--chip-background:var(--vds-color-bg-disabled,#f3f4f6);--chip-border-color:var(--vds-color-border-disabled,#e5e7eb);--chip-text-color:var(--vds-color-text-disabled,#9ca3af);--chip-icon-color:var(--vds-color-text-disabled,#9ca3af)}}
@layer design-system.components{.vds-chip{justify-content:center;align-items:center;gap:var(--chip-gap);box-sizing:border-box;min-block-size:var(--chip-height);padding-inline:var(--chip-padding-inline);padding-block:var(--chip-padding-block);background-color:var(--chip-background);border:var(--chip-border-width) solid var(--chip-border-color);border-radius:var(--chip-radius);color:var(--chip-text-color);font-family:var(--chip-font-family);font-size:var(--chip-font-size);font-weight:var(--chip-font-weight);line-height:var(--chip-line-height);letter-spacing:var(--chip-letter-spacing);white-space:nowrap;-webkit-user-select:none;user-select:none;vertical-align:middle;transition:background-color var(--chip-transition-duration) var(--chip-transition-easing), border-color var(--chip-transition-duration) var(--chip-transition-easing), color var(--chip-transition-duration) var(--chip-transition-easing);flex:none;display:inline-flex}button.vds-chip,a.vds-chip{cursor:pointer;appearance:none;text-decoration:none}.vds-chip[data-interactive=true]:focus-visible,button.vds-chip:focus-visible,a.vds-chip:focus-visible{outline:var(--chip-focus-ring-width) solid var(--chip-focus-ring-color);outline-offset:var(--chip-focus-ring-offset)}.vds-chip[aria-disabled=true],.vds-chip:disabled{cursor:not-allowed;pointer-events:none}.vds-chip-icon{inline-size:var(--chip-icon-size);block-size:var(--chip-icon-size);border-radius:var(--chip-icon-radius);color:var(--chip-icon-color);flex:none;justify-content:center;align-items:center;margin-inline-start:var(--chip-icon-inset-inline-start);display:inline-flex}.vds-chip-icon>svg,.vds-chip-icon>img{object-fit:cover;border-radius:inherit;block-size:100%;inline-size:100%;display:block}.vds-chip>svg{inline-size:var(--chip-icon-size);block-size:var(--chip-icon-size);flex-shrink:0;display:block}.vds-chip-label{text-overflow:ellipsis;align-items:center;min-block-size:1lh;min-inline-size:0;display:inline-flex;overflow:hidden}.vds-chip-remove{inline-size:var(--chip-remove-size);block-size:var(--chip-remove-size);background-color:var(--chip-remove-bg);border-radius:var(--chip-remove-radius);color:inherit;cursor:pointer;appearance:none;transition:background-color var(--chip-transition-duration) var(--chip-transition-easing);border:0;flex:none;justify-content:center;align-items:center;margin-inline-end:var(--chip-remove-inset-inline-end);padding:0;display:inline-flex}.vds-chip-remove:hover{background-color:var(--chip-remove-bg-hover)}.vds-chip-remove:active{background-color:var(--chip-remove-bg-active)}.vds-chip-remove:focus-visible{outline:var(--chip-focus-ring-width) solid var(--chip-focus-ring-color);outline-offset:1px}.vds-chip-remove>svg{inline-size:var(--chip-remove-icon-size);block-size:var(--chip-remove-icon-size)}}