search-drawer{position:fixed;top:0;left:0;width:100vw;height:100%;z-index:1000;display:flex;justify-content:flex-end;transition:visibility var(--duration-default) ease;visibility:hidden;pointer-events:none}search-drawer.active{visibility:visible;pointer-events:all}search-drawer.active .drawer__overlay{opacity:1}search-drawer.active .drawer__inner{transform:translate(0)}search-drawer .drawer__overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity var(--duration-default) ease;z-index:-1}search-drawer .drawer__inner{height:100%;width:45rem;max-width:calc(100vw - 3rem);padding:0 1.5rem;background-color:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.2);border-right:0;overflow:hidden;display:flex;flex-direction:column;transform:translate(100%);transition:transform var(--duration-default) ease}@media(max-width:749.98px){search-drawer .drawer__inner{width:80vw;max-width:80vw;padding:0 1rem}}@container (max-width: 575.98px){search-drawer .drawer__inner{padding:0 .75rem}}search-drawer .drawer__header{position:relative;padding:1.5rem 0;display:flex;justify-content:space-between;align-items:center}search-drawer .drawer__heading{margin:0 0 1rem}search-drawer .drawer__close{display:inline-block;padding:0;min-width:3.5rem;min-height:3.5rem;box-shadow:0 0 0 .2rem rgba(var(--color-button),0);position:absolute;top:8px;right:8px;color:rgb(var(--color-foreground));background-color:transparent;border:none;cursor:pointer;transition:transform var(--duration-default) ease}search-drawer .drawer__close:hover{transform:scale(1.1)}search-drawer .drawer__close .svg-wrapper{height:2rem;width:2rem}search-drawer .drawer__contents{flex-grow:1;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}search-drawer .drawer__contents::-webkit-scrollbar{width:3px}search-drawer .drawer__contents::-webkit-scrollbar-thumb{background-color:rgba(var(--color-foreground),.7);border-radius:100px}search-drawer .drawer__contents::-webkit-scrollbar-track-piece{margin-top:31px}search-drawer .search-modal__form{display:flex;flex-direction:column}search-drawer .search-modal__form .search__input{background-color:var(--colour-bg-gray)}search-drawer .search-modal__form .search__input:focus,search-drawer .search-modal__form .search__input:focus-visible{outline:none;box-shadow:none}search-drawer .search{width:100%}search-drawer .field{margin-bottom:1.5rem}search-drawer .predictive-search{flex-grow:1;overflow-y:none;position:relative;display:block;top:auto;left:auto;border:none;box-shadow:none}search-drawer .predictive-search__results-groups-wrapper{display:flex;flex-direction:column;gap:2rem}search-drawer .predictive-search__heading{font-size:1.5rem;font-weight:700}search-drawer .predictive-search__result-group .brands{display:flex;gap:1rem}search-drawer .predictive-search__result-group .brands .brand-icon{border-radius:var(--border-radius);border:1px solid var(--colour-outline);display:flex;justify-content:center;align-items:center;padding:1rem!important;box-shadow:var(--box-shadow);transition:box-shadow var(--duration-default) ease}search-drawer .predictive-search__result-group .brands .brand-icon:hover{box-shadow:var(--box-shadow-bold)}search-drawer .predictive-search__result-group .brands .brand-icon img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}search-drawer .promotional-banner{display:flex;height:auto;flex-direction:column;border-radius:var(--border-radius);overflow:hidden;position:relative;box-shadow:var(--box-shadow-bold)}search-drawer .promotional-banner:after{content:"";background:var(--background-colour);clip-path:polygon(0 0,var(--clip-top-right) 0,var(--clip-bottom-right) 100%,0 100%);width:120%;height:120%;-webkit-mask-size:cover;mask-size:cover;position:absolute;top:0;left:0;z-index:1;-webkit-mask-position:center;mask-position:center}search-drawer .promotional-banner .content{position:relative;display:grid;grid-template-columns:2fr 1fr;gap:1.6rem;align-items:center;z-index:2}search-drawer .promotional-banner .content .text-content{color:var(--color-foreground);padding:1.6rem}search-drawer .promotional-banner .content .text-content .stretched-link{text-decoration:none;color:var(--color-foreground)}search-drawer .promotional-banner .content .text-content .stretched-link .heading{margin:0}search-drawer .promotional-banner .content .text-content p{margin-bottom:0;font-size:clamp(.9rem,.4rem + .4vw,1.1rem);line-height:1.5}search-drawer .promotional-banner .bg-image{position:absolute;top:0;right:0;-o-object-fit:cover;object-fit:cover;z-index:0}
/*# sourceMappingURL=/cdn/shop/t/15/assets/snippet-search-drawer.css.map */
