.searchbar{align-items:center;gap:var(--space-7);width:100%;display:flex;position:relative}.searchbar__icon{left:var(--space-5);pointer-events:none;color:var(--color-icon-subtle);font-size:var(--font-size-t6);align-items:center;line-height:1;display:inline-flex;position:absolute;top:50%;transform:translateY(-50%)}.searchbar__input{width:100%;height:34px;padding:0 var(--space-1)0 34px;font-family:inherit;font-size:var(--font-size-t6);color:var(--color-text-default);background-color:var(--color-input-bg-default);border:1px solid var(--color-input-border-default);border-radius:var(--radius-xs);box-sizing:border-box;outline:none;transition:border-color .2s,box-shadow .2s}.searchbar__input::placeholder{color:var(--color-text-placeholder)}.searchbar__input:hover:not(:disabled){border-color:var(--color-input-border-active)}.searchbar__input:focus{border-color:var(--color-input-border-focus);box-shadow:0 0 0 3px rgba(3,135,224,.12)}.searchbar__input:disabled{background-color:var(--color-input-bg-disabled);color:var(--color-text-disabled);cursor:not-allowed}.searchbar--clearable .searchbar__input{padding-right:32px}.searchbar__clear{right:var(--space-5);background-color:var(--color-bg-section);width:16px;height:16px;color:var(--color-icon-subtle);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:10px;line-height:1;transition:background-color .15s;display:inline-flex;position:absolute;top:50%;transform:translateY(-50%)}.searchbar__clear:hover{background-color:var(--color-border-subtle)}
