.hkd-search-field-container{--sf-pad-y:var(--hkd-spacing-md);--sf-pad-x:var(--hkd-spacing-md);--sf-icon-space:var(--hkd-spacing-2xl);--bw-sm:var(--hkd-borderwidth-sm,1px);--bw-md:var(--hkd-borderwidth-md,2px);--ring-diff:calc(var(--bw-md) - var(--bw-sm));display:flex;flex-direction:column;width:100%;gap:var(--hkd-spacing-xs)}.hkd-search-field--sm{--sf-pad-x:var(--hkd-spacing-md)}.hkd-search-field-label{margin-bottom:var(--hkd-spacing-xs)}.hkd-search-field-wrapper{position:relative;display:flex;align-items:center;width:100%}.hkd-search-field-icon{position:absolute;left:var(--sf-pad-x);z-index:1;pointer-events:none;color:var(--hkd-color-text-subtle);display:flex;align-items:center}.hkd-search-field{box-sizing:border-box;width:100%;background:var(--hkd-color-background-default);color:var(--hkd-color-text-default);font:var(--hkd-type-body-sm-regular,400 18px/24px "Source Sans Pro",system-ui,sans-serif);border-radius:var(--hkd-borderradius-sm);padding-block:var(--sf-pad-y);padding-inline-start:var(--sf-icon-space);padding-inline-end:var(--sf-pad-x);border-style:solid;border-width:var(--bw-sm);border-color:var(--hkd-color-interaction-border-neutral-default);transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease,color .15s ease}.hkd-search-field--sm{--sf-pad-y:var(--hkd-spacing-sm)}.hkd-search-field--md{--sf-pad-y:var(--hkd-spacing-md)}.hkd-search-field::placeholder{color:var(--hkd-color-text-subtle)}.hkd-search-field-wrapper:hover>.hkd-search-field{border-color:var(--hkd-color-interaction-border-primary-default);box-shadow:0 0 0 var(--ring-diff) var(--hkd-color-interaction-border-primary-default)}.hkd-search-field-wrapper:focus-within>.hkd-search-field{outline:none;border-color:var(--hkd-color-interaction-border-primary-strong);box-shadow:0 0 0 var(--ring-diff) var(--hkd-color-interaction-border-primary-strong)}.hkd-search-field:disabled{background-color:var(--hkd-color-background-disabled);border-color:var(--hkd-color-interaction-border-disabled);opacity:.6;cursor:not-allowed}.hkd-search-field:disabled,.hkd-search-field:disabled+.hkd-search-field-icon{color:var(--hkd-color-text-disabled)}.hkd-search-field-clear{position:absolute;right:var(--sf-pad-x);background:none;border:none;cursor:pointer;color:var(--hkd-color-text-subtle);display:flex;align-items:center;padding:var(--hkd-spacing-xs);border-radius:var(--hkd-borderradius-sm);transition:color .15s ease,background-color .15s ease}.hkd-search-field-clear:hover{color:var(--hkd-color-text-default)}.hkd-search-field-clear:focus{outline:2px solid var(--hkd-color-interaction-border-primary-default);outline-offset:1px}.hkd-search-field--has-value{padding-inline-end:calc(var(--hkd-spacing-lg) + var(--sf-pad-x))}.hkd-search-field-input-wrapper{display:flex;align-items:stretch;gap:var(--hkd-spacing-xs)}.hkd-search-field-container--with-button .hkd-search-field-wrapper{flex:1}.hkd-search-field-search-button{white-space:nowrap}.hkd-search-field::-webkit-search-cancel-button,.hkd-search-field::-webkit-search-decoration,.hkd-search-field::-webkit-search-results-button,.hkd-search-field::-webkit-search-results-decoration{-webkit-appearance:none}