img.draggable-piece{text-align:right;position:relative;width:135px!important;height:100px!important;margin:4px 6px 6px;overflow:hidden;vertical-align:top;outline:0px!important}.builder .container{display:flex;justify-content:center;align-items:start}.builder canvas{border:1px solid black;background-color:#f8f8f8}.builder .draggable{height:auto;object-fit:contain;transition:transform .3s ease-in-out}#pieces-container{display:flex;flex-wrap:wrap;justify-content:space-around}.piece.right{float:right}.piece.left{float:left}.piece.top{margin-top:10px}.piece.bottom{margin-bottom:10px}#sidebar{display:flex;flex-wrap:wrap;overflow-y:auto}.draggable-piece{height:auto;object-fit:contain;cursor:grab}.colors-container{text-align:justify;display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;justify-content:center}.color-box{width:50px;height:50px;border-radius:50%;cursor:pointer;border:2px solid #ccc;display:inline-block}.color-box:hover{border:2px solid black}.builder .sidebar{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;justify-content:center;border-right:1px solid #000;border-radius:5px;padding:5px;background-color:#f8f8f8}.planner-heading{font-size:24px;font-weight:600;margin-bottom:8px}.planner-divider{width:100%;border:0;border-top:1px solid #000;margin:0 auto 20px}.sectional-planner{max-width:1200px;margin:0 auto;font-family:Arial,sans-serif;padding:20px}.planner-steps{display:flex;gap:1rem;font-size:1rem;margin-bottom:10px}.planner-steps .step.active{font-weight:700}.planner-divider{border:none;border-top:1px solid #000;margin-bottom:20px}.planner-body{display:flex;gap:20px}.planner-left{flex:2;padding:20px;position:relative;min-height:400px}.planner-right{flex:1;padding:20px}.colors-container{display:flex;gap:10px;margin-top:20px}.color-box{width:40px;height:40px;cursor:pointer;border:1px solid #555;border-radius:3px}.sidebar{border:1px solid #eee;padding:20px}.product{display:none}.product-images img{max-width:100%;height:auto;display:block;margin-bottom:10px}.planner-heading{text-align:center;font-size:24px;margin-top:30px;font-family:Arial,sans-serif}.planner-divider{width:100%;margin:10px auto 20px;border:0;border-top:1px solid #000}.tab-button{background-color:#eee;border:1px solid #ccc;padding:10px 20px;margin:0 5px;cursor:pointer;font-family:Arial,sans-serif;font-weight:400;outline:none}.tab-button.active{background-color:#fff;border-bottom:1px solid #fff;font-weight:700}.planner-layout{display:flex;width:90%;margin:0 auto;gap:20px}.planner-canvas{flex:2;border:1px solid #ddd;min-height:500px;position:relative}.planner-sidebar{flex:1;border:1px solid #ddd;padding:20px;min-width:300px}.tab-content{display:none}.build-item{margin-bottom:15px;border-bottom:1px solid #eee;padding-bottom:10px}.build-item img{max-width:100%;height:auto;display:block;margin-bottom:5px}.placeholder-img{width:100px;height:100px;background-color:#ccc;display:flex;align-items:center;justify-content:center;font-size:12px;margin-bottom:5px}.fabric-swatches{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}.color-box{width:40px;height:40px;border-radius:3px;border:1px solid #333;cursor:pointer}*{box-sizing:border-box}.planner-container{display:flex!important;flex-wrap:wrap!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0 10px!important;box-sizing:border-box!important}.planner-left,.planner-right{box-sizing:border-box;padding:10px;flex:1 1 100%}@media (min-width: 768px){.planner-left{flex:2 1 0}.planner-right{flex:1 1 0}}.planner-right{flex:1;display:flex;flex-direction:column;padding:10px}.tab-button{flex:1;background-color:#eee;border:1px solid #ccc;border-right:none;cursor:pointer;padding:10px;text-align:center;font-family:Arial,sans-serif;outline:none}.tab-button:last-child{border-right:1px solid #ccc}.tab-button.active{background-color:#fff;font-weight:700}.tab-content{display:none;border-top:1px solid #ccc;padding-top:10px}.tab-content.active{display:block}.builder{margin-top:10px}.product{margin-bottom:20px}.product-images img{max-width:100%;height:auto;display:block}.no-image{width:100px;height:100px;background-color:#ccc;display:flex;justify-content:center;align-items:center}.colors-container{display:flex;flex-wrap:wrap;gap:10px}#product-details .placeholder{margin:0 0 12px;padding:12px;background:#f9f9f9;color:#666;font-style:italic;text-align:center}.color-box{width:50px;height:50px;border:1px solid #555;border-radius:4px;cursor:pointer}.title-line{display:flex;align-items:center;margin:20px 0;justify-content:center!important}.title-line h2{margin:0 15px 0 0;font-size:24px;opacity:0;animation:fadeIn 1s forwards}.title-line .divider{flex:1;height:2px;background-color:#000;opacity:0;animation:growLine 1s forwards;animation-delay:.5s}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes growLine{0%{width:0;opacity:0}to{width:100%;opacity:1}}.heading-container{text-align:center;margin-top:20px;margin-bottom:20px}.heading-container h1{font-weight:100;font-family:Arial,sans-serif;font-size:25px;margin:0;padding:0}.heading-line{width:80%;margin:10px auto 0;border:none;border-top:1px solid #000}.planner-tabs{display:flex;justify-content:center}.tab-button{background:#fff;border:1px solid #ccc;border-bottom:none;cursor:pointer;padding:10px 20px;margin:0 5px;font-family:Arial,sans-serif;font-size:16px;outline:none;border-top-left-radius:8px;border-top-right-radius:8px;transition:background-color .3s ease,box-shadow .3s ease}.tab-button:hover{background-color:#e2e2e2;box-shadow:0 2px 6px #0000001a}.tab-button.active{background-color:#000;color:#fff!important}.title_builder{font-size:15px;font-weight:400;margin-top:5px;text-align:start}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#product-details .selected-item{display:flex;align-items:center}.selected-thumb{width:60px;margin-right:12px;object-fit:cover}.selected-info h3{margin:0 0 4px;font-size:16px;font-weight:600}.selected-info p{margin:0;font-size:14px;color:#555}.selected-item{display:flex!important;text-align:center;padding:5px}div#tab-build{max-height:60vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.planner-container{display:flex;max-width:100%;margin:0 auto;padding-left:20px;padding-right:20px}.planner-left{max-height:70vh}
/*# sourceMappingURL=/cdn/shop/t/10/assets/sectional-builder.css.map */