.c-search{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:var(--sm-spacing)}.c-search .c-search__form{height:2rem;width:90%;display:flex;align-items:center;gap:var(--sm-spacing);padding:0 var(--md-spacing);background:color-mix(in srgb,var(--c-nav-fg) 10%,transparent);border:1px solid color-mix(in srgb,var(--c-nav-fg) 30%,transparent);border-radius:1rem;color:color-mix(in srgb,var(--c-nav-fg) 70%,transparent);font-family:var(--font-body);font-weight:400;font-size:var(--sm-font-size);transition:border-color .2s ease-in-out,color .2s ease-in-out}.c-search .c-search__form:focus-within{border:1px solid var(--color-accent)}.c-search .c-search__form .c-search__magnifier{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.c-search .c-search__form .c-search__magnifier svg{width:100%;height:100%}.c-search .c-search__form .c-search__input{flex:1 1 auto;padding:0;background:transparent;border:0;outline:none;color:var(--c-nav-fg);transition:color .2s ease-in-out}.c-search .c-search__form .c-search__input::placeholder{color:color-mix(in srgb,var(--c-nav-fg) 60%,transparent);transition:color .2s ease-in-out}.c-search .c-search__form .c-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.c-search .c-search__form .c-search__back,.c-search .c-search__form .c-search__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;background:transparent;border:0;color:inherit;cursor:pointer;transition:color .2s ease-in-out,opacity .2s ease-in-out}:is(.c-search .c-search__form .c-search__back,.c-search .c-search__form .c-search__clear) svg{width:1rem;height:1rem;fill:currentColor;stroke:currentColor}:is(.c-search .c-search__form .c-search__back,.c-search .c-search__form .c-search__clear):hover{opacity:.7}:is(.c-search .c-search__form .c-search__back,.c-search .c-search__form .c-search__clear):focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.c-search .c-search__form .c-search__back{display:none}.c-search .c-search__form:has(.c-search__input:placeholder-shown) .c-search__clear{display:none}@media(prefers-reduced-motion:reduce){.c-search__form,.c-search__input,.c-search__input::placeholder{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/20/assets/component-common-search.css.map */