.hotspot-section{--hs-primary: rgb(245, 202, 128);--hs-primary-dark:rgb(245, 202, 128);--hs-bg: #ffffff;--hs-bg-hover: #f8f8f8;--hs-text: #1a1a1a;--hs-text-muted: #666666;--hs-border: rgba(0, 0, 0, .08);--hs-radius-sm: 6px;--hs-radius: 12px;--hs-radius-lg: 16px;--hs-transition-fast: .15s ease;--hs-transition: .3s cubic-bezier(.4, 0, .2, 1);--hs-transition-bounce: .4s cubic-bezier(.34, 1.56, .64, 1);--hs-z-base: 10;--hs-z-tooltip: 100;--hs-z-overlay: 99;--hs-z-editor: 1000}.hotspot-section,.hotspot-section *,.hotspot-section *:before,.hotspot-section *:after{box-sizing:border-box}.hotspot-section{position:relative;width:100%;padding:60px 20px;background:#f9f6f1;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.hotspot-wrapper{position:relative;width:100%;max-width:1400px;margin:0 auto;height:var(--hotspot-height, 600px);min-height:400px;border-radius:var(--hs-radius-lg);overflow:visible;background:#f0f0f0;box-shadow:var(--hs-shadow-lg);transition:box-shadow var(--hs-transition)}.hotspot-wrapper:hover{box-shadow:var(--hs-shadow-xl)}.hotspot-image-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:1;border-radius:var(--hs-radius-lg);overflow:hidden}.hotspot-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .6s ease,filter .3s ease;will-change:transform}.hotspot-wrapper:hover .hotspot-image{transform:scale(1.02)}.hotspot-wrapper:has(.hotspot-item.active) .hotspot-image{filter:brightness(.85)}.hotspot-image-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(45deg,#e0e0e0 25%,#f0f0f0 25% 50%,#e0e0e0 50% 75%,#f0f0f0 75%,#f0f0f0);background-size:20px 20px;color:#999;font-size:18px;font-weight:500;gap:12px}.hotspot-image-placeholder:before{content:"";width:64px;height:64px;border:3px dashed #ccc;border-radius:var(--hs-radius)}.hotspot-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible}.hotspot-item{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;z-index:var(--hs-z-base)}.hotspot-dot{position:relative;width:32px;height:32px;border-radius:50%;border:3px solid white;background:var(--hs-primary);cursor:pointer;padding:0;margin:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #00000040,0 0 #ff6b6b66;transition:all var(--hs-transition-bounce);will-change:transform,box-shadow}.hotspot-dot:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4),transparent 60%);pointer-events:none}.hotspot-dot-inner{width:8px;height:8px;background:#fff;border-radius:50%;display:block;transition:transform var(--hs-transition-fast)}.hotspot-dot:hover{transform:scale(1.25);box-shadow:0 6px 20px #00000059,0 0 0 8px #ff6b6b26}.hotspot-dot:active{transform:scale(.95)}.hotspot-item.active .hotspot-dot{background:#1a1a1a;transform:scale(1.15);box-shadow:0 4px 15px #0006;z-index:calc(var(--hs-z-tooltip) + 1)}.hotspot-item.active .hotspot-dot-inner{transform:scale(.8)}.hotspot-dot:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;border:2px solid var(--hs-primary);opacity:0;animation:hotspot-pulse 2s ease-out infinite;pointer-events:none}@keyframes hotspot-pulse{0%{transform:scale(1);opacity:.6}70%{opacity:0}to{transform:scale(1.6);opacity:0}}.hotspot-item.active .hotspot-dot:after,.hotspot-dot:hover:after{animation:none;opacity:0}.hotspot-tooltip{position:absolute;width:280px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--hs-transition),visibility var(--hs-transition),transform var(--hs-transition-bounce);z-index:var(--hs-z-tooltip)}.hotspot-tooltip.tooltip-top{bottom:100%;left:50%;transform:translate(-50%) translateY(-15px);margin-bottom:12px}.hotspot-tooltip.tooltip-bottom{top:100%;left:50%;transform:translate(-50%) translateY(15px);margin-top:12px}.hotspot-tooltip.tooltip-left{right:100%;top:50%;transform:translateY(-50%) translate(-15px);margin-right:12px}.hotspot-tooltip.tooltip-right{left:100%;top:50%;transform:translateY(-50%) translate(15px);margin-left:12px}.hotspot-item[data-pos-x^="0"] .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="1"] .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="2"] .hotspot-tooltip.tooltip-top{left:0;transform:translateY(-15px)}.hotspot-item[data-pos-x^="0"] .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="1"] .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="2"] .hotspot-tooltip.tooltip-bottom{left:0;transform:translateY(15px)}.hotspot-item[data-pos-x^="8"] .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="9"] .hotspot-tooltip.tooltip-top{left:auto;right:0;transform:translateY(-15px)}.hotspot-item[data-pos-x^="8"] .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="9"] .hotspot-tooltip.tooltip-bottom{left:auto;right:0;transform:translateY(15px)}.hotspot-item[data-pos-y^="0"] .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="1"] .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="2"] .hotspot-tooltip.tooltip-left{top:0;transform:translate(-15px)}.hotspot-item[data-pos-y^="8"] .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="9"] .hotspot-tooltip.tooltip-left{top:auto;bottom:0;transform:translate(-15px)}.hotspot-item[data-pos-y^="0"] .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="1"] .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="2"] .hotspot-tooltip.tooltip-right{top:0;transform:translate(15px)}.hotspot-item[data-pos-y^="8"] .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="9"] .hotspot-tooltip.tooltip-right{top:auto;bottom:0;transform:translate(15px)}.hotspot-item.active{z-index:calc(var(--hs-z-tooltip) + 10)}.hotspot-item.active .hotspot-tooltip{opacity:1;visibility:visible;pointer-events:auto}.hotspot-item.active .hotspot-tooltip.tooltip-top,.hotspot-item.active .hotspot-tooltip.tooltip-bottom{transform:translate(-50%) translateY(0)}.hotspot-item.active .hotspot-tooltip.tooltip-left,.hotspot-item.active .hotspot-tooltip.tooltip-right{transform:translateY(-50%) translate(0)}.hotspot-item[data-pos-x^="0"].active .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="1"].active .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="2"].active .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="0"].active .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="1"].active .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="2"].active .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="8"].active .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="9"].active .hotspot-tooltip.tooltip-top,.hotspot-item[data-pos-x^="8"].active .hotspot-tooltip.tooltip-bottom,.hotspot-item[data-pos-x^="9"].active .hotspot-tooltip.tooltip-bottom{transform:translateY(0)}.hotspot-item[data-pos-y^="0"].active .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="1"].active .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="2"].active .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="0"].active .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="1"].active .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="2"].active .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="8"].active .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="9"].active .hotspot-tooltip.tooltip-left,.hotspot-item[data-pos-y^="8"].active .hotspot-tooltip.tooltip-right,.hotspot-item[data-pos-y^="9"].active .hotspot-tooltip.tooltip-right{transform:translate(0)}.hotspot-tooltip-card{background:var(--hs-bg);border-radius:var(--hs-radius);box-shadow:var(--hs-shadow-xl);overflow:hidden;position:relative;animation:tooltip-enter .3s var(--hs-transition-bounce);border:1px solid var(--hs-border)}@keyframes tooltip-enter{0%{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.hotspot-tooltip-close{position:absolute;top:8px;right:8px;width:28px;height:28px;min-width:28px;min-height:28px;border-radius:50%;border:none;background:#0009;color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin:0;opacity:0;visibility:hidden;transition:all var(--hs-transition-fast);z-index:10;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);flex-shrink:0;flex-grow:0}.hotspot-item.active .hotspot-tooltip-close{opacity:1;visibility:visible}.hotspot-tooltip-close:hover{background:#000000e6;transform:rotate(90deg) scale(1.1)}.hotspot-tooltip-close:active{transform:rotate(90deg) scale(.95)}.hotspot-tooltip-close span,.hotspot-tooltip-close:before{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.hotspot-tooltip:before{content:"";position:absolute;width:0;height:0;border:10px solid transparent}.tooltip-top:before{bottom:-20px;left:50%;transform:translate(-50%);border-top-color:var(--hs-bg);filter:drop-shadow(0 2px 2px rgba(0,0,0,.1))}.tooltip-bottom:before{top:-20px;left:50%;transform:translate(-50%);border-bottom-color:var(--hs-bg);filter:drop-shadow(0 -2px 2px rgba(0,0,0,.1))}.tooltip-left:before{right:-20px;top:50%;transform:translateY(-50%);border-left-color:var(--hs-bg);filter:drop-shadow(2px 0 2px rgba(0,0,0,.1))}.tooltip-right:before{left:-20px;top:50%;transform:translateY(-50%);border-right-color:var(--hs-bg);filter:drop-shadow(-2px 0 2px rgba(0,0,0,.1))}.hotspot-item[data-pos-x^="0"] .hotspot-tooltip.tooltip-top:before,.hotspot-item[data-pos-x^="1"] .hotspot-tooltip.tooltip-top:before,.hotspot-item[data-pos-x^="2"] .hotspot-tooltip.tooltip-top:before{left:20px;transform:none}.hotspot-item[data-pos-x^="8"] .hotspot-tooltip.tooltip-top:before,.hotspot-item[data-pos-x^="9"] .hotspot-tooltip.tooltip-top:before{left:auto;right:20px;transform:none}.hotspot-item[data-pos-x^="0"] .hotspot-tooltip.tooltip-bottom:before,.hotspot-item[data-pos-x^="1"] .hotspot-tooltip.tooltip-bottom:before,.hotspot-item[data-pos-x^="2"] .hotspot-tooltip.tooltip-bottom:before{left:20px;transform:none}.hotspot-item[data-pos-x^="8"] .hotspot-tooltip.tooltip-bottom:before,.hotspot-item[data-pos-x^="9"] .hotspot-tooltip.tooltip-bottom:before{left:auto;right:20px;transform:none}.hotspot-item[data-pos-y^="0"] .hotspot-tooltip.tooltip-left:before,.hotspot-item[data-pos-y^="1"] .hotspot-tooltip.tooltip-left:before,.hotspot-item[data-pos-y^="2"] .hotspot-tooltip.tooltip-left:before{top:20px;transform:none}.hotspot-item[data-pos-y^="8"] .hotspot-tooltip.tooltip-left:before,.hotspot-item[data-pos-y^="9"] .hotspot-tooltip.tooltip-left:before{top:auto;bottom:20px;transform:none}.hotspot-item[data-pos-y^="0"] .hotspot-tooltip.tooltip-right:before,.hotspot-item[data-pos-y^="1"] .hotspot-tooltip.tooltip-right:before,.hotspot-item[data-pos-y^="2"] .hotspot-tooltip.tooltip-right:before{top:20px;transform:none}.hotspot-item[data-pos-y^="8"] .hotspot-tooltip.tooltip-right:before,.hotspot-item[data-pos-y^="9"] .hotspot-tooltip.tooltip-right:before{top:auto;bottom:20px;transform:none}.hotspot-tooltip-img{width:100%;height:180px;overflow:hidden;background:#f5f5f5;position:relative}.hotspot-tooltip-img:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 60%,rgba(0,0,0,.05));pointer-events:none}.hotspot-tooltip-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;will-change:transform}.hotspot-tooltip-card:hover .hotspot-tooltip-img img{transform:scale(1.08)}.hotspot-tooltip-body{padding:20px}.hotspot-tooltip-title{margin:0 0 10px;font-size:17px;font-weight:700;color:var(--hs-text);line-height:1.3;letter-spacing:-.01em;padding-right:20px}.hotspot-tooltip-desc{margin:0 0 14px;font-size:14px;color:var(--hs-text-muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hotspot-tooltip-price{display:block;font-size:20px;font-weight:800;color:var(--hs-primary);margin-bottom:16px;letter-spacing:-.02em}.hotspot-tooltip-btn{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 20px;background:var(--hs-text);color:#fff;text-decoration:none;border-radius:var(--hs-radius-sm);font-size:14px;font-weight:600;transition:all var(--hs-transition-fast);border:none;cursor:pointer;position:relative;overflow:hidden}.hotspot-tooltip-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.hotspot-tooltip-btn:hover{background:var(--hs-primary);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b6b4d}.hotspot-tooltip-btn:hover:before{left:100%}.hotspot-tooltip-btn:active{transform:translateY(0)}.hotspot-dot{overflow:visible}.hotspot-dot .ripple{position:absolute;border-radius:50%;background:#fff9;transform:scale(0);animation:ripple-effect .6s linear;pointer-events:none}@keyframes ripple-effect{to{transform:scale(4);opacity:0}}.hotspot-item.is-dragging:before,.hotspot-item.is-dragging:after{content:"";position:absolute;background:#0000001a;pointer-events:none;z-index:-1}.hotspot-item.is-dragging:before{width:2000px;height:1px;left:-1000px;top:50%}.hotspot-item.is-dragging:after{width:1px;height:2000px;left:50%;top:-1000px}.shopify-design-mode .hotspot-item{cursor:grab}.shopify-design-mode .hotspot-item:active{cursor:grabbing}.shopify-design-mode .hotspot-item:after{content:attr(data-pos-x) "% , " attr(data-pos-y) "%";position:absolute;top:-30px;left:50%;transform:translate(-50%);background:#1a1a1a;color:#fff;padding:4px 10px;border-radius:var(--hs-radius-sm);font-size:12px;font-family:SF Mono,Monaco,monospace;white-space:nowrap;opacity:0;transition:opacity var(--hs-transition-fast);pointer-events:none;box-shadow:var(--hs-shadow)}.shopify-design-mode .hotspot-item:hover:after{opacity:1}.shopify-design-mode .hotspot-item.is-dragging:after{opacity:1;background:var(--hs-primary)}.hotspot-editor-controls{position:absolute;bottom:20px;left:20px;display:flex;gap:10px;z-index:var(--hs-z-editor)}.hotspot-editor-btn{padding:10px 18px;background:#1a1a1a;color:#fff;border:none;border-radius:var(--hs-radius-sm);font-size:13px;font-weight:600;cursor:pointer;transition:all var(--hs-transition-fast);box-shadow:var(--hs-shadow)}.hotspot-editor-btn:hover{background:var(--hs-primary);transform:translateY(-2px)}@media(max-width:1024px){.hotspot-section{padding:40px 16px}.hotspot-wrapper{height:auto!important;aspect-ratio:16/10;min-height:500px}.hotspot-tooltip{width:260px}.hotspot-tooltip-img{height:150px}}@media(max-width:768px){.hotspot-section{padding:30px 12px}.hotspot-wrapper{aspect-ratio:4/3;min-height:400px;border-radius:var(--hs-radius);overflow:visible}.hotspot-image-container{border-radius:var(--hs-radius)}.hotspot-dot{width:36px;height:36px}.hotspot-dot-inner{width:10px;height:10px}.hotspot-tooltip{position:fixed;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;width:90vw;max-width:360px;max-height:80vh;margin:0!important;transform:translate(-50%,-50%) scale(.9)!important;z-index:1000}.hotspot-item.active .hotspot-tooltip{transform:translate(-50%,-50%) scale(1)!important}.hotspot-tooltip:before{display:none}.hotspot-item.active:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--hs-z-overlay);animation:fade-in .3s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.hotspot-tooltip-card{max-height:70vh;overflow-y:auto}.hotspot-tooltip-img{height:200px}.hotspot-tooltip-close{opacity:1;visibility:visible;top:12px;right:12px;width:32px;height:32px;min-width:32px;min-height:32px;background:#000000b3}}@media(max-width:480px){.hotspot-wrapper{aspect-ratio:1/1;min-height:350px}.hotspot-tooltip{width:95vw;max-width:none}.hotspot-tooltip-body{padding:16px}.hotspot-tooltip-title{font-size:16px}.hotspot-tooltip-price{font-size:18px}.hotspot-tooltip-close{width:36px;height:36px;min-width:36px;min-height:36px;font-size:20px}}.hotspot-dot:focus-visible{outline:3px solid var(--hs-primary);outline-offset:4px}.hotspot-tooltip-close:focus-visible,.hotspot-tooltip-btn:focus-visible{outline:2px solid var(--hs-primary);outline-outline-offset:2px}@media(prefers-reduced-motion:reduce){.hotspot-dot,.hotspot-tooltip,.hotspot-tooltip-card,.hotspot-image,.hotspot-tooltip-img img,.hotspot-tooltip-btn{transition:none!important;animation:none!important}.hotspot-dot:after{animation:none!important}.hotspot-tooltip-card{animation:none!important}}@media(prefers-contrast:high){.hotspot-dot{border-width:4px;box-shadow:0 0 0 2px #000}.hotspot-tooltip-card{border:2px solid currentColor}.hotspot-tooltip-close{border:2px solid white}}@media(prefers-color-scheme:dark){:root{--hs-bg: #1a1a1a;--hs-text: #ffffff;--hs-text-muted: #a0a0a0;--hs-border: rgba(255, 255, 255, .1)}}.hotspot-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.hotspot-loading{pointer-events:none;opacity:.7}.hotspot-section.theme-minimal .hotspot-dot{background:#fff;border-color:var(--hs-primary)}.hotspot-section.theme-minimal .hotspot-dot-inner{background:var(--hs-primary)}.hotspot-section.theme-dark{background:linear-gradient(135deg,#1a1a2e,#16213e)}.hotspot-section.theme-dark .hotspot-wrapper{box-shadow:0 20px 60px #00000080}.hotspot-section.style-large-dots .hotspot-dot{width:44px;height:44px}.hotspot-section.style-large-dots .hotspot-dot-inner{width:12px;height:12px}.hotspot-section.no-pulse .hotspot-dot:after{display:none}@media(max-width:768px){.hotspot-tooltip{transform:scale(.88);transform-origin:center}}@media(max-width:480px){.hotspot-tooltip{transform:scale(.82);transform-origin:center}}@media(max-width:990px){.hotspot-item.active .hotspot-tooltip{position:fixed!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translate(calc(-50% + var(--card-shift-x-m, 0px)),calc(-50% + var(--card-shift-y-m, 0px))) scale(.76)!important;transform-origin:center!important;z-index:999999!important}}@media(max-width:480px){.hotspot-item.active .hotspot-tooltip{transform:translate(calc(-50% + var(--card-shift-x-m, 0px)),calc(-50% + var(--card-shift-y-m, 0px))) scale(.7)!important}}.hotspot-tooltip-media,.hotspot-tooltip-img{width:100%!important}.hotspot-tooltip-media{height:auto!important}.hotspot-tooltip-img{height:auto!important;display:block!important;object-fit:cover!important;object-position:center!important}@media(max-width:990px){.hotspot-tooltip-img{width:100%!important;height:98px!important;object-fit:cover!important;object-position:center!important}}@media(max-width:480px){.hotspot-tooltip-img{height:88px!important}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/hotspot-editor.css.map */