.ds-text-input-wrap.svelte-yljbbv{width:100%;position:relative}.ds-text-input-search.svelte-yljbbv{pointer-events:none;z-index:1;align-items:center;display:flex;position:absolute;top:50%;left:8px;transform:translateY(-50%)}.ds-text-input-wrap.svelte-yljbbv:not(.disabled):hover .ds-text-input:where(.svelte-yljbbv){background:var(--hover-bg)!important}.ds-text-input.svelte-yljbbv{font-weight:var(--ds-ti-fw,500);color:var(--ds-navy-900);transition:background var(--ds-transition-normal);anchor-name:--text-input;border-radius:7px;margin:4px 0;padding:0 20px 0 8px}.ds-text-input.svelte-yljbbv::placeholder{color:var(--ds-navy-200);font-weight:var(--ds-ti-fw,500)}.ds-text-input.svelte-yljbbv:focus{outline:2px solid var(--ds-blue-700);outline-offset:2px}.ds-text-input.is-kit.svelte-yljbbv{transition:border-color var(--ds-transition-fast), background var(--ds-transition-fast);margin:0;padding-right:12px;line-height:1.4}.ds-text-input.is-kit.svelte-yljbbv::placeholder{color:var(--ds-navy-300)}.ds-text-input-wrap.svelte-yljbbv:not(.disabled):hover .ds-text-input.is-kit:where(.svelte-yljbbv):not(:focus){border-color:var(--ds-navy-100)!important}.ds-text-input-wrap.svelte-yljbbv:not(.disabled):hover .ds-text-input.is-kit.is-error:where(.svelte-yljbbv):not(:focus){border-color:var(--ds-red-900)!important}.ds-text-input.is-kit.svelte-yljbbv:focus{outline:none;border-color:var(--ds-navy-900)!important}.ds-text-input.is-kit.is-error.svelte-yljbbv:focus{border-color:var(--ds-red-700)!important}.ds-text-input-clear.svelte-yljbbv{right:anchor(right, 4px);position-anchor:--text-input;cursor:default;background:0 0;border:none;outline:none;flex-shrink:0;padding:4px;position:absolute;top:50%;transform:translateY(-50%)}.ds-text-input-clear.svelte-yljbbv:active:not(:disabled){transform:translateY(-50%)scale(.9)}.ds-text-input-clear.svelte-yljbbv:not(.disabled){cursor:pointer}.ds-text-input-clear.svelte-yljbbv svg:where(.svelte-yljbbv) :where(.svelte-yljbbv){transition:fill var(--ds-transition-fast)}.ds-text-input-clear.svelte-yljbbv:not(.disabled):hover svg:where(.svelte-yljbbv) :where(.svelte-yljbbv){fill:var(--ds-navy-400)}