@use '../abstracts/variables' as *;

.chip {
    display: inline-flex;
    align-items: center;
    gap: $space-1;
    background: var(--color-accent-soft);
    color: var(--color-accent-soft-text);
    border-radius: $radius-full;
    padding: $space-1 $space-2 * 1.25;
    font-size: $font-xs;
}

.chip__remove {
    color: var(--color-accent-strong);
    opacity: 0.6;

    &:hover {
        opacity: 1;
    }
}