.search-drawer{--drawer-width: 100%;--drawer-max-width: 400px;--drawer-bg: #FFFFFF;--drawer-z-index: 1000;--drawer-transition: .3s ease;--brand-color: #34CC33;--text-color: #121212;--text-muted: #757575;--border-color: rgba(0, 0, 0, .08);--input-bg: #F5F5F5;--overlay-bg: rgba(0, 0, 0, .5)}@media screen and (min-width: 990px){.search-drawer{display:none!important}}.search-drawer__toggle{display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;position:relative;z-index:calc(var(--drawer-z-index) + 2);padding:0}.search-drawer__toggle svg{width:24px;height:24px}.search-drawer__toggle:focus-visible{outline:2px solid var(--brand-color);outline-offset:2px;border-radius:4px}.search-drawer__overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--overlay-bg);z-index:var(--drawer-z-index);opacity:0;visibility:hidden;transition:opacity var(--drawer-transition),visibility var(--drawer-transition)}.search-drawer--open .search-drawer__overlay{opacity:1;visibility:visible}.search-drawer__panel{position:fixed;top:0;right:0;width:var(--drawer-width);max-width:var(--drawer-max-width);height:100%;height:100dvh;background:var(--drawer-bg);z-index:calc(var(--drawer-z-index) + 1);transform:translate(100%);transition:transform var(--drawer-transition);display:flex;flex-direction:column;overflow:hidden;box-shadow:-4px 0 20px #00000026}.search-drawer--open .search-drawer__panel{transform:translate(0)}.search-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:1.6rem 2rem;background:var(--brand-color);flex-shrink:0}.search-drawer__title{font-size:1.6rem;font-weight:600;color:#fff;letter-spacing:.02em}.search-drawer__close{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#fff3;border:none;cursor:pointer;border-radius:50%;transition:background-color .2s ease}.search-drawer__close:hover{background:#ffffff4d}.search-drawer__close:focus-visible{outline:2px solid #FFFFFF;outline-offset:2px}.search-drawer__close svg{width:20px;height:20px;stroke:#fff}.search-drawer__form-wrapper{padding:2rem;flex-shrink:0}.search-drawer__form{position:relative}.search-drawer__input-wrapper{position:relative;display:flex;align-items:center;background:var(--input-bg);border:1px solid rgba(0,0,0,.1);border-radius:12px;transition:all .2s ease}.search-drawer__input-wrapper:focus-within{background:#fff;border-color:#00000026}.search-drawer__input-icon{position:absolute;left:1.4rem;width:20px;height:20px;color:var(--text-muted);pointer-events:none}.search-drawer__input{width:100%;padding:1.4rem 4rem 1.4rem 4.4rem;border:none;background:transparent;font-size:1.6rem;color:var(--text-color);line-height:1.4}.search-drawer__input:focus{outline:none}.search-drawer__input::placeholder{color:var(--text-muted)}.search-drawer__input::-webkit-search-decoration,.search-drawer__input::-webkit-search-cancel-button{-webkit-appearance:none}.search-drawer__reset{position:absolute;right:1rem;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:#00000014;border:none;border-radius:50%;cursor:pointer;transition:background-color .2s ease}.search-drawer__reset:hover{background:#0000001f}.search-drawer__reset:focus-visible{outline:2px solid var(--brand-color);outline-offset:2px}.search-drawer__reset svg{width:12px;height:12px;color:var(--text-color)}.search-drawer__reset.hidden{display:none}.search-drawer__input-spinner{position:absolute;right:1rem;top:50%;transform:translateY(-50%);width:24px;height:24px;display:none;align-items:center;justify-content:center}.search-drawer__input-spinner .spinner{width:24px;height:24px}.search-drawer__input-spinner .path{stroke:var(--brand-color)}.search-drawer predictive-search[loading] .search-drawer__input-spinner{display:flex}.search-drawer predictive-search[loading] .search-drawer__reset{display:none!important}.search-drawer__results{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.search-drawer__predictive{position:relative;width:100%}.search-drawer .predictive-search--drawer{display:none;position:relative;top:auto;left:auto;right:auto;margin-top:1.6rem;border-radius:12px;box-shadow:none;border:1px solid var(--border-color);max-height:none;background:#fff}.search-drawer predictive-search[open] .predictive-search--drawer,.search-drawer predictive-search[loading] .predictive-search--drawer{display:block}.search-drawer .predictive-search__loading-state{display:none!important}.search-drawer .predictive-search--drawer .predictive-search__results-groups-wrapper{padding:0}.search-drawer__quick-links{padding:0 2rem 2rem}.search-drawer__quick-label{display:block;font-size:1.1rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:1.2rem}.search-drawer__quick-tags{display:flex;flex-wrap:wrap;gap:.8rem}.search-drawer__tag{display:inline-block;padding:.8rem 1.4rem;background:var(--input-bg);border-radius:20px;color:var(--text-color);text-decoration:none;font-size:1.4rem;font-weight:500;transition:all .2s ease}.search-drawer__tag:hover{background:var(--brand-color);color:#fff}.search-drawer__tag:focus-visible{outline:2px solid var(--brand-color);outline-offset:2px}.search-drawer__empty{padding:3rem 2rem;text-align:center}.search-drawer__empty-icon{width:48px;height:48px;margin:0 auto 1.2rem;color:var(--text-muted);opacity:.5}.search-drawer__empty-text{font-size:1.4rem;color:var(--text-muted);margin:0}@media (prefers-reduced-motion: reduce){.search-drawer__panel,.search-drawer__overlay,.search-drawer__input-wrapper,.search-drawer__close,.search-drawer__reset,.search-drawer__tag{transition:none}}body.search-drawer-open{overflow:hidden;position:fixed;width:100%}.search-drawer--open .search-drawer__toggle,body.search-drawer-open .mobile-drawer__toggle,body.mobile-drawer-open .search-drawer__toggle{visibility:hidden;pointer-events:none}@supports (-webkit-touch-callout: none){body.search-drawer-open{position:fixed;height:100%}}@supports (padding-bottom: env(safe-area-inset-bottom)){.search-drawer__panel{padding-bottom:env(safe-area-inset-bottom)}.search-drawer__quick-links{padding-bottom:calc(2rem + env(safe-area-inset-bottom))}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/search-drawer.css.map */
