@digdir/designsystemet-css 1.16.1 → 1.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/src/avatar.css +1 -1
  2. package/dist/src/chip.css +1 -1
  3. package/dist/src/field.css +1 -1
  4. package/dist/src/fieldset.css +1 -1
  5. package/dist/src/index.css +2 -2
  6. package/dist/src/suggestion.css +1 -1
  7. package/dist/src/v2/index.css +2 -2
  8. package/dist/theme/designsystemet.css +1 -1
  9. package/package.json +2 -2
  10. package/theme/types.d.ts +1 -1
package/dist/src/suggestion.css CHANGED
@@ -1 +1 @@
1
- .ds-suggestion{--dsc-suggestion-option-background--hover:var(--ds-color-surface-hover);--dsc-suggestion-option-background--selected:var(--ds-color-surface-active);--dsc-suggestion-option-border-radius:var(--ds-border-radius-md);--dsc-suggestion-option-checkmark-size:var(--ds-size-6);--dsc-suggestion-option-checkmark-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M18.998 6.94a.75.75 0 0 1 .063 1.058l-8 9a.75.75 0 0 1-1.091.032l-5-5a.75.75 0 1 1 1.06-1.06l4.438 4.437 7.471-8.405A.75.75 0 0 1 19 6.939' clip-rule='evenodd'/%3E%3C/svg%3E");--dsc-suggestion-option-padding:var(--ds-size-3);--dsc-suggestion-option-gap:var(--ds-size-2);--dsc-suggestion-option-checkmark-border:max(2px,0.125rem);--dsc-suggestion-option-checkmark-border-color:var(--ds-color-neutral-border-default);--dsc-suggestion-clear-gap:var(--ds-size-2);--dsc-suggestion-clear-padding:var(--ds-size-1);--dsc-suggestion-clear-size:var(--ds-size-9);--dsc-suggestion-clear-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-suggestion-clear-border-radius:var(--ds-border-radius-md);--dsc-suggestion-clear-background--hover:var(--ds-color-surface-hover);--dsc-suggestion-clear-background--active:var(--ds-color-surface-active);--dsc-suggestion-list-background:var(--ds-color-neutral-surface-default);--dsc-suggestion-list-border-radius:var(--ds-border-radius-md);--dsc-suggestion-list-box-shadow:var(--ds-shadow-md);--dsc-suggestion-list-color:var(--ds-color-text-default);--dsc-suggestion-list-offset:var(--ds-size-1);--dsc-suggestion-list-gap:var(--ds-size-1);--dsc-suggestion-list-placement:bottom;--dsc-suggestion-list-padding:var(--ds-size-3) var(--ds-size-2);--dsc-suggestion-border-width:var(--ds-border-width-default);--dsc-suggestion-border-style:solid;--dsc-suggestion-border-color:var(--ds-color-neutral-border-subtle);--dsc-suggestion-chip-gap:var(--ds-size-1);--dsc-suggestion-chip-background:var(--ds-color-base-default);--dsc-suggestion-chip-background--hover:var(--ds-color-base-hover);--dsc-suggestion-chip-border-width:var(--ds-border-width-default);--dsc-suggestion-chip-height:var(--ds-size-8);--dsc-suggestion-chip-font-size:var(--ds-body-sm-font-size);--dsc-suggestion-chip-border-style:solid;--dsc-suggestion-chip-border-color:transparent;--dsc-suggestion-chip-border-radius:var(--ds-border-radius-full);--dsc-suggestion-chip-padding:0 var(--ds-size-3);--dsc-suggestion-chip-color:var(--ds-color-base-contrast-default);--dsc-suggestion-chip-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-suggestion-chip-icon-size:var(--ds-icon-size);--dsc-suggestion-chip-input-size:var(--ds-size-5);--dsc-suggestion-chip-spacing:calc((var(--dsc-suggestion-chip-height) - var(--dsc-suggestion-chip-input-size))/2);box-sizing:border-box;flex-wrap:wrap;gap:var(--ds-size-1);position:relative}.ds-suggestion:not([hidden]){display:flex}.ds-suggestion:not([data-multiple]) data,.ds-suggestion[data-multiple=false] data{display:none}.ds-suggestion:not(:has(data))::part(items){position:absolute}.ds-suggestion>data{align-items:center;background:var(--dsc-suggestion-chip-background);border-color:var(--dsc-suggestion-chip-border-color);border-radius:var(--dsc-suggestion-chip-border-radius);border-style:var(--dsc-suggestion-chip-border-style);border-width:var(--dsc-suggestion-chip-border-width);box-sizing:border-box;color:var(--dsc-suggestion-chip-color);cursor:pointer;display:inline-flex;font-size:var(--dsc-suggestion-chip-font-size);height:var(--dsc-suggestion-chip-height);line-height:var(--ds-line-height-sm);margin-bottom:var(--dsc-suggestion-chip-gap);padding:var(--dsc-suggestion-chip-padding);padding-inline-end:var(--dsc-suggestion-chip-spacing);white-space:none}:is(.ds-suggestion>data):after{content:"";background:currentcolor;height:var(--dsc-suggestion-chip-icon-size);-webkit-mask:center/contain no-repeat var(--dsc-suggestion-chip-icon-url);mask:center/contain no-repeat var(--dsc-suggestion-chip-icon-url);width:var(--dsc-suggestion-chip-icon-size);padding-inline:0;margin-left:var(--dsc-suggestion-chip-gap)}@media (forced-colors:active){:is(.ds-suggestion>data):after{background-color:CanvasText;forced-color-adjust:none}}.ds-suggestion>data{-webkit-print-color-adjust:exact;print-color-adjust:exact}:is(.ds-suggestion>data):focus{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}:is(.ds-suggestion>data):focus *{--_ds--focus: }:is(.ds-suggestion>data):hover{background:var(--dsc-suggestion-chip-background--hover)}:is(.ds-suggestion>data):has(+data){margin-inline-end:var(--dsc-suggestion-chip-gap)}.ds-suggestion u-datalist[data-is-floating]:not([style*=translate]){opacity:0}.ds-suggestion u-datalist{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;margin:0;overflow:visible;position:absolute}:is(.ds-suggestion u-datalist):before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:"";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}[data-overscroll=contain]:is(.ds-suggestion u-datalist){--_ds-floating-overscroll:contain;overscroll-behavior:contain;overflow:auto}.ds-suggestion u-datalist{&[data-floating|=top]:before{top:100%;rotate:45deg}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{top:0;rotate:-135deg}&[data-floating|=left]:before{left:100%;rotate:-45deg}--_ds-floating:var(--dsc-suggestion-list-placement);--_ds-floating-overscroll:fit;--_ds-floating-arrow-visibility:hidden;--_ds-floating-arrow-size:var(--ds-size-2);background:var(--dsc-suggestion-list-background);border-color:var(--dsc-suggestion-border-color);border-radius:var(--dsc-suggestion-list-border-radius);border-style:var(--dsc-suggestion-border-style);border-width:var(--dsc-suggestion-border-width);box-shadow:var(--dsc-suggestion-list-box-shadow);box-sizing:border-box;color:var(--dsc-suggestion-list-color);display:none;inset:0 auto auto 0;overflow:auto;overscroll-behavior:contain;padding:var(--dsc-suggestion-list-padding)}:is(.ds-suggestion u-datalist):not([popover]){margin-top:var(--dsc-suggestion-list-offset);z-index:1600;inset:100% 0 auto 0}:is(.ds-suggestion u-datalist):not([hidden]):not(:empty){display:grid;align-content:start;gap:var(--dsc-suggestion-list-gap)}:is(.ds-suggestion u-datalist)>u-option{padding:var(--dsc-suggestion-option-padding);border:none;outline:none;border-radius:var(--dsc-suggestion-option-border-radius);cursor:pointer;position:relative;outline-offset:calc(var(--dsc-suggestion-option-activedecendant-outline-width)*-1);line-height:var(--ds-line-height-sm)}@media (hover:hover) and (pointer:fine){:is(:is(.ds-suggestion u-datalist)>u-option):not([data-empty]):where(:hover){background:var(--dsc-suggestion-option-background--hover)}}[selected]:is(:is(.ds-suggestion u-datalist)>u-option){padding-inline-start:calc(var(--dsc-suggestion-option-padding) + var(--dsc-suggestion-option-checkmark-size) + var(--dsc-suggestion-option-gap));background-color:var(--dsc-suggestion-option-background--selected)}[selected]:is(:is(.ds-suggestion u-datalist)>u-option):before{content:"";position:absolute;inset-inline-start:var(--dsc-suggestion-option-padding);-webkit-mask:var(--dsc-suggestion-option-checkmark-url) center /contain no-repeat;mask:var(--dsc-suggestion-option-checkmark-url) center /contain no-repeat;background:currentcolor;width:var(--dsc-suggestion-option-checkmark-size);height:var(--dsc-suggestion-option-checkmark-size)}@media (forced-colors:active){[selected]:is(:is(.ds-suggestion u-datalist)>u-option):before{background-color:LinkText;forced-color-adjust:none}}[data-activedescendant]:is(:is(.ds-suggestion u-datalist)>u-option){box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-middle));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, 0))}[data-activedescendant]:is(:is(.ds-suggestion u-datalist)>u-option) *{--_ds--focus: }:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty]){padding-inline-start:calc(var(--dsc-suggestion-option-padding) + var(--dsc-suggestion-option-checkmark-size) + var(--dsc-suggestion-option-gap))}:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{content:"";position:absolute;inset-inline-start:var(--dsc-suggestion-option-padding);-webkit-mask:none;mask:none;width:var(--dsc-suggestion-option-checkmark-size);height:var(--dsc-suggestion-option-checkmark-size);border-radius:var(--ds-border-radius-sm);outline:var(--dsc-suggestion-option-checkmark-border) solid var(--dsc-suggestion-option-checkmark-border-color);outline-offset:calc(var(--dsc-suggestion-option-checkmark-border)*-1);padding:.188rem;box-sizing:border-box;translate:0 calc(.5lh - 50%)}[selected]:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{background-color:var(--ds-color-base-default);color:var(--ds-color-base-contrast-default);outline:none;--_stroke-width:0.05em;--_stroke-width-fallback:0.05em;--_diagonal-1:transparent calc(48% - var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-2:currentcolor calc(50% - var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-3:currentcolor calc(50% + var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-4:transparent calc(52% + var(--_stroke-width, var(--_stroke-width-fallback)));background-origin:content-box;background-repeat:no-repeat;background-position:10% 73%,90% 50%;background-size:35% 35%,65% 65%;background-image:linear-gradient(45deg,var(--_diagonal-1),var(--_diagonal-2),var(--_diagonal-3),var(--_diagonal-4)),linear-gradient(-45deg,var(--_diagonal-1),var(--_diagonal-2),var(--_diagonal-3),var(--_diagonal-4))}@media (forced-colors:active){[selected]:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{background-color:LinkText;border-color:LinkText;forced-color-adjust:none}}.ds-suggestion:has(input:-moz-placeholder) input{padding-inline-end:2.4em;background-image:linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4));background-position:calc(100% - 1.2em + var(--dsc-input-stroke-width)),calc(100% - .8em);background-size:.4em .4em;background-repeat:no-repeat}.ds-suggestion:has(input:placeholder-shown) input{padding-inline-end:2.4em;background-image:linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4));background-position:calc(100% - 1.2em + var(--dsc-input-stroke-width)),calc(100% - .8em);background-size:.4em .4em;background-repeat:no-repeat}:dir(rtl) :is(.ds-suggestion:has(input:-moz-placeholder) input){background-position:calc(1.2em - var(--dsc-input-stroke-width)),.8em}:dir(rtl) :is(.ds-suggestion:has(input:placeholder-shown) input){background-position:calc(1.2em - var(--dsc-input-stroke-width)),.8em}@media (forced-colors:active){.ds-suggestion:has(input:-moz-placeholder) input{-moz-appearance:auto;appearance:auto}.ds-suggestion:has(input:placeholder-shown) input{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}.ds-suggestion:has(input:-moz-placeholder):has(:popover-open) input{background-image:linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4))}.ds-suggestion:has(input:placeholder-shown):has(:popover-open) input{background-image:linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4))}.ds-suggestion input[inputmode=none]{box-shadow:none;outline:none}.ds-suggestion:has(input:is(:-moz-read-only,:disabled,[aria-disabled=true])) :is(del,button[type=reset]){visibility:hidden}.ds-suggestion :is(del[hidden],button[type=reset][hidden]),.ds-suggestion:has(input:is(:read-only,:disabled,[aria-disabled=true])) :is(del,button[type=reset]){visibility:hidden}.ds-suggestion:has(:is(del,button[type=reset])) input{padding-inline-end:calc(var(--dsc-suggestion-clear-size) + var(--dsc-suggestion-clear-gap))}.ds-suggestion input[type=search]::-webkit-search-cancel-button{display:none}.ds-suggestion :is(del,button[type=reset]){--dsc-button-size:var(--dsc-suggestion-clear-size);display:grid;align-self:center;margin-inline-start:calc((var(--dsc-suggestion-clear-size) + var(--dsc-suggestion-clear-gap))*-1);order:999;box-sizing:border-box;border-radius:var(--dsc-suggestion-clear-border-radius);padding:var(--dsc-suggestion-clear-padding);height:var(--dsc-suggestion-clear-size);width:var(--dsc-suggestion-clear-size);cursor:pointer;position:relative;scale:.75;z-index:2;outline:none}:is(.ds-suggestion :is(del,button[type=reset])):focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}:is(.ds-suggestion :is(del,button[type=reset])):focus-visible *{--_ds--focus: }:is(.ds-suggestion :is(del,button[type=reset])):hover{background:var(--dsc-suggestion-clear-background--hover)}:is(.ds-suggestion :is(del,button[type=reset])):active{background:var(--dsc-suggestion-clear-background--active)}:is(.ds-suggestion :is(del,button[type=reset])):before{content:"";-webkit-mask:var(--dsc-suggestion-clear-icon-url) center /contain no-repeat;mask:var(--dsc-suggestion-clear-icon-url) center /contain no-repeat;background:currentcolor}@media (forced-colors:active){:is(.ds-suggestion :is(del,button[type=reset])):before{background-color:canvastext;forced-color-adjust:none}}
1
+ .ds-suggestion{--dsc-suggestion-option-background--hover:var(--ds-color-surface-hover);--dsc-suggestion-option-background--selected:var(--ds-color-surface-active);--dsc-suggestion-option-border-radius:var(--ds-border-radius-md);--dsc-suggestion-option-checkmark-size:var(--ds-size-6);--dsc-suggestion-option-checkmark-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M18.998 6.94a.75.75 0 0 1 .063 1.058l-8 9a.75.75 0 0 1-1.091.032l-5-5a.75.75 0 1 1 1.06-1.06l4.438 4.437 7.471-8.405A.75.75 0 0 1 19 6.939' clip-rule='evenodd'/%3E%3C/svg%3E");--dsc-suggestion-option-padding:var(--ds-size-3);--dsc-suggestion-option-gap:var(--ds-size-2);--dsc-suggestion-option-checkmark-border:max(2px,0.125rem);--dsc-suggestion-option-checkmark-border-color:var(--ds-color-neutral-border-default);--dsc-suggestion-clear-gap:var(--ds-size-2);--dsc-suggestion-clear-padding:var(--ds-size-1);--dsc-suggestion-clear-size:var(--ds-size-9);--dsc-suggestion-clear-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-suggestion-clear-border-radius:var(--ds-border-radius-md);--dsc-suggestion-clear-background--hover:var(--ds-color-surface-hover);--dsc-suggestion-clear-background--active:var(--ds-color-surface-active);--dsc-suggestion-list-background:var(--ds-color-neutral-surface-default);--dsc-suggestion-list-border-radius:var(--ds-border-radius-md);--dsc-suggestion-list-box-shadow:var(--ds-shadow-md);--dsc-suggestion-list-color:var(--ds-color-text-default);--dsc-suggestion-list-offset:var(--ds-size-1);--dsc-suggestion-list-gap:var(--ds-size-1);--dsc-suggestion-list-placement:bottom;--dsc-suggestion-list-padding:var(--ds-size-3) var(--ds-size-2);--dsc-suggestion-border-width:var(--ds-border-width-default);--dsc-suggestion-border-style:solid;--dsc-suggestion-border-color:var(--ds-color-neutral-border-subtle);--dsc-suggestion-chip-gap:var(--ds-size-1);--dsc-suggestion-chip-background:var(--ds-color-base-default);--dsc-suggestion-chip-background--hover:var(--ds-color-base-hover);--dsc-suggestion-chip-border-width:var(--ds-border-width-default);--dsc-suggestion-chip-height:var(--ds-size-8);--dsc-suggestion-chip-font-size:var(--ds-body-sm-font-size);--dsc-suggestion-chip-border-style:solid;--dsc-suggestion-chip-border-color:transparent;--dsc-suggestion-chip-border-radius:var(--ds-border-radius-full);--dsc-suggestion-chip-padding:0 var(--ds-size-3);--dsc-suggestion-chip-color:var(--ds-color-base-contrast-default);--dsc-suggestion-chip-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-suggestion-chip-icon-size:var(--ds-icon-size);--dsc-suggestion-chip-input-size:var(--ds-size-5);--dsc-suggestion-chip-spacing:calc((var(--dsc-suggestion-chip-height) - var(--dsc-suggestion-chip-input-size))/2);box-sizing:border-box;flex-wrap:wrap;gap:var(--ds-size-1);position:relative}.ds-suggestion:not([hidden]){display:flex}.ds-suggestion:not([data-multiple]) data,.ds-suggestion[data-multiple=false] data{display:none}.ds-suggestion:not(:has(data))::part(items){position:absolute}.ds-suggestion[data-multiple]::part(items){display:flex;flex-wrap:wrap;gap:var(--dsc-suggestion-chip-gap);max-width:100%}.ds-suggestion>data{background:var(--dsc-suggestion-chip-background);border-color:var(--dsc-suggestion-chip-border-color);border-radius:var(--dsc-suggestion-chip-border-radius);border-style:var(--dsc-suggestion-chip-border-style);border-width:var(--dsc-suggestion-chip-border-width);box-sizing:border-box;color:var(--dsc-suggestion-chip-color);cursor:pointer;display:block;font-size:var(--dsc-suggestion-chip-font-size);height:var(--dsc-suggestion-chip-height);line-height:var(--ds-line-height-sm);min-width:0;overflow:hidden;padding:var(--dsc-suggestion-chip-padding);padding-block:calc(var(--dsc-suggestion-chip-height)/2 - var(--dsc-suggestion-chip-border-width)/2 - .5lh);padding-inline-end:calc(var(--dsc-suggestion-chip-spacing)*2 + var(--dsc-suggestion-chip-icon-size));position:relative;text-overflow:ellipsis;white-space:nowrap}:is(.ds-suggestion>data):after{content:"";background:currentcolor;height:var(--dsc-suggestion-chip-icon-size);inset-block-start:50%;inset-inline-end:var(--dsc-suggestion-chip-spacing);margin-left:var(--dsc-suggestion-chip-gap);-webkit-mask:center/contain no-repeat var(--dsc-suggestion-chip-icon-url);mask:center/contain no-repeat var(--dsc-suggestion-chip-icon-url);padding-inline:0;position:absolute;translate:0 -50%;width:var(--dsc-suggestion-chip-icon-size)}@media (forced-colors:active){:is(.ds-suggestion>data):after{background-color:CanvasText;forced-color-adjust:none}}.ds-suggestion>data{-webkit-print-color-adjust:exact;print-color-adjust:exact}:is(.ds-suggestion>data):focus{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}:is(.ds-suggestion>data):focus *{--_ds--focus: }:is(.ds-suggestion>data):hover{background:var(--dsc-suggestion-chip-background--hover)}.ds-suggestion u-datalist[data-is-floating]:not([style*=translate]){opacity:0}.ds-suggestion u-datalist{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;margin:0;overflow:visible;position:absolute}:is(.ds-suggestion u-datalist):before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:"";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}[data-overscroll=contain]:is(.ds-suggestion u-datalist){--_ds-floating-overscroll:contain;overscroll-behavior:contain;overflow:auto}.ds-suggestion u-datalist{&[data-floating|=top]:before{top:100%;rotate:45deg}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{top:0;rotate:-135deg}&[data-floating|=left]:before{left:100%;rotate:-45deg}--_ds-floating:var(--dsc-suggestion-list-placement);--_ds-floating-overscroll:fit;--_ds-floating-arrow-visibility:hidden;--_ds-floating-arrow-size:var(--ds-size-2);background:var(--dsc-suggestion-list-background);border-color:var(--dsc-suggestion-border-color);border-radius:var(--dsc-suggestion-list-border-radius);border-style:var(--dsc-suggestion-border-style);border-width:var(--dsc-suggestion-border-width);box-shadow:var(--dsc-suggestion-list-box-shadow);box-sizing:border-box;color:var(--dsc-suggestion-list-color);display:none;inset:0 auto auto 0;overflow:auto;overscroll-behavior:contain;padding:var(--dsc-suggestion-list-padding)}:is(.ds-suggestion u-datalist):not([popover]){margin-top:var(--dsc-suggestion-list-offset);z-index:1600;inset:100% 0 auto 0}:is(.ds-suggestion u-datalist):not([hidden]):not(:empty){display:grid;align-content:start;gap:var(--dsc-suggestion-list-gap)}:is(.ds-suggestion u-datalist)>u-option{padding:var(--dsc-suggestion-option-padding);border:none;outline:none;border-radius:var(--dsc-suggestion-option-border-radius);cursor:pointer;position:relative;outline-offset:calc(var(--dsc-suggestion-option-activedecendant-outline-width)*-1);line-height:var(--ds-line-height-sm)}@media (hover:hover) and (pointer:fine){:is(:is(.ds-suggestion u-datalist)>u-option):not([data-empty]):where(:hover){background:var(--dsc-suggestion-option-background--hover)}}[selected]:is(:is(.ds-suggestion u-datalist)>u-option){padding-inline-start:calc(var(--dsc-suggestion-option-padding) + var(--dsc-suggestion-option-checkmark-size) + var(--dsc-suggestion-option-gap));background-color:var(--dsc-suggestion-option-background--selected)}[selected]:is(:is(.ds-suggestion u-datalist)>u-option):before{content:"";position:absolute;inset-inline-start:var(--dsc-suggestion-option-padding);-webkit-mask:var(--dsc-suggestion-option-checkmark-url) center /contain no-repeat;mask:var(--dsc-suggestion-option-checkmark-url) center /contain no-repeat;background:currentcolor;width:var(--dsc-suggestion-option-checkmark-size);height:var(--dsc-suggestion-option-checkmark-size)}@media (forced-colors:active){[selected]:is(:is(.ds-suggestion u-datalist)>u-option):before{background-color:LinkText;forced-color-adjust:none}}[data-activedescendant]:is(:is(.ds-suggestion u-datalist)>u-option){box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-middle));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, 0))}[data-activedescendant]:is(:is(.ds-suggestion u-datalist)>u-option) *{--_ds--focus: }:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty]){padding-inline-start:calc(var(--dsc-suggestion-option-padding) + var(--dsc-suggestion-option-checkmark-size) + var(--dsc-suggestion-option-gap))}:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{content:"";position:absolute;inset-inline-start:var(--dsc-suggestion-option-padding);-webkit-mask:none;mask:none;width:var(--dsc-suggestion-option-checkmark-size);height:var(--dsc-suggestion-option-checkmark-size);border-radius:var(--ds-border-radius-sm);outline:var(--dsc-suggestion-option-checkmark-border) solid var(--dsc-suggestion-option-checkmark-border-color);outline-offset:calc(var(--dsc-suggestion-option-checkmark-border)*-1);padding:.188rem;box-sizing:border-box;translate:0 calc(.5lh - 50%)}[selected]:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{background-color:var(--ds-color-base-default);color:var(--ds-color-base-contrast-default);outline:none;--_stroke-width:0.05em;--_stroke-width-fallback:0.05em;--_diagonal-1:transparent calc(48% - var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-2:currentcolor calc(50% - var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-3:currentcolor calc(50% + var(--_stroke-width, var(--_stroke-width-fallback)));--_diagonal-4:transparent calc(52% + var(--_stroke-width, var(--_stroke-width-fallback)));background-origin:content-box;background-repeat:no-repeat;background-position:10% 73%,90% 50%;background-size:35% 35%,65% 65%;background-image:linear-gradient(45deg,var(--_diagonal-1),var(--_diagonal-2),var(--_diagonal-3),var(--_diagonal-4)),linear-gradient(-45deg,var(--_diagonal-1),var(--_diagonal-2),var(--_diagonal-3),var(--_diagonal-4))}@media (forced-colors:active){[selected]:is(:is([data-multiple] :is(.ds-suggestion u-datalist))>u-option:not([data-empty])):before{background-color:LinkText;border-color:LinkText;forced-color-adjust:none}}.ds-suggestion:has(input:-moz-placeholder) input{padding-inline-end:2.4em;background-image:linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4));background-position:calc(100% - 1.2em + var(--dsc-input-stroke-width)),calc(100% - .8em);background-size:.4em .4em;background-repeat:no-repeat}.ds-suggestion:has(input:placeholder-shown) input{padding-inline-end:2.4em;background-image:linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4));background-position:calc(100% - 1.2em + var(--dsc-input-stroke-width)),calc(100% - .8em);background-size:.4em .4em;background-repeat:no-repeat}:dir(rtl) :is(.ds-suggestion:has(input:-moz-placeholder) input){background-position:calc(1.2em - var(--dsc-input-stroke-width)),.8em}:dir(rtl) :is(.ds-suggestion:has(input:placeholder-shown) input){background-position:calc(1.2em - var(--dsc-input-stroke-width)),.8em}@media (forced-colors:active){.ds-suggestion:has(input:-moz-placeholder) input{-moz-appearance:auto;appearance:auto}.ds-suggestion:has(input:placeholder-shown) input{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}.ds-suggestion:has(input:-moz-placeholder):has(:popover-open) input{background-image:linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4))}.ds-suggestion:has(input:placeholder-shown):has(:popover-open) input{background-image:linear-gradient(-45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4)),linear-gradient(45deg,var(--_dsc-input-diagonal-1),var(--_dsc-input-diagonal-2),var(--_dsc-input-diagonal-3),var(--_dsc-input-diagonal-4))}.ds-suggestion input[inputmode=none]{box-shadow:none;outline:none}.ds-suggestion:has(input:is(:-moz-read-only,:disabled,[aria-disabled=true])) :is(del,button[type=reset]){visibility:hidden}.ds-suggestion :is(del[hidden],button[type=reset][hidden]),.ds-suggestion:has(input:is(:read-only,:disabled,[aria-disabled=true])) :is(del,button[type=reset]){visibility:hidden}.ds-suggestion:has(:is(del,button[type=reset])) input{padding-inline-end:calc(var(--dsc-suggestion-clear-size) + var(--dsc-suggestion-clear-gap))}.ds-suggestion input[type=search]::-webkit-search-cancel-button{display:none}.ds-suggestion :is(del,button[type=reset]){--dsc-button-size:var(--dsc-suggestion-clear-size);display:grid;align-self:center;margin-inline-start:calc((var(--dsc-suggestion-clear-size) + var(--dsc-suggestion-clear-gap))*-1);order:999;box-sizing:border-box;border-radius:var(--dsc-suggestion-clear-border-radius);padding:var(--dsc-suggestion-clear-padding);height:var(--dsc-suggestion-clear-size);width:var(--dsc-suggestion-clear-size);cursor:pointer;position:relative;scale:.75;z-index:2;outline:none}:is(.ds-suggestion :is(del,button[type=reset])):focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}:is(.ds-suggestion :is(del,button[type=reset])):focus-visible *{--_ds--focus: }:is(.ds-suggestion :is(del,button[type=reset])):hover{background:var(--dsc-suggestion-clear-background--hover)}:is(.ds-suggestion :is(del,button[type=reset])):active{background:var(--dsc-suggestion-clear-background--active)}:is(.ds-suggestion :is(del,button[type=reset])):before{content:"";-webkit-mask:var(--dsc-suggestion-clear-icon-url) center /contain no-repeat;mask:var(--dsc-suggestion-clear-icon-url) center /contain no-repeat;background:currentcolor}@media (forced-colors:active){:is(.ds-suggestion :is(del,button[type=reset])):before{background-color:canvastext;forced-color-adjust:none}}