hemfixarna-web-components 1.8.15 → 1.8.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/dist/cjs/hemfixarna-address_15.cjs.entry.js +4 -4
  2. package/dist/cjs/hemfixarna-address_15.cjs.entry.js.map +1 -1
  3. package/dist/collection/components/hemfixarna-checkout/hemfixarna-checkout.js +2 -2
  4. package/dist/collection/components/hemfixarna-checkout/hemfixarna-checkout.js.map +1 -1
  5. package/dist/collection/components/hemfixarna-component/hemfixarna.css +4 -0
  6. package/dist/collection/components/hemfixarna-getuser/hemfixarna-getuser.js +1 -1
  7. package/dist/collection/components/hemfixarna-getuser/hemfixarna-getuser.js.map +1 -1
  8. package/dist/esm/hemfixarna-address_15.entry.js +4 -4
  9. package/dist/esm/hemfixarna-address_15.entry.js.map +1 -1
  10. package/dist/hemfixarna-components/hemfixarna-components.esm.js +1 -1
  11. package/dist/hemfixarna-components/p-a838e61e.entry.js +2 -0
  12. package/dist/hemfixarna-components/p-a838e61e.entry.js.map +1 -0
  13. package/package.json +1 -1
  14. package/dist/hemfixarna-components/p-4e4bb5ab.entry.js +0 -2
  15. package/dist/hemfixarna-components/p-4e4bb5ab.entry.js.map +0 -1
package/dist/cjs/hemfixarna-address_15.cjs.entry.js CHANGED
@@ -631,9 +631,9 @@ const HemfixarnaCheckout = class {
631
631
  return index.h("hemfixarna-getuser", null);
632
632
  }
633
633
  else if (index$1.state.checkoutStep === 2) {
634
- return (index.h("div", { class: "mb-2" }, index.h("div", { class: "hemfixarna_addressinfo" }, index.h("div", null, index.h("p", null, hideField(index$1.state.user.firstName)), index.h("p", null, hideField(index$1.state.user.lastName)), index.h("p", null, index$1.state.user.email), index.h("p", null, index$1.state.user.phone)), index.h("div", null, index.h("p", null, hideField(index$1.state.user.street)), index.h("p", null, hideField(index$1.state.user.zip)), index.h("p", null, hideField(index$1.state.user.town))), index.h("button", { onClick: () => (index$1.state.checkoutEdit = true) }, "Beh\u00F6ver du \u00E4ndra adressen?")), index.h("form", { onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("img", { src: dateLogo, width: 24 }), index.h("input", { class: `${this.date.length ? 'input_active' : ''}`, min: new Date().toISOString().split('T')[0], onChange: e => this.handleChangeDate(e), type: "date", name: "date", value: this.date }), index.h("label", { htmlFor: "date" }, "Tidigaste datum f\u00F6r hembes\u00F6k"), index.h("img", { src: down, width: 24 })), this.dateError && index.h("span", null, this.dateError), index$1.state.customer.source && index$1.state.selectSource ? (index.h(index.Fragment, null, index.h("p", null, "Inloggad som:", index.h("strong", null, " ", index$1.state.customer.source.fieldData.So01_Name)), index.h("label", null, "S\u00E4ljare (S\u00E4ljarId)", index.h("input", { type: "text", value: this.sellerID, onChange: e => (this.sellerID = e.target.value) })), index.h("label", null, "PartnerOrderID (RefferalID)", index.h("input", { type: "text", value: this.RefferalID, onChange: e => (this.RefferalID = e.target.value) })), ((_a = index$1.state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) ? (index.h("div", null, index.h("select", { onChange: e => (this.selectedSubSource = e.target.value) }, index.h("option", { disabled: true, selected: true, value: "null" }, "V\u00E4lj underk\u00E4lla"), index$1.state.customer.source.sub_sources.map(sub => (index.h("option", { value: sub['So_SubSource::Sus01_Name'] }, sub['So_SubSource::Sus01_Name'])))))) : (index.h("p", null, "Det finns inga underk\u00E4llor att v\u00E4lja")))) : null, index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: e => this.handleChangeTerms(e), type: "checkbox" }), index.h("span", { innerHTML: index$1.state.options.terms })), index$1.state.cart
634
+ return (index.h("div", { class: "mb-2" }, index.h("div", { class: "hemfixarna_addressinfo" }, index.h("div", null, index.h("p", null, hideField(index$1.state.user.firstName)), index.h("p", null, hideField(index$1.state.user.lastName)), index.h("p", null, index$1.state.user.email), index.h("p", null, index$1.state.user.phone)), index.h("div", null, index.h("p", null, hideField(index$1.state.user.street)), index.h("p", null, hideField(index$1.state.user.zip)), index.h("p", null, hideField(index$1.state.user.town))), index.h("button", { onClick: () => (index$1.state.checkoutEdit = true) }, "Beh\u00F6ver du \u00E4ndra adressen?")), index.h("form", { onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("img", { src: dateLogo, width: 24 }), index.h("input", { class: `${this.date.length ? 'input_active' : ''}`, min: new Date().toISOString().split('T')[0], onChange: e => this.handleChangeDate(e), type: "date", name: "date", value: this.date }), index.h("label", { htmlFor: "date" }, "Tidigaste datum f\u00F6r hembes\u00F6k"), index.h("img", { src: down, width: 24 })), this.dateError && index.h("span", null, this.dateError), index$1.state.customer.source && index$1.state.selectSource ? (index.h(index.Fragment, null, index.h("p", null, "Inloggad som:", index.h("strong", null, " ", index$1.state.customer.source.fieldData.So01_Name)), index.h("label", null, "S\u00E4ljare (S\u00E4ljarId)", index.h("input", { type: "text", value: this.sellerID, onChange: e => (this.sellerID = e.target.value) })), index.h("label", null, "PartnerOrderID (RefferalID)", index.h("input", { type: "text", value: this.RefferalID, onChange: e => (this.RefferalID = e.target.value) })), ((_a = index$1.state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) ? (index.h("div", null, index.h("select", { onChange: e => (this.selectedSubSource = e.target.value) }, index.h("option", { disabled: true, selected: true, value: "null" }, "V\u00E4lj underk\u00E4lla"), index$1.state.customer.source.sub_sources.map(sub => (index.h("option", { value: sub['So_SubSource::Sus01_Name'] }, sub['So_SubSource::Sus01_Name'])))))) : (index.h("p", null, "Det finns inga underk\u00E4llor att v\u00E4lja")))) : null, index$1.state.cart
635
635
  .filter(i => { var _a; return (_a = i.terms_checkout) === null || _a === void 0 ? void 0 : _a.length; })
636
- .map(item => (index.h(index.Fragment, null, index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: () => this.handleChangeItemTerms(), type: "checkbox" }), index.h("span", null, item.terms_checkout))))), this.generalError && index.h("span", null, this.generalError), index.h("div", { class: this.loading ? 'loading' : '' }, index.h("input", { type: "submit", value: this.loading ? '' : 'Skicka bokning' }), index.h("img", { width: 20, height: 20, src: loading, alt: "spinner" })))));
636
+ .map(item => (index.h(index.Fragment, null, index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: () => this.handleChangeItemTerms(), type: "checkbox" }), index.h("span", null, item.terms_checkout))))), index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: e => this.handleChangeTerms(e), type: "checkbox" }), index.h("span", { class: "checkout_terms", innerHTML: index$1.state.options.terms })), this.generalError && index.h("span", null, this.generalError), index.h("div", { class: this.loading ? 'loading' : '' }, index.h("input", { type: "submit", value: this.loading ? '' : 'Skicka bokning' }), index.h("img", { width: 20, height: 20, src: loading, alt: "spinner" })))));
637
637
  }
