.wall-preview{border-radius:8px;min-height:400px;padding-top:20px}.wall-preview .preview-header{border-bottom:2px solid #e9ecef;margin-bottom:20px;padding-bottom:10px}.wall-preview .preview-header h3{color:#343a40;font-size:1.25rem;font-weight:600;margin:0}.wall-preview .wall-segments-container{align-items:flex-end;display:flex;flex-direction:row;gap:var(--segment-gap,10px);min-width:-webkit-fill-available;min-width:-moz-available}.wall-preview .preview-content{min-height:350px;position:relative}.wall-preview .preview-placeholder{align-items:center;background:#fff;border:2px dashed #dee2e6;border-radius:8px;color:#6c757d;display:flex;font-style:italic;height:300px;justify-content:center}.wall-preview .preview-placeholder span{font-size:1.1rem}.wall-preview .corner-indicator{height:16px;position:absolute;width:16px;z-index:20}.wall-preview .corner-indicator .corner-marker{align-items:center;background:#ffc107;border:2px solid #e0a800;border-radius:50%;color:#212529;cursor:pointer;display:flex;font-size:.7rem;font-weight:700;height:100%;justify-content:center;transition:all .2s ease;width:100%}.wall-preview .corner-indicator .corner-marker:hover{background:#e0a800;transform:scale(1.2)}.wall-preview .front-view-container{align-items:stretch;background:#fff;border-radius:8px;display:flex;flex-direction:column;gap:10px;overflow:hidden;position:relative;width:100%}.wall-preview .front-view-wrapper{align-items:flex-start;display:flex;overflow:hidden;position:relative}.wall-preview .width-marker{margin-top:15px;position:relative;width:100%}.wall-preview .width-marker .width-marker-line{background:var(--primary-color,#d6591f);height:2px;margin:0;position:relative;width:var(--total-length,100%)}.wall-preview .width-marker .width-marker-line:after,.wall-preview .width-marker .width-marker-line:before{background:var(--primary-color,#d6591f);content:"";height:8px;position:absolute;top:-3px;width:2px}.wall-preview .width-marker .width-marker-line:before{left:0}.wall-preview .width-marker .width-marker-line:after{right:0}.wall-preview .width-marker .width-marker-labels{height:30px;margin-top:5px;position:relative}.wall-preview .width-marker .width-marker-labels .segment-width-marker{background:#28a745;border-radius:3px;color:#fff;font-size:.7rem;font-weight:500;left:var(--segment-start-x,0);padding:3px 6px;position:absolute;top:0;transform:translate(-50%);white-space:nowrap}.wall-preview .width-marker .width-marker-labels .segment-width-marker span{display:block}.wall-preview .width-marker .total-width-marker{background:var(--primary-color,#d6591f);border-radius:4px;color:#fff;display:inline-block;font-size:.85rem;font-weight:600;margin-top:10px;padding:6px 12px;text-align:left}.wall-preview .front-view{background:transparent;display:flex;flex:1;flex-direction:column;min-height:200px;overflow:auto hidden;padding:20px 20px 6px;position:relative}.wall-preview .front-view::-webkit-scrollbar{height:16px}.wall-preview .front-view::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.wall-preview .front-view::-webkit-scrollbar-thumb{background:var(--primary-color,#d6591f);border:3px solid #f1f1f1;border-radius:7px}.wall-preview .front-view::-webkit-scrollbar-thumb:hover{background:var(--primary-color,#d6591f)}.wall-preview .front-view>div:first-child{align-items:flex-end;display:flex;flex-direction:row;gap:var(--segment-gap,10px);min-width:-webkit-fill-available;min-width:-moz-available}[data-segment-gap] .wall-preview .front-view{--segment-gap:attr(data-segment-gap px)}.wall-preview .width-marker-in-scroll{margin-top:15px;min-width:var(--total-length,100%);position:relative}.wall-preview .width-marker-in-scroll .width-marker-line{background:var(--primary-color,#d6591f);height:2px;position:relative;width:var(--total-length,100%)}.wall-preview .width-marker-in-scroll .width-marker-line:after,.wall-preview .width-marker-in-scroll .width-marker-line:before{background:var(--primary-color,#d6591f);content:"";height:8px;position:absolute;top:-3px;width:2px}.wall-preview .width-marker-in-scroll .width-marker-line:before{left:0}.wall-preview .width-marker-in-scroll .width-marker-line:after{right:0}.wall-preview .width-marker-in-scroll .width-marker-labels{height:30px;margin-top:5px;position:relative;width:var(--total-length,100%)}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker{background:#28a745;border-radius:3px;box-shadow:0 2px 4px #0000001a;color:#fff;font-size:.7rem;font-weight:500;left:var(--segment-start-x,0);padding:3px 6px;position:absolute;top:0;transform:translate(-50%);transition:left .15s ease-out,background-color .15s ease;white-space:nowrap;z-index:10}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker span{display:block}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker:after{background:#28a7451a;border-radius:5px;content:"";top:-2px;right:-2px;bottom:-2px;left:-2px;opacity:0;position:absolute;transition:opacity .2s ease;z-index:-1}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker:hover:after{opacity:1}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker.marker-repositioned{background:#ffc107;box-shadow:0 3px 6px #ffc10766;color:#212529}.wall-preview .width-marker-in-scroll .width-marker-labels .segment-width-marker.marker-repositioned:before{content:"\1f4cd";font-size:.6rem;left:50%;position:absolute;top:-15px;transform:translate(-50%)}.wall-preview .width-marker-in-scroll .total-width-marker{background:var(--primary-color,#d6591f);border-radius:4px;box-shadow:0 2px 6px #007bff4d;color:#fff;display:inline-block;font-size:.85rem;font-weight:600;left:20px;margin-top:10px;padding:6px 12px;position:sticky;text-align:left;top:0;z-index:15}.wall-preview .height-marker-in-scroll{height:var(--max-height,200px);left:20px;pointer-events:none;position:absolute;right:20px;top:20px;z-index:20}.wall-preview .height-marker-in-scroll .height-marker-labels{height:100%;position:relative;width:var(--total-length,100%)}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker{bottom:0;height:var(--segment-height,200px);left:var(--segment-center-x,0);pointer-events:none;position:absolute;transform:translate(-50%);transition:left .15s ease-out;width:60px;z-index:20}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-line{background:#dc3545;height:100%;left:50%;position:absolute;top:0;transform:translate(-50%);width:2px;z-index:20}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-line:after,.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-line:before{background:#dc3545;content:"";height:2px;left:-3px;position:absolute;width:8px;z-index:20}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-line:before{top:0}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-line:after{bottom:0}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker .height-marker-center{background:#dc3545;border-radius:3px;box-shadow:0 2px 4px #dc35454d;color:#fff;font-size:.7rem;font-weight:500;left:50%;padding:3px 6px;position:absolute;top:50%;transform:translateY(-50%) translate(-50%);white-space:nowrap;z-index:25}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker.marker-repositioned .height-marker-center{background:#ffc107;box-shadow:0 3px 6px #ffc10766;color:#212529;z-index:25}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker.marker-repositioned .height-marker-line,.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker.marker-repositioned .height-marker-line:after,.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker.marker-repositioned .height-marker-line:before{background:#ffc107;z-index:20}.wall-preview .height-marker-in-scroll .height-marker-labels .segment-height-marker.marker-repositioned:before{content:"\1f4cd";font-size:.6rem;left:50%;position:absolute;top:-15px;transform:translate(-50%);z-index:30}.wall-preview .segment-labels-in-scroll{margin-top:10px;min-width:var(--total-length,100%);position:relative}.wall-preview .segment-labels-in-scroll .segment-labels-container{height:35px;position:relative;width:var(--total-length,100%)}.wall-preview .segment-labels-in-scroll .segment-labels-container .segment-label-marker{background:#6c757d;border-radius:4px;box-shadow:0 2px 4px #0000001a;color:#fff;font-size:.9rem;font-weight:600;left:var(--segment-center-x,0);padding:5px 10px;position:absolute;top:0;transform:translate(-50%);transition:left .15s ease-out,background-color .15s ease;white-space:nowrap;z-index:10}.wall-preview .segment-labels-in-scroll .segment-labels-container .segment-label-marker:after{background:#6d767e1a;border-radius:6px;content:"";top:-2px;right:-2px;bottom:-2px;left:-2px;opacity:0;position:absolute;transition:opacity .2s ease;z-index:-1}.wall-preview .segment-labels-in-scroll .segment-labels-container .segment-label-marker:hover:after{opacity:1}.wall-preview .segment-labels-in-scroll .segment-labels-container .segment-label-marker.label-repositioned{background:#fd7e14;box-shadow:0 3px 6px #fd7e1466;color:#fff}.wall-preview .segment-labels-in-scroll .segment-labels-container .segment-label-marker.label-repositioned:before{content:"\1f3f7\fe0f";font-size:.6rem;left:50%;position:absolute;top:-15px;transform:translate(-50%)}.wall-preview .segment-front{align-items:center;display:flex;flex:none;flex-direction:column;min-width:200px;position:relative}.wall-preview .segment-front .blocks-grid{background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;position:relative}.wall-preview .segment-front .block-item{align-items:center;background:#6c757d;border:1px solid #adb5bd;border-radius:2px;display:flex;height:var(--block-height,20px);justify-content:center;position:absolute;transition:all .2s ease;width:var(--block-length,40px)}.wall-preview .segment-front .block-item:hover{background:#495057;transform:scale(1.05);z-index:10}.wall-preview .segment-front .block-item.alternating-row{background:#5a6268;border-color:#495057}.wall-preview .segment-front .block-item.alternating-row:hover{background:#495057}.wall-preview .segment-front .block-item.corner{background:#dc3545;border-color:#c82333}.wall-preview .segment-front .block-item.corner:hover{background:#c82333}.wall-preview .segment-front .block-item.corner.alternating-row{background:#c82333;border-color:#bd2130}.wall-preview .segment-front .block-item.corner.alternating-row:hover{background:#bd2130}.wall-preview .segment-front .block-item.top-stone{background:#17a2b8;border-color:#138496}.wall-preview .segment-front .block-item.top-stone:hover{background:#138496}.wall-preview .segment-front .block-item.top-stone.alternating-row{background:#17a2b8;border-color:#138496}.wall-preview .segment-front .block-item.top-stone.alternating-row:hover{background:#138496}.wall-preview .segment-front .block-item.starting-stone{background:#28a745;border-color:#1e7e34}.wall-preview .segment-front .block-item.starting-stone:hover{background:#1e7e34}.wall-preview .segment-front .block-item.starting-stone.alternating-row{background:#1e7e34;border-color:#1c7430}.wall-preview .segment-front .block-item.starting-stone.alternating-row:hover{background:#1c7430}.wall-preview .segment-front .block-item.end-stone{background:#28a745;border-color:#1e7e34}.wall-preview .segment-front .block-item.end-stone:hover{background:#1e7e34}.wall-preview .segment-front .block-item.end-stone.alternating-row{background:#1e7e34;border-color:#1c7430}.wall-preview .segment-front .block-item.end-stone.alternating-row:hover{background:#1c7430}.wall-preview .segment-front .block-item.top-corner-stone{background:#6f42c1;border-color:#5a32a3}.wall-preview .segment-front .block-item.top-corner-stone:hover{background:#5a32a3}.wall-preview .segment-front .block-item.top-corner-stone.alternating-row{background:#5a32a3;border-color:#492c85}.wall-preview .segment-front .block-item.top-corner-stone.alternating-row:hover{background:#492c85}.wall-preview .segment-front .block-item .block-image-container{background-image:var(--block-bg-image,none);background-position:50%;background-repeat:no-repeat;background-size:cover;height:var(--block-height,20px);position:relative;width:var(--block-length,40px)}.wall-preview .segment-front .block-item .block-fallback{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.wall-preview .segment-front .block-item .block-fallback .block-text{color:#fff;font-size:.6rem;font-weight:500;text-shadow:1px 1px 1px rgba(0,0,0,.3)}.wall-preview .top-view-container{background:#fff;border:1px solid #dee2e6;border-radius:8px;max-height:600px;min-height:400px;overflow:auto;padding:40px 8px 8px 20px;position:relative}.wall-preview .top-view-container::-webkit-scrollbar{height:16px;width:16px}.wall-preview .top-view-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:8px}.wall-preview .top-view-container::-webkit-scrollbar-thumb{background:var(--primary-color,#d6591f);border:3px solid #f1f1f1;border-radius:8px}.wall-preview .top-view-container::-webkit-scrollbar-thumb:hover{background:var(--primary-color-dark,#953e15)}.wall-preview .top-view{height:100%;overflow:auto;padding-bottom:4px;padding-right:4px;position:relative;width:100%}.wall-preview .top-view::-webkit-scrollbar{height:16px;width:16px}.wall-preview .top-view::-webkit-scrollbar-track{background:#f1f1f1;border-radius:8px}.wall-preview .top-view::-webkit-scrollbar-thumb{background:var(--primary-color,#d6591f);border:3px solid #f1f1f1;border-radius:8px}.wall-preview .top-view::-webkit-scrollbar-thumb:hover{background:var(--primary-color-dark,#953e15)}.wall-preview .wall-segments-container-top{margin:0 auto;min-height:var(--total-height,400px);min-width:var(--total-length,800px);padding:20px 0;position:relative}.wall-preview .wall-segments-path{height:100%;position:relative;width:100%}.wall-preview .segment-line-container{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.wall-preview .segment-line{background:linear-gradient(90deg,#495057,#6c757d 50%,#495057);border-radius:3px;box-shadow:0 2px 4px #0003;cursor:pointer;height:6px;left:var(--start-x);pointer-events:all;position:absolute;top:var(--start-y);transform:rotate(var(--segment-angle));transform-origin:left center;transition:all .3s ease;width:var(--segment-length)}.wall-preview .segment-line:hover{background:linear-gradient(90deg,#343a40,#495057 50%,#343a40);box-shadow:0 4px 8px #0000004d;height:8px;margin-top:-1px}.wall-preview .segment-line:before{top:-2px}.wall-preview .segment-line:after,.wall-preview .segment-line:before{background:#adb5bd;border-radius:1px;content:"";height:2px;left:0;opacity:.6;position:absolute;width:100%}.wall-preview .segment-line:after{bottom:-2px}.wall-preview .corner-marker{left:var(--marker-x);pointer-events:all;position:absolute;top:var(--marker-y);transform:translate(-50%,-50%);z-index:3}.wall-preview .corner-point{background:#dc3545;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 3px #0003;cursor:pointer;height:12px;transition:all .2s ease;width:12px}.wall-preview .corner-point:hover{box-shadow:0 2px 6px #0000004d;transform:scale(1.2)}.wall-preview .end-marker,.wall-preview .start-marker{left:var(--marker-x);pointer-events:all;position:absolute;top:var(--marker-y);transform:translate(-50%,-50%);z-index:4}.wall-preview .end-point,.wall-preview .start-point{background:#28a745;border:2px solid #fff;border-radius:3px;box-shadow:0 1px 3px #0003;cursor:pointer;height:16px;transition:all .2s ease;width:16px}.wall-preview .end-point:hover,.wall-preview .start-point:hover{box-shadow:0 2px 6px #0000004d;transform:scale(1.1)}.wall-preview .top-corner-marker{left:var(--marker-x);pointer-events:all;position:absolute;top:var(--marker-y);transform:translate(-50%,-50%);z-index:5}.wall-preview .top-corner-point{background:#6f42c1;border:2px solid #fff;box-shadow:0 1px 3px #0003;cursor:pointer;height:16px;transform:rotate(45deg);transition:all .2s ease;width:16px}.wall-preview .top-corner-point:hover{box-shadow:0 2px 6px #0000004d;transform:rotate(45deg) scale(1.1)}.wall-preview .segment-label-path{background:#ffffffe6;border-radius:4px;box-shadow:0 1px 3px #0000001a;color:#495057;font-size:.75rem;left:var(--label-x);padding:4px 8px;pointer-events:all;position:absolute;text-align:center;top:var(--label-y);transform:translate(-50%);white-space:nowrap;z-index:2}.wall-preview .segment-label-path span{display:block}.wall-preview .segment-label-path span:first-child{font-weight:600;margin-bottom:2px}.wall-preview .segment-label-path span.segment-length{background:#f8f9fa;border:1px solid #dee2e6;border-radius:2px;color:#6c757d;font-size:.7rem;padding:1px 4px}.wall-preview .segment-label-box{color:#495057;font-size:.75rem;left:50%;position:absolute;text-align:center;top:-40px;transform:translate(-50%);white-space:nowrap;z-index:2}.wall-preview .segment-label-box span{display:block}.wall-preview .segment-label-box span:first-child{font-weight:600;margin-bottom:2px}.wall-preview .segment-label-box span.segment-length{background:#f8f9fa;border:1px solid #dee2e6;border-radius:2px;color:#6c757d;font-size:.7rem;padding:1px 4px}.wall-preview .segment-label-line{color:#495057;font-size:.75rem;left:50%;position:absolute;text-align:center;top:-40px;transform:translate(-50%);white-space:nowrap;z-index:2}.wall-preview .segment-label-line span{display:block}.wall-preview .segment-label-line span:first-child{font-weight:600;margin-bottom:2px}.wall-preview .segment-label-line span.segment-length{background:#f8f9fa;border:1px solid #dee2e6;border-radius:2px;color:#6c757d;font-size:.7rem;padding:1px 4px}.wall-preview .segment-rotation-controls{align-items:center;background:#ffffffe6;border:1px solid #dee2e6;border-radius:16px;box-shadow:0 2px 4px #0000001a;display:flex;gap:4px;left:50%;opacity:0;padding:2px 8px;position:absolute;top:20px;transform:translate(-50%);transition:opacity .2s ease-in-out;z-index:10}.wall-preview .segment-rotation-controls .rotation-button{color:#495057;height:24px;min-width:24px;padding:4px}.wall-preview .segment-rotation-controls .rotation-button:hover{background:#007bff1a;color:var(--primary-color,#d6591f)}.wall-preview .segment-rotation-controls .rotation-button .MuiSvgIcon-root{font-size:16px}.wall-preview .segment-rotation-controls .rotation-display{color:#495057;font-size:.7rem;font-weight:600;min-width:24px;text-align:center}.wall-preview .segment-line:hover .segment-rotation-controls{opacity:1}.wall-preview .total-length-display{background:#28a745;border-radius:4px;bottom:10px;box-shadow:0 2px 4px #0000001a;color:#fff;font-size:.9rem;font-weight:600;left:50%;padding:6px 12px;position:absolute;transform:translate(-50%)}.wall-preview .legend-container{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px}.wall-preview .legend-swatch{border-radius:2px;height:12px;width:12px}.wall-preview .legend-swatch.legend-swatch--regular{background:#6c757d;border:1px solid #adb5bd}.wall-preview .legend-swatch.legend-swatch--corner{background:#dc3545;border:1px solid #c82333}.wall-preview .legend-swatch.legend-swatch--top{background:#17a2b8;border:1px solid #138496}.wall-preview .legend-swatch.legend-swatch--end{background:#28a745;border:1px solid #1e7e34}.wall-preview .legend-swatch.legend-swatch--top-corner{background:#6f42c1;border:1px solid #5a32a3}.wall-preview .legend-swatch.legend-swatch--wall-body{background:linear-gradient(90deg,#495057,#6c757d 50%,#495057);border:1px solid #adb5bd}.wall-preview .legend-marker.legend-marker--height{background:#dc3545;border-radius:1px;height:12px;width:2px}.wall-preview .legend-marker.legend-marker--width{background:var(--primary-color,#d6591f);border-radius:1px;height:2px;width:12px}.wall-preview .legend-dot{border-radius:50%;height:8px;width:8px}.wall-preview .legend-dot.legend-dot--corner{background:#dc3545;border:1px solid #fff}.wall-preview .legend-dot.legend-dot--end{background:#28a745;border:1px solid #fff;border-radius:2px}.wall-preview .legend-dot.legend-dot--top-corner{background:#6f42c1;border:1px solid #fff;border-radius:2px}
/*# sourceMappingURL=/cdn/shop/t/108/assets/sb-wall-builder.css.map */