.smart-banner{display:flex;flex-direction:column;position:fixed;top:36px;left:0;right:0;margin:4px;width:calc(100% - 8px);background-color:rgb(var(--color-background));box-shadow:0 0 4px 4px rgba(var(--color-shadow),.13);border-radius:8px;z-index:3147483639;font-family:var(--font-body-family);animation:smartBannerSlideIn .3s ease-in-out;overflow:hidden}@keyframes smartBannerSlideIn{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.smart-banner__container{display:flex;align-items:flex-start;width:100%;padding:1.5rem 1rem;position:relative}.smart-banner__close-icon{position:absolute;top:.5rem;right:1rem;background:transparent;border:none;color:rgba(var(--color-foreground),.55);cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;z-index:1;transition:opacity .2s ease}.smart-banner__close-icon:hover{opacity:.75}.smart-banner__close-icon svg{width:1.2rem;height:1.2rem}.smart-banner__icon{width:4rem;height:4rem;margin-right:1rem;border-radius:.8rem;overflow:hidden;flex-shrink:0;background:rgba(var(--color-foreground),.04)}.smart-banner__icon img{width:100%;height:100%;object-fit:cover}.smart-banner__icon-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2)}.smart-banner__icon-placeholder svg{width:2.4rem;height:2.4rem;color:#fff}.smart-banner__info{flex:1;min-width:0;padding-right:3rem}.smart-banner__title{font-weight:var(--font-body-weight-bold);font-size:1.4rem;line-height:1.2;margin-bottom:.2rem;color:rgb(var(--color-foreground));letter-spacing:.02em}.smart-banner__description{font-size:1.2rem;line-height:1.4;color:rgba(var(--color-foreground),.75);letter-spacing:.01em}.smart-banner__button{background-color:rgb(var(--color-foreground));color:rgb(var(--color-background));border:none;border-radius:.6rem;padding:1rem 1.5rem;font-weight:var(--font-body-weight-bold);font-size:1.4rem;text-decoration:none;text-align:center;margin:0 1rem 1rem;width:calc(100% - 2rem);display:block;transition:opacity .2s ease;letter-spacing:.06rem;text-transform:uppercase}.smart-banner__button:hover{opacity:.85}@media screen and (min-width: 750px){.smart-banner{display:none!important}}@media screen and (max-width: 374px){.smart-banner__container{padding:1.2rem .8rem}.smart-banner__icon{width:3.6rem;height:3.6rem;margin-right:.8rem}.smart-banner__title{font-size:1.3rem}.smart-banner__description{font-size:1.1rem}.smart-banner__button{font-size:1.3rem;padding:.8rem 1.2rem}}@media (prefers-contrast: high){.smart-banner{border:1px solid rgb(var(--color-foreground))}}@media (prefers-reduced-motion: reduce){.smart-banner{animation:none}}.smart-banner-desktop{display:none;position:fixed;background-color:rgb(var(--color-background));box-shadow:0 4px 24px rgba(var(--color-shadow),.2);border-radius:12px;padding:2.4rem;z-index:3147483638;max-width:320px;width:90%;font-family:var(--font-body-family)}.smart-banner-desktop[data-position=bottom-right]{bottom:24px;right:24px}.smart-banner-desktop[data-position=bottom-left]{bottom:24px;left:24px}.smart-banner-desktop[data-position=top-right]{top:24px;right:24px}.smart-banner-desktop[data-position=top-left]{top:24px;left:24px}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideLeft{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideRight{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.smart-banner-desktop[data-animation=slide-up]{animation:slideUp .4s ease-out}.smart-banner-desktop[data-animation=slide-down]{animation:slideDown .4s ease-out}.smart-banner-desktop[data-animation=slide-left]{animation:slideLeft .4s ease-out}.smart-banner-desktop[data-animation=slide-right]{animation:slideRight .4s ease-out}.smart-banner-desktop__close{position:absolute;top:1.2rem;right:1.2rem;background:transparent;border:none;color:rgba(var(--color-foreground),.55);cursor:pointer;padding:.4rem;width:2.8rem;height:2.8rem;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.smart-banner-desktop__close:hover{background:rgba(var(--color-foreground),.08);color:rgba(var(--color-foreground),.75)}.smart-banner-desktop__close svg{width:1.6rem;height:1.6rem}.smart-banner-desktop__content{text-align:center}.smart-banner-desktop__heading{font-size:1.8rem;font-weight:var(--font-body-weight-bold);color:rgb(var(--color-foreground));margin:0 0 .8rem;line-height:1.2}.smart-banner-desktop__subheading{font-size:1.4rem;color:rgba(var(--color-foreground),.75);margin:0 0 2rem;line-height:1.4}.smart-banner-desktop__qr-container{display:flex;flex-direction:column;align-items:center;gap:1.2rem}.smart-banner-desktop__qr{background:#fff;padding:1.6rem;border-radius:8px;border:1px solid rgba(var(--color-foreground),.1)}.smart-banner-desktop__qr img{display:block;width:180px;height:180px;object-fit:contain}.smart-banner-desktop__qr--placeholder{width:212px;height:212px;display:flex;align-items:center;justify-content:center;background:rgba(var(--color-foreground),.05);border:2px dashed rgba(var(--color-foreground),.2)}.smart-banner-desktop__qr--placeholder p{font-size:1.2rem;color:rgba(var(--color-foreground),.5);text-align:center;padding:2rem;margin:0}.smart-banner-desktop__helper{font-size:1.2rem;color:rgba(var(--color-foreground),.55);margin:0;font-style:italic}@media screen and (max-width: 749px){.smart-banner-desktop{display:none!important}}@media screen and (max-width: 1200px){.smart-banner-desktop{max-width:280px;padding:2rem}.smart-banner-desktop__heading{font-size:1.6rem}.smart-banner-desktop__subheading{font-size:1.3rem}}@media (prefers-reduced-motion: reduce){.smart-banner-desktop[data-animation=slide-up],.smart-banner-desktop[data-animation=slide-down],.smart-banner-desktop[data-animation=slide-left],.smart-banner-desktop[data-animation=slide-right]{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/section-smart-banner.css.map */
