@layer components{[data-ui=tag]{width:max-content;height:var(--spacing-24);padding-inline:var(--spacing-8);transition:background-color var(--transition-standard-fast-effects), border-color var(--transition-standard-fast-effects), color var(--transition-standard-fast-effects);border-radius:calc(var(--radius-sm) - var(--spacing-2));color:var(--color-on-surface-variant);font:var(--font-body-sm);align-items:center;gap:var(--spacing-8);-webkit-user-select:none;user-select:none;cursor:pointer;border:1px solid;flex-shrink:0;display:flex}[data-ui=tag][data-variant=stroke]{border-color:var(--color-surface-container-highest);background-color:var(--color-surface)}[data-ui=tag][data-variant=lighter]{background-color:var(--color-surface-container-high);border-color:#0000}[data-ui=tag]:where(:has([data-slot=tag-dismiss]:focus-visible):not([aria-disabled=true]))[data-variant=stroke]{background-color:var(--color-surface-container-high);border-color:#0000}[data-ui=tag]:where(:has([data-slot=tag-dismiss]:focus-visible):not([aria-disabled=true]))[data-variant=lighter]{border-color:var(--color-surface-container-highest);background-color:var(--color-surface)}@media (hover:hover) and (pointer:fine){[data-ui=tag]:hover[data-variant=stroke]{background-color:var(--color-surface-container-high);border-color:#0000}[data-ui=tag]:hover[data-variant=lighter]{border-color:var(--color-surface-container-highest);background-color:var(--color-surface)}}[data-ui=tag]>svg{margin-inline:calc(var(--spacing-4) * -1);transition:color var(--transition-standard-fast-effects);width:var(--spacing-16);height:var(--spacing-16);flex-shrink:0}[data-ui=tag]>img{width:var(--spacing-16);height:var(--spacing-16);margin-inline:calc(var(--spacing-4) * -1);transition:color var(--transition-standard-fast-effects);object-fit:fill;clip-path:circle();flex-shrink:0}[data-ui=tag] [data-slot=tag-dismiss][data-ui=button]{width:var(--spacing-16);height:var(--spacing-16);margin-inline:calc(var(--spacing-6) * -1) calc(var(--spacing-4) * -1);padding:0}@media (hover:hover) and (pointer:fine){[data-ui=tag] [data-slot=tag-dismiss][data-ui=button]:hover{background-color:#0000}}[data-ui=tag] [data-slot=tag-dismiss][data-ui=button]:focus-visible{color:var(--color-on-surface)}@media (hover:hover) and (pointer:fine){[data-ui=tag]:hover>i{color:var(--color-on-surface)}}[data-ui=tag][aria-disabled=true]{background-color:var(--color-surface-container);color:color-mix(in srgb, var(--color-on-surface) 38%, transparent);pointer-events:none;border-color:#0000}}