@dnb/eufemia/cjs/extensions/forms/Field/MultiSelection/style/dnb-multi-selection.min.css

DNB Eufemia Design System UI Library

.dnb-forms-field-multi-selection__container{display:flex;flex-direction:column;gap:1rem;width:100%}.dnb-forms-field-multi-selection__popover{--popover-border-radius:var(--token-radius-lg)}.dnb-forms-field-multi-selection__popover.dnb-popover{min-width:auto}.dnb-forms-field-multi-selection__search{padding:0 0 1rem}.dnb-forms-field-multi-selection__items{display:flex;flex-direction:column}.dnb-forms-field-multi-selection__items:focus-visible{outline:var(--focus-ring-width) solid var(--token-color-stroke-action-focus);outline-offset:var(--focus-ring-offset)}.dnb-forms-field-multi-selection__list{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}.dnb-forms-field-multi-selection__item-details{display:flex;flex-direction:column;gap:0;padding-left:2.35rem}.dnb-forms-field-multi-selection__item-description,.dnb-forms-field-multi-selection__item-text{display:block;word-break:break-word}.dnb-forms-field-multi-selection__item-description{color:var(--token-color-text-neutral-alternative)}.dnb-forms-field-multi-selection__item{--item-outline-width:0.0625rem;--item-outline-width--hover:0.125rem;--item-outline-width--active:0.0625rem;--item-outline-width--focus:var(--focus-ring-width);background-color:var(--item-background-color,transparent);display:flex;flex-direction:column;padding:1rem .5rem 1rem 1rem;position:relative}.dnb-forms-field-multi-selection__item:after{border:var(--item-outline-width) solid var(--item-outline-color,transparent);border-bottom:var(--item-outline-width) solid var(--item-outline-color,var(--item-outline-bottom-color,transparent));bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.dnb-forms-field-multi-selection__item{cursor:pointer}.dnb-forms-field-multi-selection__item .dnb-checkbox{align-self:center;width:100%}.dnb-forms-field-multi-selection__item .dnb-checkbox .dnb-checkbox__label{font-size:var(--font-size-basis)}.dnb-forms-field-multi-selection__item--parent:not(.dnb-forms-field-multi-selection__item--selected){--item-background-color:var(
    --token-color-background-neutral-alternative
  )}.dnb-forms-field-multi-selection__item--selected{--item-background-color:var(
    --token-color-background-selected-subtle
  )}.dnb-forms-field-multi-selection__item--select-all{--item-outline-bottom-color:var(
    --token-color-stroke-neutral-subtle
  )}.dnb-forms-field-multi-selection__item--disabled{cursor:not-allowed;opacity:.5}.dnb-forms-field-multi-selection__item .dnb-checkbox__input{--checkbox-bounding--medium:100}.dnb-forms-field-multi-selection__item:has(.dnb-checkbox__input){overflow:clip}.dnb-forms-field-multi-selection__item:hover:not(.dnb-forms-field-multi-selection__item--disabled){--item-outline-color:var(--token-color-stroke-action);--item-outline-width:var(--item-outline-width--hover)}.dnb-forms-field-multi-selection__item:hover:not(.dnb-forms-field-multi-selection__item--disabled):after{z-index:2}.dnb-forms-field-multi-selection__item:active:not(.dnb-forms-field-multi-selection__item--disabled){--item-outline-color:var(--token-color-stroke-action-pressed);--item-outline-width:var(--item-outline-width--active)}.dnb-forms-field-multi-selection__item .dnb-checkbox__order .dnb-form-label{padding-left:1rem}html[data-whatinput=keyboard] .dnb-forms-field-multi-selection__item:has(.dnb-checkbox__input:focus){--item-outline-color:var(--token-color-stroke-action-focus);--item-outline-width:var(--item-outline-width--focus);--item-background-color:var(
    --token-color-background-action-focus-subtle
  )}html[data-whatinput=keyboard] .dnb-forms-field-multi-selection__item:has(.dnb-checkbox__input:focus),html[data-whatinput=keyboard] .dnb-forms-field-multi-selection__item:has(.dnb-checkbox__input:focus) .dnb-form-label,html[data-whatinput=keyboard] .dnb-forms-field-multi-selection__item:has(.dnb-checkbox__input:focus) .dnb-forms-field-multi-selection__item-description{color:var(--token-color-text-action-focus)}.dnb-forms-field-multi-selection__popover-content{--inner-space:2.5rem;display:flex;flex-direction:column;width:calc(var(--forms-field-width--large) - var(--inner-space, 0))}@media screen and (max-width:25em){.dnb-forms-field-multi-selection__popover-content{width:70dvw}}.dnb-forms-field-multi-selection__popover-content{max-height:calc(var(--popover-max-height, 90dvh) - var(--inner-space, 0))}.dnb-popover--no-inner-space .dnb-forms-field-multi-selection__popover-content{--inner-space:-0.5rem}.dnb-forms-field-multi-selection__popover-content:focus{outline:none}.dnb-forms-field-multi-selection__popover-content:focus-visible{outline:var(--focus-ring-width) solid var(--token-color-stroke-action-focus);outline-offset:var(--focus-ring-offset)}.dnb-forms-field-multi-selection__nested-items{background-color:var(--token-color-background-neutral);display:flex;flex-direction:column;list-style:none;margin:0;padding:0}.dnb-forms-field-multi-selection__item--level-1{padding-left:2rem}.dnb-forms-field-multi-selection__item--level-2{padding-left:3rem}.dnb-forms-field-multi-selection__item--level-3{padding-left:4rem}.dnb-forms-field-multi-selection__no-options{align-items:center;display:flex;justify-content:center;padding:1rem}.dnb-forms-field-multi-selection__no-options-text{color:var(--token-color-text-neutral-alternative)}.dnb-forms-field-multi-selection__selected-items__inner{display:flex;flex-wrap:wrap;gap:.5rem;margin:-.125rem 0 0 -.125rem;max-height:10rem;padding:.125rem 0 1rem .125rem}.dnb-forms-field-multi-selection__search~.dnb-forms-field-multi-selection__selected-items .dnb-forms-field-multi-selection__selected-items__inner{padding-top:1rem}.dnb-forms-field-multi-selection__actions{align-items:center;display:flex;gap:1.5rem;padding-top:1rem}.dnb-forms-field-multi-selection__selected-items-header{padding:.5rem 0}.dnb-forms-field-multi-selection--inline .dnb-forms-field-multi-selection__inline-content{display:flex;flex-direction:column}.dnb-forms-field-multi-selection--inline .dnb-forms-field-multi-selection__items{max-height:none}