.selectable-pill-component{border-radius:1rem;display:inline-flex;flex-direction:row;align-items:center;font-weight:400;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:1px solid transparent;padding:.15rem .5rem;margin:.2rem .3rem;font-size:1rem;line-height:1.5;transition:background-color .3s ease,border-color .3s ease,color .3s ease;cursor:pointer}.selectable-pill-component.pill-emphasized{width:auto;background-color:var(--background-color-secondary);border-radius:1rem;padding:.4rem;margin-top:.5rem;border:solid 1px var(--text-color)}.selectable-pill-component.pill-default{border-color:var(--secondary-text-color);color:var(--text-color)}.selectable-pill-component.pill-default i{color:var(--text-color)}@media (hover: hover){.selectable-pill-component.pill-default:hover{background-color:var(--tertiary-hover);border-color:var(--tertiary-hover);color:var(--tertiary-text-color);transition:background-color .3s ease,color .3s ease}.selectable-pill-component.pill-default:hover i{color:var(--tertiary-text-color)}}.selectable-pill-component.pill-selected{background-color:var(--tertiary);border-color:var(--tertiary);color:var(--tertiary-text-color)}.selectable-pill-component.pill-selected i{color:var(--tertiary-text-color)}.selectable-pill-component.pill-crossed-out{border-color:var(--secondary-text-color);color:var(--secondary-text-color);text-decoration:line-through}@media (hover: hover){.selectable-pill-component.pill-crossed-out:hover{color:var(--secondary-text-color)}}.selectable-pill-component .left-icon{margin-right:var(--small-gap)}.selectable-pill-component .right-icon{padding-left:var(--small-gap)}