.header-search{--header-search-text: 31, 31, 31;width:clamp(22rem,24vw,36rem);margin-inline-end:.4rem}.header-search__field{height:4rem;background:#ffffffeb;border:.1rem solid rgba(0,0,0,.18);border-radius:var(--inputs-radius);color:rgb(var(--header-search-text));transition:border-color .2s,box-shadow .2s}@supports (backdrop-filter: blur(4px)){.header-search__field{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.header-search__field:focus-within{border-color:#00000073;box-shadow:0 2px 10px #0000001f}.header-search__input{flex:1 1 auto;min-width:0;height:100%;padding:0 .4rem 0 1.8rem;border:0;background:transparent;color:inherit;font-family:var(--font-body-family);font-size:1.4rem;line-height:1;box-shadow:none;outline:none;-webkit-appearance:none;appearance:none}.header-search__input::placeholder{color:#4d4d4d;opacity:1}.header-search__input::-webkit-search-decoration,.header-search__input::-webkit-search-cancel-button,.header-search__input::-webkit-search-results-button,.header-search__input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.header-search__submit,.header-search__reset{flex:none;padding:0;border:0;background:transparent;color:inherit;cursor:pointer}.header-search__submit{width:4.4rem;height:100%}.header-search__reset{position:relative;width:2.4rem;height:2.4rem;opacity:.7}.header-search__reset:hover{opacity:1}.header-search__input:placeholder-shown~.header-search__reset:not(.btn--loading){visibility:hidden}.header-search__reset .loading__spinner{position:absolute;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center}.header-search__dropdown{position:absolute;inset-block-start:calc(100% + .8rem);inset-inline-end:0;width:max(100%,42rem);max-height:calc(100vh - var(--header-height, 10rem) - 4rem);overflow-y:auto;padding:2rem;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));border:.1rem solid rgb(var(--color-border));border-radius:1.2rem;box-shadow:0 8px 24px #0000001f;text-align:start;opacity:0;visibility:hidden;pointer-events:none}.header-search__form[results] .header-search__dropdown:not(.hidden){display:block}.header-search__form[results]:focus-within .header-search__dropdown{opacity:1;visibility:visible;pointer-events:auto}@media(min-width:1024px){.header__icons--right:has(.header-search){z-index:12}}
/*# sourceMappingURL=/cdn/shop/t/220/assets/header-search.css.map */