.header__search{--roots-search-duration: .42s;--roots-search-ease: cubic-bezier(.16, 1, .3, 1);--roots-search-height: 4rem;--roots-search-collapsed: 4rem;position:relative}.header__search .modal-overlay,.header__search details[open] .modal-overlay,.header__search details[open] .modal-overlay:after{display:none}body.overflow-hidden:has(.header__search details[open]){overflow:visible}.header__search .search-modal{position:absolute;inset-block-start:50%;inset-inline-end:0;inset-block-end:auto;inset-inline-start:auto;translate:0 -50%;z-index:5;min-height:0;height:auto;border-bottom:0;opacity:0;transition:opacity .16s ease}.header__search details[open]>.search-modal{opacity:1;animation:none}.header__search .search-modal .field{clip-path:inset(0 0 0 calc(100% - var(--roots-search-collapsed)) round var(--radius-pill));transition:clip-path var(--roots-search-duration) var(--roots-search-ease)}.header__search details[open] .search-modal .field{clip-path:inset(0 round var(--radius-pill))}.header__search .search-modal__content{width:100%;height:auto;padding:0;top:auto;bottom:auto}.header__search .search-modal__form{position:relative;width:100%;max-width:none}.header__search .search-modal .field{background-color:rgb(var(--color-background))}.header__search .search__input.field__input{height:var(--roots-search-height);min-height:var(--roots-search-height);padding:0 8.4rem 0 4rem;border-radius:var(--radius-pill);border-color:var(--roots-copper);font-size:var(--type-meta)}.header__search .search-modal .field__label{position:absolute;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.header__search .search__input.field__input::placeholder{color:rgba(var(--color-foreground),.72);opacity:1}.header__search .search__button.field__button{right:auto;left:0;top:0;width:4rem;height:var(--roots-search-height);color:var(--roots-copper)}.header__search .search__button .icon{width:1.7rem;height:1.7rem}.header__search .reset__button.field__button{right:4rem;top:0;width:4rem;height:var(--roots-search-height)}.header__search .reset__button:after{display:none}.header__search .search-modal__close-button{position:absolute;inset-inline-end:.2rem;inset-block-start:50%;translate:0 -50%;width:3.6rem;height:3.6rem;margin:0;display:flex;align-items:center;justify-content:center;color:rgba(var(--color-foreground),.72);opacity:0;transition:opacity .16s ease var(--roots-search-duration)}.header__search details[open] .search-modal__close-button{opacity:1}.header__search .search-modal__close-button:hover{color:rgb(var(--color-foreground))}.header__search .search-modal__close-button .icon{width:1.5rem;height:1.5rem}.header__search predictive-search{position:relative;display:block}.header__search .predictive-search--header{inset-inline:0;inset-block-start:calc(100% + .6rem);width:auto;max-height:min(60svh,48rem);border-radius:var(--radius-card);border-color:var(--roots-hairline)}.header__search .predictive-search--header .predictive-search__results-groups-wrapper{flex-direction:column;gap:var(--space-4)}.header__search .predictive-search--header .predictive-search__result-group{flex:0 0 auto;gap:0}.header__search .predictive-search--header .predictive-search__item-heading{overflow-wrap:anywhere}@media screen and (min-width:990px){.header__search .search-modal{width:38rem}.header__search details[open]>.header__icon--search{opacity:0;pointer-events:none}.header__search .header__icon--search{transition:opacity .14s ease}}@media screen and (max-width:989px){.header__search{position:static}.header__search .search-modal{inset-inline:1.5rem;inset-block-start:50%;width:auto}}@media(prefers-reduced-motion:reduce){.header__search .search-modal,.header__search .search-modal .field,.header__search .search-modal__close-button{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/component-roots-search.css.map */
