.hotspot__popup-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;display:none}@media screen and (min-width: 860px){.hotspot__popup-modal{position:absolute;top:auto;bottom:100%;left:50%;width:auto;height:auto;transform:translate(-50%,-10px);z-index:101}}.hotspot__popup-modal.active{display:block}.hotspot__popup-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;animation:fadeIn .3s ease}@media screen and (min-width: 860px){.hotspot__popup-backdrop{display:none}}.dynamic--hotspot-image{background-color:#f5f5f5;padding-bottom:20px}.dynamic--hotspot-image .shoppable-image.no-section-heading{margin-top:0;padding-top:50px}.hotspot__popup-content{position:absolute;top:50%;left:50%;background-color:#fff;padding:32px;border-radius:8px;box-shadow:0 10px 40px #0003;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;animation:slideUp .3s ease;position:relative}@media screen and (min-width: 860px){.hotspot__popup-content{position:static;transform:none;width:300px;padding:20px;max-height:none;animation:none}}.hotspot__popup-close{position:absolute;top:16px;right:16px;background:transparent;border:none;cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center;color:#666;transition:color .2s ease;z-index:10}.dynamic--hotspot-image .shoppable-image__text-box-content{max-width:100%;margin:unset}@media screen and (min-width: 860px){.dynamic--hotspot-image .shoppable-image__text-box-content{max-width:500px;margin:unset}}.hotspot__popup-close:hover{color:#000}.dynamic--hotspot-image .hotspot-heading{font-weight:700;color:#000;font-size:24px;margin:0 0 16px;padding-right:40px}.dynamic--hotspot-image .hotspot-description{color:#333;font-size:16px;line-height:1.6;margin:0}.dynamic--hotspot-image .shoppable-image__hotspot-inner{width:25px;height:25px;display:flex;align-items:center;justify-content:center;background-color:#e2c417}.dynamic--hotspot-image .shoppable-image__hotspot--active .shoppable-image__hotspot-inner{transform:scale(1) translate(-50%,50%)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-40%)}to{opacity:1;transform:translate(-50%,-50%)}}@media screen and (max-width: 859px){.hotspot__popup-content{transform:translate(-50%,-50%)}}@media (max-width: 768px){.hotspot__popup-content{padding:24px;max-width:90%}.dynamic--hotspot-image .hotspot-heading{font-size:20px}.dynamic--hotspot-image .hotspot-description{font-size:14px}}
/*# sourceMappingURL=/cdn/shop/t/18/assets/dynamic-hotspot-image.css.map */