638
638
  };
639
639
  this.date = '';
@@ -655,7 +655,7 @@ const HemfixarnaCheckout = class {
655
655
  get el() { return index.getElement(this); }
656
656
  };
657
657
 
658
- const hemfixarnaCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\");\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n* {\n box-sizing: border-box;\n}\n\n:host {\n font-family: \"Inter\", sans-serif;\n}\n:host input[type=text] {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host .mb-2 {\n margin-bottom: 32px;\n}\n:host button {\n color: #474444;\n}\n:host form {\n display: flex;\n flex-direction: column;\n gap: 16px;\n position: relative;\n}\n:host form button {\n position: absolute;\n right: 0;\n top: -1rem;\n}\n:host form img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n pointer-events: none;\n}\n:host form img:first-of-type {\n left: 16px;\n}\n:host form img:last-of-type {\n right: 16px;\n}\n:host form span {\n margin-top: -8px;\n color: #ec6632;\n}\n:host form p {\n text-align: center;\n}\n:host form p {\n margin: 0;\n}\n:host form div {\n position: relative;\n}\n:host form div label {\n pointer-events: none;\n position: absolute;\n left: 16px;\n top: 50%;\n transform: translateY(-50%);\n background: #fff;\n padding: 4px;\n transition: 0.2s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host form div input {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host form div input:focus ~ label,\n:host form div .input_active ~ label {\n top: 0;\n transform: translateY(-50%);\n background: linear-gradient(180deg, #faf1e8 50%, #fff 50%);\n}\n:host form select {\n padding: 0.75rem 1rem;\n width: 100%;\n}\n:host h1 {\n font-size: 24px;\n font-weight: 400;\n line-height: 32px;\n letter-spacing: -3%;\n text-align: left;\n margin: 0 0 8px;\n}\n:host h2 {\n margin: 0 0 24px;\n font-weight: 700;\n font-size: 20px;\n line-height: 28px;\n letter-spacing: -3%;\n}\n:host p {\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna {\n width: 100%;\n /* Hide default HTML checkbox */\n /* The slider */\n}\n:host .hemfixarna_source {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n:host .hemfixarna_source img {\n width: 20px;\n}\n:host .hemfixarna_source--pw {\n max-width: 300px !important;\n}\n:host .hemfixarna_source--pw input[type=password] {\n padding: 0.5rem;\n}\n:host .hemfixarna_source--pw form {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n:host .hemfixarna_contact {\n display: flex;\n gap: 16px;\n}\n:host .hemfixarna_contact a {\n display: flex;\n align-items: center;\n gap: 8px;\n color: #474444;\n text-decoration: none;\n font-weight: 600;\n font-size: 13px;\n}\n:host .hemfixarna_contact a:hover {\n text-decoration: underline;\n}\n:host .hemfixarna_contact--horizontal span {\n display: none;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_contact--horizontal span {\n display: initial;\n }\n}\n:host .hemfixarna_painting {\n opacity: 0;\n padding: 0 1rem;\n animation: fadeIn 0.5s forwards 0.3s;\n}\n:host .hemfixarna_painting > h2,\n:host .hemfixarna_painting p {\n text-align: center;\n padding: 0 16px;\n}\n:host .hemfixarna_painting > h2 {\n margin: 0 0 8px;\n}\n:host .hemfixarna_partnerlogo {\n max-height: 50px;\n min-height: 45px;\n object-fit: contain;\n max-width: 150px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_partnerlogo {\n max-width: 200px;\n }\n}\n:host .hemfixarna_nav {\n position: absolute;\n top: 0;\n width: 100dvw;\n left: 0;\n height: 80px;\n z-index: 9999;\n}\n:host .hemfixarna_nav--links {\n display: none !important;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav--links {\n display: flex !important;\n }\n}\n:host .hemfixarna_nav--links a {\n color: #ec6632;\n text-decoration: none;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 56px;\n padding: 8px 32px;\n text-transform: capitalize;\n}\n:host .hemfixarna_nav > div {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav > div {\n padding: 0 32px;\n }\n}\n:host .hemfixarna_nav > div > div {\n display: flex;\n gap: 32px;\n justify-content: space-between;\n}\n:host .hemfixarna_nav > div > img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: -1;\n}\n:host .hemfixarna_nav a {\n text-decoration: none;\n}\n:host .hemfixarna_nav p {\n color: #474444;\n}\n:host .hemfixarna_nav p.with-bg {\n color: #fff;\n}\n:host .hemfixarna_standalone .hemfixarna_backdrop {\n background: #fffaf2;\n opacity: 1;\n}\n:host .hemfixarna_standalone .hemfixarna_modal {\n top: 80px;\n transform: translateX(-50%);\n border: none;\n height: calc(100dvh - 80px);\n opacity: 0;\n}\n:host .hemfixarna_standalone .hemfixarna_modal--open {\n opacity: 1;\n}\n:host .hemfixarna .switch {\n position: relative;\n display: inline-block;\n width: 40px;\n height: 20px;\n}\n:host .hemfixarna .switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n:host .hemfixarna .slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 34px;\n}\n:host .hemfixarna .slider:before {\n position: absolute;\n content: \"\";\n height: 18px;\n width: 18px;\n left: 2px;\n bottom: 1px;\n background-color: white;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 50%;\n}\n:host .hemfixarna input:checked + .slider {\n background-color: #fcd9c9;\n}\n:host .hemfixarna input:focus + .slider {\n box-shadow: 0 0 1px #fcd9c9;\n}\n:host .hemfixarna input:checked + .slider:before {\n -webkit-transform: translateX(18px);\n -ms-transform: translateX(18px);\n transform: translateX(18px);\n background: #ec6632;\n}\n:host .hemfixarna_maleribox {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n width: 100%;\n min-height: 132px;\n padding: 24px;\n display: flex;\n align-items: center;\n gap: 24px;\n text-align: left;\n}\n:host .hemfixarna_maleribox:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_checkbox {\n display: grid;\n grid-template-columns: 40px auto;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna_checkbox > span {\n transform: translateY(6px);\n}\n:host .hemfixarna_checkbox span,\n:host .hemfixarna_checkbox span p {\n color: #474444;\n font-size: 14px;\n}\n:host .hemfixarna_checkbox p {\n text-align: left;\n}\n:host .hemfixarna_info {\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 32px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n border-radius: 4px;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_info h2 {\n margin: 0;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_info {\n position: sticky;\n top: 0;\n }\n}\n:host .hemfixarna_infomodal {\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 100%;\n max-width: 80%;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n padding: 32px;\n z-index: 99;\n border-radius: 4px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n flex-direction: column;\n gap: 16px;\n}\n:host .hemfixarna_infomodal p,\n:host .hemfixarna_infomodal h4 {\n margin: 0;\n}\n:host .hemfixarna_infomodal button {\n background: #ec6632;\n color: #fff;\n border-radius: 60px;\n font-size: 16px;\n padding: 8px 16px;\n}\n:host .hemfixarna_addressinfo {\n padding: 16px 16px 64px;\n border: 1px solid #fcd9c9;\n position: relative;\n margin-bottom: 32px;\n display: grid;\n grid-template-columns: 1fr;\n gap: 8px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_addressinfo {\n grid-template-columns: 1fr 1fr;\n }\n}\n:host .hemfixarna_addressinfo button {\n position: absolute;\n bottom: 16px;\n right: 16px;\n font-weight: 500;\n text-underline-offset: 2px;\n text-decoration: underline;\n}\n:host .hemfixarna_part {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: grid;\n padding: 16px;\n grid-template-columns: auto 75px;\n}\n:host .hemfixarna_counter {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_counter span {\n padding: 0 8px;\n}\n:host .hemfixarna_counter img {\n cursor: pointer;\n}\n:host .hemfixarna_counter img:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_description {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_description ul {\n list-style: disc;\n padding-right: 12px;\n transform: translateX(12px);\n}\n:host .hemfixarna_description--hidden {\n max-height: 140px;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n}\n:host .hemfixarna_description--hidden::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 128px;\n background: linear-gradient(180deg, rgba(255, 253, 250, 0), rgba(255, 253, 250, 0.46) 50%, #faf1e8);\n}\n:host .hemfixarna_terms {\n font-size: 14px;\n}\n:host .hemfixarna_terms a {\n color: inherit;\n}\n:host .hemfixarna_logo {\n height: 64px;\n}\n:host .hemfixarna_box {\n padding: 16px;\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border-radius: 4px;\n gap: 16px 8px;\n border-radius: 4px;\n gap: 16px 8px;\n}\n:host .hemfixarna_box p,\n:host .hemfixarna_box span {\n font-size: 15px;\n}\n:host .hemfixarna_box .underline {\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n:host .hemfixarna_box .pointer {\n cursor: pointer;\n}\n:host .hemfixarna_box .p-s {\n font-size: 12px;\n}\n:host .hemfixarna_box > div {\n display: grid;\n gap: 8px;\n}\n:host .hemfixarna_box--standard {\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_box--alternative, :host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n background: transparent;\n border: 1px solid #e3e3e3;\n}\n:host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.0784313725);\n}\n:host .hemfixarna_box--alternative_3 {\n justify-content: center;\n}\n:host .hemfixarna_altbtn {\n display: flex !important;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n margin-left: auto;\n}\n:host .hemfixarna_btn {\n margin-left: auto;\n}\n:host .hemfixarna_btn, :host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n border: none;\n border-radius: 60px;\n font-weight: 600;\n letter-spacing: 0.5px;\n line-height: 20px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_btn:not(.disabled):hover, :host .hemfixarna_buy:not(.disabled):hover,\n:host .hemfixarna input[type=submit]:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna div:has(> input[type=submit]) {\n position: relative;\n}\n:host .hemfixarna div:has(> input[type=submit]) input {\n cursor: pointer;\n}\n:host .hemfixarna div:has(> input[type=submit]) img {\n display: none;\n}\n:host .hemfixarna .loading {\n cursor: default;\n opacity: 0.6;\n}\n:host .hemfixarna .loading > img {\n display: initial !important;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n:host .hemfixarna_btn {\n font-size: 14px;\n background: #c84e18;\n color: #fff;\n padding: 16px 24px;\n white-space: nowrap;\n position: relative;\n}\n:host .hemfixarna_btn span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_btn span {\n background: #25a710;\n color: #fff;\n right: 0 !important;\n}\n:host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n font-size: 21px;\n background: #25a710;\n color: #fff;\n padding: 16px 24px;\n}\n:host .hemfixarna .disabled {\n opacity: 0.5;\n cursor: default;\n}\n:host .hemfixarna_modal {\n position: fixed;\n background: #faf1e8;\n border: 1px solid #fcd9c9;\n border-radius: 4px;\n top: 50%;\n left: 50%;\n z-index: 1000;\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n transform: translate(-50%, -50%) scale(0.7);\n opacity: 0;\n height: 92%;\n width: 92%;\n max-width: 920px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n:host .hemfixarna_modal--open {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n}\n:host .hemfixarna_backdrop {\n z-index: 999;\n position: fixed;\n background: #474444;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n opacity: 0;\n transition: transform 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946), opacity 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host .hemfixarna_backdrop--open {\n opacity: 0.3;\n}\n:host .hemfixarna_order {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n background-repeat: no-repeat !important;\n background-size: cover !important;\n background-position: center !important;\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding: 48px 32px 64px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_order {\n grid-template-columns: 1fr;\n grid-template-rows: 0 auto;\n }\n}\n:host .hemfixarna_order > div:last-of-type {\n background: #fffaf2;\n padding: 32px;\n display: flex;\n flex-direction: column;\n max-height: 100%;\n overflow: auto;\n}\n:host .hemfixarna_order img {\n cursor: pointer;\n}\n:host .hemfixarna_order button {\n margin: 16px 0;\n padding: 0;\n text-decoration: underline;\n text-underline-offset: 2px;\n font-size: 14px;\n font-weight: 600;\n}\n:host .hemfixarna_cart {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart {\n grid-template-columns: 1fr;\n gap: 0;\n }\n}\n:host .hemfixarna_cart--right h2, :host .hemfixarna_cart--left h2 {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_cart--right h2 img, :host .hemfixarna_cart--left h2 img {\n margin-top: 3.2px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_cart--left h2 button {\n display: none;\n }\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart--right h2 button {\n display: none;\n }\n}\n:host .hemfixarna_cart--startfee {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot div {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_cart--additional {\n display: flex;\n flex-direction: column;\n gap: 16px;\n padding: 16px;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--additional p {\n font-size: 14px;\n position: relative;\n}\n:host .hemfixarna_cart--additional p strong {\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: pointer;\n}\n:host .hemfixarna_cart--additional p img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: -20px;\n cursor: pointer;\n}\n:host .hemfixarna_cart--price {\n border-top: 1px solid #fcd9c9;\n padding: 16px;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--price h3 {\n margin: 0;\n}\n:host .hemfixarna_cart--item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px 0;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--item span {\n font-size: 12px;\n}\n:host .hemfixarna_cart--item > div {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--item > div > div {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n:host .hemfixarna_cart--item > div button {\n color: #ec6632;\n}\n:host .hemfixarna_cart--group {\n border-radius: 16px;\n background: #fefaf6;\n margin-bottom: 16px;\n padding: 10px 20px;\n}\n:host .hemfixarna_cart--group ul li:first-of-type {\n border-top: 0;\n}\n:host .hemfixarna_categories {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n:host .hemfixarna_categories--wrapper {\n gap: 32px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_categories--wrapper {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_categories li {\n position: relative;\n background: #fff;\n border-radius: 4px;\n min-height: 132px;\n padding: 24px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n align-items: center;\n gap: 24px;\n cursor: pointer;\n}\n:host .hemfixarna_categories li:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_categories li > button {\n height: 100%;\n width: 100%;\n}\n:host .hemfixarna_categories li .price {\n font-weight: 700;\n}\n:host .hemfixarna_content {\n height: 100%;\n overflow: auto;\n padding: 0 32px 64px;\n}\n:host .hemfixarna_content--5 {\n padding-top: 16px;\n}\n:host .hemfixarna_content--painting {\n padding: 0;\n overflow: initial;\n}\n:host .hemfixarna_crumbs {\n position: relative;\n padding: 16px 24px;\n border-bottom: 1px solid #fcd9c9;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_crumbs--back {\n padding: 16px 24px 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs--back:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_crumbs img {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .close {\n position: absolute;\n right: -16px;\n top: -16px;\n z-index: 9;\n -webkit-transform: translate3d(0, 0, 0);\n}\n:host .hemfixarna_crumbs .cart {\n display: flex;\n padding-left: 16px;\n position: relative;\n}\n:host .hemfixarna_crumbs .cart img {\n cursor: inherit;\n}\n:host .hemfixarna_crumbs .cart span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_crumbs .cart_active {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .cart_active span {\n background: #25a710;\n color: #fff;\n}\n:host .hemfixarna_crumbs--links {\n display: flex;\n align-items: center;\n gap: 16px;\n overflow: auto;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_crumbs--links {\n -ms-overflow-style: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar {\n display: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar-button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs--right {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_crumbs button {\n white-space: nowrap;\n background: #f1ded6;\n border-radius: 64px;\n padding: 12px 16px;\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.3px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs button:not(.active):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n@media (max-width: 768px) {\n :host .hemfixarna_crumbs button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs .active {\n background: #fffaf2;\n cursor: default;\n}\n:host .hemfixarna_features {\n gap: 12px !important;\n}\n:host .hemfixarna_features li {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_address {\n margin-bottom: 16px;\n}\n:host .hemfixarna_product {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_product--link {\n font-weight: 700;\n color: #474444;\n text-underline-offset: 4px;\n}\n:host .hemfixarna_product--left {\n gap: 32px;\n}\n:host .hemfixarna_product--right {\n gap: 32px;\n}\n:host .hemfixarna_product--price {\n margin-top: 4px;\n font-weight: 700;\n}\n:host .hemfixarna_product--total {\n text-align: center;\n margin: -16px 0;\n font-size: 21px;\n line-height: 28px;\n}\n:host .hemfixarna_product--item {\n background: #fff;\n padding: 16px;\n display: grid;\n grid-template-columns: auto 75px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_product--grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--grid {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_product--grid > div {\n display: flex;\n flex-direction: column;\n}\n:host .hemfixarna_product--grid ul {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n:host .hemfixarna_product .generate-pdf-button {\n border-radius: 88px;\n background: -o-linear-gradient(303deg, #EC873E 0%, #E5421E 100%);\n background: linear-gradient(147deg, #EC873E 0%, #E5421E 100%);\n color: #fff;\n text-align: center;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: 24px;\n padding: 12px 25px;\n border: 0;\n text-decoration: none;\n max-width: 300px;\n cursor: pointer;\n}\n:host .hemfixarna_product p {\n margin: 0;\n}\n:host .hemfixarna_product--top {\n display: flex;\n gap: 32px;\n}\n:host .hemfixarna_product--top img {\n object-fit: contain;\n}\n:host .hemfixarna_product--top > div {\n width: 100%;\n}\n:host .hemfixarna_product--top > div h1 {\n max-width: 80%;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--top > div h1 {\n max-width: 100%;\n }\n}\n:host .hemfixarna_product--top h4 {\n margin-bottom: 8px;\n}\n:host h5,\n:host p {\n margin: 0;\n}\n:host input[type=submit] {\n cursor: pointer;\n}\n:host input[type=date] ~ label {\n left: 56px;\n}\n:host input[type=date] {\n border: 1px solid #fcd9c9;\n padding-left: 64px;\n}\n:host input[type=checkbox] {\n height: 18px;\n width: 18px;\n border: 1px solid #fcd9c9;\n}\n:host input[type=checkbox]:checked {\n background: red;\n}\n:host input[type=date]::-webkit-calendar-picker-indicator {\n background: transparent;\n bottom: 0;\n color: transparent;\n cursor: pointer;\n height: auto;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n width: auto;\n}\n:host button,\n:host a {\n cursor: pointer;\n background: none;\n border: none;\n}\n:host ul {\n list-style: none;\n margin: 0;\n padding: 0;\n}";
658
+ const hemfixarnaCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\");\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n* {\n box-sizing: border-box;\n}\n\n:host {\n font-family: \"Inter\", sans-serif;\n}\n:host input[type=text] {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host .mb-2 {\n margin-bottom: 32px;\n}\n:host button {\n color: #474444;\n}\n:host form {\n display: flex;\n flex-direction: column;\n gap: 16px;\n position: relative;\n}\n:host form button {\n position: absolute;\n right: 0;\n top: -1rem;\n}\n:host form img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n pointer-events: none;\n}\n:host form img:first-of-type {\n left: 16px;\n}\n:host form img:last-of-type {\n right: 16px;\n}\n:host form span {\n margin-top: -8px;\n color: #ec6632;\n}\n:host form p {\n text-align: center;\n}\n:host form p {\n margin: 0;\n}\n:host form div {\n position: relative;\n}\n:host form div label {\n pointer-events: none;\n position: absolute;\n left: 16px;\n top: 50%;\n transform: translateY(-50%);\n background: #fff;\n padding: 4px;\n transition: 0.2s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host form div input {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host form div input:focus ~ label,\n:host form div .input_active ~ label {\n top: 0;\n transform: translateY(-50%);\n background: linear-gradient(180deg, #faf1e8 50%, #fff 50%);\n}\n:host form select {\n padding: 0.75rem 1rem;\n width: 100%;\n}\n:host h1 {\n font-size: 24px;\n font-weight: 400;\n line-height: 32px;\n letter-spacing: -3%;\n text-align: left;\n margin: 0 0 8px;\n}\n:host h2 {\n margin: 0 0 24px;\n font-weight: 700;\n font-size: 20px;\n line-height: 28px;\n letter-spacing: -3%;\n}\n:host p {\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna {\n width: 100%;\n /* Hide default HTML checkbox */\n /* The slider */\n}\n:host .hemfixarna_source {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n:host .hemfixarna_source img {\n width: 20px;\n}\n:host .hemfixarna_source--pw {\n max-width: 300px !important;\n}\n:host .hemfixarna_source--pw input[type=password] {\n padding: 0.5rem;\n}\n:host .hemfixarna_source--pw form {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n:host .hemfixarna_contact {\n display: flex;\n gap: 16px;\n}\n:host .hemfixarna_contact a {\n display: flex;\n align-items: center;\n gap: 8px;\n color: #474444;\n text-decoration: none;\n font-weight: 600;\n font-size: 13px;\n}\n:host .hemfixarna_contact a:hover {\n text-decoration: underline;\n}\n:host .hemfixarna_contact--horizontal span {\n display: none;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_contact--horizontal span {\n display: initial;\n }\n}\n:host .hemfixarna_painting {\n opacity: 0;\n padding: 0 1rem;\n animation: fadeIn 0.5s forwards 0.3s;\n}\n:host .hemfixarna_painting > h2,\n:host .hemfixarna_painting p {\n text-align: center;\n padding: 0 16px;\n}\n:host .hemfixarna_painting > h2 {\n margin: 0 0 8px;\n}\n:host .hemfixarna_partnerlogo {\n max-height: 50px;\n min-height: 45px;\n object-fit: contain;\n max-width: 150px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_partnerlogo {\n max-width: 200px;\n }\n}\n:host .hemfixarna_nav {\n position: absolute;\n top: 0;\n width: 100dvw;\n left: 0;\n height: 80px;\n z-index: 9999;\n}\n:host .hemfixarna_nav--links {\n display: none !important;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav--links {\n display: flex !important;\n }\n}\n:host .hemfixarna_nav--links a {\n color: #ec6632;\n text-decoration: none;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 56px;\n padding: 8px 32px;\n text-transform: capitalize;\n}\n:host .hemfixarna_nav > div {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav > div {\n padding: 0 32px;\n }\n}\n:host .hemfixarna_nav > div > div {\n display: flex;\n gap: 32px;\n justify-content: space-between;\n}\n:host .hemfixarna_nav > div > img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: -1;\n}\n:host .hemfixarna_nav a {\n text-decoration: none;\n}\n:host .hemfixarna_nav p {\n color: #474444;\n}\n:host .hemfixarna_nav p.with-bg {\n color: #fff;\n}\n:host .hemfixarna_standalone .hemfixarna_backdrop {\n background: #fffaf2;\n opacity: 1;\n}\n:host .hemfixarna_standalone .hemfixarna_modal {\n top: 80px;\n transform: translateX(-50%);\n border: none;\n height: calc(100dvh - 80px);\n opacity: 0;\n}\n:host .hemfixarna_standalone .hemfixarna_modal--open {\n opacity: 1;\n}\n:host .hemfixarna .switch {\n position: relative;\n display: inline-block;\n width: 40px;\n height: 20px;\n}\n:host .hemfixarna .switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n:host .hemfixarna .slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 34px;\n}\n:host .hemfixarna .slider:before {\n position: absolute;\n content: \"\";\n height: 18px;\n width: 18px;\n left: 2px;\n bottom: 1px;\n background-color: white;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 50%;\n}\n:host .hemfixarna input:checked + .slider {\n background-color: #fcd9c9;\n}\n:host .hemfixarna input:focus + .slider {\n box-shadow: 0 0 1px #fcd9c9;\n}\n:host .hemfixarna input:checked + .slider:before {\n -webkit-transform: translateX(18px);\n -ms-transform: translateX(18px);\n transform: translateX(18px);\n background: #ec6632;\n}\n:host .hemfixarna_maleribox {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n width: 100%;\n min-height: 132px;\n padding: 24px;\n display: flex;\n align-items: center;\n gap: 24px;\n text-align: left;\n}\n:host .hemfixarna_maleribox:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_checkbox {\n display: grid;\n grid-template-columns: 40px auto;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna_checkbox > span {\n transform: translateY(6px);\n}\n:host .hemfixarna_checkbox span,\n:host .hemfixarna_checkbox span p {\n color: #474444;\n font-size: 14px;\n}\n:host .hemfixarna_checkbox p {\n text-align: left;\n}\n:host .hemfixarna_info {\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 32px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n border-radius: 4px;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_info h2 {\n margin: 0;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_info {\n position: sticky;\n top: 0;\n }\n}\n:host .hemfixarna_infomodal {\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 100%;\n max-width: 80%;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n padding: 32px;\n z-index: 99;\n border-radius: 4px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n flex-direction: column;\n gap: 16px;\n}\n:host .hemfixarna_infomodal p,\n:host .hemfixarna_infomodal h4 {\n margin: 0;\n}\n:host .hemfixarna_infomodal button {\n background: #ec6632;\n color: #fff;\n border-radius: 60px;\n font-size: 16px;\n padding: 8px 16px;\n}\n:host .hemfixarna_addressinfo {\n padding: 16px 16px 64px;\n border: 1px solid #fcd9c9;\n position: relative;\n margin-bottom: 32px;\n display: grid;\n grid-template-columns: 1fr;\n gap: 8px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_addressinfo {\n grid-template-columns: 1fr 1fr;\n }\n}\n:host .hemfixarna_addressinfo button {\n position: absolute;\n bottom: 16px;\n right: 16px;\n font-weight: 500;\n text-underline-offset: 2px;\n text-decoration: underline;\n}\n:host .hemfixarna_part {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: grid;\n padding: 16px;\n grid-template-columns: auto 75px;\n}\n:host .hemfixarna_counter {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_counter span {\n padding: 0 8px;\n}\n:host .hemfixarna_counter img {\n cursor: pointer;\n}\n:host .hemfixarna_counter img:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_description {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_description ul {\n list-style: disc;\n padding-right: 12px;\n transform: translateX(12px);\n}\n:host .hemfixarna_description--hidden {\n max-height: 140px;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n}\n:host .hemfixarna_description--hidden::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 128px;\n background: linear-gradient(180deg, rgba(255, 253, 250, 0), rgba(255, 253, 250, 0.46) 50%, #faf1e8);\n}\n:host .hemfixarna_terms {\n font-size: 14px;\n}\n:host .hemfixarna_terms a {\n color: inherit;\n}\n:host .hemfixarna_logo {\n height: 64px;\n}\n:host .hemfixarna_box {\n padding: 16px;\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border-radius: 4px;\n gap: 16px 8px;\n border-radius: 4px;\n gap: 16px 8px;\n}\n:host .hemfixarna_box p,\n:host .hemfixarna_box span {\n font-size: 15px;\n}\n:host .hemfixarna_box .underline {\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n:host .hemfixarna_box .pointer {\n cursor: pointer;\n}\n:host .hemfixarna_box .p-s {\n font-size: 12px;\n}\n:host .hemfixarna_box > div {\n display: grid;\n gap: 8px;\n}\n:host .hemfixarna_box--standard {\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_box--alternative, :host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n background: transparent;\n border: 1px solid #e3e3e3;\n}\n:host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.0784313725);\n}\n:host .hemfixarna_box--alternative_3 {\n justify-content: center;\n}\n:host .hemfixarna_altbtn {\n display: flex !important;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n margin-left: auto;\n}\n:host .hemfixarna_btn {\n margin-left: auto;\n}\n:host .hemfixarna_btn, :host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n border: none;\n border-radius: 60px;\n font-weight: 600;\n letter-spacing: 0.5px;\n line-height: 20px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_btn:not(.disabled):hover, :host .hemfixarna_buy:not(.disabled):hover,\n:host .hemfixarna input[type=submit]:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna div:has(> input[type=submit]) {\n position: relative;\n}\n:host .hemfixarna div:has(> input[type=submit]) input {\n cursor: pointer;\n}\n:host .hemfixarna div:has(> input[type=submit]) img {\n display: none;\n}\n:host .hemfixarna .loading {\n cursor: default;\n opacity: 0.6;\n}\n:host .hemfixarna .loading > img {\n display: initial !important;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n:host .hemfixarna_btn {\n font-size: 14px;\n background: #c84e18;\n color: #fff;\n padding: 16px 24px;\n white-space: nowrap;\n position: relative;\n}\n:host .hemfixarna_btn span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_btn span {\n background: #25a710;\n color: #fff;\n right: 0 !important;\n}\n:host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n font-size: 21px;\n background: #25a710;\n color: #fff;\n padding: 16px 24px;\n}\n:host .hemfixarna .disabled {\n opacity: 0.5;\n cursor: default;\n}\n:host .hemfixarna_modal {\n position: fixed;\n background: #faf1e8;\n border: 1px solid #fcd9c9;\n border-radius: 4px;\n top: 50%;\n left: 50%;\n z-index: 1000;\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n transform: translate(-50%, -50%) scale(0.7);\n opacity: 0;\n height: 92%;\n width: 92%;\n max-width: 920px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n:host .hemfixarna_modal--open {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n}\n:host .hemfixarna_backdrop {\n z-index: 999;\n position: fixed;\n background: #474444;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n opacity: 0;\n transition: transform 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946), opacity 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host .hemfixarna_backdrop--open {\n opacity: 0.3;\n}\n:host .hemfixarna_order {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n background-repeat: no-repeat !important;\n background-size: cover !important;\n background-position: center !important;\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding: 48px 32px 64px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_order {\n grid-template-columns: 1fr;\n grid-template-rows: 0 auto;\n }\n}\n:host .hemfixarna_order > div:last-of-type {\n background: #fffaf2;\n padding: 32px;\n display: flex;\n flex-direction: column;\n max-height: 100%;\n overflow: auto;\n}\n:host .hemfixarna_order img {\n cursor: pointer;\n}\n:host .hemfixarna_order button {\n margin: 16px 0;\n padding: 0;\n text-decoration: underline;\n text-underline-offset: 2px;\n font-size: 14px;\n font-weight: 600;\n}\n:host .hemfixarna_cart {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart {\n grid-template-columns: 1fr;\n gap: 0;\n }\n}\n:host .hemfixarna_cart--right h2, :host .hemfixarna_cart--left h2 {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_cart--right h2 img, :host .hemfixarna_cart--left h2 img {\n margin-top: 3.2px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_cart--left h2 button {\n display: none;\n }\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart--right h2 button {\n display: none;\n }\n}\n:host .hemfixarna_cart--startfee {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot div {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_cart--additional {\n display: flex;\n flex-direction: column;\n gap: 16px;\n padding: 16px;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--additional p {\n font-size: 14px;\n position: relative;\n}\n:host .hemfixarna_cart--additional p strong {\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: pointer;\n}\n:host .hemfixarna_cart--additional p img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: -20px;\n cursor: pointer;\n}\n:host .hemfixarna_cart--price {\n border-top: 1px solid #fcd9c9;\n padding: 16px;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--price h3 {\n margin: 0;\n}\n:host .hemfixarna_cart--item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px 0;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--item span {\n font-size: 12px;\n}\n:host .hemfixarna_cart--item > div {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--item > div > div {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n:host .hemfixarna_cart--item > div button {\n color: #ec6632;\n}\n:host .hemfixarna_cart--group {\n border-radius: 16px;\n background: #fefaf6;\n margin-bottom: 16px;\n padding: 10px 20px;\n}\n:host .hemfixarna_cart--group ul li:first-of-type {\n border-top: 0;\n}\n:host .hemfixarna_categories {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n:host .hemfixarna_categories--wrapper {\n gap: 32px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_categories--wrapper {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_categories li {\n position: relative;\n background: #fff;\n border-radius: 4px;\n min-height: 132px;\n padding: 24px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n align-items: center;\n gap: 24px;\n cursor: pointer;\n}\n:host .hemfixarna_categories li:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_categories li > button {\n height: 100%;\n width: 100%;\n}\n:host .hemfixarna_categories li .price {\n font-weight: 700;\n}\n:host .hemfixarna_content {\n height: 100%;\n overflow: auto;\n padding: 0 32px 64px;\n}\n:host .hemfixarna_content--5 {\n padding-top: 16px;\n}\n:host .hemfixarna_content--painting {\n padding: 0;\n overflow: initial;\n}\n:host .hemfixarna_crumbs {\n position: relative;\n padding: 16px 24px;\n border-bottom: 1px solid #fcd9c9;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_crumbs--back {\n padding: 16px 24px 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs--back:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_crumbs img {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .close {\n position: absolute;\n right: -16px;\n top: -16px;\n z-index: 9;\n -webkit-transform: translate3d(0, 0, 0);\n}\n:host .hemfixarna_crumbs .cart {\n display: flex;\n padding-left: 16px;\n position: relative;\n}\n:host .hemfixarna_crumbs .cart img {\n cursor: inherit;\n}\n:host .hemfixarna_crumbs .cart span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_crumbs .cart_active {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .cart_active span {\n background: #25a710;\n color: #fff;\n}\n:host .hemfixarna_crumbs--links {\n display: flex;\n align-items: center;\n gap: 16px;\n overflow: auto;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_crumbs--links {\n -ms-overflow-style: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar {\n display: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar-button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs--right {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_crumbs button {\n white-space: nowrap;\n background: #f1ded6;\n border-radius: 64px;\n padding: 12px 16px;\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.3px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs button:not(.active):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n@media (max-width: 768px) {\n :host .hemfixarna_crumbs button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs .active {\n background: #fffaf2;\n cursor: default;\n}\n:host .hemfixarna_features {\n gap: 12px !important;\n}\n:host .hemfixarna_features li {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_address {\n margin-bottom: 16px;\n}\n:host .hemfixarna_product {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_product--link {\n font-weight: 700;\n color: #474444;\n text-underline-offset: 4px;\n}\n:host .hemfixarna_product--left {\n gap: 32px;\n}\n:host .hemfixarna_product--right {\n gap: 32px;\n}\n:host .hemfixarna_product--price {\n margin-top: 4px;\n font-weight: 700;\n}\n:host .hemfixarna_product--total {\n text-align: center;\n margin: -16px 0;\n font-size: 21px;\n line-height: 28px;\n}\n:host .hemfixarna_product--item {\n background: #fff;\n padding: 16px;\n display: grid;\n grid-template-columns: auto 75px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_product--grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--grid {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_product--grid > div {\n display: flex;\n flex-direction: column;\n}\n:host .hemfixarna_product--grid ul {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n:host .hemfixarna_product .generate-pdf-button {\n border-radius: 88px;\n background: -o-linear-gradient(303deg, #EC873E 0%, #E5421E 100%);\n background: linear-gradient(147deg, #EC873E 0%, #E5421E 100%);\n color: #fff;\n text-align: center;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: 24px;\n padding: 12px 25px;\n border: 0;\n text-decoration: none;\n max-width: 300px;\n cursor: pointer;\n}\n:host .hemfixarna_product p {\n margin: 0;\n}\n:host .hemfixarna_product--top {\n display: flex;\n gap: 32px;\n}\n:host .hemfixarna_product--top img {\n object-fit: contain;\n}\n:host .hemfixarna_product--top > div {\n width: 100%;\n}\n:host .hemfixarna_product--top > div h1 {\n max-width: 80%;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--top > div h1 {\n max-width: 100%;\n }\n}\n:host .hemfixarna_product--top h4 {\n margin-bottom: 8px;\n}\n:host h5,\n:host p {\n margin: 0;\n}\n:host input[type=submit] {\n cursor: pointer;\n}\n:host input[type=date] ~ label {\n left: 56px;\n}\n:host input[type=date] {\n border: 1px solid #fcd9c9;\n padding-left: 64px;\n}\n:host input[type=checkbox] {\n height: 18px;\n width: 18px;\n border: 1px solid #fcd9c9;\n}\n:host input[type=checkbox]:checked {\n background: red;\n}\n:host input[type=date]::-webkit-calendar-picker-indicator {\n background: transparent;\n bottom: 0;\n color: transparent;\n cursor: pointer;\n height: auto;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n width: auto;\n}\n:host button,\n:host a {\n cursor: pointer;\n background: none;\n border: none;\n}\n:host ul {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.checkout_terms a {\n color: #ec6632;\n}";
659
659
 
