blue-chestnut-solar-expert 0.0.64 → 0.0.66
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.
- package/dist/cjs/eraser-icon_19.cjs.entry.js +1 -1
- package/dist/cjs/{lerc-CQf05pmr.js → lerc-Bzx_uOA8.js} +3 -3
- package/dist/cjs/{lerc-CQf05pmr.js.map → lerc-Bzx_uOA8.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/loading-widget.cjs.entry.js +1 -1
- package/dist/cjs/loading-widget.cjs.entry.js.map +1 -1
- package/dist/cjs/loading-widget.entry.cjs.js.map +1 -1
- package/dist/cjs/stencil-library.cjs.js +1 -1
- package/dist/collection/components/map-draw/map-draw.js +8 -10
- package/dist/collection/components/map-draw/map-draw.js.map +1 -1
- package/dist/collection/components/solar-system-form/solar-system-form.js +73 -50
- package/dist/collection/components/solar-system-form/solar-system-form.js.map +1 -1
- package/dist/collection/output.css +0 -52
- package/dist/collection/utils/lang/german.js +5 -5
- package/dist/collection/utils/lang/german.js.map +1 -1
- package/dist/components/eraser-icon.js +1 -1
- package/dist/components/house-icon.js +1 -1
- package/dist/components/icon-selector.js +1 -1
- package/dist/components/loading-widget.js +1 -1
- package/dist/components/loading-widget.js.map +1 -1
- package/dist/components/map-draw.js +1 -1
- package/dist/components/map-selector.js +1 -1
- package/dist/components/marker-icon.js +1 -1
- package/dist/components/move-icon.js +1 -1
- package/dist/components/octagon-minus-icon.js +1 -1
- package/dist/components/{p-B_6Ue-UQ.js → p-BGDUEqPw.js} +7 -7
- package/dist/components/p-BGDUEqPw.js.map +1 -0
- package/dist/components/p-BJLO76Yi.js +40 -0
- package/dist/components/p-BJLO76Yi.js.map +1 -0
- package/dist/components/p-B_d25VbK.js +76 -0
- package/dist/components/p-B_d25VbK.js.map +1 -0
- package/dist/components/{p-IzVa21Wl.js → p-Bb2Y3Z89.js} +81 -55
- package/dist/components/p-Bb2Y3Z89.js.map +1 -0
- package/dist/components/p-Btv8OdhG.js +47 -0
- package/dist/components/p-Btv8OdhG.js.map +1 -0
- package/dist/components/p-C5QieOat.js +114 -0
- package/dist/components/p-C5QieOat.js.map +1 -0
- package/dist/components/p-CAfEQ2E5.js +121 -0
- package/dist/components/p-CAfEQ2E5.js.map +1 -0
- package/dist/components/p-CL74Q4VR.js +40 -0
- package/dist/components/p-CL74Q4VR.js.map +1 -0
- package/dist/components/{p-DoOT28vq.js → p-Cmq8WfHd.js} +3 -3
- package/dist/components/{p-DoOT28vq.js.map → p-Cmq8WfHd.js.map} +1 -1
- package/dist/components/p-D-7y2xyY.js +89 -0
- package/dist/components/p-D-7y2xyY.js.map +1 -0
- package/dist/components/p-D8w3bTPO.js +40 -0
- package/dist/components/p-D8w3bTPO.js.map +1 -0
- package/dist/components/p-DBwr8xSB.js +40 -0
- package/dist/components/p-DBwr8xSB.js.map +1 -0
- package/dist/components/p-DTXeHbuh.js +40 -0
- package/dist/components/p-DTXeHbuh.js.map +1 -0
- package/dist/components/p-DlZrNkTC.js +623 -0
- package/dist/components/p-DlZrNkTC.js.map +1 -0
- package/dist/components/p-FdEV2qPo.js +40 -0
- package/dist/components/p-FdEV2qPo.js.map +1 -0
- package/dist/components/p-P28NBglk.js +86 -0
- package/dist/components/p-P28NBglk.js.map +1 -0
- package/dist/components/p-Umz6nJIv.js +40 -0
- package/dist/components/p-Umz6nJIv.js.map +1 -0
- package/dist/components/{p-De6Uhz0b.js → p-bfmX8bQv.js} +29 -31
- package/dist/components/p-bfmX8bQv.js.map +1 -0
- package/dist/components/p-waOPoUcA.js +40 -0
- package/dist/components/p-waOPoUcA.js.map +1 -0
- package/dist/components/p-zTqylr2Y.js +163 -0
- package/dist/components/p-zTqylr2Y.js.map +1 -0
- package/dist/components/polygon-buttons.js +1 -1
- package/dist/components/polygon-information.js +1 -1
- package/dist/components/search-icon.js +1 -1
- package/dist/components/settings-icon.js +1 -1
- package/dist/components/settings-modal.js +1 -1
- package/dist/components/solar-expert.js +20 -20
- package/dist/components/solar-expert.js.map +1 -1
- package/dist/components/solar-system-form.js +1 -1
- package/dist/components/toast-notification.js +1 -1
- package/dist/components/tool-box.js +1 -1
- package/dist/components/tutorial-component.js +1 -1
- package/dist/components/undo-icon.js +1 -1
- package/dist/esm/eraser-icon_19.entry.js +1 -1
- package/dist/esm/{lerc-j3yBkoBc.js → lerc-fDBsT-r9.js} +3 -3
- package/dist/esm/{lerc-j3yBkoBc.js.map → lerc-fDBsT-r9.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/loading-widget.entry.js +1 -1
- package/dist/esm/loading-widget.entry.js.map +1 -1
- package/dist/esm/stencil-library.js +1 -1
- package/dist/stencil-library/loading-widget.entry.esm.js.map +1 -1
- package/dist/stencil-library/{p-d2fcb2d8.entry.js → p-0020e897.entry.js} +2 -2
- package/dist/stencil-library/p-BwLev3G_.js +2 -0
- package/dist/stencil-library/p-BwLev3G_.js.map +1 -0
- package/dist/stencil-library/{p-rVA7BFlW.js → p-C9kyZnQX.js} +2 -2
- package/dist/stencil-library/{p-rVA7BFlW.js.map → p-C9kyZnQX.js.map} +1 -1
- package/dist/stencil-library/p-ab0f2031.entry.js +2 -0
- package/dist/stencil-library/p-ab0f2031.entry.js.map +1 -0
- package/dist/stencil-library/stencil-library.esm.js +1 -1
- package/dist/types/components/solar-system-form/solar-system-form.d.ts +1 -0
- package/package.json +1 -1
- package/dist/components/p-1jcVNjsm.js +0 -47
- package/dist/components/p-1jcVNjsm.js.map +0 -1
- package/dist/components/p-4FooU4eR.js +0 -40
- package/dist/components/p-4FooU4eR.js.map +0 -1
- package/dist/components/p-6rmvkwsO.js +0 -163
- package/dist/components/p-6rmvkwsO.js.map +0 -1
- package/dist/components/p-BYULvwxQ.js +0 -40
- package/dist/components/p-BYULvwxQ.js.map +0 -1
- package/dist/components/p-B_6Ue-UQ.js.map +0 -1
- package/dist/components/p-BcBvva_X.js +0 -40
- package/dist/components/p-BcBvva_X.js.map +0 -1
- package/dist/components/p-But3uNm3.js +0 -76
- package/dist/components/p-But3uNm3.js.map +0 -1
- package/dist/components/p-COCnOrkb.js +0 -121
- package/dist/components/p-COCnOrkb.js.map +0 -1
- package/dist/components/p-COL7rExT.js +0 -86
- package/dist/components/p-COL7rExT.js.map +0 -1
- package/dist/components/p-CpGXfh7Q.js +0 -114
- package/dist/components/p-CpGXfh7Q.js.map +0 -1
- package/dist/components/p-Cu7ckMQp.js +0 -40
- package/dist/components/p-Cu7ckMQp.js.map +0 -1
- package/dist/components/p-CxwiRuTf.js +0 -623
- package/dist/components/p-CxwiRuTf.js.map +0 -1
- package/dist/components/p-DCMO4ssM.js +0 -40
- package/dist/components/p-DCMO4ssM.js.map +0 -1
- package/dist/components/p-DWrXodHT.js +0 -40
- package/dist/components/p-DWrXodHT.js.map +0 -1
- package/dist/components/p-De6Uhz0b.js.map +0 -1
- package/dist/components/p-IzVa21Wl.js.map +0 -1
- package/dist/components/p-JzJ_ZuEh.js +0 -89
- package/dist/components/p-JzJ_ZuEh.js.map +0 -1
- package/dist/components/p-kB7DMoo7.js +0 -40
- package/dist/components/p-kB7DMoo7.js.map +0 -1
- package/dist/components/p-rW0sFWOp.js +0 -40
- package/dist/components/p-rW0sFWOp.js.map +0 -1
- package/dist/stencil-library/p-741a746a.entry.js +0 -2
- package/dist/stencil-library/p-741a746a.entry.js.map +0 -1
- package/dist/stencil-library/p-c6J1w7ew.js +0 -2
- package/dist/stencil-library/p-c6J1w7ew.js.map +0 -1
- /package/dist/stencil-library/{p-d2fcb2d8.entry.js.map → p-0020e897.entry.js.map} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
|
|
2
2
|
if (typeof global === "undefined") { var global = globalThis || window || self; }
|
|
3
3
|
import { p as proxyCustomElement, H, h } from './index.js';
|
|
4
|
-
import { g as getLanguageStrings, s as state } from './p-
|
|
4
|
+
import { g as getLanguageStrings, s as state } from './p-BGDUEqPw.js';
|
|
5
5
|
|
|
6
6
|
var dist$1 = {};
|
|
7
7
|
|
|
@@ -1065,12 +1065,15 @@ function requireSimulation$1 () {
|
|
|
1065
1065
|
savedCostsByYear.push(savedCostsThisYear);
|
|
1066
1066
|
energyPrice = (1 + config.electricityPrice.increase) * energyPrice;
|
|
1067
1067
|
}
|
|
1068
|
+
const totalEnergyProduction = (summerProduction.reduce((acc, curr) => acc + curr, 0) +
|
|
1069
|
+
winterProduction.reduce((acc, curr) => acc + curr, 0)) / 2;
|
|
1068
1070
|
return {
|
|
1069
1071
|
autonomy: (summerDay.autonomy + winterDay.autonomy) / 2,
|
|
1070
1072
|
compensationPerDay: soldEnergy * config.electricityPrice.sell,
|
|
1071
1073
|
byYearSavedCosts: savedCostsByYear,
|
|
1072
1074
|
totalEnergyConsumptionDay: (summerConsumptionWholeDay + winterConsumptionWholeDay) / 2 +
|
|
1073
1075
|
electricCarConsumption,
|
|
1076
|
+
totalEnergyProduction,
|
|
1074
1077
|
};
|
|
1075
1078
|
}
|
|
1076
1079
|
|
|
@@ -1162,7 +1165,7 @@ function requireHeatingSimulation () {
|
|
|
1162
1165
|
const climateData = heatingConstants_1.CLIMATE_DATA["Zone 1"];
|
|
1163
1166
|
const baseHeatLoss = house.size * 30;
|
|
1164
1167
|
const insulationFactor = heatingConstants_1.INSULATION_FACTORS[house.insulationLevel];
|
|
1165
|
-
const sharedWallFactor = 1
|
|
1168
|
+
const sharedWallFactor = 1;
|
|
1166
1169
|
return baseHeatLoss * insulationFactor * sharedWallFactor *
|
|
1167
1170
|
((climateData === null || climateData === void 0 ? void 0 : climateData.heatingDegreeHours) || 3000) / 3000;
|
|
1168
1171
|
}
|
|
@@ -1477,7 +1480,7 @@ async function sendLeadToNexvoro(leadData) {
|
|
|
1477
1480
|
}
|
|
1478
1481
|
}
|
|
1479
1482
|
|
|
1480
|
-
const outputCss = "/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-100: oklch(93.6% 0.032 17.717);\n --color-red-300: oklch(80.8% 0.114 19.571);\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-red-700: oklch(50.5% 0.213 27.518);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --container-2xl: 42rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .bottom-4 {\n bottom: calc(var(--spacing) * 4);\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1 {\n left: calc(var(--spacing) * 1);\n }\n .left-1\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-10 {\n z-index: 10;\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .m-auto {\n margin: auto;\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .table {\n display: table;\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n .h-48 {\n height: calc(var(--spacing) * 48);\n }\n .h-64 {\n height: calc(var(--spacing) * 64);\n }\n .h-\\[400px\\] {\n height: 400px;\n }\n .h-full {\n height: 100%;\n }\n .max-h-full {\n max-height: 100%;\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n .w-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-2xl {\n max-width: var(--container-2xl);\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .border-collapse {\n border-collapse: collapse;\n }\n .-translate-x-1 {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-0 {\n --tw-translate-y: calc(var(--spacing) * 0);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-2 {\n --tw-translate-y: calc(var(--spacing) * 2);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .scale-95 {\n --tw-scale-x: 95%;\n --tw-scale-y: 95%;\n --tw-scale-z: 95%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .scale-100 {\n --tw-scale-x: 100%;\n --tw-scale-y: 100%;\n --tw-scale-z: 100%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n .resize {\n resize: both;\n }\n .appearance-none {\n appearance: none;\n }\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded {\n border-radius: 0.25rem;\n }\n .rounded-4xl {\n border-radius: var(--radius-4xl);\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n .border-t-2 {\n border-top-style: var(--tw-border-style);\n border-top-width: 2px;\n }\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n .border-border {\n border-color: var(--color-border);\n }\n .border-current {\n border-color: currentcolor;\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-error\\/20 {\n border-color: color-mix(in srgb, hsl(0 100% 50%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-error) 20%, transparent);\n }\n }\n .border-info {\n border-color: var(--color-info);\n }\n .border-info\\/20 {\n border-color: color-mix(in srgb, hsl(221 83% 53%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-info) 20%, transparent);\n }\n }\n .border-red-300 {\n border-color: var(--color-red-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .border-success {\n border-color: var(--color-success);\n }\n .border-success\\/20 {\n border-color: color-mix(in srgb, hsl(142 76% 36%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-success) 20%, transparent);\n }\n }\n .border-t-transparent {\n border-top-color: transparent;\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-error {\n background-color: var(--color-error);\n }\n .bg-error\\/10 {\n background-color: color-mix(in srgb, hsl(0 100% 50%) 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-error) 10%, transparent);\n }\n }\n .bg-error\\/90 {\n background-color: color-mix(in srgb, hsl(0 100% 50%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-error) 90%, transparent);\n }\n }\n .bg-info {\n background-color: var(--color-info);\n }\n .bg-info\\/90 {\n background-color: color-mix(in srgb, hsl(221 83% 53%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-info) 90%, transparent);\n }\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-success {\n background-color: var(--color-success);\n }\n .bg-success\\/10 {\n background-color: color-mix(in srgb, hsl(142 76% 36%) 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-success) 10%, transparent);\n }\n }\n .bg-success\\/90 {\n background-color: color-mix(in srgb, hsl(142 76% 36%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-success) 90%, transparent);\n }\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-tertiary {\n background-color: var(--color-tertiary);\n }\n .bg-transparent {\n background-color: transparent;\n }\n .object-contain {\n object-fit: contain;\n }\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pt-7 {\n padding-top: calc(var(--spacing) * 7);\n }\n .pr-3 {\n padding-right: calc(var(--spacing) * 3);\n }\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-3 {\n padding-left: calc(var(--spacing) * 3);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n .pl-10 {\n padding-left: calc(var(--spacing) * 10);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .text-error {\n color: var(--color-error);\n }\n .text-error-foreground {\n color: var(--color-error-foreground);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-red-500 {\n color: var(--color-red-500);\n }\n .text-red-700 {\n color: var(--color-red-700);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .text-white {\n color: var(--color-white);\n }\n .underline {\n text-decoration-line: underline;\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .duration-300 {\n --tw-duration: 300ms;\n transition-duration: 300ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .hover\\:bg-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-tertiary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 29%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-tertiary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .focus\\:border-2 {\n &:focus {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n }\n .focus\\:border-secondary {\n &:focus {\n border-color: var(--color-secondary);\n }\n }\n .focus\\:border-transparent {\n &:focus {\n border-color: transparent;\n }\n }\n .focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n }\n .focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n }\n .sm\\:mt-0 {\n @media (width >= 40rem) {\n margin-top: calc(var(--spacing) * 0);\n }\n }\n .sm\\:flex-3 {\n @media (width >= 40rem) {\n flex: 3;\n }\n }\n .sm\\:flex-row {\n @media (width >= 40rem) {\n flex-direction: row;\n }\n }\n .sm\\:items-center {\n @media (width >= 40rem) {\n align-items: center;\n }\n }\n .sm\\:gap-4 {\n @media (width >= 40rem) {\n gap: calc(var(--spacing) * 4);\n }\n }\n .md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n }\n .md\\:pl-2 {\n @media (width >= 48rem) {\n padding-left: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:rounded-full {\n &::-webkit-slider-runnable-track {\n border-radius: calc(infinity * 1px);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-black\\/25 {\n &::-webkit-slider-runnable-track {\n background-color: color-mix(in srgb, #000 25%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 25%, transparent);\n }\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:appearance-none {\n &::-webkit-slider-thumb {\n appearance: none;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:rounded-full {\n &::-webkit-slider-thumb {\n border-radius: calc(infinity * 1px);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\n }\n }\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ease {\n syntax: \"*\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n";
|
|
1483
|
+
const outputCss = "/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-100: oklch(93.6% 0.032 17.717);\n --color-red-300: oklch(80.8% 0.114 19.571);\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-red-700: oklch(50.5% 0.213 27.518);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --container-2xl: 42rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .bottom-4 {\n bottom: calc(var(--spacing) * 4);\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-10 {\n z-index: 10;\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .m-auto {\n margin: auto;\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n .h-48 {\n height: calc(var(--spacing) * 48);\n }\n .h-64 {\n height: calc(var(--spacing) * 64);\n }\n .h-\\[400px\\] {\n height: 400px;\n }\n .h-full {\n height: 100%;\n }\n .max-h-full {\n max-height: 100%;\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n .w-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-2xl {\n max-width: var(--container-2xl);\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-0 {\n --tw-translate-y: calc(var(--spacing) * 0);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-2 {\n --tw-translate-y: calc(var(--spacing) * 2);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .scale-95 {\n --tw-scale-x: 95%;\n --tw-scale-y: 95%;\n --tw-scale-z: 95%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .scale-100 {\n --tw-scale-x: 100%;\n --tw-scale-y: 100%;\n --tw-scale-z: 100%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n .resize {\n resize: both;\n }\n .appearance-none {\n appearance: none;\n }\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded {\n border-radius: 0.25rem;\n }\n .rounded-4xl {\n border-radius: var(--radius-4xl);\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n .border-t-2 {\n border-top-style: var(--tw-border-style);\n border-top-width: 2px;\n }\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n .border-border {\n border-color: var(--color-border);\n }\n .border-current {\n border-color: currentcolor;\n }\n .border-error\\/20 {\n border-color: color-mix(in srgb, hsl(0 100% 50%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-error) 20%, transparent);\n }\n }\n .border-info\\/20 {\n border-color: color-mix(in srgb, hsl(221 83% 53%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-info) 20%, transparent);\n }\n }\n .border-red-300 {\n border-color: var(--color-red-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .border-success\\/20 {\n border-color: color-mix(in srgb, hsl(142 76% 36%) 20%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-success) 20%, transparent);\n }\n }\n .border-t-transparent {\n border-top-color: transparent;\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-error\\/10 {\n background-color: color-mix(in srgb, hsl(0 100% 50%) 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-error) 10%, transparent);\n }\n }\n .bg-error\\/90 {\n background-color: color-mix(in srgb, hsl(0 100% 50%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-error) 90%, transparent);\n }\n }\n .bg-info\\/90 {\n background-color: color-mix(in srgb, hsl(221 83% 53%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-info) 90%, transparent);\n }\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-success\\/10 {\n background-color: color-mix(in srgb, hsl(142 76% 36%) 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-success) 10%, transparent);\n }\n }\n .bg-success\\/90 {\n background-color: color-mix(in srgb, hsl(142 76% 36%) 90%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-success) 90%, transparent);\n }\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-tertiary {\n background-color: var(--color-tertiary);\n }\n .bg-transparent {\n background-color: transparent;\n }\n .object-contain {\n object-fit: contain;\n }\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pt-7 {\n padding-top: calc(var(--spacing) * 7);\n }\n .pr-3 {\n padding-right: calc(var(--spacing) * 3);\n }\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-3 {\n padding-left: calc(var(--spacing) * 3);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n .pl-10 {\n padding-left: calc(var(--spacing) * 10);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .text-error {\n color: var(--color-error);\n }\n .text-error-foreground {\n color: var(--color-error-foreground);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-red-500 {\n color: var(--color-red-500);\n }\n .text-red-700 {\n color: var(--color-red-700);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .text-white {\n color: var(--color-white);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .duration-300 {\n --tw-duration: 300ms;\n transition-duration: 300ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .hover\\:bg-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-tertiary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 29%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-tertiary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .focus\\:border-2 {\n &:focus {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n }\n .focus\\:border-secondary {\n &:focus {\n border-color: var(--color-secondary);\n }\n }\n .focus\\:border-transparent {\n &:focus {\n border-color: transparent;\n }\n }\n .focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n }\n .focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n }\n .sm\\:mt-0 {\n @media (width >= 40rem) {\n margin-top: calc(var(--spacing) * 0);\n }\n }\n .sm\\:flex-3 {\n @media (width >= 40rem) {\n flex: 3;\n }\n }\n .sm\\:flex-row {\n @media (width >= 40rem) {\n flex-direction: row;\n }\n }\n .sm\\:items-center {\n @media (width >= 40rem) {\n align-items: center;\n }\n }\n .sm\\:gap-4 {\n @media (width >= 40rem) {\n gap: calc(var(--spacing) * 4);\n }\n }\n .md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n }\n .md\\:pl-2 {\n @media (width >= 48rem) {\n padding-left: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:rounded-full {\n &::-webkit-slider-runnable-track {\n border-radius: calc(infinity * 1px);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-black\\/25 {\n &::-webkit-slider-runnable-track {\n background-color: color-mix(in srgb, #000 25%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 25%, transparent);\n }\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:appearance-none {\n &::-webkit-slider-thumb {\n appearance: none;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:rounded-full {\n &::-webkit-slider-thumb {\n border-radius: calc(infinity * 1px);\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\n }\n }\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ease {\n syntax: \"*\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n";
|
|
1481
1484
|
|
|
1482
1485
|
const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm extends H {
|
|
1483
1486
|
constructor() {
|
|
@@ -1507,6 +1510,7 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1507
1510
|
electricCarChargingTime = "day";
|
|
1508
1511
|
heatPump = 0;
|
|
1509
1512
|
battery = 0;
|
|
1513
|
+
batteryEnabled = false;
|
|
1510
1514
|
compensation20Years = 0;
|
|
1511
1515
|
savedCosts20Years = 0;
|
|
1512
1516
|
maxPanels = 5;
|
|
@@ -1600,8 +1604,7 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1600
1604
|
this.autonomy = result.autonomy * 100;
|
|
1601
1605
|
this.totalEnergyConsumption = result.totalEnergyConsumptionDay * 365;
|
|
1602
1606
|
// Calculate total energy production based on compensation and rate
|
|
1603
|
-
this.totalEnergyProduction =
|
|
1604
|
-
(result.compensationPerDay / this.compensationRate) * 365;
|
|
1607
|
+
this.totalEnergyProduction = result.totalEnergyProduction * 365;
|
|
1605
1608
|
}
|
|
1606
1609
|
componentWillLoad() {
|
|
1607
1610
|
this.updateSystemConfigs();
|
|
@@ -1672,7 +1675,7 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1672
1675
|
phone: this.phone,
|
|
1673
1676
|
consumption: this.householdConsumption,
|
|
1674
1677
|
consumptionProfile: this.consumptionProfile,
|
|
1675
|
-
hasBattery: this.
|
|
1678
|
+
hasBattery: this.batteryEnabled,
|
|
1676
1679
|
battery: this.battery,
|
|
1677
1680
|
hasHeatPump: this.heatPump > 0,
|
|
1678
1681
|
heatPumpM2: this.heatPump,
|
|
@@ -1724,13 +1727,13 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1724
1727
|
// Reusable style objects
|
|
1725
1728
|
const borderStyle = { border: "1px solid var(--color-border)" };
|
|
1726
1729
|
const errorBorderStyle = { border: "1px solid var(--color-error)" };
|
|
1727
|
-
return (h("div", { key: '
|
|
1730
|
+
return (h("div", { key: 'bb41415c5998e8c1d3e98df49bb13f601410c09d', class: "flex flex-col justify-center items-center w-full h-full pt-4" // style={{
|
|
1728
1731
|
,
|
|
1729
1732
|
// display: (Object.keys(this.systemConfigs).length === 0)
|
|
1730
1733
|
// ? "none"
|
|
1731
1734
|
// : "flex",
|
|
1732
1735
|
// }}
|
|
1733
|
-
id: "solar-system-form" }, h("h1", { key: '
|
|
1736
|
+
id: "solar-system-form" }, h("h1", { key: '136c0a340cdc4ef1e7de9cc7e8e899017ff111c8', class: "text-2xl font-bold text-secondary mb-4 w-full" }, t.solarSystemForm.title), h("div", { key: '1b7a0195f63cbe3765777573c34c9fbe2b47646a', class: "w-full bg-primary rounded-4xl space-y-6" }, h("div", { key: 'f5b8490c2ba77b7afbf8310c83723c44d5ad66b9', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: 'aa7de0e6fae0b9b8d3193e2d32fe1e63a23d9f64', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.systemInformation), h("div", { key: '4c745cbf10a6251bdfc0bc926e073073b0ba6408', class: "flex flex-col sm:flex-row gap-4" }, h("div", { key: '292edb872ca1ef3dd82f015ca9d479af89c87ea7', class: "flex-1 bg-muted rounded-4xl p-4 space-y-3" }, h("div", { key: '89a23d55107849485c28023ab6ac344b209ad34d', class: "flex items-center justify-between" }, h("label", { key: 'ee5bd53c202f897a8c212b362265b76044bd5e44', class: "text-sm font-medium text-text-muted" }, t.solarSystemForm.numberOfPanels), !this.isIOS()
|
|
1734
1737
|
? (h("input", { type: "number", class: "w-20 px-3 py-1 rounded-full bg-muted text-muted-foreground text-right", value: this.numberOfPanels, readOnly: true }))
|
|
1735
1738
|
: (h("input", { type: "number", min: "1", max: this.maxPanels, class: "w-20 px-3 py-1 rounded-full focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground text-center", style: borderStyle, value: this.numberOfPanels, onInput: (e) => {
|
|
1736
1739
|
const value = parseInt(e.target
|
|
@@ -1742,38 +1745,44 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1742
1745
|
value;
|
|
1743
1746
|
this.recalculate();
|
|
1744
1747
|
}
|
|
1745
|
-
} }))), !this.isIOS() && (h("input", { key: '
|
|
1748
|
+
} }))), !this.isIOS() && (h("input", { key: '3505aba4610e120ff535a4357e32bfe44092fd28', type: "range", min: "1", max: this.maxPanels, step: "1", class: "input-slider w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-muted", value: this.numberOfPanels, onInput: (e) => {
|
|
1746
1749
|
this.numberOfPanels = parseInt(e.target
|
|
1747
1750
|
.value);
|
|
1751
|
+
if (isNaN(this.numberOfPanels)) {
|
|
1752
|
+
this.numberOfPanels = 0;
|
|
1753
|
+
}
|
|
1748
1754
|
this.recalculate();
|
|
1749
|
-
} }))), h("div", { key: '
|
|
1750
|
-
this.numberOfPanels).toFixed(1), " kWp"))))), h("div", { key: '
|
|
1755
|
+
} }))), h("div", { key: '58abbe1ad7b258880138e3d398dabcb2d1efca5b', class: "flex-1 bg-muted rounded-4xl p-4" }, h("div", { key: 'be74d4f0a1e34a55fdc6eafa4dc08e69570e9b04', class: "flex items-center justify-between" }, h("label", { key: '1f8a47d5052731a7da89852099fef84a8946f596', class: "text-sm font-medium text-text-muted" }, t.solarSystemForm.panelPeakPower), h("span", { key: 'a3f101b680f251c3e4372bce14b833b9dfa415d3', class: "text-text-muted" }, this.panelPeakPower.toFixed(2), " kW")), h("div", { key: '2ed107c8a0cb43e08b2cbb205f7db8e9de271b22', class: "flex items-center justify-between mt-4" }, h("span", { key: '670c41ca8173f58b1dcbe31699c922ceb9672105', class: "text-sm font-medium text-text-muted" }, t.solarSystemForm.totalSystemPeakPower), h("span", { key: 'e41306aec2f7351e5f01c1f221ef23bbe684a366', class: "font-bold text-text-muted" }, (DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *
|
|
1756
|
+
this.numberOfPanels).toFixed(1), " kWp"))))), h("div", { key: '38ce148b3679e357768a03d92e2aff79d5192f76', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: 'bf8031199ddd6ccd90301c29f4bd8e223b14d787', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.householdConsumptionTitle), h("div", { key: 'e06f62af8305aa26be7ea662da32135276218484', class: "grid grid-rows-2 gap-0" }, h("div", { key: 'a04a7c38ab456419674e9e2818bd7519fe795a17', class: "grid grid-cols-2 gap-4" }, h("label", { key: '6d0a74756d1d5a164dbe5783cf3df044bd4d2ced', class: "block text-sm font-medium text-text-muted" }, t.solarSystemForm.annualConsumption), h("label", { key: '49187db1a88afde0b1bebd8fc9f2e88524a4c59d', class: "block text-sm font-medium text-text-muted" }, t.solarSystemForm.consumptionProfileTitle)), h("div", { key: '25690a6ca0000b1eabb589c77109d1087ed1ad76', class: "grid grid-cols-2 gap-4" }, h("input", { key: '506dd439307bacc0d7274a6b2ec0a79f363a9d11', type: "number", step: "100", min: "0", class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground", style: borderStyle, value: this.householdConsumption, onInput: (e) => {
|
|
1751
1757
|
this.householdConsumption = parseInt(e.target
|
|
1752
1758
|
.value);
|
|
1753
1759
|
this.recalculate();
|
|
1754
|
-
} }), h("select", { key: '
|
|
1760
|
+
} }), h("select", { key: '025fdf9c050c1e00aedd293cfa15da8a411e70af', class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground", style: borderStyle, onChange: (e) => {
|
|
1755
1761
|
this.consumptionProfile =
|
|
1756
1762
|
e.target
|
|
1757
1763
|
.value;
|
|
1758
1764
|
this.recalculate();
|
|
1759
|
-
} }, h("option", { key: '
|
|
1765
|
+
} }, h("option", { key: '26c2fdbcb3646323157dfa6f9f66d6b8ca924c72', value: "mostly_at_home", selected: this.consumptionProfile ===
|
|
1760
1766
|
"mostly_at_home" }, t.solarSystemForm.consumptionProfiles
|
|
1761
|
-
.mostlyAtHome), h("option", { key: '
|
|
1767
|
+
.mostlyAtHome), h("option", { key: 'f3b9527d607657efc4ff75d93576fd765aa97975', value: "mostly_away", selected: this.consumptionProfile ===
|
|
1762
1768
|
"mostly_away" }, t.solarSystemForm.consumptionProfiles
|
|
1763
|
-
.mostlyAway))))), h("div", { key: '
|
|
1769
|
+
.mostlyAway))))), h("div", { key: '5618500ae3aca7633180a6b3607f1c6462c49815', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: 'fe74e96b7fdcb2e6776a7eccf248d29b0cdd0206', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.additionalComponents.title), h("div", { key: 'a26c1c3461d3021b823f07a05a20ac74108d4ee7', class: "flex flex-col gap-4" }, h("div", { key: 'ef4c60ac505187ca35d213e0f80a6959f1edabd1', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '08e0b956be5958985d8bb247ea94ff0510657d89', class: "flex items-center justify-between" }, h("div", { key: 'ef1917d84a95ace85e140e801736c4dc5c16e378', class: "flex items-center gap-2" }, h("input", { key: '3b19229e72c742accfa553e6b385ab5ad148e6a9', type: "checkbox", id: "heatPump", class: "w-4 h-4 accent-tertiary border-border rounded-full focus:ring-tertiary focus:ring-offset-0 focus:ring-2", checked: this.heatPump > 0, onChange: (e) => {
|
|
1764
1770
|
this.heatPump =
|
|
1765
1771
|
e.target
|
|
1766
1772
|
.checked
|
|
1767
1773
|
? 100
|
|
1768
1774
|
: 0;
|
|
1769
1775
|
this.recalculate();
|
|
1770
|
-
} }), h("label", { key: '
|
|
1776
|
+
} }), h("label", { key: 'f73944ac3cd52ab5ac7358d8dfd520720ad43c1b', htmlFor: "heatPump", class: "text-text-muted" }, t.solarSystemForm
|
|
1771
1777
|
.additionalComponents
|
|
1772
|
-
.heatPump)), (this.heatPump > 0 && !this.isIOS()) && (h("span", { key: '
|
|
1778
|
+
.heatPump)), (this.heatPump > 0 && !this.isIOS()) && (h("span", { key: '4a2090de47870f9a59b498425b6bbd2bdd177aba', class: "text-text-muted" }, this.heatPump, " m\u00B2"))), this.heatPump > 0 && (h("div", { key: '9a2f2cc91a1efafb06de01ecb78949656cdfcccf', class: "flex flex-col gap-2" }, this.isIOS()
|
|
1773
1779
|
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "10", max: "300", step: "10", class: "flex-1 px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", style: borderStyle, value: this.heatPump, onInput: (e) => {
|
|
1774
|
-
|
|
1780
|
+
let value = parseInt(e.target
|
|
1775
1781
|
.value);
|
|
1776
|
-
if (value
|
|
1782
|
+
if (isNaN(value)) {
|
|
1783
|
+
value = 0;
|
|
1784
|
+
}
|
|
1785
|
+
if (value >= 0 &&
|
|
1777
1786
|
value <= 300) {
|
|
1778
1787
|
this.heatPump =
|
|
1779
1788
|
value;
|
|
@@ -1785,105 +1794,121 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1785
1794
|
parseInt(e.target
|
|
1786
1795
|
.value);
|
|
1787
1796
|
this.recalculate();
|
|
1788
|
-
} }))))), h("div", { key: '
|
|
1797
|
+
} }))))), h("div", { key: '0a7e51f6f8596bed2af8850169ca32c488f43559', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: 'e768501bf22d0d93d4c5ce0d4c142ef7d6096151', class: "flex items-center justify-between" }, h("div", { key: 'e1c54539633730995db596e77be2fd4bba609a81', class: "flex items-center gap-2" }, h("input", { key: 'bface3b5aad019fdcb92ba3229fe7187ec8babb1', type: "checkbox", id: "electricCar", class: "w-4 h-4 accent-tertiary border-border rounded focus:ring-tertiary focus:ring-offset-0 focus:ring-2", checked: this.electricCar, onChange: (e) => {
|
|
1789
1798
|
this.electricCar =
|
|
1790
1799
|
e.target
|
|
1791
1800
|
.checked;
|
|
1792
1801
|
this.recalculate();
|
|
1793
|
-
} }), h("label", { key: '
|
|
1802
|
+
} }), h("label", { key: 'a148ffb1488169ef9e383c5483145f3163c38172', htmlFor: "electricCar", class: "text-text-muted" }, t.solarSystemForm
|
|
1794
1803
|
.additionalComponents
|
|
1795
|
-
.electricCar))), this.electricCar && (h("div", { key: '
|
|
1804
|
+
.electricCar))), this.electricCar && (h("div", { key: '0d6db7e0d23eed4c85aa21f8661038c100049fb7', class: "flex flex-col gap-2" }, h("div", { key: 'c9be028278aa8a582b3d563c98ecabf5a137669b', class: "grid grid-cols-2 gap-4" }, h("label", { key: 'a1d2a3070dd0506be70623ca9b8c524a35132956', class: "text-sm text-text-muted" }, t.solarSystemForm
|
|
1796
1805
|
.additionalComponents
|
|
1797
|
-
.chargingTime), h("label", { key: '
|
|
1806
|
+
.chargingTime), h("label", { key: '7bedc4d1e43fb5e10f04a4ae2b91abf10c56da2c', class: "text-sm text-text-muted" }, t.solarSystemForm
|
|
1798
1807
|
.additionalComponents
|
|
1799
|
-
.kilometersPerYear)), h("div", { key: '
|
|
1808
|
+
.kilometersPerYear)), h("div", { key: 'c0f3501cecec8280e323f2403de52e3248b6ce7a', class: "grid grid-cols-2 gap-4" }, h("select", { key: 'e2947d4b13363e341955c429fa37fe2ad5966280', class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", onChange: (e) => {
|
|
1800
1809
|
this.electricCarChargingTime =
|
|
1801
1810
|
e.target
|
|
1802
1811
|
.value;
|
|
1803
1812
|
this.recalculate();
|
|
1804
|
-
}, style: borderStyle }, h("option", { key: '
|
|
1813
|
+
}, style: borderStyle }, h("option", { key: '544ae8957ab71cdfd3ad438031d5b3235a321f56', value: "day", selected: this
|
|
1805
1814
|
.electricCarChargingTime ===
|
|
1806
1815
|
"day" }, t.solarSystemForm
|
|
1807
1816
|
.additionalComponents
|
|
1808
|
-
.chargingTimeDay), h("option", { key: '
|
|
1817
|
+
.chargingTimeDay), h("option", { key: '04d71d6537186ecda58784b3f70e357a3c36f85f', value: "night", selected: this
|
|
1809
1818
|
.electricCarChargingTime ===
|
|
1810
1819
|
"night" }, t.solarSystemForm
|
|
1811
1820
|
.additionalComponents
|
|
1812
|
-
.chargingTimeNight)), h("input", { key: '
|
|
1821
|
+
.chargingTimeNight)), h("input", { key: '951f65399cc04d815a585d32206b235710eaefe3', type: "number", min: "1000", max: "100000", step: "1000", class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.kmDrivenPerYear, onInput: (e) => {
|
|
1813
1822
|
this.kmDrivenPerYear =
|
|
1814
1823
|
parseInt(e.target
|
|
1815
1824
|
.value);
|
|
1825
|
+
if (isNaN(this.kmDrivenPerYear)) {
|
|
1826
|
+
this.kmDrivenPerYear =
|
|
1827
|
+
0;
|
|
1828
|
+
}
|
|
1816
1829
|
this.recalculate();
|
|
1817
|
-
}, style: borderStyle }))))), h("div", { key: '
|
|
1818
|
-
this.
|
|
1830
|
+
}, style: borderStyle }))))), h("div", { key: 'b0b64b1afec1a7b05af83d910369141713792a9f', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '16d9ff1d1ed9f11b8cb3f0bf707ae911bd4d3052', class: "flex items-center justify-between" }, h("div", { key: '5ea7224b166ac5d09a0c6954a6583c6ee10bcbf8', class: "flex items-center gap-2" }, h("input", { key: '6bfe5da599c642efe88fdb981983857a812df417', type: "checkbox", id: "battery", class: "w-4 h-4 accent-tertiary border-border rounded-full focus:ring-tertiary focus:ring-offset-0 focus:ring-2", checked: this.batteryEnabled, onChange: (e) => {
|
|
1831
|
+
this.batteryEnabled =
|
|
1819
1832
|
e.target
|
|
1820
|
-
.checked
|
|
1833
|
+
.checked;
|
|
1834
|
+
this.battery =
|
|
1835
|
+
this.batteryEnabled
|
|
1821
1836
|
? 5
|
|
1822
1837
|
: 0;
|
|
1823
1838
|
this.recalculate();
|
|
1824
|
-
} }), h("label", { key: '
|
|
1839
|
+
} }), h("label", { key: 'e40e64ca8bd60afddef286b7e4aa5cf369217eb2', htmlFor: "battery", class: "text-text-muted" }, t.solarSystemForm
|
|
1825
1840
|
.additionalComponents
|
|
1826
|
-
.battery)), (this.
|
|
1827
|
-
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "
|
|
1828
|
-
|
|
1841
|
+
.battery)), (this.batteryEnabled && !this.isIOS()) && (h("span", { key: 'b2fc3a8d3e565b6f0de27b8e0cdd9a125787dc97', class: "text-text-muted" }, this.battery, " kWh"))), this.batteryEnabled && (h("div", { key: 'e2148708d2c07f4bb07dfb8c68ea37005f86d4ac', class: "flex flex-col gap-2" }, this.isIOS()
|
|
1842
|
+
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "0", max: "20", step: "1", class: "flex-1 px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.battery, onInput: (e) => {
|
|
1843
|
+
let value = parseInt(e.target
|
|
1829
1844
|
.value);
|
|
1830
|
-
if (value
|
|
1845
|
+
if (isNaN(value)) {
|
|
1846
|
+
value = 0;
|
|
1847
|
+
}
|
|
1848
|
+
if (value >= 0 &&
|
|
1831
1849
|
value <= 20) {
|
|
1832
1850
|
this.battery =
|
|
1833
1851
|
value;
|
|
1834
|
-
this.recalculate();
|
|
1835
1852
|
}
|
|
1853
|
+
else {
|
|
1854
|
+
this.battery =
|
|
1855
|
+
20;
|
|
1856
|
+
}
|
|
1857
|
+
this.recalculate();
|
|
1836
1858
|
}, style: borderStyle }), h("span", { class: "text-sm text-text-muted" }, "kWh")))
|
|
1837
1859
|
: (h("input", { type: "range", min: "1", max: "20", step: "1", class: "input-slider w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-muted", value: this.battery, onInput: (e) => {
|
|
1838
|
-
|
|
1860
|
+
const value = parseInt(e.target
|
|
1839
1861
|
.value);
|
|
1862
|
+
this.battery = value;
|
|
1863
|
+
this.batteryEnabled =
|
|
1864
|
+
value > 0;
|
|
1840
1865
|
this.recalculate();
|
|
1841
|
-
} }))))))), h("div", { key: '
|
|
1866
|
+
} }))))))), h("div", { key: '2403db26cd231ee1e14ee9e54904a6d47a442cde', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: 'd7792f3cd2f10acbc708f347eb9d875774b4d7cd', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.electricityCostsTitle), h("div", { key: 'a2ace9b4c49c0e778a112ee957a372f32a499117', style: {
|
|
1842
1867
|
display: "grid",
|
|
1843
|
-
gridTemplateColumns: "repeat(auto-fit, minmax(
|
|
1868
|
+
gridTemplateColumns: "repeat(auto-fit, minmax(100px, 1fr))",
|
|
1844
1869
|
gap: "1rem",
|
|
1845
|
-
} }, h("div", { key: '
|
|
1870
|
+
} }, h("div", { key: '1d5fbae3664adf9c19550b482a0ded3a7a7442c0' }, h("label", { key: 'd16ad99fa9c8f87151a5a6a7d7bcde674c4a8e81', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.electricityPrice), h("input", { key: 'f36ae62025eee8bbdb65c9c82d4b605667894d8d', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", style: borderStyle, value: this.electricityPrice.toFixed(2), onInput: (e) => {
|
|
1846
1871
|
this.electricityPrice = parseFloat(e.target
|
|
1847
1872
|
.value);
|
|
1848
1873
|
this.recalculate();
|
|
1849
|
-
} })), h("div", { key: '
|
|
1874
|
+
} })), h("div", { key: 'bfd9e6153ab03d5ace55ad15de335df6566b5417' }, h("label", { key: 'ee2536275e4fd5649721d4d3940291430075db67', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.compensationRate), h("input", { key: '8dd2be4609fcb850794fa070df50cfa751a87fa1', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", style: borderStyle, value: this.compensationRate.toFixed(2), onInput: (e) => {
|
|
1850
1875
|
this.compensationRate = parseFloat(e.target
|
|
1851
1876
|
.value);
|
|
1852
1877
|
this.recalculate();
|
|
1853
|
-
} })), h("div", { key: '
|
|
1878
|
+
} })), h("div", { key: '8f29216586bc3f5c92be3aee08f3d92c67dbf061' }, h("label", { key: 'af3fac52689fe289a72003f3acc78d9ea4bc232d', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.annualPriceIncrease), h("input", { key: '7e9587a58424149e25b6cd35b3b0f8e67bad0a10', type: "number", step: "0.1", class: "w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", style: borderStyle, value: this.annualPriceIncrease.toFixed(1), onInput: (e) => {
|
|
1854
1879
|
this.annualPriceIncrease = parseFloat(e.target
|
|
1855
1880
|
.value);
|
|
1856
1881
|
this.recalculate();
|
|
1857
|
-
} })))), h("div", { key: '
|
|
1882
|
+
} })))), h("div", { key: 'edee17bd72e40f9a00345fce0c7b0728474ecd5c', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: '8833b742a6df1556486ff3719b8b833adb858163', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.resultsTitle), h("div", { key: '6cb17515165775c5b59c0e2ab9f9602125aac953', class: "bg-muted rounded-4xl p-4" }, h("div", { key: '43ba0b310caa0d3e19d4d991b19f54500609e155', class: "flex flex-col sm:flex-row sm:items-center justify-between" }, h("span", { key: 'fe78bf736efedb7e3ce331d594ebec5ac4260ea3', class: "text-text-muted" }, t.solarSystemForm.autonomy), h("span", { key: '57e3d258a15dcc6ff502b5ac2c5612a3ae7a9332', class: "text-xl font-bold text-secondary mt-1 sm:mt-0" }, this.autonomy > 100
|
|
1858
1883
|
? "100"
|
|
1859
|
-
: this.formatEuropeanNumber(this.autonomy, 1), "%")), h("div", { key: '
|
|
1860
|
-
.solarSystemForm.year)), h("div", { key: '
|
|
1861
|
-
.monetaryBenefit20Years)), h("span", { key: '
|
|
1884
|
+
: this.formatEuropeanNumber(this.autonomy, 1), "%")), h("div", { key: '84c71945018078f4d1f22d94de5710b57a097b10', class: "flex flex-col sm:flex-row sm:items-center justify-between mt-4" }, h("span", { key: '1ba73ff5a96617626b3a219bb4a3894cc6a82e2a', class: "text-text-muted" }, t.solarSystemForm.totalEnergyConsumption), h("span", { key: '3d328063a9999304de1a2cdc3010787dd08ebdac', class: "text-xl font-bold text-secondary mt-1 sm:mt-0" }, this.formatEuropeanNumber(this.totalEnergyConsumption, 0), " kWh/", t.solarSystemForm.year)), h("div", { key: 'a6e0a99b0532b1c8409e5f8ebfb04d5c0b7fc1d5', class: "flex flex-col sm:flex-row sm:items-center justify-between mt-4" }, h("span", { key: '4e3de7a62055aed15d8214080da79d7c67a3504f', class: "text-text-muted" }, t.solarSystemForm.totalEnergyProduction), h("span", { key: '50919661b3fa82dc99d93aef0bf4e46b85e683e6', class: "text-xl font-bold text-secondary mt-1 sm:mt-0" }, this.formatEuropeanNumber(this.totalEnergyProduction, 0), " kWh/", t.solarSystemForm.year)), h("div", { key: '669ecb3bff03f954c459c5864ebc790f7802d2c3', class: "flex flex-col sm:flex-row sm:items-center justify-between mt-4" }, h("div", { key: '50064fa431dae13dfafd7a827b4265eb5ce66025', class: "flex items-center gap-2" }, h("span", { key: 'add8a4952f5f2992657a8723210697a2889e08ca', class: "text-text-muted" }, t.solarSystemForm.costSavings)), h("span", { key: '1a4cf403f0cdc01e8aa195826165f66e74c2f460', class: "text-xl font-bold text-success mt-1 sm:mt-0" }, this.formatEuropeanNumber(this.costSavings), " \u20AC/", t
|
|
1885
|
+
.solarSystemForm.year)), h("div", { key: 'fadf1e4394b0734ae14d4568db8f47b286b00eed', class: "flex flex-col sm:flex-row sm:items-center justify-between mt-4" }, h("div", { key: '69c5b3bfa131e35b1760b854e0adcddc4cd7513e', class: "flex items-center gap-2" }, h("span", { key: '826a2b7a6c1959626ca195b66893e7725582d666', class: "text-text-muted" }, t.solarSystemForm.compensation20Years)), h("span", { key: 'cfbc1063b55c815f6ae89a48c6b8239ecfbcbb5d', class: "text-xl font-bold text-success mt-1 sm:mt-0" }, this.formatEuropeanNumber(this.compensation20Years), " \u20AC")), h("div", { key: 'fa740700dbc3a640c5adce3d28413b839000b840', class: "flex flex-col sm:flex-row sm:items-center justify-between mt-4" }, h("div", { key: '095d543adc7d81fec92ebfcf35efd4122b1b6ef9', class: "flex items-center gap-2" }, h("span", { key: 'eac35fd6b6bb3778afadec2bfa93b7549a7db08a', class: "text-text-muted" }, t.solarSystemForm
|
|
1886
|
+
.monetaryBenefit20Years)), h("span", { key: '82d2fdee254b0ff2bb6534dced8a43087f7f4269', class: "text-xl font-bold text-success mt-1 sm:mt-0" }, this.formatEuropeanNumber(this.savedCosts20Years), " \u20AC")))), h("div", { key: '96cc3aa5ed8fa4870a5fe54e1345b1abc6b69862', class: "space-y-4 p-4 rounded-4xl", style: borderStyle }, h("h2", { key: '08f6274c8a655995b0a2061696bbeca324c81924', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.requestOffer), h("div", { key: 'ed644026714f6962469ba290c8931e12d6b3afff', style: {
|
|
1862
1887
|
display: "grid",
|
|
1863
|
-
gridTemplateColumns: "repeat(auto-fit, minmax(
|
|
1888
|
+
gridTemplateColumns: "repeat(auto-fit, minmax(1 00px, 1fr))",
|
|
1864
1889
|
gap: "1rem",
|
|
1865
|
-
} }, h("div", { key: '
|
|
1890
|
+
} }, h("div", { key: '8d22c69472e58ad2fb2dbca427e5dd1bc2f207a8' }, h("label", { key: '3d975692c644c8e26ec1c0a03e12312adf6b0ede', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.name), h("input", { key: 'addb2114b79ddb98d2215b68214116ed2d64ad66', type: "text", class: `w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`, style: this.nameError
|
|
1866
1891
|
? errorBorderStyle
|
|
1867
1892
|
: borderStyle, value: this.name, onInput: (e) => {
|
|
1868
1893
|
this.name =
|
|
1869
1894
|
e.target
|
|
1870
1895
|
.value;
|
|
1871
1896
|
this.validateForm();
|
|
1872
|
-
}, placeholder: "Your name" }), this.nameError && (h("p", { key: '
|
|
1897
|
+
}, placeholder: "Your name" }), this.nameError && (h("p", { key: '32dd68fc53f8694371c56a229fd075839d3e00d8', class: "text-error text-sm mt-1" }, this.nameError))), h("div", { key: 'f58d1775fb32e5b0704cb635bdc563c4a2b2a9f1' }, h("label", { key: '87b853fd645e5dd16bcabfb9836a044441a56198', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.email), h("input", { key: '115b7a027cc5a77a7a70a1a8c8f4cb3c64c09d50', type: "email", class: `w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`, style: this.emailError
|
|
1873
1898
|
? errorBorderStyle
|
|
1874
1899
|
: borderStyle, value: this.email, onInput: (e) => {
|
|
1875
1900
|
this.email =
|
|
1876
1901
|
e.target
|
|
1877
1902
|
.value;
|
|
1878
1903
|
this.validateForm();
|
|
1879
|
-
}, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '
|
|
1904
|
+
}, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '055f714dfa5ccf74d461c048cf14bcc4a4f1d2a0', class: "text-error text-sm mt-1" }, this.emailError))), h("div", { key: '9516dab3e8d312aafbded94676d377c950b5e34d' }, h("label", { key: 'd13fced3339f847cf792738c1469b45d0090c3e5', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.phone), h("input", { key: 'ab7df19168e831442fdb4368bc817f0985d8750a', type: "tel", class: `w-full px-4 py-2 rounded-4xl focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`, style: this.phoneError
|
|
1880
1905
|
? errorBorderStyle
|
|
1881
1906
|
: borderStyle, value: this.phone, onInput: (e) => {
|
|
1882
1907
|
this.phone =
|
|
1883
1908
|
e.target
|
|
1884
1909
|
.value;
|
|
1885
1910
|
this.validateForm();
|
|
1886
|
-
}, placeholder: "+34 123 456 789" }), this.phoneError && (h("p", { key: '
|
|
1911
|
+
}, placeholder: "+34 123 456 789" }), this.phoneError && (h("p", { key: '9eff09242097e92c1d9eec03df499a73b169664c', class: "text-error text-sm mt-1" }, this.phoneError)))), h("div", { key: '55990f0a38c24bd9a0d91df2760f81909a79696c', class: "flex flex-col items-center gap-4" }, h("button", { key: '09dfe384f03928294282cf973d3ccd9baf6d0a56', onClick: () => this.handleRequestOffer(), disabled: !this.name.trim() ||
|
|
1887
1912
|
!this.email.trim() || !!this.nameError ||
|
|
1888
1913
|
!!this.emailError || !!this.phoneError ||
|
|
1889
1914
|
this.isSubmitting, class: `px-6 py-3 rounded-4xl transition-colors duration-200 flex items-center gap-2 ${this.isSubmitting
|
|
@@ -1892,9 +1917,9 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1892
1917
|
color: this.isSubmitting
|
|
1893
1918
|
? "var(--color-text-muted)"
|
|
1894
1919
|
: "#ffffff",
|
|
1895
|
-
} }, this.isSubmitting && (h("div", { key: '
|
|
1920
|
+
} }, this.isSubmitting && (h("div", { key: 'e5aad83a4c2f4838e303f9447b26db9a3094aa14', class: "w-4 h-4 border-2 border-current border-t-transparent rounded-full animate-spin" })), this.isSubmitting
|
|
1896
1921
|
? t.solarSystemForm.sending
|
|
1897
|
-
: t.solarSystemForm.requestOfferButton), this.submitMessage && (h("div", { key: '
|
|
1922
|
+
: t.solarSystemForm.requestOfferButton), this.submitMessage && (h("div", { key: '72a6cfc9becc8f24a4aa2072c8706a5bcec0319e', class: `text-sm px-4 py-2 rounded-4xl ${this.submitSuccess
|
|
1898
1923
|
? "bg-success/10 text-success border border-success/20"
|
|
1899
1924
|
: "bg-error/10 text-error border border-error/20"}` }, this.submitMessage)))))));
|
|
1900
1925
|
}
|
|
@@ -1926,6 +1951,7 @@ const SolarSystemForm = /*@__PURE__*/ proxyCustomElement(class SolarSystemForm e
|
|
|
1926
1951
|
"electricCarChargingTime": [32],
|
|
1927
1952
|
"heatPump": [32],
|
|
1928
1953
|
"battery": [32],
|
|
1954
|
+
"batteryEnabled": [32],
|
|
1929
1955
|
"compensation20Years": [32],
|
|
1930
1956
|
"savedCosts20Years": [32],
|
|
1931
1957
|
"maxPanels": [32],
|
|
@@ -1954,6 +1980,6 @@ function defineCustomElement() {
|
|
|
1954
1980
|
defineCustomElement();
|
|
1955
1981
|
|
|
1956
1982
|
export { BORDER_INSET as B, DEFAULT_COLOR_SCHEME as D, SolarSystemForm as S, DEFAULT_SOLAR_EXPERT_CONFIG as a, DEFAULT_SOLAR_PANEL_TYPE as b, distExports as c, defineCustomElement as d, requireDist$1 as r };
|
|
1957
|
-
//# sourceMappingURL=p-
|
|
1983
|
+
//# sourceMappingURL=p-Bb2Y3Z89.js.map
|
|
1958
1984
|
|
|
1959
|
-
//# sourceMappingURL=p-
|
|
1985
|
+
//# sourceMappingURL=p-Bb2Y3Z89.js.map
|