.select-kit { &.multi-select { width: 300px; background: var(--secondary); border-radius: 0; .select-kit-filter { & + .selected-content, & + .select-kit-collection { border-top: 1px solid var(--primary-low); } } .select-kit-row { min-height: 1px; border-radius: 0; } &.is-disabled { .multi-select-header { background: var(--primary-low); border-color: var(--primary-low-mid); color: var(--primary-medium); .d-icon { color: var(--primary-medium); } } } .selected-content { display: flex; width: 100%; flex-wrap: wrap; padding: 0; justify-content: flex-start; box-sizing: border-box; border-bottom: 1px solid var(--primary-low); padding: 0.25em 0.25em 0 0.25em; .selected-choice { margin: 0 0.25em 0.25em 0; font-size: var(--font-down-1); &.selected-choice-color { border-bottom: 2px solid transparent; } } } .multi-select-header { background: var(--secondary); border: 1px solid var(--primary-medium); padding: 0 0.25em 0 0.5em; font-weight: 500; font-size: var(--font-0); box-sizing: border-box; overflow: hidden; .formated-selection { margin: 0; border: 0; padding: 0; outline: none; box-shadow: none; cursor: pointer; @include ellipsis; } } .multi-select-header:focus { border-radius: 0; @include default-focus; } &.is-expanded { .multi-select-header { border-radius: 0; @include default-focus; } } } }