660
660
  const HemfixarnaComponent = class {
661
661
  constructor(hostRef) {
@@ -1715,7 +1715,7 @@ const HemfixarnaGetuser = class {
1715
1715
  }
1716
1716
  };
1717
1717
  this.render = () => {
1718
- return (index.h("form", { class: "mb-2", onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("input", { class: `${this.email.length ? 'input_active' : ''}`, onChange: e => this.handleChangeEmail(e), type: "email", name: "email", value: this.email }), index.h("label", { htmlFor: "email" }, "E-post ")), this.emailError && index.h("span", null, this.emailError), index.h("div", null, index.h("input", { class: `${this.phone.length ? 'input_active' : ''}`, onChange: e => this.handleChangePhone(e), type: "tel", name: "phone", value: this.phone }), index.h("label", { htmlFor: "phone" }, "Mobiltelefon ")), this.phoneError && index.h("span", null, this.phoneError), index.h("div", null, index.h("input", { class: `${this.ssn.length ? 'input_active' : ''}`, onChange: e => this.handleChangessn(e), type: "tel", name: "ssn", value: this.ssn }), index.h("label", { htmlFor: "phone" }, "Personnummer*")), this.ssnError && index.h("span", null, this.ssnError), index.h("input", { type: "submit", value: "Forts\u00E4tt*" }), index.h("p", null, "*Vi h\u00E4mtar din adress")));
1718
+ return (index.h("form", { class: "mb-2", onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("input", { class: `${this.email.length ? 'input_active' : ''}`, onChange: e => this.handleChangeEmail(e), type: "email", name: "email", value: this.email }), index.h("label", { htmlFor: "email" }, "E-post ")), this.emailError && index.h("span", null, this.emailError), index.h("div", null, index.h("input", { class: `${this.phone.length ? 'input_active' : ''}`, onChange: e => this.handleChangePhone(e), type: "tel", name: "phone", value: this.phone }), index.h("label", { htmlFor: "phone" }, "Mobiltelefon ")), this.phoneError && index.h("span", null, this.phoneError), index.h("div", null, index.h("input", { class: `${this.ssn.length ? 'input_active' : ''}`, onChange: e => this.handleChangessn(e), type: "tel", name: "ssn", value: this.ssn }), index.h("label", { htmlFor: "phone" }, "Personnummer*")), this.ssnError && index.h("span", null, this.ssnError), index.h("p", { class: "checkout_terms" }, "Dina personuppgifter behandlas i enlighet med v\u00E5r ", index.h("a", { href: "https://hemfixarna.se/integritetspolicy/", target: "_blank" }, "integritetspolicy")), index.h("input", { type: "submit", value: "Forts\u00E4tt*" }), index.h("p", null, "*Vi h\u00E4mtar din adress")));
1719
1719
  };
1720
1720
  this.email = '';
1721
1721
  this.emailError = null;