:host{display:block;--background-pattern-dot:url(/cdn/shop/files/ptbk.png?v=1699863504) repeat center / 2px 2px;--images-slide-index:0;--images-slide-label:"1";--images-slide-count:1;--cart-item-count:"1"}:host *{-webkit-tap-highlight-color:transparent}div.custom-builder-trigger-wrapper{background:var(--background-pattern-dot);position:fixed;padding:1em 0;height:1em;z-index:1;color:#fff;border-radius:2px 0 0 2px;transition:all .4s ease-in-out;text-align:center;margin:auto;line-height:1em;bottom:30%;left:50%;transform:translate(calc(50vw - 49px)) translateY(50%);width:54px;overflow-x:hidden;overflow-y:hidden}div.custom-builder-trigger-wrapper.active{border-radius:4px;padding:1em 0 0;width:400px;height:100px;left:50%;bottom:50%;opacity:1;transform:translate(-50%) translateY(50%)}@media screen and (max-width: 749px){div.custom-builder-trigger-wrapper.active{width:calc(100vw - 20px);bottom:100px;left:50%;right:auto;top:auto;transform:translate(-50%) translateY(0)}}div.custom-builder-trigger-wrapper.active.pending{will-change:opacity,transform;opacity:0!important;transform:translate(-50%) translateY(40%)!important;transition:.4s ease-in-out}div.custom-builder-trigger-wrapper p.custom-builder-trigger-label{visibility:hidden;opacity:0;transition:opacity .3s linear}div.custom-builder-trigger-wrapper.active p.custom-builder-trigger-label{visibility:visible;opacity:1;transition:opacity .3s linear;transition:visibility 0s linear .3s}div.custom-builder-trigger-wrapper label.custom-builder-trigger{line-height:1em;display:inline-block;width:auto;opacity:0;cursor:pointer;transition:all .4s ease-in-out}div.custom-builder-trigger-wrapper.active label.custom-builder-trigger{opacity:1;text-indent:0;transition:.2s ease-in-out}div.custom-builder-trigger-wrapper.active label.custom-builder-trigger:hover{color:teal}@media screen and (max-width: 749px){div.custom-builder-trigger-wrapper.active label.custom-builder-trigger{text-indent:1em}}div.custom-builder-trigger-wrapper div.custom-builder-trigger-grid{display:none}div.custom-builder-trigger-wrapper.active div.custom-builder-trigger-grid{display:grid;margin:1.4em auto 0;width:80%;grid-template-columns:1fr 1fr}label.custom-builder-trigger input[type=checkbox]{display:none}div.custom-builder-trigger-wrapper:has(input:checked){bottom:-100px}div.custom-builder-trigger-wrapper.active div.custom-builder-trigger-grid button{background:transparent;border:none;color:#fff;transition:.2s ease-in-out}div.custom-builder-trigger-wrapper.active div.custom-builder-trigger-grid button:hover{color:tomato}div.custom-builder-trigger-wrapper button.evacuate{display:block;position:absolute;background:transparent;border:none;margin:auto;left:0;top:0;bottom:0;width:49px;height:40px;text-align:center}div.custom-builder-trigger-wrapper.active button.evacuate{display:none}div.custom-builder-trigger-wrapper button.evacuate:after{content:"\f0ad";display:block;font-family:fontawesome;font-size:16px;color:#fff;transition:all .4s ease-in-out}div.custom-builder-trigger-wrapper.active button.evacuate:after{content:"\f00d";font-size:20px;color:tomato}div.custom-builder-trigger-wrapper.active button.evacuate:hover:after{filter:brightness(150%)}.custom-builder{position:fixed;visibility:hidden;height:90vh;margin:auto;top:0;bottom:0;left:auto;right:-100vw;background:#fff;z-index:1000;box-shadow:0 0 8px 8px #7b7b7b1a;overflow-y:scroll;overflow-x:hidden;transition:all .3s ease-in-out}@media screen and (max-width: 749px){.custom-builder{width:100%}}@media screen and (min-width: 750px){.custom-builder{width:calc(100vw - 160px)}}.custom-builder.active{visibility:visible;right:0%}.custom-builder:before{display:none;content:"";position:fixed;top:0;bottom:0;left:0;right:0;margin:auto;width:100%;height:100%;background:#fff0;visibility:hidden;z-index:10003;transition:all .5s ease-in-out}.custom-builder.loading{overflow-y:hidden}.custom-builder.loading:before{display:block;background:#ffffffb3;visibility:visible}.custom-builder.loading:after{content:"";position:fixed;top:0;bottom:0;left:0;right:0;margin:auto;display:inline-block;width:48px;height:48px;border:7px solid #e9e9e9;border-top-color:#373737;border-radius:50%;animation:spin 1s linear infinite;z-index:10003}@keyframes spin{to{transform:rotate(360deg)}}.custom-builder .navigation{padding:10px 24px 10px 20px;text-align:right;position:sticky;top:46px;background:#fff;z-index:2;border-bottom:1px solid #f7f7f7}.custom-builder .navigation label:has(input[type=radio]){background:transparent;color:#373737;padding:.4em 1em .5em 1.08em;text-align:center;display:inline-block!important;line-height:1em;border-radius:2px;cursor:pointer;font-size:14px;transition:all .4 ease-in-out}@media screen and (max-width: 749px){.custom-builder .navigation{padding:10px}.custom-builder .navigation label:has(input[type=radio]){padding:.3em .52em .4em .6em}}.custom-builder .navigation label input[type=radio]{display:none}.custom-builder .navigation label:has(input[type=radio]:hover){color:teal}.custom-builder .navigation label:has(input[type=radio]:checked){background:var(--background-pattern-dot);color:#fff;cursor:normal}.custom-builder .navigation label:only-child{visibility:hidden}.custom-builder .navigation:has(label:only-child){display:none;background:transparent;border-top:none;border-bottom:none;box-shadow:none}.builder-buttons{width:100%;height:46px;display:block;position:sticky;top:0;left:0;background:#fff;z-index:10002;border-bottom:1px solid #f7f7f7;text-align:right}button.cart{display:inline-flex!important;align-items:center;justify-content:center;gap:.6em;position:relative;z-index:10002;background:#fff;border:none;-webkit-appearance:none;appearance:none;padding:8px 14px 6px 12px;border-radius:4px;border:1px solid #f7f7f7;box-shadow:0 2px #e9e9e9;color:#373737;font-size:10px;line-height:1;letter-spacing:1px;vertical-align:middle;transition:all .2s ease-in-out}@media screen and (max-width: 749px){button.cart{margin:6px 14px 0 auto}button.cart:hover{margin:8px 14px 0 auto}}@media screen and (min-width: 750px){button.cart{margin:6px 24px 0 auto}button.cart:hover{margin:8px 24px 0 auto}}button.cart>span.icon:before{content:"\f0c9";color:teal;font-size:16px;display:inline-block;background:transparent;font-family:fontawesome;cursor:pointer;line-height:1;letter-spacing:1px;vertical-align:middle;transition:all .2s ease-in-out}button.cart:hover{color:tomato;box-shadow:0 0 #fff0}button.cart:hover>span.icon:before{color:tomato!important}button.cart:after{content:var(--cart-item-count);display:flex;align-items:center;justify-content:center;position:absolute;z-index:1;bottom:-5px;right:-8px;width:1em;height:1em;padding:.4em;border-radius:20px;color:#fff;text-align:center;background-color:teal;background:var(--background-pattern-dot)}button.remove{position:absolute;top:0;left:0;z-index:10002;background:none;border:none;-webkit-appearance:none;appearance:none;padding:.8em 1.2em;display:none}button.remove:after{content:"\f00d";color:tomato;font-size:26px;display:inline-block;background:transparent;font-family:fontawesome;cursor:pointer;transition:all .2s ease-in-out}button.cart:hover:after,button.remove:hover:after,button.remove.back:hover:after{color:#e9e9e9}button.remove.back:after{content:"\f107"!important;color:#373737}.active>button.remove,.active>.builder-buttons>button.remove,.active>.builder-buttons>button.cart{display:block}.custom-builder .builder-header{margin-top:0}.builder-block{display:none}.builder-block.active{display:block}.list-block{border:none}.item-grid,.field-container{display:none}.field-container.active{display:block}.item-grid.active{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;gap:16px;padding:20px 20px 40px}@media screen and (max-width: 749px){.item-grid.active{grid-template-columns:1fr 1fr}}@media screen and (min-width: 750px){.item-grid.active{grid-template-columns:1fr 1fr 1fr}}@media screen and (min-width: 1200px){.item-grid.active{grid-template-columns:1fr 1fr 1fr 1fr}}@media screen and (min-width: 1400px){.item-grid.active{grid-template-columns:1fr 1fr 1fr 1fr 1fr}}.item-grid .cell{position:relative;width:100%;height:100%}.item-grid .cell.active:after{display:block;position:absolute;content:"\f14a";font-family:FontAwesome;font-size:27px;color:tomato;top:0;right:.5em}.item-grid .cell input[type=radio]{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;margin:0;padding:0;background:none;border:none;border-radius:0;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.item-grid .cell input[type=radio]:hover+img{filter:brightness(80%)}.item-grid .cell input[type=radio]:disabled{cursor:normal}.item-grid .cell input[type=radio]:disabled+img{filter:grayscale(100%)}.item-grid .cell img{width:100%}.item-grid .cell .item-title{line-height:1.2em;font-size:14px;word-break:break-all!important}.item-grid .cell .item-price{text-align:right;font-weight:700;font-size:16px}.error-container{display:block;visibility:hidden;position:fixed;bottom:0;left:0;right:0;margin:auto;width:calc(100% - 40px);max-width:600px;height:0%;background:#fff;box-shadow:0 0 8px 8px #7b7b7b1a;z-index:10005;transform:translateY(100%);transition:all .3s ease-in-out}.error-container.active{visibility:visible;height:400px;transform:translateY(calc((100vh - 400px)/-2));transition:all .3s ease-in-out}.error-container.active .inner{padding:16px;text-align:center}.error-container.active .inner:before{content:"\f071";display:block;text-align:center;width:100%;font-family:fontawesome;font-size:40px;color:gold}.error-container.active .inner .description{text-align:left;color:#373737;height:200px;overflow-y:scroll;line-height:1.6em;font-size:14px;padding:.4em 1em 1em}.error-container.active .inner .description .item-list{padding-inline-start:0}.error-container.active .inner .description .item-title{color:#777;word-break:break-all;list-style:none;padding-bottom:.6em}.error-container.active .inner .description .item-title strong{font-weight:600;color:#373737;display:block;line-height:1.8em;border-bottom:1px solid #f2f2f2;margin-bottom:.4em;text-indent:.4em}.error-container.active .inner .description .caution{padding:1em 0;color:tomato}.error-container.active .inner button[value=retry]{width:160px;text-align:center;background:#e9e9e9;border-radius:4px;padding:.6em 0;border:none;position:absolute;bottom:2em;left:50%;transform:translate(-50%)}.error-container.active .inner button[value=retry]:after{content:"\f107  CLOSE";font-family:fontawesome;letter-spacing:2px;color:#373737}.error-container.active .inner button[value=retry]:hover:after{color:tomato}.description-container{display:block;visibility:hidden;position:sticky;top:0;bottom:0;left:0;right:0;margin:auto;width:calc(100% - 40px);height:0%;background:#fff;box-shadow:0 0 8px 8px #7b7b7b1a;z-index:10006;transition:all .3s ease-in-out}.description-container.active{visibility:visible;transition:all .3s ease-in-out .3s}.description-container .inner{width:100%;height:100%}.description-container .detail-grid{display:grid;height:100%;gap:40px}@media screen and (max-width: 749px){.description-container.active{height:100%}.description-container .inner{overflow-y:scroll}.description-container .detail-grid{grid-template-columns:1fr;gap:10px}}@media screen and (min-width: 750px){.description-container.active{height:calc(100% - 40px)}.description-container .inner{overflow-y:hidden}.description-container .detail-grid{grid-template-columns:5fr 7fr}}.description-container .detail-grid .detail-cell{height:100%;background:#ffffff80;padding:50px 20px 20px}.description-container .detail-grid .detail-cell:first-child{padding:50px 20px 20px}.description-container .detail-grid .detail-cell:last-child{padding:50px 20px 20px}.description-container .detail-grid .context-cell .description{padding-bottom:100px}@media screen and (max-width: 749px){.description-container .detail-grid .detail-cell{overflow-y:visible}.description-container .detail-grid .detail-cell:first-child{padding:50px 20px 0}.description-container .detail-grid .detail-cell:last-child{padding:0 20px 20px}}@media screen and (min-width: 750px){.description-container .detail-grid .detail-cell{overflow-y:scroll}}.description-container .detail-grid .detail-cell .main{width:100%;aspect-ratio:1 / 1;overflow-x:hidden;overflow-y:hidden;position:relative}.description-container .detail-grid .detail-cell .main .image-grid{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0px;transform:translate(calc(-100% * var(--images-slide-index) / var(--images-slide-count)));transition:all .2s ease-in-out}.description-container .detail-grid .detail-cell .main .image-grid .image-grid-cell img{width:100%}.description-container .detail-grid .detail-cell .controller{width:100%;margin:2em auto 0;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;justify-items:center}.description-container .detail-grid .detail-cell .controller>div.prev{justify-self:start}.description-container .detail-grid .detail-cell .controller>div.prev button:after{display:inline-block;content:"\f104";height:1em;line-height:1em;font-family:fontawesome}.description-container .detail-grid .detail-cell .controller>div.next{justify-self:end}.description-container .detail-grid .detail-cell .controller>div.next button:after{display:inline-block;content:"\f105";height:1em;line-height:1em;font-family:fontawesome}.description-container .detail-grid .detail-cell .controller>div button{background:none;border:none;font-size:26px;cursor:pointer;color:#777}.description-container .detail-grid .detail-cell .controller>div button:disabled{color:#e9e9e9;cursor:normal}@media (hover: hover) and (pointer: fine){.description-container .detail-grid .detail-cell .controller>div button:not(:disabled):hover:after{color:#e9e9e9}}.description-container .detail-grid .detail-cell .controller .now:after{display:inline;content:var(--images-slide-label)}.description-container h3.title{line-height:1.4em}.description-container .price{font-size:18px;font-weight:600}.description-container .submit{padding:1em 0}.description-container .submit .builder-submit-button{font-size:18px;letter-spacing:1px;background:var(--background-pattern-dot);color:#fff;border:none;border-radius:2px;letter-spacing:2px;line-height:1em;cursor:pointer;display:inline-block;transition:all .3s ease-in-out}@media screen and (max-width: 749px){.description-container .submit .builder-submit-button{width:100%;padding:.8em 0 .72em}}@media screen and (min-width: 750px){.description-container .submit .builder-submit-button{width:auto;padding:.4em 1em .32em}}.description-container .submit .builder-submit-button:not(:disabled):hover{background:teal}.description-container .submit .builder-submit-button:after{display:inline-block;content:"+";font-family:FontAwesome;width:1em;padding-left:.5em}.description-container .submit .builder-submit-button:disabled:after{display:inline-block;content:"\f00c";font-family:FontAwesome;width:1em;padding-left:.5em}.description-container .submit .builder-submit-button:disabled{background:teal;cursor:none}.builder-list-container{display:block;visibility:hidden;position:sticky;top:0;bottom:0;right:0;left:0;margin:auto;width:calc(100% - 40px);height:0%;background:#fff;box-shadow:0 0 8px 8px #7b7b7b1a;z-index:10005;filter:brightness(100%);overflow:hidden;transition:all .3s ease-in-out .3s}.builder-list-container.active{overflow:visible;visibility:visible;transition:all .3s ease-in-out}@media screen and (max-width: 749px){.builder-list-container{width:100%}.builder-list-container.active{height:100%}}@media screen and (min-width: 750px){.builder-list-container.active{height:calc(100% - 40px)}}.builder-list-container .inner{height:100%;overflow-y:scroll}.builder-list-container .inner h2.builder-list-title{font-size:18px;text-align:right;padding:40px;position:sticky;z-index:1;top:0;margin:0!important;letter-spacing:2px;background:#fff;box-shadow:0 4px 8px 8px #fff6}.builder-list-container .inner h2.builder-list-title:before{display:inline-block;content:"\f00c";color:teal;font-family:fontawesome;margin-right:.2em}.builder-list-container .inner .item-grid-wrap{padding:30px 40px 160px}.builder-list-container .inner .item-grid-wrap .item-grid{display:grid;grid-template-columns:150px 1fr;gap:20px}@media screen and (max-width: 749px){.builder-list-container .inner h2.builder-list-title{padding:20px}.builder-list-container .inner .item-grid-wrap{padding:10px 20px 160px}.builder-list-container .inner .item-grid-wrap .item-grid{grid-template-columns:100px 1fr;gap:10px}}.builder-list-container .inner .item-grid .cell{background:#fff;padding-bottom:20px}.builder-list-container .inner .item-grid .cell h4.item-group-label{line-height:2.2em}.builder-list-container .inner .item-grid.caution h4.item-group-label:before{display:inline-block;width:1em;margin-right:.4em;content:"\f071";font-family:fontawesome;color:gold}.builder-list-container .inner .item-grid .cell button.builder-item{display:block;position:relative;background:#fff;border:none;width:100%;aspect-ratio:1 /1}.builder-list-container .inner .item-grid .cell button.builder-item:has(img[src=""]):before{content:"";display:block;position:absolute;width:100%;aspect-ratio:1 /1;background:#e9e9e9;left:0;right:0;top:0;bottom:0;margin:auto}.builder-list-container .inner .item-grid .cell button.builder-item:has(img[src=""]):after{content:"UNSELECTED";display:block;position:absolute;width:100%;height:1em;text-align:center;top:0;bottom:0;left:0;right:0;margin:auto;font-size:12px;color:#fff}.builder-list-container .inner .item-grid .cell button.builder-item:not(:disabled):hover{filter:brightness(75%)}.builder-list-container .inner .item-grid .cell button.delete{display:block;position:absolute;right:2px;top:0;width:20px;height:20px;border:none;padding:.4em 0;background:transparent}.builder-list-container .inner .item-grid .cell button.delete:disabled{display:none}.builder-list-container .inner .item-grid .cell button.delete:before{display:none}.builder-list-container .inner .item-grid .cell button.delete:after{display:block;content:"\f2ed";font-family:fontawesome;font-weight:400;font-size:18px;color:#777}.builder-list-container .inner .item-grid .cell button.delete:hover:after{color:tomato;font-weight:900}.builder-list-container .inner .item-grid .cell:has(button.delete:hover) h4.item-group-label{color:tomato}.builder-list-container .inner .item-grid .cell h4{line-height:1.6em;margin:0 auto 10px}.builder-list-container .inner .item-grid .cell h5.item-title{width:100%;line-height:1.6em;margin:.8em auto;font-size:16px;text-align:left;color:#373737;font-weight:400}@media screen and (max-width: 749px){.builder-list-container .inner .item-grid .cell h5.item-title{font-size:12px}}.builder-list-container .inner .item-grid .cell p.item-price{width:100%;line-height:1.6em;margin:.8em auto;font-size:16px;text-align:right;color:#373737;font-weight:600}.builder-list-container .inner .summary{padding:.6em 1em;position:fixed;bottom:-230px;right:0;left:0;width:calc(100% - 100px);z-index:10006;border-radius:4px;background:var(--background-pattern-dot);pointer-events:none;margin:40px auto;transition:all .3s ease-in-out}@media screen and (max-width: 749px){.builder-list-container .inner .summary{right:0;width:calc(100vw - 60px)}}.builder-list-container.active .inner .summary{pointer-events:auto;bottom:40px;transition:all .3s ease-in-out .6s}.builder-list-container .inner .summary h3{text-align:right;line-height:1em;padding:0 10px 0 0;font-weight:800;letter-spacing:1px;font-size:16px;color:#fff;display:block;position:relative}.builder-list-container .inner .summary h3 .total-price{color:teal;letter-spacing:1px;font-weight:700;text-shadow:0 0 5px rgba(0,255,255,.2);-webkit-text-stroke:.2px #00b3b3}.builder-list-container .inner .summary h3 button.all-submit{background:none;border:none;font-size:20px;position:relative}.builder-list-container .inner .summary h3 button.all-submit:after{display:inline-block;content:"\f217";height:1em;position:absolute;top:-15px;right:-8px;font-family:fontawesome}.builder-list-container .inner .summary h3 button.all-submit:disabled:after{cursor:normal;color:#373737}.builder-list-container .inner .summary h3 button.all-submit:not(:disabled):after{color:#ff7f7f;-webkit-text-stroke:1px rgba(255,100,100,.4);animation:pikupiku .6s ease-in-out infinite}.builder-list-container .inner .summary h3 button.all-submit:not(:disabled):hover:after{filter:brightness(125%);text-shadow:0 0 15px rgba(255,100,100,.8)}@keyframes pikupiku{0%{transform:rotate(0)}5%{transform:rotate(6deg)}10%{transform:rotate(0)}15%{transform:rotate(-6deg)}20%{transform:rotate(0)}25%{transform:rotate(6deg)}30%{transform:rotate(0)}35%{transform:rotate(-6deg)}40%{transform:rotate(0)}to{transform:rotate(0)}}
/*# sourceMappingURL=/cdn/shop/t/26/assets/custom-builder.css.map */