popup-modal:has(social-modal){position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--z-popup)}social-modal,.social-modal--background{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.social-modal--background{background:color-mix(in srgb,var(--color-text) 80%,transparent);opacity:0;transition:opacity var(--transition-duration) var(--transition-ease)}.social-modal--inner{position:absolute;top:50%;left:50%;height:calc(100vh - calc(var(--header-height) * 2));aspect-ratio:2 / 4;opacity:0;pointer-events:none;transform:translate(-50%,-50%);transition:opacity var(--transition-duration) var(--transition-ease)}popup-modal[open=true] .social-modal--background,popup-modal[open=true] .social-modal--inner{opacity:1;pointer-events:auto}.social-modal--close{position:absolute;top:1rem;right:calc(1rem + 1px);z-index:2}.social-modal--carousel{width:100%;max-width:100%;max-height:100%;min-height:0;min-width:0;aspect-ratio:2 / 4;border:1px solid var(--color-border);border-radius:var(--radius-std)}.social-modal--carousel-nav{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 1rem;z-index:10;pointer-events:none}.social-modal--carousel-nav button{width:2.5rem;height:2.5rem;pointer-events:auto}.social-modal--slide{position:relative;display:flex!important;flex-direction:column;gap:1.25rem;width:auto;flex-shrink:0;display:block;height:100%;max-height:100%;overflow:hidden}.social-modal--slide figure{width:100%;aspect-ratio:2 / 4}.social-modal--slide .video-component--controls{align-items:flex-start;justify-content:flex-end;padding-top:3.5rem}.social-modal--slide .video-component--controls .btn--play{display:none}.social-modal--product{position:absolute;bottom:1rem;left:1rem;display:flex;align-items:stretch;gap:1rem;width:calc(100% - 2rem);padding:1rem;background:var(--color-background);border-radius:var(--radius-std);z-index:10}.social-modal--product-image{width:4.5rem;flex-shrink:0;border-radius:var(--radius-std);border:1px solid var(--color-border);overflow:hidden}.social-modal--product-image img{aspect-ratio:4 / 5}.social-modal--product-info{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between;width:100%}
/*# sourceMappingURL=/cdn/shop/t/332/assets/social-modal.css.map */
