.icon{--size:20px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 var(--size);width:var(--size);height:var(--size);color:currentColor}.icon svg{width:100%;height:100%}.icon.--xxxl{--size:48px}.icon.--xxl{--size:40px}.icon.--xl{--size:32px}.icon.--lg{--size:24px}.icon.--md{--size:20px}.icon.--sm{--size:16px}.icon.--xs{--size:12px}.icon.--primary svg circle,.icon.--primary svg path,.icon.--primary svg rect{fill:var(--c-primary)}.icon.--white svg circle,.icon.--white svg path,.icon.--white svg rect{fill:#fff}.icon.--black svg circle,.icon.--black svg path,.icon.--black svg rect{fill:#000}.icon.--danger svg circle,.icon.--danger svg path,.icon.--danger svg rect{fill:var(--c-danger)}.icon.--text svg circle,.icon.--text svg path,.icon.--text svg rect{fill:var(--c-text-500)}.icon.--conversion svg circle,.icon.--conversion svg path,.icon.--conversion svg rect{fill:var(--c-conversion)}.icon.--success svg circle,.icon.--success svg path,.icon.--success svg rect{fill:var(--c-success)}