.base-reels{display:block;--reels-gap: 16px;--reels-radius: 16px;--reels-slides-mobile: 1.5;--reels-slides-desktop: 4.5}.base-reels__inner{position:relative}.base-reels--full .base-reels__inner{padding-inline:1.5rem}@media screen and (min-width:750px){.base-reels--full .base-reels__inner{padding-inline:5rem}}.base-reels__header{margin-bottom:2rem}.base-reels__heading{margin:0}.base-reels__subheading{margin-top:.8rem;max-width:60ch}.base-reels__subheading>*{margin:0}.base-reels__viewport{position:relative}.base-reels__track{display:flex;gap:var(--reels-gap);margin:0;padding:.4rem .4rem 1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:safe center}.base-reels__track::-webkit-scrollbar{display:none}@media(prefers-reduced-motion:reduce){.base-reels__track{scroll-behavior:auto}}.base-reels__slide{flex:0 0 calc((100% - (var(--reels-slides-mobile) - 1) * var(--reels-gap)) / var(--reels-slides-mobile));scroll-snap-align:center}@media screen and (min-width:990px){.base-reels__slide{flex-basis:calc((100% - (var(--reels-slides-desktop) - 1) * var(--reels-gap)) / var(--reels-slides-desktop));scroll-snap-align:start}}.base-reels__media{position:relative;aspect-ratio:9 / 16;border-radius:var(--reels-radius);overflow:hidden;background:rgba(var(--color-foreground),.06)}.base-reels__media video{display:block;width:100%;height:100%;object-fit:cover;cursor:pointer}.base-reels__placeholder{display:grid;place-items:center;width:100%;height:100%}.base-reels__placeholder .placeholder-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.base-reels__placeholder-label{position:relative;font-size:1.3rem;padding:.6rem 1.2rem;border-radius:999px;background:rgb(var(--color-background))}.base-reels__controls{position:absolute;inset-inline:1.2rem;bottom:1.2rem;display:flex;justify-content:space-between;pointer-events:none}.base-reels__control{display:grid;place-items:center;width:4rem;height:4rem;padding:0;border:0;border-radius:999px;color:#fff;background:#0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;pointer-events:auto;transition:background .15s ease}.base-reels__control:hover{background:#000000bf}.base-reels__control:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}.base-reels__control svg{width:1.6rem;height:1.6rem;fill:currentColor}.base-reels__icon{display:none;line-height:0}.base-reels__slide:not([data-playing=true]) .base-reels__icon--play,.base-reels__slide[data-playing=true] .base-reels__icon--pause,.base-reels__slide[data-muted=true] .base-reels__icon--muted,.base-reels__slide:not([data-muted=true]) .base-reels__icon--unmuted{display:block}.base-reels__product{display:flex;align-items:center;gap:1rem;margin-top:1.2rem}.base-reels__product-image{flex:0 0 auto;line-height:0}.base-reels__product-image img{width:5.6rem;height:5.6rem;object-fit:cover;border-radius:calc(var(--reels-radius) * .5)}.base-reels__product-info{flex:1 1 auto;min-width:0}.base-reels__product-vendor{opacity:.7}.base-reels__product-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:1.4rem;line-height:1.3;text-decoration:none;color:rgb(var(--color-foreground))}.base-reels__product-title:hover{text-decoration:underline}.base-reels__product-info .price{margin-top:.4rem;font-size:1.4rem}.base-reels__product-cta{flex:0 0 auto}.base-reels__product-cta .form,.base-reels__product-cta product-form{display:block}.base-reels__button{min-width:0;min-height:0;padding:.9rem 1.4rem;font-size:1.3rem;white-space:nowrap}.base-reels__nav{display:none;position:absolute;top:40%;z-index:2;place-items:center;width:4.4rem;height:4.4rem;padding:0;border:.1rem solid rgba(var(--color-foreground),.1);border-radius:999px;color:rgb(var(--color-foreground));background:rgb(var(--color-background));box-shadow:0 .2rem 1rem rgba(var(--color-foreground),.12);cursor:pointer}.base-reels__nav:disabled{opacity:.35;cursor:default}.base-reels__nav:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}.base-reels__nav svg{width:1.2rem;height:1.2rem}.base-reels__nav--prev{inset-inline-start:-1.6rem;transform:translateY(-50%) rotate(90deg)}.base-reels__nav--next{inset-inline-end:-1.6rem;transform:translateY(-50%) rotate(-90deg)}@media screen and (min-width:990px){.base-reels__nav{display:grid}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/base-video-reels.css.map */