@studious-creative/yumekit 0.1.7 → 0.1.8

package/dist/yumekit.min.js

@@ -1 +1 @@
-var YumeKit=function(e){"use strict";const t=new Map;function n(e){for(const[n,r]of Object.entries(e))t.set(n,r)}function r(e){return t.get(e)||""}n({ai:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 8V4H8"/>\n  <rect width="16" height="12" x="4" y="8" rx="2"/>\n  <path d="M2 14h2M20 14h2M15 13v2M9 13v2"/>\n</svg>\n',"arrow-right":'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="5" y1="12" x2="19" y2="12"/>\n  <polyline points="12 5 19 12 12 19"/>\n</svg>\n',bolt:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>\n</svg>\n',chart:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/>\n</svg>\n',checkmark:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polyline points="5 13 10 17 19 6" fill="none" stroke="currentColor" stroke-width="2"/></svg>\n',"chevron-down":'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>\n',"chevron-down-lg":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" aria-hidden="true"><path d="M5 7 L10 12 L15 7" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" /></svg>\n',"chevron-right":'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>\n',close:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="14" height="14" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"><line x1="6" y1="6" x2="14" y2="14" /><line x1="14" y1="6" x2="6" y2="14" /></svg>\n',"collapse-left":'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="11 17 6 12 11 7"/><polyline points="18 17 13 12 18 7"/></svg>\n',discord:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026c.462-.62.874-1.275 1.226-1.963.021-.04.001-.088-.041-.104a13.201 13.201 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028z"/>\n</svg>\n',"expand-right":'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="13 17 18 12 13 7"/><polyline points="6 17 11 12 6 7"/></svg>\n',features:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="3"/>\n  <path d="M12 1v4M12 19v4M4.22 4.22l2.83 2.83M16.95 16.95l2.83 2.83M1 12h4M19 12h4M4.22 19.78l2.83-2.83M16.95 7.05l2.83-2.83"/>\n</svg>\n',figma:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"/>\n  <path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"/>\n  <path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>\n  <path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"/>\n  <path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"/>\n</svg>\n',folder:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2z"/>\n</svg>\n',github:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"/>\n</svg>\n',home:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>\n  <polyline points="9 22 9 12 15 12 15 22"/>\n</svg>\n',image:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>\n  <circle cx="8.5" cy="8.5" r="1.5"/>\n  <polyline points="21 15 16 10 5 21"/>\n</svg>\n',indeterminate:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="4" y="11" width="16" height="2" rx="1" ry="1" fill="currentColor"/></svg>\n',layout:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>\n  <line x1="3" y1="9" x2="21" y2="9"/>\n  <line x1="9" y1="21" x2="9" y2="9"/>\n</svg>\n',logo:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 2L2 7l10 5 10-5-10-5z"/>\n  <path d="M2 17l10 5 10-5"/>\n  <path d="M2 12l10 5 10-5"/>\n</svg>\n',mail:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="2" y="4" width="20" height="16" rx="2"/>\n  <path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/>\n</svg>\n',moon:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>\n</svg>\n',palette:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="13.5" cy="6.5" r=".5" fill="currentColor"/>\n  <circle cx="17.5" cy="10.5" r=".5" fill="currentColor"/>\n  <circle cx="8.5" cy="7.5" r=".5" fill="currentColor"/>\n  <circle cx="6.5" cy="12.5" r=".5" fill="currentColor"/>\n  <path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"/>\n</svg>\n',search:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="11" cy="11" r="8"/>\n  <path d="m21 21-4.35-4.35"/>\n</svg>\n',settings:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="3"/>\n  <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/>\n</svg>\n',star:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>\n</svg>\n',sun:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="5"/>\n  <path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/>\n</svg>\n',user:'<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>\n  <circle cx="12" cy="7" r="4"/>\n</svg>\n'});var o='/* Colors */\n:root {\n    --neutral--: #7f8286ff;\n    --neutral-white: #ffffffff;\n    --neutral-black: #000000ff;\n    --neutral-light-0: #f7f7faff;\n    --neutral-light-1: #f0f0f2ff;\n    --neutral-light-2: #dfe0e3ff;\n    --neutral-light-3: #cacbcfff;\n    --neutral-light-4: #bbbdc0ff;\n    --neutral-light-5: #acaeb2ff;\n    --neutral-light-6: #9d9fa3ff;\n    --neutral-light-7: #8e9195ff;\n    --neutral-dark-0: #0c0c0dff;\n    --neutral-dark-1: #151617ff;\n    --neutral-dark-2: #292a2bff;\n    --neutral-dark-3: #37383aff;\n    --neutral-dark-4: #46474aff;\n    --neutral-dark-5: #545659ff;\n    --neutral-dark-6: #626568ff;\n    --neutral-dark-7: #717377ff;\n    --neutral-black-translucent: #0000001f;\n    --neutral-white-translucent: #1111111f;\n    --red--: #b80421ff;\n    --red-light-0: #f2e6e8ff;\n    --red-light-1: #ebcacfff;\n    --red-light-2: #e4aeb6ff;\n    --red-light-3: #dc919dff;\n    --red-light-4: #d57585ff;\n    --red-light-5: #ce596cff;\n    --red-light-6: #c73d53ff;\n    --red-light-7: #bf203aff;\n    --red-dark-0: #0d0103ff;\n    --red-dark-1: #220107ff;\n    --red-dark-2: #38020bff;\n    --red-dark-3: #4d020eff;\n    --red-dark-4: #630312ff;\n    --red-dark-5: #780316ff;\n    --red-dark-6: #8d031aff;\n    --red-dark-7: #a3041dff;\n    --red-translucent: #b804211f;\n    --orange--: #d13704ff;\n    --orange-light-0: #f2e9e6ff;\n    --orange-light-1: #eed3caff;\n    --orange-light-2: #eabdaeff;\n    --orange-light-3: #e6a691ff;\n    --orange-light-4: #e29075ff;\n    --orange-light-5: #dd7a59ff;\n    --orange-light-6: #d9643dff;\n    --orange-light-7: #d54d20ff;\n    --orange-dark-0: #0d0300ff;\n    --orange-dark-1: #260a01ff;\n    --orange-dark-2: #3e1001ff;\n    --orange-dark-3: #571702ff;\n    --orange-dark-4: #6f1d02ff;\n    --orange-dark-5: #882403ff;\n    --orange-dark-6: #a02a03ff;\n    --orange-dark-7: #b93104ff;\n    --orange-translucent: #d137041f;\n    --amber--: #d16004ff;\n    --amber-light-0: #f2ece6ff;\n    --amber-light-1: #eedbcaff;\n    --amber-light-2: #eac9aeff;\n    --amber-light-3: #e6b891ff;\n    --amber-light-4: #e2a675ff;\n    --amber-light-5: #dd9559ff;\n    --amber-light-6: #d9833dff;\n    --amber-light-7: #d57220ff;\n    --amber-dark-0: #0d0c0cff;\n    --amber-dark-1: #26170bff;\n    --amber-dark-2: #3e210aff;\n    --amber-dark-3: #572c09ff;\n    --amber-dark-4: #6f3608ff;\n    --amber-dark-5: #884107ff;\n    --amber-dark-6: #a04b06ff;\n    --amber-dark-7: #b95605ff;\n    --amber-translucent: #d160041f;\n    --yellow--: #d17f04ff;\n    --yellow-light-0: #f2eadfff;\n    --yellow-light-1: #eeddc4ff;\n    --yellow-light-2: #eacfa8ff;\n    --yellow-light-3: #e6c28dff;\n    --yellow-light-4: #e2b572ff;\n    --yellow-light-5: #dda756ff;\n    --yellow-light-6: #d99a3bff;\n    --yellow-light-7: #d58c1fff;\n    --yellow-dark-0: #0d0c0cff;\n    --yellow-dark-1: #261a0bff;\n    --yellow-dark-2: #3e290aff;\n    --yellow-dark-3: #573709ff;\n    --yellow-dark-4: #6f4608ff;\n    --yellow-dark-5: #885407ff;\n    --yellow-dark-6: #a06206ff;\n    --yellow-dark-7: #b97105ff;\n    --yellow-translucent: #d17f041f;\n    --lime--: #cad104ff;\n    --lime-light-0: #f2f2dfff;\n    --lime-light-1: #edeec4ff;\n    --lime-light-2: #e8eaa8ff;\n    --lime-light-3: #e3e68dff;\n    --lime-light-4: #dee272ff;\n    --lime-light-5: #d9dd56ff;\n    --lime-light-6: #d4d93bff;\n    --lime-light-7: #cfd51fff;\n    --lime-dark-0: #0d0d0cff;\n    --lime-dark-1: #25260bff;\n    --lime-dark-2: #3c3e0aff;\n    --lime-dark-3: #545709ff;\n    --lime-dark-4: #6c6f08ff;\n    --lime-dark-5: #838807ff;\n    --lime-dark-6: #9ba006ff;\n    --lime-dark-7: #b2b905ff;\n    --lime-translucent: #cad1041f;\n    --green--: #2dba73ff;\n    --green-light-0: #e6f2ecff;\n    --green-light-1: #cfebddff;\n    --green-light-2: #b8e4ceff;\n    --green-light-3: #a1ddbfff;\n    --green-light-4: #8ad6b0ff;\n    --green-light-5: #72cfa0ff;\n    --green-light-6: #5bc891ff;\n    --green-light-7: #44c182ff;\n    --green-dark-0: #030d08ff;\n    --green-dark-1: #082315ff;\n    --green-dark-2: #0e3823ff;\n    --green-dark-3: #134e30ff;\n    --green-dark-4: #18643eff;\n    --green-dark-5: #1d794bff;\n    --green-dark-6: #238f58ff;\n    --green-dark-7: #28a466ff;\n    --green-translucent: #2dba731f;\n    --teal--: #04b8b8ff;\n    --teal-light-0: #f2fffeff;\n    --teal-light-1: #d4f6f5ff;\n    --teal-light-2: #b7ededff;\n    --teal-light-3: #99e4e4ff;\n    --teal-light-4: #7bdcdbff;\n    --teal-light-5: #5dd3d2ff;\n    --teal-light-6: #40cacaff;\n    --teal-light-7: #22c1c1ff;\n    --teal-dark-0: #0c0d0dff;\n    --teal-dark-1: #0b2624ff;\n    --teal-dark-2: #0a3e3cff;\n    --teal-dark-3: #095753ff;\n    --teal-dark-4: #086f6aff;\n    --teal-dark-5: #078881ff;\n    --teal-dark-6: #06a099ff;\n    --teal-dark-7: #05b9b0ff;\n    --teal-translucent: #04b8b81f;\n    --blue--: #0576ffff;\n    --blue-light-0: #ebf5ffff;\n    --blue-light-1: #cee5ffff;\n    --blue-light-2: #b2d5ffff;\n    --blue-light-3: #95c5ffff;\n    --blue-light-4: #78b6ffff;\n    --blue-light-5: #5ba6ffff;\n    --blue-light-6: #3f96ffff;\n    --blue-light-7: #2286ffff;\n    --blue-dark-0: #0c0c0dff;\n    --blue-dark-1: #0b192bff;\n    --blue-dark-2: #0a274aff;\n    --blue-dark-3: #093468ff;\n    --blue-dark-4: #094186ff;\n    --blue-dark-5: #084ea4ff;\n    --blue-dark-6: #075cc3ff;\n    --blue-dark-7: #0669e1ff;\n    --blue-translucent: #0576ff1f;\n    --indigo--: #5405ffff;\n    --indigo-light-0: #f6f2ffff;\n    --indigo-light-1: #e2d4ffff;\n    --indigo-light-2: #ceb7ffff;\n    --indigo-light-3: #b999ffff;\n    --indigo-light-4: #a57cffff;\n    --indigo-light-5: #915effff;\n    --indigo-light-6: #7d40ffff;\n    --indigo-light-7: #6823ffff;\n    --indigo-dark-0: #0d0c0cff;\n    --indigo-dark-1: #160b2aff;\n    --indigo-dark-2: #1f0a49ff;\n    --indigo-dark-3: #280967ff;\n    --indigo-dark-4: #310986ff;\n    --indigo-dark-5: #3908a4ff;\n    --indigo-dark-6: #4207c2ff;\n    --indigo-dark-7: #4b06e1ff;\n    --indigo-translucent: #5405ff1f;\n    --purple--: #8a05ffff;\n    --purple-light-0: #f9f2ffff;\n    --purple-light-1: #ebd4ffff;\n    --purple-light-2: #ddb7ffff;\n    --purple-light-3: #cf99ffff;\n    --purple-light-4: #c27cffff;\n    --purple-light-5: #b45effff;\n    --purple-light-6: #a640ffff;\n    --purple-light-7: #9823ffff;\n    --purple-dark-0: #0c0c0dff;\n    --purple-dark-1: #1c0b2bff;\n    --purple-dark-2: #2c0a4aff;\n    --purple-dark-3: #3b0968ff;\n    --purple-dark-4: #4b0986ff;\n    --purple-dark-5: #5b08a4ff;\n    --purple-dark-6: #6b07c3ff;\n    --purple-dark-7: #7a06e1ff;\n    --purple-translucent: #8a05ff1f;\n    --pink--: #ff05a8ff;\n    --pink-light-0: #f9f2ffff;\n    --pink-light-1: #fad4f4ff;\n    --pink-light-2: #fbb7e9ff;\n    --pink-light-3: #fb99deff;\n    --pink-light-4: #fc7cd4ff;\n    --pink-light-5: #fd5ec9ff;\n    --pink-light-6: #fe40beff;\n    --pink-light-7: #fe23b3ff;\n    --pink-dark-0: #0c0c0dff;\n    --pink-dark-1: #2a0b20ff;\n    --pink-dark-2: #490a34ff;\n    --pink-dark-3: #670947ff;\n    --pink-dark-4: #86095bff;\n    --pink-dark-5: #a4086eff;\n    --pink-dark-6: #c20781ff;\n    --pink-dark-7: #e10695ff;\n    --pink-translucent: #ff05a81f;\n    --brown--: #ab642eff;\n    --brown-light-0: #f2dfdfff;\n    --brown-light-1: #e9d0c9ff;\n    --brown-light-2: #e0c0b3ff;\n    --brown-light-3: #d7b19dff;\n    --brown-light-4: #cfa287ff;\n    --brown-light-5: #c69270ff;\n    --brown-light-6: #bd835aff;\n    --brown-light-7: #b47344ff;\n    --brown-dark-0: #0d0c0cff;\n    --brown-dark-1: #211710ff;\n    --brown-dark-2: #352215ff;\n    --brown-dark-3: #482d19ff;\n    --brown-dark-4: #5c381dff;\n    --brown-dark-5: #704321ff;\n    --brown-dark-6: #844e26ff;\n    --brown-dark-7: #97592aff;\n    --brown-translucent: #ab642e1f;\n}\n\n/* Numerics */\n:root {\n    --border-none: 0px;\n    --border-x-thin: 1px;\n    --border-thin: 2px;\n    --border-medium: 4px;\n    --border-thick: 8px;\n    --border-x-thick: 10px;\n    --spacing-none: 0px;\n    --spacing-4x-small: 1px;\n    --spacing-2x-small: 2px;\n    --spacing-x-small: 4px;\n    --spacing-small: 6px;\n    --spacing-medium: 8px;\n    --spacing-large: 12px;\n    --spacing-x-large: 16px;\n    --spacing-2x-large: 24px;\n    --spacing-4x-large: 32px;\n    --font-size-display-1: 6em;\n    --font-size-display-2: 5.5em;\n    --font-size-display-3: 4.5em;\n    --font-size-display-4: 3.5em;\n    --font-size-h1: 2em;\n    --font-size-h2: 1.5em;\n    --font-size-h3: 1.17em;\n    --font-size-h4: 1em;\n    --font-size-h5: 0.83em;\n    --font-size-paragraph: 1em;\n    --font-size-small: 0.8em;\n    --font-size-label: 0.83em;\n    --font-size-button: 1em;\n    --font-size-quote: 1.17em;\n    --radii-none: 0px;\n    --radii-x-small: 0.125em;\n    --radii-small: 0.25em;\n    --radii-medium: 0.375em;\n    --radii-large: 0.5px;\n    --radii-x-large: 1em;\n    --radii-full: 9999px;\n    --sizing-2x-small: 16px;\n    --sizing-x-small: 19px;\n    --sizing-small: 32px;\n    --sizing-medium: 40px;\n    --sizing-large: 56px;\n}\n\n/* Components */\n\n:root {\n    /* appbar */\n    --component-appbar-collapsed-width: 48px;\n    --component-appbar-padding: var(--spacing-medium);\n    --component-appbar-width: 240px;\n    --component-appbar-z-index: 100;\n\n    /* avatar */\n    --component-avatar-border-radius-circle: var(--radii-full);\n    --component-avatar-border-radius-square: var(--radii-small);\n    --component-avatar-size-large: var(--sizing-large);\n    --component-avatar-size-medium: var(--sizing-medium);\n    --component-avatar-size-small: var(--sizing-small);\n\n    /* badge */\n    --component-badge-border-radius-circle: var(--radii-full);\n    --component-badge-border-radius-square: var(--radii-small);\n    --component-badge-padding-large: var(--spacing-small);\n    --component-badge-padding-medium: var(--spacing-x-small);\n    --component-badge-padding-small: var(--spacing-2x-small);\n    --component-badge-size-large: var(--sizing-medium);\n    --component-badge-size-medium: var(--sizing-small);\n    --component-badge-size-small: var(--sizing-2x-small);\n\n    /* button */\n    --component-button-border-radius-inner: var(--radii-x-small);\n    --component-button-border-radius-outer: var(--radii-small);\n    --component-button-border-width: var(--border-thin);\n    --component-button-border-width-2: var(--border-x-thin);\n    --component-button-padding-large: var(--spacing-x-large);\n    --component-button-padding-medium: var(--spacing-medium);\n    --component-button-padding-small: var(--spacing-x-small);\n\n    /* card */\n    --component-card-border-radius-inner: var(--radii-small);\n    --component-card-border-radius-outer: var(--radii-medium);\n    --component-card-border-width: var(--border-x-thin);\n    --component-card-inner-border-width: var(--border-x-thin);\n    --component-card-padding-inner: var(--spacing-medium);\n    --component-card-padding-outer: var(--spacing-x-large);\n\n    /* checkbox */\n    --component-checkbox-icon-size: var(--sizing-2x-small);\n    --component-checkbox-size: var(--sizing-x-small);\n\n    /* dialog */\n    --component-dialog-border-radius-inner: var(--radii-x-small);\n    --component-dialog-border-radius-outer: var(--radii-small);\n    --component-dialog-border-width: var(--border-x-thin);\n    --component-dialog-inner-border-width: var(--border-x-thin);\n    --component-dialog-padding: var(--spacing-medium);\n    --component-dialog-z-index: 1000;\n\n    /* drawer */\n    --component-drawer-border-radius: var(--radii-small);\n    --component-drawer-border-width: var(--border-x-thin);\n    --component-drawer-handle-padding: var(--spacing-x-small);\n    --component-drawer-handle-width: var(--spacing-x-small);\n    --component-drawer-padding: var(--spacing-medium);\n    --component-drawer-z-index: 5000;\n\n    /* icon */\n    --component-icon-size-large: var(--spacing-4x-large);\n    --component-icon-size-medium: var(--spacing-2x-large);\n    --component-icon-size-small: var(--spacing-x-large);\n\n    /* inputs */\n    --component-inputs-border-radius-inner: var(--radii-x-small);\n    --component-inputs-border-radius-outer: var(--radii-small);\n    --component-inputs-border-width: var(--border-thin);\n    --component-inputs-padding-large: var(--spacing-x-large);\n    --component-inputs-padding-medium: var(--spacing-medium);\n    --component-inputs-padding-small: var(--spacing-x-small);\n\n    /* menu */\n    --component-menu-border-radius: var(--radii-x-small);\n    --component-menu-border-width: var(--border-x-thin);\n    --component-menu-padding-horizontal: var(--spacing-small);\n    --component-menu-padding-vertical: var(--spacing-x-small);\n    --component-menu-z-index: 1001;\n\n    /* panelbar */\n    --component-panelbar-border-radius: var(--radii-x-small);\n    --component-panelbar-border-width: var(--border-x-thin);\n    --component-panelbar-indent: var(--spacing-x-large);\n    --component-panelbar-padding: var(--spacing-medium);\n\n    /* progress */\n    --component-progress-border-radius-inner: var(--radii-small);\n    --component-progress-border-radius-outer: calc(var(--radii-small) + 4px);\n    --component-progress-border-width: var(--border-x-thin);\n    --component-progress-padding: var(--spacing-x-small);\n    --component-progress-size-large: var(--sizing-large);\n    --component-progress-size-medium: var(--sizing-medium);\n    --component-progress-size-small: var(--sizing-small);\n\n    /* radio */\n    --component-radio-dot-offset: var(--spacing-2x-small);\n    --component-radio-dot-size: var(--spacing-medium);\n    --component-radio-size: var(--sizing-2x-small);\n\n    /* select */\n    --component-select-z-index: 6000;\n\n    /* sidebar */\n    --component-sidebar-border-radius: var(--radii-small);\n    --component-sidebar-border-width: var(--border-x-thin);\n\n    /* slider */\n    --component-slider-border-radius-inner: var(--radii-small);\n    --component-slider-border-radius-outer: calc(var(--radii-small) + 4px);\n    --component-slider-border-width: var(--border-x-thin);\n    --component-slider-padding: var(--spacing-x-small);\n    --component-slider-thumb-border-radius: var(--radii-x-small);\n\n    /* switch */\n    --component-switch-border-radius: var(--radii-full);\n    --component-switch-border-width: var(--border-x-thin);\n    --component-switch-padding: var(--spacing-2x-small);\n\n    /* tab */\n    --component-tab-border-radius-inner: var(--radii-x-small);\n    --component-tab-border-radius-outer: var(--radii-small);\n    --component-tab-border-width: var(--border-x-thin);\n    --component-tab-content-padding: var(--spacing-large);\n    --component-tab-gap-large: var(--spacing-large);\n    --component-tab-gap-medium: var(--spacing-small);\n    --component-tab-gap-small: var(--spacing-2x-small);\n    --component-tab-padding-large: var(--spacing-2x-large);\n    --component-tab-padding-medium: var(--spacing-large);\n    --component-tab-padding-small: var(--spacing-small);\n\n    /* table */\n    --component-table-border-radius: var(--radii-small);\n    --component-table-border-width: var(--border-x-thin);\n    --component-table-border-width-header: var(--border-thin);\n    --component-table-padding-large: var(--spacing-large);\n    --component-table-padding-medium: var(--spacing-medium);\n    --component-table-padding-small: var(--spacing-small);\n\n    /* tag */\n    --component-tag-border-radius-circle: var(--radii-full);\n    --component-tag-border-radius-square: var(--radii-small);\n    --component-tag-padding-large: var(--spacing-small);\n    --component-tag-padding-medium: var(--spacing-x-small);\n    --component-tag-padding-small: var(--spacing-2x-small);\n    --component-tag-size-large: var(--sizing-large);\n    --component-tag-size-medium: var(--sizing-medium);\n    --component-tag-size-small: var(--sizing-small);\n\n    /* toast */\n    --component-toast-border-radius: var(--radii-small);\n    --component-toast-offset: var(--spacing-x-large);\n    --component-toast-padding: var(--spacing-medium);\n    --component-toast-padding-h: var(--spacing-x-large);\n    --component-toast-z-index: 9000;\n\n    /* tooltip */\n    --component-tooltip-border-radius: var(--radii-small);\n    --component-tooltip-padding: var(--spacing-x-small);\n    --component-tooltip-padding-h: var(--spacing-medium);\n    --component-tooltip-z-index: 7000;\n}\n\n/* Default Theme (Blue Light) */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-light-1);\n    --primary-background-component: var(--blue-light-0);\n    --primary-background-hover: var(--blue-light-2);\n    --primary-background-active: var(--blue-light-3);\n    --primary-background-border: var(--blue-light-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-dark-7);\n    --primary-content-active: var(--blue-dark-6);\n    --secondary-background-app: var(--teal-light-1);\n    --secondary-background-component: var(--teal-light-0);\n    --secondary-background-hover: var(--teal-light-2);\n    --secondary-background-border: var(--teal-light-3);\n    --secondary-background-active: var(--teal-light-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-dark-7);\n    --secondary-content-active: var(--teal-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n';class a extends HTMLElement{static get observedAttributes(){return["left-icon","right-icon","color","size","style-type","type","disabled","name","value","autofocus","form","formaction","formenctype","formmethod","formnovalidate","formtarget","aria-label","aria-pressed","aria-hidden"]}constructor(){super(),this.attachShadow({mode:"open"}),this.init()}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.init()}attributeChangedCallback(e,t,n){t!==n&&a.observedAttributes.includes(e)&&(null===n?this.button.removeAttribute(e):this.button.setAttribute(e,n)),this.init(),["color","size","style-type","disabled"].includes(e)&&this.updateStyles()}get value(){return this.hasAttribute("multiple")?Array.from(this.selectedValues).join(","):this.selectedValues.size?Array.from(this.selectedValues)[0]:""}set value(e){this.hasAttribute("multiple")?"string"==typeof e?this.selectedValues=new Set(e.split(",").map(e=>e.trim())):Array.isArray(e)&&(this.selectedValues=new Set(e)):this.selectedValues="string"==typeof e?new Set([e.trim()]):new Set,this.setAttribute("value",e)}setOptions(e){this.setAttribute("options",JSON.stringify(e))}handleClick(){const e={},t=this.getAttribute("data-event");!this.hasAttribute("disabled")&&t&&(Array.from(this.attributes).filter(e=>e.name.startsWith("data-detail-")).forEach(t=>{const n=t.name.replace("data-detail-","");e[n]=t.value}),this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0})))}init(){this.applyStyles(),this.render(),this.proxyNativeOnClick(),this.addEventListeners()}proxyNativeOnClick(){try{Object.defineProperty(this,"onclick",{get:()=>this.button.onclick,set:e=>{this.button.onclick=e},configurable:!0,enumerable:!0})}catch(e){console.warn("Could not redefine onclick:",e)}}updateButtonAttributes(){a.observedAttributes.forEach(e=>{this.hasAttribute(e)?this.button.setAttribute(e,this.getAttribute(e)):this.button.removeAttribute(e)})}manageSlotVisibility(e,t){const n=e?this.shadowRoot.querySelector(`slot[name="${e}"]`):this.shadowRoot.querySelector("slot:not([name])"),r=this.shadowRoot.querySelector(t),o=()=>{const e=n.assignedNodes({flatten:!0}).some(e=>!(e.nodeType===Node.TEXT_NODE&&""===e.textContent.trim()));r.style.display=e?"inline-flex":"none"};o(),n.addEventListener("slotchange",o)}render(){this.button||(this.button=document.createElement("button"),this.button.classList.add("button"),this.button.setAttribute("role","button"),this.button.setAttribute("tabindex","0"),this.button.setAttribute("part","button"),this.shadowRoot.appendChild(this.button)),this.updateButtonAttributes(),this.hasAttribute("disabled")?(this.button.setAttribute("disabled",""),this.button.setAttribute("aria-disabled","true")):(this.button.removeAttribute("disabled"),this.button.setAttribute("aria-disabled","false")),this.button.innerHTML='\n          <span class="icon left-icon" part="left-icon"><slot name="left-icon"></slot></span>\n          <span class="label" part="label"><slot></slot></span>\n          <span class="icon right-icon" part="right-icon"><slot name="right-icon"></slot></span>\n      ',this.manageSlotVisibility("left-icon",".left-icon"),this.manageSlotVisibility("right-icon",".right-icon"),this.manageSlotVisibility("",".label")}applyStyles(){const e=document.createElement("style");e.textContent='\n        :host {\n          display: inline-block;\n        }\n\n        @font-face {\n            font-family: "Lexend";\n            font-display: swap;\n        }\n\n        .button {\n            box-sizing: border-box;\n            display: inline-flex;\n            min-height: var(--button-min-height, var(--sizing-medium, 40px));\n            min-width: var(--button-min-width, var(--sizing-medium, 40px));\n            padding: var(--button-padding, var(--component-button-padding-medium));\n            gap: var(--button-gap, var(--component-button-padding-medium));\n            justify-content: center;\n            align-items: center;\n            position: relative;\n            overflow: hidden;\n            border-radius: var(--component-button-border-radius-outer, 4px);\n            border: var(--component-button-border-width, 1px) solid var(--border-color, var(--base-content--, #f7f7fa));\n            background: var(--background-color, #0c0c0d);\n            transition: background-color 0.1s, color 0.1s, border-color 0.1s;\n            cursor: pointer;\n            color: var(--text-color);\n            font-family: var(--font-family-body, Lexend, sans-serif);\n            font-size: var(--font-size-button, 1em);\n            line-height: 1;\n        }\n\n        .button:disabled {\n            opacity: 0.5;\n            cursor: not-allowed;\n        }\n\n        .button:hover:not(:disabled),\n        .button:hover:not(:disabled) .button-content {\n            background: var(--hover-background-color);\n            color: var(--hover-text-color);\n            border-color: var(--hover-border-color);\n        }\n        .button:focus:not(:disabled),\n        .button:focus:not(:disabled) .button-content {\n            background: var(--focus-background-color);\n            color: var(--focus-text-color);\n            border-color: var(--focus-border-color);\n        }\n        .button:active:not(:disabled),\n        .button:active:not(:disabled) .button-content {\n            background: var(--active-background-color);\n            color: var(--active-text-color);\n            border-color: var(--active-border-color);\n        }\n        .icon {\n            display: flex;\n            min-width: 16px;\n            min-height: 1em;\n            justify-content: center;\n            align-items: center;\n        }\n        .label {\n            line-height: inherit;\n            min-height: 1em;\n            align-items: center;\n        }\n      ',this.shadowRoot.appendChild(e)}addEventListeners(){this.button.addEventListener("focus",()=>{this.dispatchEvent(new CustomEvent("focus",{bubbles:!0,composed:!0}))}),this.button.addEventListener("blur",()=>{this.dispatchEvent(new CustomEvent("blur",{bubbles:!0,composed:!0}))}),this.button.addEventListener("keydown",e=>{this.dispatchEvent(new CustomEvent("keydown",{detail:{key:e.key,code:e.code},bubbles:!0,composed:!0}))}),this.button.addEventListener("keyup",e=>{this.dispatchEvent(new CustomEvent("keyup",{detail:{key:e.key,code:e.code},bubbles:!0,composed:!0}))}),this.button.addEventListener("click",e=>{if(this.handleClick(),"submit"===this.getAttribute("type")){const t=this.closest("form");t&&(e.preventDefault(),t.requestSubmit())}})}updateStyles(){const e=this.getAttribute("color")||"base",t=this.getAttribute("size")||"medium",n=this.getAttribute("style-type")||"outlined",r={primary:["--primary-content--","--primary-content-hover","--primary-content-active","--primary-background-component","--primary-background-hover","--primary-background-active","--primary-content-inverse"],secondary:["--secondary-content--","--secondary-content-hover","--secondary-content-active","--secondary-background-component","--secondary-background-hover","--secondary-background-active","--secondary-content-inverse"],base:["--base-content--","--base-content-lighter","--base-content-lightest","--base-background-component","--base-background-hover","--base-background-active","--base-content-inverse"],success:["--success-content--","--success-content-hover","--success-content-active","--success-background-component","--success-background-hover","--success-background-active","--success-content-inverse"],error:["--error-content--","--error-content-hover","--error-content-active","--error-background-component","--error-background-hover","--error-background-active","--error-content-inverse"],warning:["--warning-content--","--warning-content-hover","--warning-content-active","--warning-background-component","--warning-background-hover","--warning-background-active","--warning-content-inverse"],help:["--help-content--","--help-content-hover","--help-content-active","--help-background-component","--help-background-hover","--help-background-active","--help-content-inverse"]},o={small:["--component-button-padding-small","--component-button-padding-small"],medium:["--component-button-padding-medium","--component-button-padding-medium"],large:["--component-button-padding-large","--component-button-padding-large"]},a={outlined:{"--background-color":`var(${r[e][3]}, #0c0c0d)`,"--border-color":`var(${r[e][0]}, #f7f7fa)`,"--text-color":`var(${r[e][0]}, #f7f7fa)`},filled:{"--background-color":`var(${r[e][0]}, #f7f7fa)`,"--border-color":`var(${r[e][0]}, #f7f7fa)`,"--text-color":`var(${r[e][6]}, #0c0c0d)`},flat:{"--background-color":`var(${r[e][3]},#0c0c0d)`,"--border-color":`var(${r[e][3]},#0c0c0d)`,"--text-color":`var(${r[e][0]},#f7f7fa)`}},i=a[n]||a.outlined;if(Object.entries(i).forEach(([e,t])=>{this.button.style.setProperty(e,t)}),"filled"===n)this.button.style.setProperty("--hover-background-color",`var(${r[e][1]}, #292a2b)`),this.button.style.setProperty("--hover-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--hover-border-color",`var(${r[e][1]}, #292a2b)`),this.button.style.setProperty("--focus-background-color",`var(${r[e][2]}, #46474a)`),this.button.style.setProperty("--focus-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--focus-border-color",`var(${r[e][2]}, #46474a)`),this.button.style.setProperty("--active-background-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--active-border-color",`var(${r[e][0]}, #f7f7fa)`);else{const t=`var(${r[e][0]}, #f7f7fa)`;this.button.style.setProperty("--hover-background-color",`var(${r[e][4]}, #292a2b)`),this.button.style.setProperty("--hover-text-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--focus-background-color",`var(${r[e][5]}, #46474a)`),this.button.style.setProperty("--focus-text-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-background-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-text-color",`var(${r[e][6]}, #0c0c0d)`),"outlined"===n?(this.button.style.setProperty("--hover-border-color",t),this.button.style.setProperty("--focus-border-color",t),this.button.style.setProperty("--active-border-color",t)):(this.button.style.setProperty("--hover-border-color",`var(${r[e][4]}, #292a2b)`),this.button.style.setProperty("--focus-border-color",`var(${r[e][5]}, #46474a)`),this.button.style.setProperty("--active-border-color",`var(${r[e][0]}, #f7f7fa)`))}const[s,c]=o[t]||o.medium;this.button.style.setProperty("--button-padding",`var(${c}, var(--component-button-padding-medium))`),this.button.style.setProperty("--button-gap",`var(${s}, var(--component-button-padding-medium))`);const l={small:"var(--sizing-small, 32px)",medium:"var(--sizing-medium, 40px)",large:"var(--sizing-large, 56px)"};this.button.style.setProperty("--button-min-height",l[t]||"40px"),this.button.style.setProperty("--button-min-width",l[t]||"40px")}}customElements.get("y-button")||customElements.define("y-button",a);class i extends HTMLElement{static get observedAttributes(){return["items","anchor","visible","direction","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onAnchorClick=this._onAnchorClick.bind(this),this._onDocumentClick=this._onDocumentClick.bind(this),this._onScrollOrResize=this._onScrollOrResize.bind(this)}connectedCallback(){this.hasAttribute("items")||(this.items=[]),this._setupAnchor(),this.render(),document.addEventListener("click",this._onDocumentClick),window.addEventListener("scroll",this._onScrollOrResize,!0),window.addEventListener("resize",this._onScrollOrResize),this.style.position="fixed",this.style.zIndex="1000",this.style.display="none"}disconnectedCallback(){this._teardownAnchor(),document.removeEventListener("click",this._onDocumentClick),window.removeEventListener("scroll",this._onScrollOrResize,!0),window.removeEventListener("resize",this._onScrollOrResize)}attributeChangedCallback(e,t,n){t!==n&&("items"!==e&&"size"!==e||this.render(),"anchor"===e&&(this._teardownAnchor(),this._setupAnchor()),"visible"===e&&this._updatePosition(),"direction"===e&&this._updatePosition())}get items(){try{return JSON.parse(this.getAttribute("items"))||[]}catch{return[]}}set items(e){this.setAttribute("items",JSON.stringify(e))}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get direction(){return this.getAttribute("direction")||"down"}set direction(e){this.setAttribute("direction",e)}get size(){const e=this.getAttribute("size");return["small","medium","large"].includes(e)?e:"medium"}set size(e){["small","medium","large"].includes(e)?this.setAttribute("size",e):this.setAttribute("size","medium")}_createMenuList(e){const t=document.createElement("ul");return e.forEach(e=>{const n=document.createElement("li");n.className="menuitem",n.setAttribute("role","menuitem"),n.setAttribute("part","menuitem"),n.tabIndex=0;const r=document.createElement("span");if(r.className="item-content",e["icon-template"]){const t=this._findTemplate(e["icon-template"]);t&&r.appendChild(t.content.cloneNode(!0))}if(e.template){const t=this._findTemplate(e.template);t?r.appendChild(t.content.cloneNode(!0)):r.textContent=e.text}else r.textContent=e.text;if(n.appendChild(r),e.url&&n.addEventListener("click",()=>{window.location.href=e.url}),e.children?.length){const t=document.createElement("span");t.className="submenu-indicator",t.textContent="▶",n.appendChild(t);const r=this._createMenuList(e.children);r.classList.add("submenu"),r.setAttribute("role","menu"),n.appendChild(r)}t.appendChild(n)}),t}_findTemplate(e){return this.querySelector(`template[slot="${e}"]`)}_onAnchorClick(e){e.stopPropagation(),this.visible=!this.visible}_onDocumentClick(e){const t=e.composedPath();this._anchorEl&&t.includes(this._anchorEl)||t.includes(this)||(this.visible=!1)}_onScrollOrResize(){this.visible&&this._updatePosition()}_setupAnchor(){const e=this.anchor;if(e){const t=this.getRootNode(),n=t?.getElementById?t.getElementById(e):document.getElementById(e);n&&(this._anchorEl=n,this._anchorEl.addEventListener("click",this._onAnchorClick))}}_teardownAnchor(){this._anchorEl&&(this._anchorEl.removeEventListener("click",this._onAnchorClick),this._anchorEl=null)}_updatePosition(){if(!this.visible||!this._anchorEl)return void(this.style.display="none");const e=this._anchorEl.getBoundingClientRect(),t=this.getBoundingClientRect(),n=window.innerWidth,r=window.innerHeight;let o,a;"right"===this.direction?(o=e.top,a=e.right,a+t.width>n&&(a=e.left-t.width),o+t.height>r&&(o=e.top-t.height)):"up"===this.direction?(o=e.top-t.height,a=e.left,o<0&&(o=e.bottom),a+t.width>n&&(a=n-t.width-10)):"left"===this.direction?(o=e.top,a=e.left-t.width,a<0&&(a=e.right),o+t.height>r&&(o=e.top-t.height)):(o=e.bottom,a=e.left,o+t.height>r&&(o=e.top-t.height),a+t.width>n&&(a=n-t.width-10)),o=Math.max(0,Math.min(o,r-t.height)),a=Math.max(0,Math.min(a,n-t.width)),this.style.top=`${o}px`,this.style.left=`${a}px`,this.style.display="block"}render(){this.shadowRoot.innerHTML="";const e=`var(--component-button-padding-${this.size}, 0.5rem)`,t=document.createElement("style");t.textContent=`\n            ul.menu,\n            ul.submenu {\n                list-style: none;\n                margin: 0;\n                padding: 0;\n                background: var(--component-menu-background, #0c0c0d);\n                border: var(--component-menu-border-width, 1px) solid var(--component-menu-border-color, #37383a);\n                border-radius: var(--component-menu-border-radius, 4px);\n                box-shadow: var(--component-menu-shadow, 0 2px 8px rgba(0, 0, 0, 0.15));\n                min-width: 150px;\n                max-height: 300px;\n                overflow-y: auto;\n            }\n\n            li.menuitem {\n                cursor: pointer;\n                padding: ${e};\n                display: flex;\n                align-items: center;\n                justify-content: space-between;\n                white-space: nowrap;\n                color: var(--component-menu-color, #f7f7fa);\n                font-size: var(--font-size-button, 1em);\n            }\n\n            li.menuitem:hover {\n                background: var(--component-menu-hover-background, #292a2b);\n            }\n\n            ul.submenu {\n                position: absolute;\n                top: 0;\n                left: 100%;\n                display: none;\n                z-index: var(--component-menu-z-index, 1001);\n            }\n\n            li.menuitem:hover > ul.submenu {\n                display: block;\n            }\n\n            .submenu-indicator {\n                font-size: 0.75em;\n                margin-left: 0.5rem;\n                opacity: 0.6;\n            }\n\n            .item-content {\n                flex: 1;\n            }\n        `,this.shadowRoot.appendChild(t);const n=this._createMenuList(this.items);n.classList.add("menu"),n.setAttribute("role","menu"),n.setAttribute("part","menu"),this.shadowRoot.appendChild(n)}}customElements.get("y-menu")||customElements.define("y-menu",i);const s='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" aria-hidden="true"><path d="M5 7 L10 12 L15 7" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" /></svg>';class c extends HTMLElement{static get observedAttributes(){return["orientation","collapsed","items","size","menu-direction","sticky"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onCollapseClick=this._onCollapseClick.bind(this),this._idCounter=0}connectedCallback(){this.render()}disconnectedCallback(){}attributeChangedCallback(e,t,n){t!==n&&this.render()}get orientation(){return this.getAttribute("orientation")||"vertical"}set orientation(e){this.setAttribute("orientation",e)}get collapsed(){return this.hasAttribute("collapsed")}set collapsed(e){e?this.setAttribute("collapsed",""):this.removeAttribute("collapsed")}get items(){try{return JSON.parse(this.getAttribute("items"))||[]}catch{return[]}}set items(e){this.setAttribute("items",JSON.stringify(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get menuDirection(){return this.getAttribute("menu-direction")||""}set menuDirection(e){e?this.setAttribute("menu-direction",e):this.removeAttribute("menu-direction")}get sticky(){const e=this.getAttribute("sticky");return!!["start","end"].includes(e)&&e}set sticky(e){"start"===e||"end"===e?this.setAttribute("sticky",e):this.removeAttribute("sticky")}toggle(){this.collapsed=!this.collapsed}_onCollapseClick(){this.toggle()}_uid(e){return`${e}-${this._idCounter++}`}_isItemActive(e){if(e.selected)return!0;if(e.href){const t=window.location,n=t.pathname+t.search+t.hash;return e.href===n||e.href===t.href}return!1}render(){const e="vertical"===this.orientation,t=this.collapsed&&e,n=this.size,r=this.menuDirection||(e?"right":"down"),o={small:{padding:"var(--spacing-x-small, 4px)",collapsedWidth:"40px",bodyGap:"2px",buttonSize:"small"},medium:{padding:"var(--spacing-small, 6px)",collapsedWidth:"52px",bodyGap:"3px",buttonSize:"medium"},large:{padding:"var(--spacing-medium, 8px)",collapsedWidth:"64px",bodyGap:"4px",buttonSize:"large"}},a=o[n]||o.medium;this.shadowRoot.innerHTML="",this._idCounter=0;const i=document.createElement("style");i.textContent='\n            :host {\n                display: block;\n                font-family: var(--font-family-body, sans-serif);\n                color: var(--component-appbar-color, #f7f7fa);\n            }\n\n            :host([sticky]) {\n                position: sticky;\n                z-index: var(--component-appbar-z-index, 100);\n            }\n            :host([orientation="vertical"][sticky="start"]),\n            :host(:not([orientation])[sticky="start"]) {\n                left: 0;\n                top: 0;\n                height: 100%;\n            }\n            :host([orientation="vertical"][sticky="end"]),\n            :host(:not([orientation])[sticky="end"]) {\n                right: 0;\n                top: 0;\n                height: 100%;\n            }\n            :host([orientation="horizontal"][sticky="start"]) {\n                top: 0;\n                left: 0;\n                width: 100%;\n            }\n            :host([orientation="horizontal"][sticky="end"]) {\n                bottom: 0;\n                left: 0;\n                width: 100%;\n            }\n\n            :host([sticky]) .appbar {\n                border-radius: 0;\n                border: none;\n            }\n            :host([orientation="vertical"][sticky="start"]) .appbar,\n            :host(:not([orientation])[sticky="start"]) .appbar {\n                border-right: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="vertical"][sticky="end"]) .appbar,\n            :host(:not([orientation])[sticky="end"]) .appbar {\n                border-left: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="horizontal"][sticky="start"]) .appbar {\n                border-bottom: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="horizontal"][sticky="end"]) .appbar {\n                border-top: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n\n            .appbar {\n                display: flex;\n                background: var(--component-appbar-background, #0c0c0d);\n                border: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                border-radius: var(--component-appbar-border-radius, var(--component-sidebar-border-radius, 4px));\n                overflow: visible;\n                padding: var(--_appbar-padding);\n                box-sizing: border-box;\n            }\n\n            .appbar.vertical {\n                flex-direction: column;\n                width: var(--component-appbar-width, 240px);\n                height: 100%;\n                transition: width 0.2s ease;\n            }\n            .appbar.vertical.collapsed {\n                width: var(--_appbar-collapsed-width);\n            }\n\n            .appbar.horizontal {\n                flex-direction: row;\n                width: 100%;\n                height: auto;\n                align-items: center;\n            }\n\n            .appbar-header,\n            .appbar-body,\n            .appbar-footer {\n                flex-shrink: 0;\n            }\n\n            .appbar-body {\n                flex: 1;\n                overflow-y: auto;\n                overflow-x: hidden;\n                display: flex;\n                gap: var(--_appbar-body-gap);\n            }\n\n            .appbar.vertical .appbar-body {\n                flex-direction: column;\n            }\n            .appbar.horizontal .appbar-body {\n                flex-direction: row;\n                overflow-y: hidden;\n                overflow-x: auto;\n                align-items: center;\n            }\n\n            .appbar.vertical .appbar-header {\n                border-bottom: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-bottom: var(--_appbar-padding);\n                margin-bottom: var(--_appbar-padding);\n            }\n            .appbar.vertical .appbar-footer {\n                border-top: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-top: var(--_appbar-padding);\n                margin-top: var(--_appbar-padding);\n            }\n\n            .appbar.horizontal .appbar-header {\n                border-right: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-right: var(--_appbar-padding);\n                margin-right: var(--_appbar-padding);\n            }\n            .appbar.horizontal .appbar-footer {\n                border-left: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-left: var(--_appbar-padding);\n                margin-left: var(--_appbar-padding);\n            }\n\n            .header-content {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-small, 8px);\n                overflow: hidden;\n            }\n            .appbar.horizontal .header-content,\n            .appbar.vertical .header-content {\n                flex-direction: row;\n            }\n            .logo-wrapper {\n                width: var(--_icon-col-width);\n                display: flex;\n                justify-content: center;\n                align-items: center;\n                flex-shrink: 0;\n            }\n\n            .header-title {\n                font-weight: bold;\n                white-space: nowrap;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                font-size: var(--font-size-label, 0.9em);\n            }\n            .appbar.vertical.collapsed .header-title {\n                display: none;\n            }\n\n            .nav-item {\n                display: flex;\n                align-items: center;\n                position: relative;\n            }\n            .appbar.vertical .nav-item {\n                width: 100%;\n            }\n            .appbar.vertical .nav-item y-button {\n                display: block;\n                width: 100%;\n            }\n            .appbar.vertical .nav-item y-button::part(button),\n            .appbar.vertical .appbar-footer y-button::part(button) {\n                width: 100%;\n                justify-content: flex-start;\n                padding-left: 0;\n                padding-right: 0;\n            }\n\n            /* Fixed-width icon column — matches collapsed inner width so icons stay centred across states */\n            .appbar.vertical .nav-item y-button::part(left-icon),\n            .appbar.vertical .appbar-footer y-button::part(left-icon) {\n                width: var(--_icon-col-width);\n                display: flex;\n                justify-content: center;\n                flex-shrink: 0;\n            }\n\n            .appbar.vertical .nav-item y-button::part(right-icon) {\n                margin-left: auto;\n            }\n\n            .appbar.vertical.collapsed .nav-item y-button::part(button),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(button) {\n                min-width: 0;\n            }\n            .appbar.vertical.collapsed .nav-item y-button::part(label),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(label) {\n                display: none;\n            }\n            .appbar.vertical.collapsed .nav-item y-button::part(right-icon),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(right-icon) {\n                display: none;\n            }\n\n            .appbar-footer {\n                display: flex;\n                flex-direction: column;\n                gap: 2px;\n            }\n            .appbar.horizontal .appbar-footer {\n                flex-direction: row;\n                align-items: center;\n            }\n            .appbar.vertical .appbar-footer y-button {\n                display: block;\n                width: 100%;\n            }\n\n            .appbar.vertical.collapsed .appbar-header,\n            .appbar.vertical.collapsed .appbar-body,\n            .appbar.vertical.collapsed .appbar-footer {\n                align-items: center;\n            }\n\n            ::slotted(*) {\n                display: block;\n            }\n        ',this.shadowRoot.appendChild(i),document.querySelectorAll('link[rel="stylesheet"]').forEach(e=>{this.shadowRoot.appendChild(e.cloneNode(!0))});const s=document.createElement("div");s.className="appbar "+(e?"vertical":"horizontal"),t&&s.classList.add("collapsed"),s.setAttribute("role","navigation"),s.style.setProperty("--_appbar-padding",a.padding),s.style.setProperty("--_appbar-collapsed-width",a.collapsedWidth),s.style.setProperty("--_appbar-body-gap",a.bodyGap),s.style.setProperty("--_icon-col-width",`calc(${a.collapsedWidth} - 2 * var(--_appbar-padding) - 2 * var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)))`);const c=document.createElement("div");c.className="appbar-header",c.setAttribute("part","header");const l=document.createElement("div");l.className="header-content";const d=document.createElement("div");d.className="logo-wrapper";const p=document.createElement("slot");p.name="logo",d.appendChild(p),l.appendChild(d);const h=document.createElement("div");h.className="header-title";const b=document.createElement("slot");b.name="title",h.appendChild(b),l.appendChild(h),c.appendChild(l),s.appendChild(c);const u=document.createElement("div");u.className="appbar-body",u.setAttribute("part","body");this.items.forEach(n=>{const o=n.children?.length>0,i=document.createElement("div");i.className="nav-item";const s=document.createElement("y-button"),c=this._uid("appbar-btn");s.id=c;const l=this._isItemActive(n);if(s.setAttribute("color",l?"primary":"base"),s.setAttribute("style-type","flat"),s.setAttribute("size",a.buttonSize),n.icon){const e=document.createElement("span");e.slot="left-icon",e.innerHTML=n.icon,s.appendChild(e)}if(n.text&&!t){const e=document.createTextNode(n.text);s.appendChild(e)}if(o&&!t){const t=document.createElement("span");t.slot="right-icon",t.innerHTML=e?'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>',s.appendChild(t)}if(n.href&&!o&&s.addEventListener("click",()=>{window.location.href=n.href}),i.appendChild(s),o){const e=document.createElement("y-menu");e.setAttribute("anchor",c),e.setAttribute("direction",r),e.setAttribute("size",a.buttonSize),e.items=n.children,i.appendChild(e)}u.appendChild(i)}),s.appendChild(u);const m=document.createElement("div");m.className="appbar-footer",m.setAttribute("part","footer");const g=document.createElement("slot");if(g.name="footer",m.appendChild(g),e){const e=document.createElement("y-button");e.setAttribute("color","base"),e.setAttribute("style-type","flat"),e.setAttribute("size",a.buttonSize),e.setAttribute("aria-label",t?"Expand sidebar":"Collapse sidebar"),e.className="collapse-btn";const n=document.createElement("span");if(n.slot="left-icon",n.innerHTML=t?'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="13 17 18 12 13 7"/><polyline points="6 17 11 12 6 7"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="11 17 6 12 11 7"/><polyline points="18 17 13 12 18 7"/></svg>',e.appendChild(n),!t){const t=document.createTextNode("Collapse");e.appendChild(t)}e.addEventListener("click",this._onCollapseClick),m.appendChild(e)}s.appendChild(m),this.shadowRoot.appendChild(s)}}customElements.get("y-appbar")||customElements.define("y-appbar",c);class l extends HTMLElement{static get observedAttributes(){return["src","alt","size","shape"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}render(){const e=this.getAttribute("src"),t=this.getAttribute("alt")||"AN",n=`var(--component-avatar-border-radius-${this.getAttribute("shape")||"circle"}, 9999px)`;let r;switch(this.getAttribute("size")||"medium"){case"small":r="var(--component-avatar-size-small, 27px)";break;case"large":r="var(--component-avatar-size-large, 51px)";break;default:r="var(--component-avatar-size-medium, 35px)"}const o=new CSSStyleSheet;let a="";if(a=e?`\n          :host {\n            display: inline-block;\n            height: ${r};\n            min-width: ${r};\n          }\n          img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            border-radius: ${n};\n          }\n        `:`\n          :host {\n            display: inline-block;\n            width: ${r};\n            height: ${r};\n            min-width: ${r};\n            font-family: var(--font-family-header, "Lexend"), sans-serif;\n            text-transform: uppercase;\n          }\n          .avatar {\n            width: 100%;\n            height: 100%;\n            border-radius: ${n};\n            background-color: var(--primary-content--, #0576ff);\n            color: var(--primary-background-component, #0c0c0d);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n          }\n          .avatar h5 {\n            margin: 0;\n            font-size: calc(${r} * 0.5);\n          }\n        `,o.replaceSync(a),this.shadowRoot.adoptedStyleSheets=[o],e)this.shadowRoot.innerHTML=`<img src="${e}" alt="${t}" part="avatar" />`;else{const e=t.trim().split(/\s+/),n=e.length>=2?e[0].charAt(0)+e[1].charAt(0):t.substring(0,2);this.shadowRoot.innerHTML=`<div class="avatar" part="avatar"><h5>${n}</h5></div>`}}}customElements.get("y-avatar")||customElements.define("y-avatar",l);class d extends HTMLElement{static get observedAttributes(){return["value","position","alignment","color","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get alignment(){return this.getAttribute("alignment")||"right"}get color(){return this.getAttribute("color")||"primary"}get position(){return this.getAttribute("position")||"top"}get size(){return this.getAttribute("size")||"small"}get value(){return this.getAttribute("value")||""}getBadgeColors(e){return{primary:["var(--primary-content--)","var(--primary-content-inverse)"],secondary:["var(--secondary-content--)","var(--secondary-content-inverse)"],base:["var(--base-content--)","var(--base-content-inverse)"],success:["var(--success-content--)","var(--success-content-inverse)"],warning:["var(--warning-content--)","var(--warning-content-inverse)"],error:["var(--error-content--)","var(--error-content-inverse)"],help:["var(--help-content--)","var(--help-content-inverse)"]}[e]||[e,"var(--neutral-white, #fff)"]}getBadgePosition(e,t){const n="var(--spacing-small, 6px)";return`${"top"===e?`top: calc(${n} * -1);`:`bottom: calc(${n} * -1);`} ${"right"===t?`right: calc(${n} * -1);`:`left: calc(${n} * -1);`}`}getSizeAttributes(e){const t={small:{fontSize:"var(--font-size-small, 0.8em)",padding:"var(--component-badge-padding-small)",minSize:"var(--component-badge-size-small)"},medium:{fontSize:"var(--font-size-label, 0.83em)",padding:"var(--component-badge-padding-medium)",minSize:"var(--component-badge-size-medium)"},large:{fontSize:"var(--font-size-paragraph, 1em)",padding:"var(--component-badge-padding-large)",minSize:"var(--component-badge-size-large)"}};return t[e]||t.small}hasTargetContent(){return Array.from(this.childNodes).some(e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent.trim())}render(){const[e,t]=this.getBadgeColors(this.color),{fontSize:n,padding:r,minSize:o}=this.getSizeAttributes(this.size),a=this.getBadgePosition(this.position,this.alignment),i=this.hasTargetContent();this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    position: ${i?"relative":"static"};\n                    display: inline-flex;\n                    align-items: center;\n                }\n                .badge {\n                    position: ${i?"absolute":"static"};\n                    ${i?a:""}\n                    background: ${e};\n                    color: ${t};\n                    font-size: ${n};\n                    font-weight: bold;\n                    padding: ${r};\n                    border-radius: var(--component-badge-border-radius-circle, 9999px);\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    font-family: var(--font-family-body, sans-serif);\n                    min-width: ${o};\n                    height: ${o};\n                    z-index: 20;\n                }\n                ::slotted(*) {\n                    position: relative;\n                    display: inline-block;\n                }\n            </style>\n            ${i?"<slot></slot>":""}\n            <div class="badge" part="badge">${this.value}</div>\n        `}}function p(e,t){const n=e.match(/var\(\s*(--[^,)]+)/);if(!n)return e;return getComputedStyle(t).getPropertyValue(n[1]).trim()||e}function h(e){const t=function(e){const t=e.match(/^#([0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i);if(t){let e=t[1];return e.length<=4&&(e=e.split("").map(e=>e+e).join("")),{r:parseInt(e.slice(0,2),16),g:parseInt(e.slice(2,4),16),b:parseInt(e.slice(4,6),16)}}const n=e.match(/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);return n?{r:parseInt(n[1],10),g:parseInt(n[2],10),b:parseInt(n[3],10)}:null}(e);return t&&function({r:e,g:t,b:n}){const[r,o,a]=[e,t,n].map(e=>(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*r+.7152*o+.0722*a}(t)>.179?"var(--neutral-black, #000000)":"var(--neutral-white, #ffffff)"}customElements.get("y-badge")||customElements.define("y-badge",d);class b extends HTMLElement{static get observedAttributes(){return["color","raised"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.updateColorStyles(),this.updateElevationStyles()}attributeChangedCallback(e,t,n){t!==n&&("color"===e&&this.updateColorStyles(),"raised"===e&&this.updateElevationStyles(),this.render())}updateColorStyles(){const e={primary:["--base-content--","--primary-background-component","--primary-background-border","--primary-background-active"],secondary:["--base-content--","--secondary-background-component","--secondary-background-border","--secondary-background-active"],base:["--base-content--","--base-background-component","--base-background-border","--base-background-active"],success:["--base-content--","--success-background-component","--success-background-border","--success-background-active"],error:["--base-content--","--error-background-component","--error-background-border","--error-background-active"],warning:["--base-content--","--warning-background-component","--warning-background-border","--warning-background-active"]},t=e[this.getAttribute("color")||"base"]||e.base;this.style.setProperty("--card-content-color",`var(${t[0]})`),this.style.setProperty("--card-border-color",`var(${t[2]})`),this.style.setProperty("--card-background",`var(${t[1]})`),this.style.setProperty("--card-section-background",`var(${t[2]})`)}updateElevationStyles(){this.hasAttribute("raised")?(this.style.setProperty("--card-border-width","0"),this.style.setProperty("--card-box-shadow","var(--base-shadow)")):(this.style.setProperty("--card-border-width","var(--component-card-border-width)"),this.style.setProperty("--card-box-shadow","none"))}render(){const e=new CSSStyleSheet;e.replaceSync("\n            :host {\n                display: block;\n                box-sizing: border-box;\n                background: var(--card-background, var(--base-background-component));\n                border: var(--card-border-width, var(--component-card-border-width)) solid var(--card-border-color, var(--base-background-border));\n                border-radius: var(--component-card-border-radius-outer);\n                font-family: var(--font-family-body);\n                color: var(--card-content-color, var(--base-content--));\n                box-shadow: var(--card-box-shadow, none);\n            }\n\n            .header {\n                padding: var(--component-card-padding-outer);\n                border-bottom: var(--component-card-inner-border-width) solid var(--card-border-color, var(--base-background-border));\n            }\n\n            .body {\n                padding: var(--component-card-padding-outer);\n            }\n\n            .footer {\n                padding: var(--component-card-padding-inner) var(--component-card-padding-outer);\n                border-top: var(--component-card-inner-border-width) solid var(--card-border-color, var(--base-background-border));\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n        "),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML='\n            <div class="header" part="header">\n                <slot name="header"></slot>\n            </div>\n            <div class="body" part="body">\n                <slot></slot>\n            </div>\n            <div class="footer" part="footer">\n                <slot name="footer"></slot>\n            </div>\n        ',function(e,t={}){Object.entries(t).forEach(([t,n])=>{const r=e.querySelector("slot"+(t?`[name="${t}"]`:":not([name])")),o=e.querySelector(n);if(r&&o){const e=r.assignedNodes({flatten:!0}).filter(e=>!(e.nodeType===Node.TEXT_NODE&&""===e.textContent.trim()));o.style.display=e.length>0?"":"none"}})}(this.shadowRoot,{header:".header",footer:".footer"})}}customElements.get("y-card")||customElements.define("y-card",b);class u extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["checked","disabled","indeterminate","label-position","name","value"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.hasAttribute("label-position")||this.setAttribute("label-position","right"),this._internals.setFormValue(this.checked?this.value:null)}attributeChangedCallback(e){"checked"!==e&&"value"!==e||this._internals.setFormValue(this.checked?this.value:null),"indeterminate"===e&&this.updateIcon(),"label-position"===e&&this.render(),this.updateState()}get checked(){return this.hasAttribute("checked")}set checked(e){e?this.setAttribute("checked",""):this.removeAttribute("checked")}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get indeterminate(){return this.hasAttribute("indeterminate")}set indeterminate(e){e?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate")}get value(){return this.getAttribute("value")||"on"}set value(e){this.setAttribute("value",e)}get name(){return this.getAttribute("name")}toggle(){this.disabled||(this.indeterminate?(this.indeterminate=!1,this.checked=!0):this.checked=!this.checked,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}updateIcon(){const e=this.shadowRoot.querySelector(".icon");e&&(this.indeterminate?e.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="4" y="11" width="16" height="2" rx="1" ry="1" fill="currentColor"/></svg>':this.checked?e.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polyline points="5 13 10 17 19 6" fill="none" stroke="currentColor" stroke-width="2"/></svg>':e.innerHTML="")}updateState(){this.shadowRoot.querySelector(".checkbox").setAttribute("aria-checked",this.indeterminate?"mixed":this.checked?"true":"false"),this.updateIcon()}render(){const e=this.getAttribute("label-position")||"right",t=this.disabled,n=new CSSStyleSheet;n.replaceSync(`\n            :host {\n                display: inline-flex;\n                align-items: center;\n                line-height: 1;\n                vertical-align: middle;\n                font-family: var(--font-family-body);\n                cursor: ${t?"not-allowed":"pointer"};\n                opacity: ${t?"0.6":"1"};\n            }\n\n            .wrapper {\n                display: inline-flex;\n                align-items: center;\n                gap: var(--spacing-x-small, 6px);\n                line-height: 1;\n                flex-direction: ${"top"===e?"column":"bottom"===e?"column-reverse":"left"===e?"row-reverse":"row"};\n            }\n\n            .checkbox {\n                width: var(--component-checkbox-size, 20px);\n                height: var(--component-checkbox-size, 20px);\n                border: var(--component-inputs-border-width, 2px) solid var(--component-checkbox-border-color);\n                border-radius: var(--component-inputs-border-radius-outer, 4px);\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                background: var(--component-checkbox-background);\n                box-sizing: border-box;\n                transition: border-color 0.2s ease;\n                line-height: 0;\n            }\n\n            :host([disabled]) .checkbox {\n                border-color: var(--component-checkbox-border-color);\n                background: var(--component-checkbox-disabled-background, var(--component-checkbox-background));\n                cursor: not-allowed;\n            }\n\n            :host([disabled]) .checkbox:hover {\n                border-color: var(--component-checkbox-border-color);\n            }\n\n            .checkbox:hover {\n                border-color: var(--component-checkbox-accent);\n            }\n\n            .checkbox svg {\n                width: var(--component-checkbox-icon-size, 16px);\n                height: var(--component-checkbox-icon-size, 16px);\n                stroke: var(--component-checkbox-accent);\n                display: block;\n            }\n\n            [part="label"] {\n                display: inline-flex;\n                align-items: center;\n                font-size: 0.9em;\n                line-height: 1;\n                color: var(--component-checkbox-color);\n            }\n\n            .icon {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                width: 100%;\n                height: 100%;\n                line-height: 0;\n            }\n\n        `),this.shadowRoot.adoptedStyleSheets=[n],this.shadowRoot.innerHTML='\n            <div class="wrapper">\n                <div class="checkbox" role="checkbox" tabindex="0">\n                    <span class="icon"></span>\n                </div>\n                <label part="label">\n                    <slot></slot>\n                </label>\n            </div>\n        ',this.shadowRoot.querySelector(".checkbox").addEventListener("click",()=>this.toggle()),this.shadowRoot.querySelector(".checkbox").addEventListener("keydown",e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),this.toggle())}),this.updateState()}}customElements.get("y-checkbox")||customElements.define("y-checkbox",u);class m extends HTMLElement{static get observedAttributes(){return["visible","anchor","closable"]}constructor(){super(),this.attachShadow({mode:"open"}),this.onKeyDown=this.onKeyDown.bind(this),this.onAnchorClick=this.onAnchorClick.bind(this)}connectedCallback(){this.render(),this.setupAnchor(),this.visible&&this.show()}attributeChangedCallback(e,t,n){t!==n&&("visible"===e&&(this.visible?this.show():this.hide()),"anchor"===e&&this.setupAnchor(),"closable"===e&&this.render())}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get closable(){return this.hasAttribute("closable")}set closable(e){e?this.setAttribute("closable",""):this.removeAttribute("closable")}show(){this.shadowRoot.querySelector(".dialog")||this.render(),document.addEventListener("keydown",this.onKeyDown);const e=this.shadowRoot.querySelector(".dialog");e&&"function"==typeof e.focus&&e.focus()}hide(){document.removeEventListener("keydown",this.onKeyDown)}setupAnchor(){if(this._anchorEl&&this._anchorEl.removeEventListener("click",this.onAnchorClick),this.anchor){const e=document.getElementById(this.anchor);e&&(this._anchorEl=e,this._anchorEl.addEventListener("click",this.onAnchorClick))}}onAnchorClick(){this.visible=!this.visible}onKeyDown(e){"Escape"===e.key&&this.visible&&(this.visible=!1)}render(){const e=document.createElement("style");e.textContent="\n            :host {\n                position: fixed;\n                top: 0; left: 0; right: 0; bottom: 0;\n                display: none;\n                align-items: center;\n                justify-content: center;\n                background: rgba(0,0,0,0.5);\n                z-index: var(--component-dialog-z-index, 1000);\n            }\n            :host([visible]) { display: flex; }\n            .dialog {\n                background: var(--component-dialog-background);\n                border: var(--component-dialog-border-width, 1px) solid var(--component-dialog-border-color);\n                border-radius: var(--component-dialog-border-radius-outer, 4px);\n                max-width: 90%;\n                max-height: 90%;\n                display: flex;\n                flex-direction: column;\n                box-shadow: var(--component-dialog-shadow, 0 2px 10px rgba(0,0,0,0.3));\n            }\n            .header {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                font-weight: bold;\n                border-bottom: var(--component-dialog-inner-border-width, 1px) solid var(--component-dialog-border-color);\n                display: flex;\n                align-items: center;\n                justify-content: space-between;\n                gap: var(--spacing-small, 8px);\n            }\n            .header-content {\n                flex: 1;\n            }\n            .close-btn {\n                background: none;\n                border: none;\n                cursor: pointer;\n                padding: var(--spacing-x-small, 4px);\n                color: var(--component-dialog-color, #f7f7fa);\n                font-size: 1.25em;\n                line-height: 1;\n                border-radius: var(--component-button-border-radius-outer, 4px);\n                display: flex;\n                align-items: center;\n                justify-content: center;\n            }\n            .close-btn:hover {\n                background: var(--component-dialog-hover-background, #292a2b);\n            }\n            .close-btn:focus-visible {\n                outline: 2px solid var(--component-dialog-accent);\n                outline-offset: -1px;\n            }\n            .body {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                overflow: auto;\n                flex: 1;\n            }\n            .footer {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                border-top: var(--component-dialog-inner-border-width, 1px) solid var(--component-dialog-border-color);\n                text-align: right;\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n        ",this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(e);const t=document.createElement("div");t.className="dialog",t.setAttribute("role","dialog"),t.setAttribute("aria-modal","true"),t.setAttribute("tabindex","-1");const n=document.createElement("div");n.className="header",n.setAttribute("part","header");const r=document.createElement("div");if(r.className="header-content",r.innerHTML='<slot name="header"></slot>',n.appendChild(r),this.closable){const e=document.createElement("button");e.className="close-btn",e.setAttribute("aria-label","Close"),e.innerHTML="&#10005;",e.addEventListener("click",()=>{this.visible=!1}),n.appendChild(e)}const o=document.createElement("div");o.className="body",o.setAttribute("part","body"),o.innerHTML='<slot name="body"></slot>';const a=document.createElement("div");a.className="footer",a.setAttribute("part","footer"),a.innerHTML='<slot name="footer"></slot>',t.appendChild(n),t.appendChild(o),t.appendChild(a),this.shadowRoot.appendChild(t)}}customElements.get("y-dialog")||customElements.define("y-dialog",m);class g extends HTMLElement{static get observedAttributes(){return["visible","anchor","position","resizable"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onAnchorClick=this._onAnchorClick.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onResizePointerDown=this._onResizePointerDown.bind(this),this._onResizePointerMove=this._onResizePointerMove.bind(this),this._onResizePointerUp=this._onResizePointerUp.bind(this)}connectedCallback(){this.render(),this._setupAnchor(),this.visible&&this._show()}disconnectedCallback(){this._teardownAnchor(),document.removeEventListener("keydown",this._onKeyDown),this._cleanupResize()}attributeChangedCallback(e,t,n){t!==n&&("visible"===e&&(this.visible?this._show():this._hide()),"anchor"===e&&(this._teardownAnchor(),this._setupAnchor()),"position"===e&&this._applyPosition(),"resizable"===e&&this._applyResizable())}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get position(){return this.getAttribute("position")||"left"}set position(e){this.setAttribute("position",e)}get resizable(){return this.hasAttribute("resizable")}set resizable(e){e?this.setAttribute("resizable",""):this.removeAttribute("resizable")}_setupAnchor(){const e=this.anchor;if(e){const t=document.getElementById(e);t&&(this._anchorEl=t,this._anchorEl.addEventListener("click",this._onAnchorClick))}}_teardownAnchor(){this._anchorEl&&(this._anchorEl.removeEventListener("click",this._onAnchorClick),this._anchorEl=null)}_onAnchorClick(){this.visible=!this.visible}_show(){this.style.display="block",this.offsetHeight;const e=this.shadowRoot.querySelector(".overlay"),t=this.shadowRoot.querySelector(".drawer-panel");e&&e.classList.add("open"),t&&(t.classList.add("open"),t.focus()),document.addEventListener("keydown",this._onKeyDown)}_hide(){const e=this.shadowRoot.querySelector(".overlay"),t=this.shadowRoot.querySelector(".drawer-panel");e&&e.classList.remove("open"),t&&t.classList.remove("open"),document.removeEventListener("keydown",this._onKeyDown);const n=this._getTransitionDuration(t);n>0?(clearTimeout(this._hideTimer),this._hideTimer=setTimeout(()=>{this.visible||(this.style.display="none")},n)):this.style.display="none"}_getTransitionDuration(e){if(!e)return 0;const t=getComputedStyle(e).transitionDuration||"0s",n=parseFloat(t);return isNaN(n)?0:1e3*n}_onKeyDown(e){"Escape"===e.key&&this.visible&&(this.visible=!1)}_onOverlayClick(){this.visible=!1}_applyPosition(){const e=this.shadowRoot.querySelector(".drawer-panel");e&&e.setAttribute("data-position",this.position)}_applyResizable(){const e=this.shadowRoot.querySelector(".resize-handle");e&&(e.style.display=this.resizable?"flex":"none")}_isHorizontal(){return"left"===this.position||"right"===this.position}_onResizePointerDown(e){e.preventDefault(),this._resizing=!0,this._startPointer=this._isHorizontal()?e.clientX:e.clientY;const t=this.shadowRoot.querySelector(".drawer-panel");this._startSize=this._isHorizontal()?t.offsetWidth:t.offsetHeight,t.style.transition="none",document.addEventListener("pointermove",this._onResizePointerMove),document.addEventListener("pointerup",this._onResizePointerUp)}_onResizePointerMove(e){if(!this._resizing)return;const t=this.shadowRoot.querySelector(".drawer-panel"),n=(this._isHorizontal()?e.clientX:e.clientY)-this._startPointer;let r;r="left"===this.position?this._startSize+n:"right"===this.position?this._startSize-n:"top"===this.position?this._startSize+n:this._startSize-n;r=Math.max(100,r),this._isHorizontal()?t.style.width=`${r}px`:t.style.height=`${r}px`}_onResizePointerUp(){this._resizing=!1;const e=this.shadowRoot.querySelector(".drawer-panel");e&&(e.style.transition=""),document.removeEventListener("pointermove",this._onResizePointerMove),document.removeEventListener("pointerup",this._onResizePointerUp)}_cleanupResize(){document.removeEventListener("pointermove",this._onResizePointerMove),document.removeEventListener("pointerup",this._onResizePointerUp)}_gripSVG(){return`<svg xmlns="http://www.w3.org/2000/svg" width="${(e=this._isHorizontal())?4:20}" height="${e?20:4}" viewBox="0 0 ${e?4:20} ${e?20:4}" fill="currentColor">\n            ${e?'<circle cx="2" cy="4"  r="1.5"/>\n                   <circle cx="2" cy="10" r="1.5"/>\n                   <circle cx="2" cy="16" r="1.5"/>':'<circle cx="4"  cy="2" r="1.5"/>\n                   <circle cx="10" cy="2" r="1.5"/>\n                   <circle cx="16" cy="2" r="1.5"/>'}\n        </svg>`;var e}render(){this.shadowRoot.innerHTML="";const e=document.createElement("style");e.textContent='\n            :host {\n                position: fixed;\n                top: 0; left: 0; right: 0; bottom: 0;\n                display: none;\n                z-index: var(--component-drawer-z-index, 5000);\n            }\n            :host([visible]) {\n                display: block;\n            }\n\n            .overlay {\n                position: absolute;\n                top: 0; left: 0; right: 0; bottom: 0;\n                background: rgba(0, 0, 0, 0);\n                transition: background var(--drawer-transition-duration, 0.3s) ease;\n            }\n            .overlay.open {\n                background: rgba(0, 0, 0, 0.4);\n            }\n\n            .drawer-panel {\n                position: absolute;\n                background: var(--component-drawer-background, #0c0c0d);\n                color: var(--component-drawer-color, #f7f7fa);\n                box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);\n                overflow: hidden;\n                outline: none;\n                display: flex;\n                flex-direction: column;\n                border: none;\n                border-radius: var(--component-drawer-border-radius, 0);\n                transition: transform var(--drawer-transition-duration, 0.3s) ease;\n            }\n\n            .drawer-panel[data-position="left"],\n            .drawer-panel[data-position="right"] {\n                top: 0;\n                bottom: 0;\n                width: var(--drawer-width, 300px);\n                flex-direction: row;\n            }\n            .drawer-panel[data-position="left"] {\n                left: 0;\n                transform: translateX(-100%);\n                border-right: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n            .drawer-panel[data-position="right"] {\n                right: 0;\n                transform: translateX(100%);\n                border-left: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n\n            .drawer-panel[data-position="top"],\n            .drawer-panel[data-position="bottom"] {\n                left: 0;\n                right: 0;\n                height: var(--drawer-height, 300px);\n            }\n            .drawer-panel[data-position="top"] {\n                top: 0;\n                transform: translateY(-100%);\n                border-bottom: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n            .drawer-panel[data-position="bottom"] {\n                bottom: 0;\n                transform: translateY(100%);\n                border-top: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n\n            .drawer-panel.open { transform: translate(0, 0); }\n\n            .drawer-header {\n                padding: var(--component-drawer-padding, 1rem);\n                font-weight: bold;\n            }\n            .drawer-body {\n                padding: var(--component-drawer-padding, 1rem);\n                flex: 1;\n                overflow: auto;\n            }\n            .drawer-footer {\n                padding: var(--component-drawer-padding, 1rem);\n            }\n\n            /* Wrapper so header/body/footer stack vertically inside a row layout */\n            .drawer-content {\n                display: flex;\n                flex-direction: column;\n                flex: 1;\n                min-width: 0;\n                min-height: 0;\n                overflow: hidden;\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n\n            .resize-handle {\n                display: none;              /* hidden until resizable attr */\n                flex-shrink: 0;\n                align-items: center;\n                justify-content: center;\n                color: var(--component-drawer-color, #f7f7fa);\n                opacity: 0.6;\n                touch-action: none;         /* needed for pointer events */\n                user-select: none;\n                transition: opacity 0.15s, background 0.15s;\n            }\n            .resize-handle:hover,\n            .resize-handle:active {\n                opacity: 1;\n                background: var(--component-drawer-hover-background, #292a2b);\n            }\n\n            .drawer-panel[data-position="left"] > .resize-handle,\n            .drawer-panel[data-position="right"] > .resize-handle {\n                width: var(--component-drawer-handle-width, 6px);\n                padding: var(--component-drawer-handle-padding, 4px);\n                cursor: ew-resize;\n            }\n            .drawer-panel[data-position="left"] > .resize-handle {\n                order: 99;\n            }\n            .drawer-panel[data-position="right"] > .resize-handle {\n                order: -1;\n            }\n\n            .drawer-panel[data-position="top"] > .resize-handle,\n            .drawer-panel[data-position="bottom"] > .resize-handle {\n                height: var(--component-drawer-handle-width, 6px);\n                padding: var(--component-drawer-handle-padding, 4px);\n                cursor: ns-resize;\n            }\n            .drawer-panel[data-position="top"] > .resize-handle {\n                order: 99;\n            }\n            .drawer-panel[data-position="bottom"] > .resize-handle {\n                order: -1;\n            }\n        ',this.shadowRoot.appendChild(e);const t=document.createElement("div");t.className="overlay",t.setAttribute("part","overlay"),t.addEventListener("click",()=>this._onOverlayClick()),this.shadowRoot.appendChild(t);const n=document.createElement("div");n.className="drawer-panel",n.setAttribute("role","dialog"),n.setAttribute("aria-modal","true"),n.setAttribute("tabindex","-1"),n.setAttribute("part","panel"),n.setAttribute("data-position",this.position);const r=document.createElement("div");r.className="resize-handle",r.innerHTML=this._gripSVG(),r.style.display=this.resizable?"flex":"none",r.addEventListener("pointerdown",this._onResizePointerDown),n.appendChild(r);const o=document.createElement("div");o.className="drawer-content";const a=document.createElement("div");a.className="drawer-header",a.setAttribute("part","header"),a.innerHTML='<slot name="header"></slot>';const i=document.createElement("div");i.className="drawer-body",i.setAttribute("part","body"),i.innerHTML='<slot name="body"></slot>';const s=document.createElement("div");s.className="drawer-footer",s.setAttribute("part","footer"),s.innerHTML='<slot name="footer"></slot>',o.appendChild(a),o.appendChild(i),o.appendChild(s),n.appendChild(o),this.shadowRoot.appendChild(n),this.visible&&requestAnimationFrame(()=>{t.classList.add("open"),n.classList.add("open")})}}customElements.get("y-drawer")||customElements.define("y-drawer",g);const v=new Set(["svg","g","path","circle","ellipse","rect","line","polyline","polygon","text","tspan","defs","clippath","mask","lineargradient","radialgradient","stop","symbol","title","desc","metadata"]),f=new Set(["viewbox","xmlns","fill","stroke","stroke-width","stroke-linecap","stroke-linejoin","stroke-dasharray","stroke-dashoffset","stroke-miterlimit","stroke-opacity","fill-opacity","fill-rule","clip-rule","opacity","d","cx","cy","r","rx","ry","x","x1","x2","y","y1","y2","width","height","points","transform","id","class","clip-path","mask","offset","stop-color","stop-opacity","gradient-units","gradienttransform","gradientunits","spreadmethod","patternunits","patterntransform","font-size","font-family","font-weight","text-anchor","dominant-baseline","alignment-baseline","dx","dy","rotate","textlength","lengthadjust","display","visibility","color","vector-effect"]);const k=new Map;function w(e){if(k.has(e))return k.get(e);const t=function(e){if(!e)return"";const t=(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg");if(!t)return"";const n=e=>{for(const t of[...e.children])if(v.has(t.tagName.toLowerCase())){for(const e of[...t.attributes])f.has(e.name.toLowerCase())||t.removeAttribute(e.name);n(t)}else t.remove()};for(const e of[...t.attributes])f.has(e.name.toLowerCase())||t.removeAttribute(e.name);return n(t),t.outerHTML}(r(e));return k.set(e,t),t}class y extends HTMLElement{static get observedAttributes(){return["name","size","color","label"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get name(){return this.getAttribute("name")||""}set name(e){this.setAttribute("name",e)}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||"base"}set color(e){this.setAttribute("color",e)}get label(){return this.getAttribute("label")||""}set label(e){e?this.setAttribute("label",e):this.removeAttribute("label")}_getColor(e){const t={base:"var(--base-content--, #f7f7fa)",primary:"var(--primary-content--, #0576ff)",secondary:"var(--secondary-content--, #04b8b8)",success:"var(--success-content--, #2dba73)",warning:"var(--warning-content--, #d17f04)",error:"var(--error-content--, #b80421)",help:"var(--help-content--, #5405ff)"};return t[e]||t.base}_getSize(e){const t={small:"var(--component-icon-size-small, 16px)",medium:"var(--component-icon-size-medium, 24px)",large:"var(--component-icon-size-large, 32px)"};return t[e]||t.medium}render(){const e=w(this.name),t=this._getSize(this.size),n=this._getColor(this.color),r=this.label;r?(this.setAttribute("role","img"),this.setAttribute("aria-label",r),this.removeAttribute("aria-hidden")):(this.setAttribute("aria-hidden","true"),this.removeAttribute("role"),this.removeAttribute("aria-label")),this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-flex;\n                    align-items: center;\n                    justify-content: center;\n                    width: ${t};\n                    height: ${t};\n                    color: ${n};\n                    line-height: 0;\n                }\n                .icon-wrapper svg {\n                    width: 100%;\n                    height: 100%;\n                }\n            </style>\n            <span class="icon-wrapper" part="icon">${e}</span>\n        `}}customElements.get("y-icon")||customElements.define("y-icon",y);class x extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["type","size","value","label-position","disabled","invalid","name"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this._internals.setFormValue(this.value)}attributeChangedCallback(e,t,n){if(t!==n)return"value"===e?(this.input&&(this.input.value=n),void(this._internals&&this._internals.setFormValue(n,this.getAttribute("name")))):void("name"!==e?"invalid"!==e?this.render():this.updateValidationState():this._internals.setFormValue(this.value,n))}get value(){return this.input?.value||""}set value(e){this.input?this.input.value=e:this.setAttribute("value",e),this._internals.setFormValue(e,this.getAttribute("name"))}checkValidity(){return this.input?.checkValidity?.()??!0}updateValidationState(){const e=this.hasAttribute("invalid"),t=this.input&&!this.checkValidity(),n=e||t;this.inputContainer?.classList.toggle("is-invalid",n),this.labelWrapper?.classList.toggle("is-invalid",n)}render(){const e=this.getAttribute("type")||"text",t=this.getAttribute("size")||"medium",n=this.getAttribute("value")||"",r=this.getAttribute("label-position")||"top",o=this.hasAttribute("disabled"),a="top"===r,i={small:"--component-inputs-padding-small",medium:"--component-inputs-padding-medium",large:"--component-inputs-padding-large"}[t],s=new CSSStyleSheet;s.replaceSync(`\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n                color: var(--component-input-color);\n                opacity: ${o?"0.75":"1"};\n                pointer-events: ${o?"none":"auto"};\n            }\n\n            .input-wrapper {\n                position: relative;\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-2x-small, 4px);\n            }\n\n            .input-container {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-x-small);\n                background: ${o?"var(--component-input-background-disabled)":"var(--component-input-background)"};\n                border: var(--component-inputs-border-width) solid var(--component-input-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                padding: var(${i});\n                box-sizing: border-box;\n                transition: border-color 0.2s ease-in-out;\n            }\n\n            .input-container.is-invalid {\n                border-color: var(--component-input-error-border-color);\n                background: var(--component-input-error-background);\n            }\n\n            .input-container.is-invalid input {\n                color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:hover {\n                border-color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:focus-within {\n                border-color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:focus-within input {\n                color: var(--component-input-color);\n            }\n\n            input {\n                all: unset;\n                flex: 1;\n                font-family: inherit;\n                font-size: 1em;\n                color: inherit;\n                min-width: 0;\n                min-height: 20px;\n            }\n\n            .input-container:hover {\n                border-color: var(--component-input-color);\n                transition: border-color 0.2s ease-in-out;\n            }\n\n            .input-container:focus-within {\n                border-color: var(--component-input-accent);\n            }\n\n            .label-wrapper.is-invalid ::slotted([slot="label"]) {\n                color: var(--component-input-error-color);\n            }\n\n            ::slotted([slot="label"]) {\n                font-weight: 500;\n                font-size: 0.875em;\n                color: var(--component-input-label-color);\n            }\n\n            ::slotted([slot="left-icon"]),\n            ::slotted([slot="right-icon"]) {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                color: var(--component-input-icon-color);\n            }\n        `),this.shadowRoot.adoptedStyleSheets=[s],this.shadowRoot.innerHTML=`\n            <div class="input-wrapper">\n                ${a?'<div class="label-wrapper"><slot name="label"></slot></div>':""}\n                <div class="input-container">\n                    <slot name="left-icon"></slot>\n                    <input part="input" type="${e}" value="${n}" ${o?"disabled":""} />\n                    <slot name="right-icon"></slot>\n                </div>\n                ${a?"":'<div class="label-wrapper"><slot name="label"></slot></div>'}\n            </div>\n        `,this.input=this.shadowRoot.querySelector("input"),this.inputContainer=this.shadowRoot.querySelector(".input-container"),this.labelWrapper=this.shadowRoot.querySelector(".label-wrapper"),o||(this.input.addEventListener("input",e=>{this.setAttribute("value",e.target.value),this.dispatchEvent(new CustomEvent("input",{detail:{value:e.target.value},bubbles:!0,composed:!0})),this.updateValidationState()}),this.updateValidationState())}}customElements.get("y-input")||customElements.define("y-input",x);class A extends HTMLElement{static get observedAttributes(){return["selected","expanded","href","history"]}constructor(){super(),this.attachShadow({mode:"open"}),this._expanded=!1,this._checkRouteMatchBound=this.checkRouteMatch.bind(this),this.render()}connectedCallback(){this.addHeaderListeners(),this.checkForChildren(),this.updateChildState(),this.updateSelectedState(),this.updateExpandedState(),this.hasAttribute("href")&&(this.checkRouteMatch(),window.addEventListener("popstate",this._checkRouteMatchBound))}disconnectedCallback(){this.hasAttribute("href")&&window.removeEventListener("popstate",this._checkRouteMatchBound)}attributeChangedCallback(e,t,n){t!==n&&("selected"===e&&this.updateSelectedState(),"expanded"===e&&this.updateExpandedState(),"href"===e&&this.checkRouteMatch())}get selected(){return this.hasAttribute("selected")}set selected(e){e?this.setAttribute("selected",""):this.removeAttribute("selected")}get expanded(){return this.hasAttribute("expanded")}set expanded(e){e?this.setAttribute("expanded",""):this.removeAttribute("expanded")}toggle(){if(this.hasChildren()){if(this._expanded)this.collapse();else{const e=this.closest("y-panelbar");if(e&&e.hasAttribute("exclusive")){const e=this.parentElement;(e?Array.from(e.children).filter(e=>"Y-PANEL"===e.tagName):[]).forEach(e=>{e!==this&&e.expanded&&e.collapse()})}this.expand()}this.dispatchEvent(new CustomEvent("toggle",{detail:{expanded:this._expanded},bubbles:!0,composed:!0}))}}expand(){this.hasChildren()&&(this.expanded=!0,this._expanded=!0,this.updateExpandedState(),this.dispatchEvent(new CustomEvent("expand",{detail:{expanded:!0},bubbles:!0,composed:!0})))}collapse(){this.expanded=!1,this._expanded=!1,this.updateExpandedState(),this.dispatchEvent(new CustomEvent("collapse",{detail:{expanded:!1},bubbles:!0,composed:!0}))}updateSelectedState(){this.classList.toggle("selected",this.selected)}updateChildState(){let e=0,t=this.parentElement;for(;t;){const n=t.closest("y-panel");if(!n||n===this)break;e++,t=n.parentElement}this.setAttribute("data-is-child",e>0?"true":"false"),this.style.setProperty("--panel-depth",e)}checkRouteMatch(){const e=this.getAttribute("href");e&&window.location.pathname===e?this.selected=!0:this.selected=!1}addHeaderListeners(){const e=this.shadowRoot.querySelector(".header");if(!e)return;e.addEventListener("click",e=>{if(e.stopPropagation(),this.hasAttribute("href")){const e=this.getAttribute("href");return void("false"!==this.getAttribute("history")?(history.pushState({},"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:{}}))):window.location.href=e)}this.hasChildren()?this.toggle():this.dispatchEvent(new CustomEvent("select",{detail:{selected:!0},bubbles:!0,composed:!0}))}),e.addEventListener("keydown",t=>{" "!==t.key&&"Enter"!==t.key||(t.preventDefault(),e.click())});const t=this.shadowRoot.querySelector('slot[name="children"]');t&&t.addEventListener("slotchange",()=>this.checkForChildren())}hasChildren(){const e=this.shadowRoot.querySelector('slot[name="children"]');if(!e)return!1;return e.assignedNodes({flatten:!0}).some(e=>e.nodeType!==Node.TEXT_NODE||""!==e.textContent.trim())}checkForChildren(){const e=this.hasChildren();this.setAttribute("data-has-children",e?"true":"false"),!e&&this.expanded&&(this.expanded=!1)}updateExpandedState(){const e=this.hasChildren(),t=this.shadowRoot.querySelector(".header"),n=this.expanded&&e;this._expanded=n,t&&t.setAttribute("aria-expanded",String(n))}render(){const e=new CSSStyleSheet;e.replaceSync('\n            :host {\n                display: block;\n                box-sizing: border-box;\n                background: var(--component-panel-background);\n                color: var(--component-panel-color);\n                font-family: var(--font-family-body);\n                overflow: hidden;\n            }\n\n            :host([expanded]) {\n                background: var(--component-panel-expanded-background);\n            }\n\n            :host([selected]) {\n                color: var(--component-panel-accent);\n            }\n\n            :host([data-is-child="true"]) {\n                box-shadow: inset var(--component-panelbar-border-width, 2px) 0 0 0 var(--component-panel-active-border);\n            }\n\n            :host([data-is-child="true"][selected]) {\n                box-shadow: inset var(--component-panelbar-border-width, 2px) 0 0 0 var(--component-panel-accent);\n            }\n\n            :host([selected]) .header:hover {\n                background: var(--component-panel-accent-hover-background);\n            }\n\n            :host([data-is-child="true"]) .header {\n                padding-left: calc(var(--component-panelbar-padding, 4px) + (var(--panel-depth, 1) * var(--component-panelbar-indent, 16px)));\n            }\n\n            .header {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-medium, 8px);\n                padding: var(--component-panelbar-padding, 4px);\n                cursor: pointer;\n                transition: background 0.2s ease;\n                user-select: none;\n            }\n\n            .header:hover {\n                background: var(--component-panel-hover-background);\n            }\n\n            :host([data-has-children="false"]) .header {\n                cursor: default;\n            }\n\n            .header ::slotted([slot="icon"]) {\n                margin-right: 6px;\n            }\n\n            .header ::slotted([slot="label"]) {\n                flex-grow: 1;\n                cursor: inherit;\n                font-size: 1rem;\n                line-height: 1.2;\n            }\n\n            .arrow {\n                display: inline-flex;\n                align-items: center;\n                justify-content: center;\n                width: 20px;\n                height: 20px;\n                transition: transform 0.2s ease;\n            }\n\n            :host([expanded]) .arrow {\n                transform: rotate(180deg);\n            }\n\n            .children {\n                display: none;\n                padding: 0;\n                width: 100%;\n                box-sizing: border-box;\n            }\n\n            .children ::slotted(y-panel) {\n                width: 100%;\n                box-sizing: border-box;\n            }\n\n            :host([expanded]) .children {\n                display: block;\n            }\n\n            :host([data-has-children="false"]) .arrow {\n                visibility: hidden;\n            }\n        '),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML=`\n            <div class="header" part="header" role="button" tabindex="0" aria-expanded="false">\n                <slot name="icon"></slot>\n                <slot name="label"><slot></slot></slot>\n                <span class="arrow" id="arrow" part="arrow">\n                    ${s}\n                </span>\n            </div>\n            <div class="children" id="childrenContainer" part="children">\n                <slot name="children"></slot>\n            </div>\n        `}}customElements.get("y-panel")||customElements.define("y-panel",A);class z extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.render()}render(){const e=new CSSStyleSheet;e.replaceSync("\n            :host {\n                display: block;\n            }\n        "),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML="\n            <slot></slot>\n        "}}customElements.get("y-panelbar")||customElements.define("y-panelbar",z);class E extends HTMLElement{static get observedAttributes(){return["value","min","max","step","size","color","label-display","label-format","indeterminate","disabled"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("min")||this.setAttribute("min","0"),this.hasAttribute("max")||this.setAttribute("max","100"),this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get value(){const e=parseFloat(this.getAttribute("value"));return Number.isNaN(e)?null:e}set value(e){null==e?this.removeAttribute("value"):this.setAttribute("value",String(e))}get min(){return parseFloat(this.getAttribute("min"))||0}set min(e){this.setAttribute("min",String(e))}get max(){return parseFloat(this.getAttribute("max"))||100}set max(e){this.setAttribute("max",String(e))}get step(){const e=parseFloat(this.getAttribute("step"));return Number.isNaN(e)||e<=0?null:e}set step(e){null==e?this.removeAttribute("step"):this.setAttribute("step",String(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||"primary"}set color(e){this.setAttribute("color",e)}get labelDisplay(){return"false"!==this.getAttribute("label-display")}set labelDisplay(e){this.setAttribute("label-display",e?"true":"false")}get labelFormat(){return this.getAttribute("label-format")||"percent"}set labelFormat(e){this.setAttribute("label-format",e)}get indeterminate(){return this.hasAttribute("indeterminate")}set indeterminate(e){e?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate")}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}increment(){if(null===this.value)return;const e=this.step||1;this.value=Math.min(this.value+e,this.max)}decrement(){if(null===this.value)return;const e=this.step||1;this.value=Math.max(this.value-e,this.min)}get percentage(){if(null===this.value)return 0;const e=this.max-this.min;if(e<=0)return 0;let t=(this.value-this.min)/e*100;if(this.step){const n=this.step/e*100;t=Math.round(t/n)*n}return Math.max(0,Math.min(100,t))}getBarColor(e){return{primary:"var(--primary-content--)",secondary:"var(--secondary-content--)",base:"var(--base-content--)",success:"var(--success-content--)",warning:"var(--warning-content--)",error:"var(--error-content--)",help:"var(--help-content--)"}[e]||e}getSizeVar(e){const t={small:"var(--component-progress-size-small)",medium:"var(--component-progress-size-medium)",large:"var(--component-progress-size-large)"};return t[e]||t.medium}getLabel(){if(this.indeterminate)return"";if(null===this.value)return"";switch(this.labelFormat){case"value":return`${this.value} / ${this.max}`;case"fraction":return`${this.value-this.min} / ${this.max-this.min}`;default:return`${Math.round(this.percentage)}%`}}render(){const e=this.indeterminate,t=this.percentage,n=this.getBarColor(this.color),r=this.getSizeVar(this.size),o=this.disabled,a=this.labelDisplay&&!e,i=this.getLabel(),s=null!==this.value?this.value:void 0;this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: block;\n                    font-family: var(--font-family-body);\n                    color: var(--base-content--);\n                    opacity: ${o?"0.5":"1"};\n                    pointer-events: ${o?"none":"auto"};\n                }\n\n                .progress-wrapper {\n                    display: flex;\n                    flex-direction: column;\n                    gap: var(--spacing-2x-small, 4px);\n                }\n\n                .progress-header {\n                    display: flex;\n                    align-items: center;\n                    justify-content: space-between;\n                    font-size: var(--font-size-label, 0.83em);\n                }\n\n                .label {\n                    color: var(--base-content--);\n                }\n\n                .track {\n                    position: relative;\n                    width: 100%;\n                    height: ${r};\n                    background: var(--base-background-component);\n                    border: var(--component-progress-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-progress-border-radius-outer);\n                    overflow: hidden;\n                    box-sizing: border-box;\n                    padding: var(--component-progress-padding);\n                }\n\n                .bar {\n                    position: relative;\n                    height: 100%;\n                    background: ${n};\n                    border-radius: var(--component-progress-border-radius-inner);\n                    width: ${e?"30%":`${t}%`};\n                    transition: ${e?"none":"width 0.3s ease"};\n                    overflow: hidden;\n                    ${e?"animation: indeterminate 1.5s ease-in-out infinite;":""}\n                }\n\n                .value-label {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    right: 0;\n                    bottom: 0;\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    font-size: var(--font-size-small, 0.75em);\n                    font-variant-numeric: tabular-nums;\n                    white-space: nowrap;\n                    pointer-events: none;\n                    font-weight: 600;\n                }\n\n                .value-label--track {\n                    color: ${n};\n                }\n\n                .value-label--bar {\n                    color: var(--base-background-component);\n                    width: calc(100% / (${t||1} / 100));\n                }\n\n                @keyframes indeterminate {\n                    0% {\n                        transform: translateX(0%);\n                    }\n                    50% {\n                        transform: translateX(233%);\n                    }\n                    100% {\n                        transform: translateX(0%);\n                    }\n                }\n            </style>\n\n            <div class="progress-wrapper">\n                <div class="progress-header">\n                    <span class="label"><slot></slot></span>\n                </div>\n                <div\n                    class="track"\n                    part="track"\n                    role="progressbar"\n                    aria-valuenow="${void 0!==s?s:""}"\n                    aria-valuemin="${this.min}"\n                    aria-valuemax="${this.max}"\n                    ${e?'aria-busy="true"':""}\n                >\n                    ${a?`<span class="value-label value-label--track" part="value-label">${i}</span>`:""}\n                    <div class="bar" part="bar">${a?`<span class="value-label value-label--bar">${i}</span>`:""}</div>\n                </div>\n            </div>\n        `}}customElements.get("y-progress")||customElements.define("y-progress",E);class C extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["options","name","value","disabled"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this._value=""}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&("value"===e?(this._value=n,this._internals.setFormValue(n,this.name),this.updateChecked()):["options","name","disabled"].includes(e)&&this.render())}get value(){return this._value}set value(e){this._value=e,this.setAttribute("value",e),this._internals.setFormValue(e,this.name),this.updateChecked()}get name(){return this.getAttribute("name")||""}get options(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch{return[]}}set options(e){this.setAttribute("options",JSON.stringify(e))}updateChecked(){this.shadowRoot.querySelectorAll("input[type=radio]").forEach((e,t)=>{const n=e.value===this.value;e.checked=n,e.setAttribute("aria-checked",n),e.setAttribute("tabindex",n?"0":"-1")})}handleKey(e,t,n){const r=n.length;let o=t;if("ArrowDown"===e.key||"ArrowRight"===e.key)e.preventDefault(),o=(t+1)%r;else{if("ArrowUp"!==e.key&&"ArrowLeft"!==e.key)return" "===e.key||"Enter"===e.key?(e.preventDefault(),this.value=n[t].value,void this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))):void 0;e.preventDefault(),o=(t-1+r)%r}n[o].focus()}render(){const e=this.name,t=this.hasAttribute("disabled"),n=this.value,r=this.options;this.shadowRoot.innerHTML=`\n            <style>\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n            }\n            fieldset {\n                border: none;\n                padding: 0;\n                margin: 0;\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-x-small, 8px);\n            }\n            label {\n                display: flex;\n                align-items: center;\n                gap: 0.5em;\n                cursor: pointer;\n            }\n            input[type="radio"] {\n                appearance: none;\n                width: var(--component-radio-size, 16px);\n                height: var(--component-radio-size, 16px);\n                border: var(--component-inputs-border-width, 2px) solid var(--component-radio-color);\n                border-radius: 50%;\n                position: relative;\n                outline: none;\n                cursor: pointer;\n            }\n            input[type="radio"]:checked::after {\n                content: '';\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                width: var(--component-radio-dot-size, 8px);\n                height: var(--component-radio-dot-size, 8px);\n                background: var(--component-radio-color);\n                border-radius: 50%;\n                transform: translate(-50%, -50%);\n            }\n            input[type="radio"]:focus-visible {\n                outline: 2px solid var(--component-radio-accent);\n                outline-offset: 2px;\n            }\n            input[disabled] {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n        </style>\n            <fieldset role="radiogroup" part="radio">\n                ${r.map((r,o)=>`\n                    <label part="label">\n                        <input\n                            type="radio"\n                            name="${e}"\n                            value="${r.value}"\n                            ${t?"disabled":""}\n                            ${n===r.value?"checked":""}\n                            tabindex="${n?n===r.value?"0":"-1":0===o?"0":"-1"}"\n                            role="radio"\n                            aria-checked="${n===r.value}"\n                        />\n                        ${r.label}\n                    </label>\n                `).join("")}\n            </fieldset>\n        `,this.shadowRoot.querySelectorAll("input[type=radio]").forEach((e,t,n)=>{e.addEventListener("keydown",e=>this.handleKey(e,t,n)),e.addEventListener("click",e=>{this.value=e.target.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))})})}}customElements.get("y-radio")||customElements.define("y-radio",C);class _ extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["label-position","disabled","invalid","required","value","name","placeholder","options","display-mode","close-on-click-outside"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.selectedValues=new Set,this._onDocumentClick=this._onDocumentClick.bind(this),this.render()}connectedCallback(){this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this.updateValidation(),this._internals.setFormValue(this.value)}disconnectedCallback(){this.closeDropdown()}_onDocumentClick(e){if("false"===this.getAttribute("close-on-click-outside"))return;!e.composedPath().includes(this)&&this.dropdown?.classList.contains("open")&&this.closeDropdown()}attributeChangedCallback(e,t,n){t!==n&&("value"===e&&(this.updateDisplay(),this._internals.setFormValue(n,this.getAttribute("name")),this.updateSelectedStyles()),["label-position","disabled","invalid","required","placeholder","options"].includes(e)&&this.render(),"name"===e&&this._internals.setFormValue(this.value,n))}get value(){return this.hasAttribute("multiple")?Array.from(this.selectedValues).join(","):this._value||""}set value(e){this.hasAttribute("multiple")?"string"==typeof e?this.selectedValues=new Set(e.split(",").map(e=>e.trim())):Array.isArray(e)&&(this.selectedValues=new Set(e)):this._value=e,this.setAttribute("value",e),this._internals.setFormValue(this.value,this.getAttribute("name")),this.updateDisplay(),this.updateSelectedStyles()}getOptions(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch(e){return[]}}getDisplayText(){const e=this.getOptions(),t=this.hasAttribute("multiple"),n="tag"===this.getAttribute("display-mode");if(t&&n)return"";if(t){const t=e.filter(e=>this.selectedValues.has(e.value)).length;return t>0?`${t} Selected`:this.getAttribute("placeholder")||"Select..."}{const t=e.find(e=>e.value===this.value);return t?.label||this.getAttribute("placeholder")||"Select..."}}toggleDropdown(){this.dropdown.classList.contains("open")?this.closeDropdown():(this.dropdown.classList.add("open"),this.selectContainer.classList.add("open"),this._positionDropdown(),this._onScrollOrResize=this._positionDropdown.bind(this),window.addEventListener("scroll",this._onScrollOrResize,!0),window.addEventListener("resize",this._onScrollOrResize),document.addEventListener("click",this._onDocumentClick,!0))}closeDropdown(){this.dropdown?.classList.remove("open"),this.selectContainer?.classList.remove("open"),document.removeEventListener("click",this._onDocumentClick,!0),this._onScrollOrResize&&(window.removeEventListener("scroll",this._onScrollOrResize,!0),window.removeEventListener("resize",this._onScrollOrResize),this._onScrollOrResize=null)}_positionDropdown(){const e=this.selectContainer.getBoundingClientRect();this.dropdown.style.left=`${e.left}px`,this.dropdown.style.width=`${e.width}px`;const t=window.innerHeight-e.bottom-4;t>=200||t>=e.top?(this.dropdown.style.top=`${e.bottom+4}px`,this.dropdown.style.bottom="auto"):(this.dropdown.style.bottom=window.innerHeight-e.top+4+"px",this.dropdown.style.top="auto")}queryRefs(){this.selectContainer=this.shadowRoot.querySelector(".select-container"),this.dropdown=this.shadowRoot.querySelector(".dropdown"),this.labelWrapper=this.shadowRoot.querySelector(".label-wrapper"),this.displayElement=this.shadowRoot.querySelector(".value-display")}attachEventListeners(){this.selectContainer.addEventListener("click",()=>this.toggleDropdown()),this.dropdown.querySelectorAll(".dropdown-item").forEach(e=>{e.addEventListener("click",()=>{const t=e.getAttribute("data-value"),n=this.hasAttribute("required");if(this.hasAttribute("multiple"))this.selectedValues.has(t)?(!n||this.selectedValues.size>1)&&this.selectedValues.delete(t):this.selectedValues.add(t),this.setAttribute("value",Array.from(this.selectedValues).join(","));else{const e=t===this.value;this.value=e&&!n?"":t}this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0})),this.updateValidation(),this.closeDropdown()})})}renderTags(){const e=this.hasAttribute("multiple"),t="tag"===this.getAttribute("display-mode");if(!e||!t||!this.displayElement)return;const n=this.getOptions();this.displayElement.innerHTML="";n.filter(e=>this.selectedValues.has(e.value)).forEach(e=>{const t=document.createElement("y-tag");t.setAttribute("removable",""),t.setAttribute("color","primary"),t.setAttribute("style-type","filled"),t.textContent=e.label,t.dataset.value=e.value,t.addEventListener("remove",()=>{this.selectedValues.delete(e.value),this.setAttribute("value",Array.from(this.selectedValues).join(",")),this.renderTags(),this.updateSelectedStyles(),this.updateValidation(),this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))}),this.displayElement.appendChild(t)})}updateDisplay(){"tag"===this.getAttribute("display-mode")?this.renderTags():this.displayElement&&(this.displayElement.textContent=this.getDisplayText())}updateSelectedStyles(){const e=this.hasAttribute("multiple")?this.selectedValues:new Set([this.value]);this.dropdown?.querySelectorAll(".dropdown-item").forEach(t=>{const n=t.getAttribute("data-value");t.classList.toggle("selected",e.has(n))})}updateValidation(){const e=this.hasAttribute("required"),t=this.hasAttribute("multiple")?this.selectedValues.size>0:this.value&&""!==this.value;e&&!t?this.setAttribute("invalid",""):this.removeAttribute("invalid")}updateValidationState(){const e=this.hasAttribute("invalid");this.selectContainer?.classList.toggle("is-invalid",e),this.labelWrapper?.classList.toggle("is-invalid",e)}render(){this.closeDropdown(),this.applyStyles(),this.shadowRoot.innerHTML=this.generateTemplate(),this.queryRefs(),this.attachEventListeners(),this.updateValidationState()}applyStyles(){const e=this.hasAttribute("disabled"),t=new CSSStyleSheet;t.replaceSync(`\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n                color: var(--component-select-color);\n                opacity: ${e?"0.75":"1"};\n                pointer-events: ${e?"none":"auto"};\n            }\n\n            .select-wrapper {\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-2x-small, 4px);\n                position: relative;\n            }\n\n            .select-container {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-x-small);\n                background: var(--component-select-background);\n                border: var(--component-inputs-border-width) solid var(--component-select-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                padding: var(--component-inputs-padding-medium);\n                box-sizing: border-box;\n                transition: border-color 0.2s ease-in-out;\n                cursor: pointer;\n            }\n\n            .select-container:hover {\n                border-color: var(--component-select-color);\n            }\n\n            .select-container:focus-within {\n                border-color: var(--component-select-accent);\n            }\n\n            .select-container.is-invalid {\n                border-color: var(--component-select-error-border-color);\n                background: var(--component-select-error-background);\n            }\n\n            .select-container.is-invalid:hover {\n                border-color: var(--component-select-error-color);\n            }\n\n            .select-container.is-invalid:focus-within {\n                border-color: var(--component-select-error-color);\n            }\n\n            .label-wrapper.is-invalid ::slotted([slot="label"]) {\n                color: var(--component-select-error-color);\n            }\n\n            ::slotted([slot="label"]) {\n                font-weight: 500;\n                font-size: 0.875em;\n                color: var(--component-select-label-color);\n            }\n\n            .dropdown {\n                position: fixed;\n                z-index: var(--component-select-z-index, 6000);\n                background: var(--component-select-background);\n                border: var(--component-inputs-border-width) solid var(--component-select-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                box-shadow: var(--component-select-shadow, 0 2px 8px rgba(0,0,0,0.1));\n                max-height: 200px;\n                overflow-y: auto;\n                display: none;\n            }\n\n            .dropdown.open {\n                display: block;\n            }\n\n            .dropdown-item {\n                padding: var(--spacing-small, 6px);\n                cursor: pointer;\n            }\n\n            .dropdown-item:hover {\n                background: var(--component-select-hover-background);\n            }\n\n            .dropdown-item.selected {\n                background: var(--component-select-accent);\n                color: var(--component-select-accent-contrast);\n            }\n\n            .value-display {\n                flex: 1;\n                font-size: 1em;\n                color: inherit;\n                display: flex;\n                gap: var(--spacing-x-small);\n            }\n\n            .label-wrapper {\n                display: block;\n            }\n\n            .chevron-icon {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                margin-left: auto;\n                transition: transform 0.2s ease;\n            }\n\n            .chevron-icon svg {\n                transition: transform 0.2s ease;\n                transform-origin: center;\n            }\n\n            .select-container.open .chevron-icon svg {\n                transform: scaleY(-1);\n            }\n        `),this.shadowRoot.adoptedStyleSheets=[t]}generateTemplate(){const e="top"===(this.getAttribute("label-position")||"top"),t=this.hasAttribute("invalid"),n=this.hasAttribute("multiple")?this.selectedValues:new Set([this.value]);return`\n            <div class="select-wrapper">\n                ${e?'<div class="label-wrapper"><slot name="label"></slot></div>':""}\n                <div class="select-container ${t?"is-invalid":""}" tabindex="0">\n                    <div class="value-display">${this.getDisplayText()}</div>\n                    <div class="chevron-icon" part="chevron-icon">\n                        ${s}\n                    </div>\n                </div>\n                ${e?"":'<div class="label-wrapper"><slot name="label"></slot></div>'}\n                <div class="dropdown" part="dropdown">\n                    ${this.getOptions().map(e=>`\n                        <div class="dropdown-item ${n.has(e.value)?"selected":""}" data-value="${e.value}">\n                            ${e.label}\n                        </div>\n                    `).join("")}\n                </div>\n            </div>\n        `}}customElements.get("y-select")||customElements.define("y-select",_);class S extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["value","min","max","step","size","color","disabled","name","orientation"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this._dragging=!1}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("min")||this.setAttribute("min","0"),this.hasAttribute("max")||this.setAttribute("max","100"),this.hasAttribute("value")||this.setAttribute("value","50"),this._internals.setFormValue(this.value),this.render(),this._bindEvents()}attributeChangedCallback(e,t,n){t!==n&&("value"!==e&&"name"!==e||this._internals.setFormValue(this.value,this.getAttribute("name")),"value"===e&&this.shadowRoot.querySelector(".slider-track")?this._updateVisuals():(this.render(),this._bindEvents()))}get value(){const e=parseFloat(this.getAttribute("value"));return Number.isNaN(e)?0:e}set value(e){const t=Math.max(this.min,Math.min(this.max,Number(e))),n=this._snapToStep(t);this.setAttribute("value",String(n))}get min(){return parseFloat(this.getAttribute("min"))||0}set min(e){this.setAttribute("min",String(e))}get max(){return parseFloat(this.getAttribute("max"))||100}set max(e){this.setAttribute("max",String(e))}get step(){const e=parseFloat(this.getAttribute("step"));return Number.isNaN(e)||e<=0?null:e}set step(e){null==e?this.removeAttribute("step"):this.setAttribute("step",String(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||"primary"}set color(e){this.setAttribute("color",e)}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get orientation(){return this.getAttribute("orientation")||"horizontal"}set orientation(e){this.setAttribute("orientation",e)}get percentage(){const e=this.max-this.min;if(e<=0)return 0;const t=(this.value-this.min)/e*100;return Math.max(0,Math.min(100,t))}_snapToStep(e){if(!this.step)return e;const t=Math.round((e-this.min)/this.step);return Math.max(this.min,Math.min(this.max,this.min+t*this.step))}getTrackColor(e){return{primary:"var(--primary-background-hover)",secondary:"var(--secondary-background-hover)",base:"var(--base-background-active)",success:"var(--success-background-hover)",warning:"var(--warning-background-hover)",error:"var(--error-background-hover)",help:"var(--help-background-hover)"}[e]||e}getThumbColor(e){return{primary:"var(--primary-content--)",secondary:"var(--secondary-content--)",base:"var(--base-content--)",success:"var(--success-content--)",warning:"var(--warning-content--)",error:"var(--error-content--)",help:"var(--help-content--)"}[e]||e}getSizeVars(e){const t={small:{trackHeight:"var(--sizing-small, 27px)"},medium:{trackHeight:"var(--sizing-medium, 35px)"},large:{trackHeight:"var(--sizing-large, 51px)"}};return t[e]||t.medium}_bindEvents(){const e=this.shadowRoot.querySelector(".slider-track"),t=this.shadowRoot.querySelector(".thumb");if(!e||!t)return;const n=e=>{this.disabled||(e.preventDefault(),this._dragging=!0,this._updateFromPointer(e),document.addEventListener("pointermove",r),document.addEventListener("pointerup",o))},r=e=>{this._dragging&&this._updateFromPointer(e)},o=()=>{this._dragging=!1,document.removeEventListener("pointermove",r),document.removeEventListener("pointerup",o),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))};e.addEventListener("pointerdown",n),t.addEventListener("pointerdown",n),e.addEventListener("keydown",e=>{if(this.disabled)return;const t=this.step||1;let n=!0;switch(e.key){case"ArrowRight":case"ArrowUp":this.value=this.value+t;break;case"ArrowLeft":case"ArrowDown":this.value=this.value-t;break;case"Home":this.value=this.min;break;case"End":this.value=this.max;break;default:n=!1}n&&(e.preventDefault(),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))})}_updateFromPointer(e){const t=this.shadowRoot.querySelector(".slider-track"),n=(this.shadowRoot.querySelector(".slider-inner")||t).getBoundingClientRect(),r=Math.max(0,Math.min(1,(e.clientX-n.left)/n.width)),o=this.min+r*(this.max-this.min);this.value=o,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}_updateVisuals(){const e=this.percentage,t=this.shadowRoot.querySelector(".fill"),n=this.shadowRoot.querySelector(".thumb"),r=this.shadowRoot.querySelector(".slider-track");t&&(t.style.width=`${e}%`),n&&(n.style.left=`${e}%`),r&&r.setAttribute("aria-valuenow",String(this.value))}render(){const e=this.percentage,t=this.getTrackColor(this.color),n=this.getThumbColor(this.color),{trackHeight:r}=this.getSizeVars(this.size),o=this.disabled;this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-block;\n                    width: var(--component-slider-width, 129px);\n                    font-family: var(--font-family-body);\n                    color: var(--base-content--);\n                    opacity: ${o?"0.5":"1"};\n                    pointer-events: ${o?"none":"auto"};\n                }\n\n                .slider-wrapper {\n                    display: flex;\n                    flex-direction: column;\n                    gap: var(--spacing-2x-small, 4px);\n                }\n\n                .slider-track {\n                    position: relative;\n                    width: 100%;\n                    height: ${r};\n                    background: var(--base-background-component);\n                    border: var(--component-slider-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-slider-border-radius-outer);\n                    box-sizing: border-box;\n                    padding: var(--component-slider-padding);\n                    cursor: pointer;\n                    outline: none;\n                }\n\n                .slider-track:focus-visible {\n                    border-color: ${n};\n                }\n\n                .slider-inner {\n                    position: relative;\n                    width: 100%;\n                    height: 100%;\n                    overflow: hidden;\n                }\n\n                .fill {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    height: 100%;\n                    background: ${t};\n                    border-radius: var(--component-slider-border-radius-inner) 0 0 var(--component-slider-border-radius-inner);\n                    width: ${e}%;\n                    pointer-events: none;\n                }\n\n                .thumb {\n                    position: absolute;\n                    top: 0;\n                    left: ${e}%;\n                    transform: translateX(-50%);\n                    width: 8px;\n                    height: 100%;\n                    background: ${n};\n                    border-radius: var(--component-slider-thumb-border-radius);\n                    cursor: grab;\n                    z-index: 1;\n                    touch-action: none;\n                }\n\n                .thumb:active {\n                    cursor: grabbing;\n                }\n            </style>\n\n            <div class="slider-wrapper">\n                <div\n                    class="slider-track"\n                    part="track"\n                    role="slider"\n                    tabindex="${o?"-1":"0"}"\n                    aria-valuenow="${this.value}"\n                    aria-valuemin="${this.min}"\n                    aria-valuemax="${this.max}"\n                    ${this.step?`aria-valuestep="${this.step}"`:""}\n                    aria-orientation="${this.orientation}"\n                    ${o?'aria-disabled="true"':""}\n                >\n                    <div class="slider-inner">\n                        <div class="fill" part="fill"></div>\n                        <div class="thumb" part="thumb"></div>\n                    </div>\n                </div>\n            </div>\n        `}}customElements.get("y-slider")||customElements.define("y-slider",S);class L extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["checked","disabled","animate","toggle-label","label-display","label-position","size","value"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("label-display")||this.setAttribute("label-display","true"),this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this.hasAttribute("animate")||this.setAttribute("animate","true"),this.render(),this.mirrorToggleLabels();const e=this.shadowRoot.querySelector(".switch");e.addEventListener("click",()=>this.toggle()),e.addEventListener("keydown",e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),this.toggle())})}attributeChangedCallback(e,t,n){t!==n&&this.update()}get checked(){return this.hasAttribute("checked")}set checked(e){e?this.setAttribute("checked",""):this.removeAttribute("checked"),this.update()}get value(){return this.getAttribute("value")||"on"}set value(e){this.setAttribute("value",e),this.update()}toggle(){this.hasAttribute("disabled")||(this.checked=!this.checked,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}labelTag(e){if("false"===this.getAttribute("label-display"))return"";const t=this.getAttribute("label-position");return"top"===e&&("top"===t||"left"===t)||"bottom"===e&&("bottom"===t||"right"===t)?'<label><slot name="label"></slot></label>':""}mirrorToggleLabels(){requestAnimationFrame(()=>{const e=this.shadowRoot?.querySelector(".toggle");if(!e)return;e.innerHTML="";const t=this.querySelector('[slot="off-label"]'),n=this.querySelector('[slot="on-label"]'),r=document.createTextNode("Off"),o=document.createTextNode("On"),a=t?.cloneNode(!0)||r,i=n?.cloneNode(!0)||o,s=document.createElement("span");s.className="off",s.appendChild(a);const c=document.createElement("span");c.className="on",c.appendChild(i),e.appendChild(s),e.appendChild(c)})}update(){this.updateSizeStyles(),this.updateTogglePosition(),this.updateToggleLabelDisplay(),this.updateLabelDisplay(),this.updateDirection(),this.updateAria(),this.updateFormValue(),this.mirrorToggleLabels()}updateSizeStyles(){const e=this.getAttribute("size")||"medium";this.style.setProperty("--switch-height",{small:"24px",medium:"32px",large:"40px"}[e]),this.style.setProperty("--switch-width-fixed",{small:"44px",medium:"56px",large:"72px"}[e]),this.style.setProperty("--toggle-size","calc(var(--switch-height) - (var(--switch-padding) * 2) - (var(--component-switch-border-width, 0px) * 2))"),this.style.setProperty("--switch-font-size",{small:"var(--font-size-small)",medium:"var(--font-size-label)",large:"var(--font-size-h4)"}[e])}updateTogglePosition(){const e=this.checked,t=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--toggle-x",e?t?"100%":"calc(var(--switch-width) - var(--toggle-size) - (var(--switch-padding) * 2) - (var(--component-switch-border-width, 0px) * 2))":"0"),this.style.setProperty("--toggle-bg",e?"var(--primary-content--)":"var(--base-content-light)"),this.style.setProperty("--toggle-transition","false"===this.getAttribute("animate")?"none":"transform 0.25s ease, background 0.25s ease")}updateLabelDisplay(){const e=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--show-labels",e?"flex":"none")}updateToggleLabelDisplay(){const e=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--show-toggle-label",e?"inline-flex":"none"),this.style.setProperty("--switch-width",e?"max-content":"var(--switch-width-fixed)"),this.style.setProperty("--toggle-width",e?"auto":"var(--toggle-size)"),this.style.setProperty("--toggle-padding",e?"0 var(--spacing-small)":"0"),this.style.setProperty("--toggle-radius",e?"var(--component-switch-border-radius)":"9999px")}updateDirection(){const e=this.getAttribute("label-position");this.style.setProperty("--switch-dir",{top:"column",bottom:"column-reverse",left:"row-reverse",right:"row"}[e]||"column")}updateAria(){const e=this.shadowRoot?.querySelector(".switch");e&&(e.setAttribute("aria-checked",this.checked),e.setAttribute("aria-disabled",this.disabled?"true":"false"))}updateFormValue(){this._internals.setFormValue(this.checked?this.value:"")}render(){this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-flex;\n                    flex-direction: var(--switch-dir, column);\n                    align-items: center;\n                    gap: var(--spacing-x-small);\n                    font-family: var(--font-family-body);\n                    --switch-padding: var(--component-switch-padding, 2px);\n                    --show-labels: flex;\n                    --show-toggle-label: none;\n                    --switch-width: max-content;\n                    --toggle-width: auto;\n                    --toggle-padding: 0 var(--spacing-small);\n                    --toggle-radius: var(--component-switch-border-radius);\n                }\n\n                .label {\n                    font-size: var(--font-size-label);\n                    color: var(--base-content--);\n                }\n\n                .switch {\n                    position: relative;\n                    display: inline-flex;\n                    align-items: center;\n                    background: var(--base-background-component);\n                    border: var(--component-switch-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-switch-border-radius);\n                    cursor: pointer;\n                    height: var(--switch-height);\n                    font-size: var(--switch-font-size);\n                    box-sizing: border-box;\n                    padding: var(--switch-padding);\n                    width: var(--switch-width, max-content);\n                }\n\n                .track {\n                    display: flex;\n                    align-items: center;\n                    height: 100%;\n                    position: relative;\n                    z-index: 0;\n                }\n\n                .label-content {\n                    flex: 0 0 auto;\n                    align-items: center;\n                    justify-content: center;\n                    padding: 0 var(--spacing-small);\n                    white-space: nowrap;\n                    position: relative;\n                    z-index: 0;\n                    color: var(--base-content-light);\n                    display: var(--show-labels, flex);\n                }\n\n                .toggle {\n                    position: absolute;\n                    top: var(--switch-padding);\n                    bottom: var(--switch-padding);\n                    left: var(--switch-padding);\n                    height: calc(100% - (var(--switch-padding) + var(--switch-padding)));\n                    width: var(--toggle-width, auto);\n                    background: var(--toggle-bg, var(--base-content-light));\n                    color: var(--base-background-component);\n                    border-radius: var(--toggle-radius, var(--component-switch-border-radius));\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    padding: var(--toggle-padding, 0 var(--spacing-small));\n                    font-weight: 500;\n                    z-index: 1;\n                    white-space: nowrap;\n                    transform: translateX(var(--toggle-x, 0));\n                    transition: var(--toggle-transition, transform 0.25s ease, background 0.25s ease);\n                }\n\n                .toggle .on,\n                .toggle .off {\n                    display: none;\n                }\n\n                :host([checked]) .toggle .on {\n                    display: var(--show-toggle-label, none);\n                }\n\n                :host(:not([checked])) .toggle .off {\n                    display: var(--show-toggle-label, none);\n                }\n\n\n                :host([animate="false"]) .toggle {\n                    transition: none !important;\n                }\n            </style>\n\n            ${this.labelTag("top")}\n\n            <div class="switch" part="switch" tabindex="0" role="switch" aria-checked="${this.checked}" aria-disabled="${this.disabled}">\n                <div class="track">\n                    <div class="label-content"><slot name="off-label">Off</slot></div>\n                    <div class="label-content"><slot name="on-label">On</slot></div>\n                </div>\n                <div class="toggle" part="toggle">\n                    <span class="off"></span>\n                    <span class="on"></span>\n                </div>\n            </div>\n\n            ${this.labelTag("bottom")}\n        `,this.update()}}customElements.get("y-switch")||customElements.define("y-switch",L);class $ extends HTMLElement{static get observedAttributes(){return["columns","data","striped","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this._sortField=null,this._sortDir="none",this._parsedData=[],this._parsedColumns=[]}connectedCallback(){this._parseAttributes(),this.render()}attributeChangedCallback(e,t,n){t!==n&&(this._parseAttributes(),this.render())}get columns(){return this.getAttribute("columns")}set columns(e){this.setAttribute("columns","string"==typeof e?e:JSON.stringify(e))}get data(){return this.getAttribute("data")}set data(e){this.setAttribute("data","string"==typeof e?e:JSON.stringify(e))}get striped(){return this.hasAttribute("striped")}set striped(e){e?this.setAttribute("striped",""):this.removeAttribute("striped")}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}_parseAttributes(){try{this._parsedColumns=JSON.parse(this.columns||"[]")}catch{this._parsedColumns=[]}try{this._parsedData=JSON.parse(this.data||"[]")}catch{this._parsedData=[]}}_onHeaderClick(e){this._sortField===e?(this._sortDir="asc"===this._sortDir?"desc":"desc"===this._sortDir?"none":"asc","none"===this._sortDir&&(this._sortField=null)):(this._sortField=e,this._sortDir="asc"),this.dispatchEvent(new CustomEvent("sort",{detail:{field:this._sortField,direction:this._sortDir},bubbles:!0,composed:!0})),this.render()}_getSortedData(){const e=[...this._parsedData];if(!this._sortField||"none"===this._sortDir)return e;const t="asc"===this._sortDir?1:-1,n=this._sortField;return e.sort((e,r)=>{const o=e[n],a=r[n];return null==o&&null==a?0:null==o?1:null==a?-1:"number"==typeof o&&"number"==typeof a?(o-a)*t:String(o).localeCompare(String(a))*t})}_sortIcon(e){const t=this._sortField===e?this._sortDir:"none";return function(e,t){return`<svg class="sort-icon" xmlns="http://www.w3.org/2000/svg" width="12" height="16" viewBox="0 0 12 16" aria-hidden="true">\n            <path d="M6 1 L11 7 L1 7 Z" fill="${e}"/>\n            <path d="M6 15 L11 9 L1 9 Z" fill="${t}"/>\n        </svg>`}("asc"===t?"var(--component-table-color, #f7f7fa)":"var(--component-table-color-light, #acaeb2)","desc"===t?"var(--component-table-color, #f7f7fa)":"var(--component-table-color-light, #acaeb2)")}render(){const e=this._parsedColumns,t=this._getSortedData(),n=this.size,r=this.striped,o=`var(--component-table-padding-${n}, 8px)`;this.shadowRoot.innerHTML="";const a=document.createElement("style");a.textContent=`\n            :host {\n                display: block;\n                font-family: var(--font-family-body, sans-serif);\n                color: var(--component-table-color, #f7f7fa);\n            }\n\n            .table-wrapper {\n                overflow-x: auto;\n            }\n\n            table {\n                width: 100%;\n                border-collapse: collapse;\n                table-layout: auto;\n            }\n\n            thead th {\n                position: relative;\n                padding: ${o};\n                text-align: left;\n                font-weight: 500;\n                font-size: var(--font-size-paragraph, 1em);\n                white-space: nowrap;\n                background: transparent;\n                border-bottom: var(--component-table-border-width-header, 2px) solid var(--component-table-border-color, #37383a);\n                user-select: none;\n            }\n\n            thead th.sortable {\n                cursor: pointer;\n            }\n\n            thead th.sortable:hover {\n                background: var(--component-table-hover-background, #292a2b);\n            }\n\n            .th-content {\n                display: inline-flex;\n                align-items: center;\n                gap: 6px;\n            }\n\n            .sort-icon {\n                flex-shrink: 0;\n                vertical-align: middle;\n            }\n\n            tbody td {\n                padding: ${o};\n                font-size: var(--font-size-paragraph, 1em);\n                border-bottom: var(--component-table-border-width, 2px) solid var(--component-table-border-color, #37383a);\n            }\n\n            tbody tr:last-child td {\n                border-bottom: none;\n            }\n\n            tbody td.row-header {\n                font-weight: 500;\n            }\n\n            ${r?"tbody tr:nth-child(even) {\n                    background: var(--component-table-hover-background, #292a2b);\n                }":""}\n\n            tbody tr:hover {\n                background: var(--component-table-active-background, #46474a);\n            }\n        `,this.shadowRoot.appendChild(a);const i=document.createElement("div");i.className="table-wrapper";const s=document.createElement("table");s.setAttribute("role","grid"),s.setAttribute("part","table");const c=document.createElement("thead");c.setAttribute("part","header");const l=document.createElement("tr");e.forEach(e=>{const t=document.createElement("th");t.setAttribute("scope","col");const n=!1!==e.sortable;n&&(t.classList.add("sortable"),t.setAttribute("aria-sort",this._sortField===e.field?"asc"===this._sortDir?"ascending":"desc"===this._sortDir?"descending":"none":"none"),t.addEventListener("click",()=>this._onHeaderClick(e.field)));const r=document.createElement("span");if(r.className="th-content",r.textContent=e.header||e.field,n){const t=document.createElement("span");t.innerHTML=this._sortIcon(e.field),r.appendChild(t)}t.appendChild(r),l.appendChild(t)}),c.appendChild(l),s.appendChild(c);const d=document.createElement("tbody");t.forEach(t=>{const n=document.createElement("tr");n.setAttribute("part","row"),e.forEach((e,r)=>{const o=document.createElement("td");o.setAttribute("part","cell"),(e.rowHeader||0===r)&&o.classList.add("row-header"),o.textContent=t[e.field]??"",n.appendChild(o)}),d.appendChild(n)}),s.appendChild(d),i.appendChild(s),this.shadowRoot.appendChild(i)}}customElements.get("y-table")||customElements.define("y-table",$);class T extends HTMLElement{static get observedAttributes(){return["removable","color","style-type","shape"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}render(){const e=this.hasAttribute("removable"),t=this.getAttribute("color")||"base",n=this.getAttribute("style-type")||"filled",r=this.getAttribute("shape")||"square",o=document.createElement("style");o.textContent=this.getStyle(t,n,r),this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(o),this.shadowRoot.innerHTML+=`\n            <span class="tag" part="tag">\n                <slot></slot>\n                ${e?'\n                    <button class="remove" part="remove" aria-label="Remove tag">\n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="14" height="14" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"><line x1="6" y1="6" x2="14" y2="14" /><line x1="14" y1="6" x2="6" y2="14" /></svg>\n                    </button>\n                ':""}\n            </span>\n        `,e&&this.shadowRoot.querySelector(".remove").addEventListener("click",e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("remove",{bubbles:!0,composed:!0}))})}getStyle(e,t,n){const r={primary:["--primary-content--","--primary-content-hover","--primary-background-component","--primary-content-inverse"],secondary:["--secondary-content--","--secondary-content-hover","--secondary-background-component","--secondary-content-inverse"],base:["--base-content--","--base-content-lighter","--base-background-component","--base-content-inverse"],success:["--success-content--","--success-content-hover","--success-background-component","--success-content-inverse"],error:["--error-content--","--error-content-hover","--error-background-component","--error-content-inverse"],warning:["--warning-content--","--warning-content-hover","--warning-background-component","--warning-content-inverse"],help:["--help-content--","--help-content-hover","--help-background-component","--help-content-inverse"]},[o,a,i,s]=r[e]||r.base,c={filled:`\n                .tag {\n                    background: var(${o});\n                    color: var(${s});\n                }\n                .remove {\n                    color: var(${s});\n                }\n            `,outlined:`\n                .tag {\n                    border: 1px solid var(${o});\n                    background: transparent;\n                    color: var(${o});\n                }\n                .remove {\n                    color: var(${o});\n                }\n            `,flat:`\n                .tag {\n                    background: transparent;\n                    color: var(${o});\n                }\n                .remove {\n                    color: var(${o});\n                }\n            `};return`\n            :host {\n                display: inline-block;\n                font-family: var(--font-family-body, sans-serif);\n                font-size: var(--font-size-label, 0.83em);\n            }\n            .tag {\n                display: inline-flex;\n                align-items: center;\n                gap: var(--spacing-2x-small);\n                padding: 0 var(--component-tag-padding-medium, var(--spacing-x-small));\n                border: 1px solid transparent;\n                transition: background-color 0.2s, color 0.2s;\n                border-radius: ${"round"===n?"var(--component-tag-border-radius-circle)":"var(--component-tag-border-radius-square)"};\n            }\n            .remove {\n                all: unset;\n                cursor: pointer;\n                display: flex;\n                align-items: center;\n            }\n            .remove svg {\n                pointer-events: none;\n            }\n        `+(c[t]||c.filled)}}customElements.get("y-tag")||customElements.define("y-tag",T);class M extends HTMLElement{static get observedAttributes(){return["options","size","position"]}constructor(){super(),this.attachShadow({mode:"open"}),this._activeTab=""}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("position")||this.setAttribute("position","top"),this.render()}attributeChangedCallback(e,t,n){"options"!==e&&"size"!==e&&"position"!==e||t===n||this.render()}get options(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch{return[]}}set options(e){this.setAttribute("options",JSON.stringify(e)),this.render()}get size(){const e=this.getAttribute("size");return["small","medium","large"].includes(e)?e:"medium"}set size(e){["small","medium","large"].includes(e)?this.setAttribute("size",e):this.setAttribute("size","medium")}get position(){const e=this.getAttribute("position");return["top","bottom","left","right"].includes(e)?e:"top"}set position(e){["top","bottom","left","right"].includes(e)?this.setAttribute("position",e):this.setAttribute("position","top")}activateTab(e){const t=this.options.find(t=>t.id===e);t&&!t.disabled&&this._activeTab!==e&&(this._activeTab=e,this.render())}_setupEvents(){const e=Array.from(this.shadowRoot.querySelectorAll("button"));e.forEach(t=>{t.disabled||(t.addEventListener("click",()=>this.activateTab(t.dataset.id)),t.addEventListener("keydown",t=>{this._handleTabKeydown(t,e)}))})}_handleTabKeydown(e,t){const n=t.indexOf(e.currentTarget);"ArrowRight"===e.key?(e.preventDefault(),this._findSiblingButton(t,n,1)?.focus()):"ArrowLeft"===e.key?(e.preventDefault(),this._findSiblingButton(t,n,-1)?.focus()):"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.activateTab(e.currentTarget.dataset.id))}_findSiblingButton(e,t,n){for(let r=1;r<=e.length;r++){const o=e[(t+r*n+e.length)%e.length];if(!o.disabled)return o}return null}_resolveActiveTab(e){const t=!this._activeTab||e.find(e=>e.id===this._activeTab)?.disabled;e.length&&t&&(this._activeTab=e.find(e=>!e.disabled)?.id||"")}_getStyles(){return`\n            :host {\n                display: flex;\n                font-family: var(--component-tabs-font-family, var(--font-family-body));\n            }\n            :host([position="top"]) { flex-direction: column; }\n            :host([position="bottom"]) { flex-direction: column-reverse; }\n            :host([position="left"]) { flex-direction: row; }\n            :host([position="right"]) { flex-direction: row-reverse; }\n\n            .tablist {\n                display: flex;\n                gap: 0;\n                position: relative;\n                z-index: 1;\n            }\n            :host([position="top"])    .tablist { margin-bottom: -1px; margin-top: 0; }\n            :host([position="bottom"]) .tablist { margin-top: -1px; margin-bottom: 0; }\n            :host([position="left"])   .tablist { flex-direction: column; margin-right: -1px; margin-left: 0; }\n            :host([position="right"])  .tablist { flex-direction: column; margin-left: -1px; margin-right: 0; }\n\n            :host([position="top"])    .tablist button { border-bottom: none; }\n            :host([position="bottom"]) .tablist button { border-top: none; }\n            :host([position="left"])   .tablist button { border-right: none; }\n            :host([position="right"])  .tablist button { border-left: none; }\n\n            button {\n                background: var(--component-tabs-border-color);\n                color: var(--component-tabs-color);\n                border: var(--component-tab-border-width) solid var(--component-tabs-border-color);\n                margin: 0;\n                padding: ${`var(--component-tab-padding-${this.size})`};\n                cursor: pointer;\n                font-size: var(--font-size-label);\n                display: inline-flex;\n                align-items: center;\n                gap: ${`var(--component-tab-gap-${this.size})`};\n                transition: background 0.2s ease;\n                outline: none;\n                font-family: inherit;\n            }\n            :host([position="top"])    .tablist button:first-child { border-top-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="top"])    .tablist button:last-child  { border-top-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="bottom"]) .tablist button:first-child { border-bottom-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="bottom"]) .tablist button:last-child  { border-bottom-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="left"])   .tablist button:first-child   { border-top-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="left"])   .tablist button:last-child    { border-bottom-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="right"])  .tablist button:first-child  { border-top-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="right"])  .tablist button:last-child   { border-bottom-right-radius: var(--component-tab-border-radius-outer); }\n\n            button[aria-selected="true"] {\n                background: var(--component-tabs-background);\n            }\n            button:focus-visible {\n                outline: 2px solid var(--component-tabs-accent);\n                outline-offset: -1px;\n            }\n            button[disabled] {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n            .icon-slot {\n                display: inline-flex;\n                align-items: center;\n                margin: 0 4px;\n            }\n            .tabpanel {\n                position: relative;\n                z-index: 0;\n                border: var(--component-tab-border-width) solid var(--component-tabs-border-color);\n                border-radius: var(--component-tab-border-radius-outer);\n                padding: var(--component-tab-content-padding);\n                background: var(--component-tabs-background);\n            }\n            :host([position="top"])    .tabpanel { border-top-left-radius: 0; }\n            :host([position="bottom"]) .tabpanel { border-bottom-left-radius: 0; }\n            :host([position="left"])   .tabpanel { border-top-left-radius: 0; }\n            :host([position="right"])  .tabpanel { border-top-right-radius: 0; }\n            :host([position="top"])    .tabpanel { margin-top: -1px; }\n            :host([position="bottom"]) .tabpanel { margin-bottom: -1px; }\n            :host([position="left"])   .tabpanel { margin-left: -1px; }\n            :host([position="right"])  .tabpanel { margin-right: -1px; }\n        `}_createTabButton(e){const t=e.id===this._activeTab,n=!!e.disabled,r=document.createElement("button");if(r.id=`tab-${e.id}`,r.setAttribute("role","tab"),r.setAttribute("part","tab"),r.setAttribute("aria-selected",t),r.setAttribute("aria-controls",`panel-${e.id}`),r.setAttribute("aria-disabled",n),n&&(r.disabled=!0),r.tabIndex=t&&!n?0:-1,r.dataset.id=e.id,this.querySelector(`[slot="left-icon-${e.id}"]`)){const t=document.createElement("slot");t.name=`left-icon-${e.id}`,t.className="icon-slot",r.appendChild(t)}const o=document.createElement("span");if(o.textContent=e.label,r.appendChild(o),this.querySelector(`[slot="right-icon-${e.id}"]`)){const t=document.createElement("slot");t.name=`right-icon-${e.id}`,t.className="icon-slot",r.appendChild(t)}return r}_createPanel(e){const t=document.createElement("div");t.className="tabpanel",t.id=`panel-${this._activeTab}`,t.setAttribute("role","tabpanel"),t.setAttribute("part","content"),t.setAttribute("aria-labelledby",`tab-${this._activeTab}`);const n=document.createElement("slot");return n.name=e,t.appendChild(n),t}render(){const e=this.options;this._resolveActiveTab(e);const t=e.find(e=>e.id===this._activeTab);this.shadowRoot.innerHTML="";const n=document.createElement("style");n.textContent=this._getStyles(),this.shadowRoot.appendChild(n);const r=document.createElement("div");r.className="tablist",r.setAttribute("role","tablist"),r.setAttribute("part","tablist"),e.forEach(e=>r.appendChild(this._createTabButton(e))),this.shadowRoot.appendChild(r),this.shadowRoot.appendChild(this._createPanel(t?.slot||"")),this._setupEvents()}}customElements.get("y-tabs")||customElements.define("y-tabs",M);class R extends HTMLElement{static get observedAttributes(){return["position","duration","max"]}constructor(){super(),this.attachShadow({mode:"open"}),this._queue=[]}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get position(){return this.getAttribute("position")||"bottom-right"}set position(e){this.setAttribute("position",e)}get duration(){return parseInt(this.getAttribute("duration")??"4000",10)}set duration(e){this.setAttribute("duration",String(e))}get max(){return parseInt(this.getAttribute("max")??"5",10)}set max(e){this.setAttribute("max",String(e))}show(e={}){const{message:t="",color:n="base",duration:r=this.duration,dismissible:o=!0,icon:a=null}=e,i=this.shadowRoot.querySelector(".toast-container");if(!i)return null;const s=i.querySelectorAll(".toast");s.length>=this.max&&this._removeToast(s[0]);const c=document.createElement("div");c.className=`toast color-${n}`,c.setAttribute("role","alert"),c.setAttribute("aria-live","assertive"),c.setAttribute("part","toast");const l=this._getColorBg(n),d=h(p(l,this));if(c.style.backgroundColor=l,c.style.color=d,a){const e=document.createElement("i");e.className=`toast-icon ${a}`,e.setAttribute("part","icon"),c.appendChild(e)}const b=document.createElement("span");if(b.className="toast-message",b.setAttribute("part","message"),b.textContent=t,c.appendChild(b),o){const e=document.createElement("button");e.className="toast-close",e.setAttribute("aria-label","Dismiss"),e.innerHTML="&#215;",e.addEventListener("click",()=>this._removeToast(c)),c.appendChild(e)}return i.appendChild(c),requestAnimationFrame(()=>{c.classList.add("visible")}),r>0&&(c._timeout=setTimeout(()=>this._removeToast(c),r)),this.dispatchEvent(new CustomEvent("y-toast-show",{detail:{message:t,color:n},bubbles:!0})),c}clear(){const e=this.shadowRoot.querySelector(".toast-container");e&&e.querySelectorAll(".toast").forEach(e=>this._removeToast(e))}_removeToast(e){e&&!e._removing&&(e._removing=!0,clearTimeout(e._timeout),e.classList.remove("visible"),e.classList.add("exit"),e.addEventListener("transitionend",()=>{e.remove(),this.dispatchEvent(new CustomEvent("y-toast-dismiss",{bubbles:!0}))},{once:!0}),setTimeout(()=>{e.parentNode&&e.remove()},350))}_getPositionStyles(){const e="position: fixed; z-index: var(--component-toast-z-index, 9000); display: flex; flex-direction: column; gap: var(--spacing-small, 6px); pointer-events: none; max-width: 420px; min-width: 280px;",t="var(--component-toast-offset, var(--spacing-x-large, 16px))",n={"top-right":`${e} top: ${t}; right: ${t}; align-items: flex-end;`,"top-left":`${e} top: ${t}; left: ${t}; align-items: flex-start;`,"top-center":`${e} top: ${t}; left: 50%; transform: translateX(-50%); align-items: center;`,"bottom-right":`${e} bottom: ${t}; right: ${t}; align-items: flex-end;`,"bottom-left":`${e} bottom: ${t}; left: ${t}; align-items: flex-start;`,"bottom-center":`${e} bottom: ${t}; left: 50%; transform: translateX(-50%); align-items: center;`};return n[this.position]||n["bottom-right"]}_getColorBg(e){const t={base:"var(--base-content--, #fff)",primary:"var(--primary-content--, #0070f3)",secondary:"var(--secondary-content--, #6c757d)",success:"var(--success-content--, #28a745)",warning:"var(--warning-content--, #ffc107)",error:"var(--error-content--, #dc3545)",help:"var(--help-content--, #6f42c1)"};return t[e]||t.base}render(){this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    font-family: var(--font-family-body, sans-serif);\n                }\n\n                .toast-container {\n                    ${this._getPositionStyles()}\n                }\n\n                .toast {\n                    pointer-events: auto;\n                    display: flex;\n                    align-items: center;\n                    gap: var(--spacing-medium, 8px);\n                    padding: var(--component-toast-padding, var(--spacing-medium, 8px));\n                    border-radius: var(--component-toast-border-radius, var(--radii-small, 4px));\n                    font-size: var(--font-size-paragraph, 1em);\n                    line-height: 1.4;\n                    opacity: 0;\n                    transform: translateY(8px);\n                    transition: opacity 0.25s ease, transform 0.25s ease;\n                    box-shadow: var(--base-shadow, 0 2px 6px rgba(0,0,0,0.15));\n                }\n\n                .toast.visible {\n                    opacity: 1;\n                    transform: translateY(0);\n                }\n\n                .toast.exit {\n                    opacity: 0;\n                    transform: translateY(-8px);\n                }\n\n                .toast-icon {\n                    flex-shrink: 0;\n                    font-size: 1.1em;\n                }\n\n                .toast-message {\n                    flex: 1;\n                }\n\n                .toast-close {\n                    flex-shrink: 0;\n                    align-self: flex-start;\n                    background: none;\n                    border: none;\n                    color: inherit;\n                    font-size: 1.2em;\n                    cursor: pointer;\n                    padding: 0 0 0 var(--spacing-small, 6px);\n                    opacity: 0.7;\n                    line-height: 1;\n                }\n                .toast-close:hover {\n                    opacity: 1;\n                }\n            </style>\n            <div class="toast-container"></div>\n        `}}customElements.get("y-toast")||customElements.define("y-toast",R);class P extends HTMLElement{static get observedAttributes(){return["text","position","delay","color"]}constructor(){super(),this.attachShadow({mode:"open"}),this._showTimeout=null,this._hideTimeout=null,this._visible=!1,this._onMouseEnter=this._onMouseEnter.bind(this),this._onMouseLeave=this._onMouseLeave.bind(this),this._onFocusIn=this._onFocusIn.bind(this),this._onFocusOut=this._onFocusOut.bind(this),this._onKeyDown=this._onKeyDown.bind(this)}connectedCallback(){this.render(),this.addEventListener("mouseenter",this._onMouseEnter),this.addEventListener("mouseleave",this._onMouseLeave),this.addEventListener("focusin",this._onFocusIn),this.addEventListener("focusout",this._onFocusOut),document.addEventListener("keydown",this._onKeyDown)}disconnectedCallback(){this.removeEventListener("mouseenter",this._onMouseEnter),this.removeEventListener("mouseleave",this._onMouseLeave),this.removeEventListener("focusin",this._onFocusIn),this.removeEventListener("focusout",this._onFocusOut),document.removeEventListener("keydown",this._onKeyDown),clearTimeout(this._showTimeout),clearTimeout(this._hideTimeout)}attributeChangedCallback(e,t,n){t!==n&&this.render()}get text(){return this.getAttribute("text")||""}set text(e){this.setAttribute("text",e)}get position(){return this.getAttribute("position")||"top"}set position(e){this.setAttribute("position",e)}get delay(){return parseInt(this.getAttribute("delay")??"200",10)}set delay(e){this.setAttribute("delay",String(e))}get color(){return this.getAttribute("color")||"base"}set color(e){this.setAttribute("color",e)}show(){clearTimeout(this._hideTimeout),this._showTimeout=setTimeout(()=>{this._visible=!0;const e=this.shadowRoot.querySelector(".tooltip");if(e){const t=p(this._getBg(),this);e.style.color=h(t),e.classList.add("visible")}},this.delay)}hide(){clearTimeout(this._showTimeout),this._visible=!1;const e=this.shadowRoot.querySelector(".tooltip");e&&e.classList.remove("visible")}_onMouseEnter(){this.show()}_onMouseLeave(){this.hide()}_onFocusIn(){this.show()}_onFocusOut(){this.hide()}_onKeyDown(e){"Escape"===e.key&&this._visible&&this.hide()}_getBg(){const e={base:"var(--base-content--, #555)",primary:"var(--primary-content--, #0070f3)",secondary:"var(--secondary-content--, #6c757d)",success:"var(--success-content--, #28a745)",warning:"var(--warning-content--, #ffc107)",error:"var(--error-content--, #dc3545)",help:"var(--help-content--, #6f42c1)"};return e[this.color]||e.base}render(){const e=this.position,t=this._getBg(),n=h(p(t,this));this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-block;\n                    position: relative;\n                    font-family: var(--font-family-body, sans-serif);\n                }\n\n                .trigger {\n                    display: inline-block;\n                }\n\n                .tooltip {\n                    position: absolute;\n                    z-index: var(--component-tooltip-z-index, 7000);\n                    white-space: nowrap;\n                    pointer-events: none;\n                    opacity: 0;\n                    transform: scale(0.95);\n                    transition: opacity 0.15s ease, transform 0.15s ease;\n                    padding: var(--component-tooltip-padding, var(--spacing-x-small, 4px)) var(--component-tooltip-padding-h, var(--spacing-medium, 8px));\n                    border-radius: var(--component-tooltip-border-radius, var(--radii-small, 4px));\n                    font-size: var(--font-size-small, 0.8em);\n                    background: ${t};\n                    color: ${n};\n                    line-height: 1.4;\n                }\n\n                .tooltip.visible {\n                    opacity: 1;\n                    transform: scale(1);\n                }\n\n                .tooltip::after {\n                    content: "";\n                    position: absolute;\n                    border: 5px solid transparent;\n                }\n\n                .tooltip.top {\n                    bottom: 100%;\n                    left: 50%;\n                    transform: translateX(-50%) scale(0.95);\n                    margin-bottom: 6px;\n                }\n                .tooltip.top.visible {\n                    transform: translateX(-50%) scale(1);\n                }\n                .tooltip.top::after {\n                    top: 100%;\n                    left: 50%;\n                    transform: translateX(-50%);\n                    border-top-color: ${t};\n                }\n\n                .tooltip.bottom {\n                    top: 100%;\n                    left: 50%;\n                    transform: translateX(-50%) scale(0.95);\n                    margin-top: 6px;\n                }\n                .tooltip.bottom.visible {\n                    transform: translateX(-50%) scale(1);\n                }\n                .tooltip.bottom::after {\n                    bottom: 100%;\n                    left: 50%;\n                    transform: translateX(-50%);\n                    border-bottom-color: ${t};\n                }\n\n                .tooltip.left {\n                    right: 100%;\n                    top: 50%;\n                    transform: translateY(-50%) scale(0.95);\n                    margin-right: 6px;\n                }\n                .tooltip.left.visible {\n                    transform: translateY(-50%) scale(1);\n                }\n                .tooltip.left::after {\n                    left: 100%;\n                    top: 50%;\n                    transform: translateY(-50%);\n                    border-left-color: ${t};\n                }\n\n                .tooltip.right {\n                    left: 100%;\n                    top: 50%;\n                    transform: translateY(-50%) scale(0.95);\n                    margin-left: 6px;\n                }\n                .tooltip.right.visible {\n                    transform: translateY(-50%) scale(1);\n                }\n                .tooltip.right::after {\n                    right: 100%;\n                    top: 50%;\n                    transform: translateY(-50%);\n                    border-right-color: ${t};\n                }\n            </style>\n            <slot class="trigger"></slot>\n            <div class="tooltip ${e}" role="tooltip" part="tooltip">${this.text}</div>\n        `}}customElements.get("y-tooltip")||customElements.define("y-tooltip",P);const D={"blue-light":'/* Themes - Blue Light */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-light-1);\n    --primary-background-component: var(--blue-light-0);\n    --primary-background-hover: var(--blue-light-2);\n    --primary-background-active: var(--blue-light-3);\n    --primary-background-border: var(--blue-light-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-dark-7);\n    --primary-content-active: var(--blue-dark-6);\n    --secondary-background-app: var(--teal-light-1);\n    --secondary-background-component: var(--teal-light-0);\n    --secondary-background-hover: var(--teal-light-2);\n    --secondary-background-border: var(--teal-light-3);\n    --secondary-background-active: var(--teal-light-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-dark-7);\n    --secondary-content-active: var(--teal-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"blue-dark":'/* Themes - Blue Dark */\n:root {\n    --base-background-app: var(--neutral-dark-1);\n    --base-background-component: var(--neutral-dark-0);\n    --base-background-hover: var(--neutral-dark-2);\n    --base-background-border: var(--neutral-dark-3);\n    --base-background-active: var(--neutral-dark-4);\n    --base-content--: var(--neutral-light-0);\n    --base-content-inverse: var(--neutral-black);\n    --base-content-light: var(--neutral-light-1);\n    --base-content-lighter: var(--neutral-light-3);\n    --base-content-lightest: var(--neutral-light-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-dark-1);\n    --primary-background-component: var(--blue-dark-0);\n    --primary-background-hover: var(--blue-dark-2);\n    --primary-background-active: var(--blue-dark-3);\n    --primary-background-border: var(--blue-dark-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-light-7);\n    --primary-content-active: var(--blue-light-6);\n    --secondary-background-app: var(--teal-dark-1);\n    --secondary-background-component: var(--teal-dark-0);\n    --secondary-background-hover: var(--teal-dark-2);\n    --secondary-background-border: var(--teal-dark-3);\n    --secondary-background-active: var(--teal-dark-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-light-7);\n    --secondary-content-active: var(--teal-light-6);\n    --success-background-app: var(--green-dark-1);\n    --success-background-component: var(--green-dark-0);\n    --success-background-hover: var(--green-dark-2);\n    --success-background-border: var(--green-dark-3);\n    --success-background-active: var(--green-dark-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-light-7);\n    --success-content-active: var(--green-light-6);\n    --warning-background-app: var(--yellow-dark-1);\n    --warning-background-component: var(--yellow-dark-0);\n    --warning-background-hover: var(--yellow-dark-2);\n    --warning-background-border: var(--yellow-dark-3);\n    --warning-background-active: var(--yellow-dark-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-light-7);\n    --warning-content-active: var(--yellow-light-6);\n    --error-background-app: var(--red-dark-1);\n    --error-background-component: var(--red-dark-0);\n    --error-background-hover: var(--red-dark-2);\n    --error-background-border: var(--red-dark-3);\n    --error-background-active: var(--red-dark-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-light-7);\n    --error-content-active: var(--red-light-6);\n    --help-background-app: var(--indigo-dark-1);\n    --help-background-component: var(--indigo-dark-0);\n    --help-background-hover: var(--indigo-dark-2);\n    --help-background-active: var(--indigo-dark-3);\n    --help-background-border: var(--indigo-dark-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-light-7);\n    --help-content-active: var(--indigo-light-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"orange-light":'/* Themes - Orange Light */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--orange-light-1);\n    --primary-background-component: var(--orange-light-0);\n    --primary-background-hover: var(--orange-light-2);\n    --primary-background-active: var(--orange-light-3);\n    --primary-background-border: var(--orange-light-4);\n    --primary-content--: var(--orange--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--orange-dark-7);\n    --primary-content-active: var(--orange-dark-6);\n    --secondary-background-app: var(--amber-light-1);\n    --secondary-background-component: var(--amber-light-0);\n    --secondary-background-hover: var(--amber-light-2);\n    --secondary-background-border: var(--amber-light-3);\n    --secondary-background-active: var(--amber-light-4);\n    --secondary-content--: var(--amber--);\n    --secondary-content-inverse: var(--neutral-white);\n    --secondary-content-hover: var(--amber-dark-7);\n    --secondary-content-active: var(--amber-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"orange-dark":'/* Themes - Orange Dark */\n:root {\n    --base-background-app: var(--neutral-dark-1);\n    --base-background-component: var(--neutral-dark-0);\n    --base-background-hover: var(--neutral-dark-2);\n    --base-background-border: var(--neutral-dark-3);\n    --base-background-active: var(--neutral-dark-4);\n    --base-content--: var(--neutral-light-0);\n    --base-content-inverse: var(--neutral-black);\n    --base-content-light: var(--neutral-light-1);\n    --base-content-lighter: var(--neutral-light-3);\n    --base-content-lightest: var(--neutral-light-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--orange-dark-1);\n    --primary-background-component: var(--orange-dark-0);\n    --primary-background-hover: var(--orange-dark-2);\n    --primary-background-active: var(--orange-dark-3);\n    --primary-background-border: var(--orange-dark-4);\n    --primary-content--: var(--orange--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--orange-light-7);\n    --primary-content-active: var(--orange-light-6);\n    --secondary-background-app: var(--amber-dark-1);\n    --secondary-background-component: var(--amber-dark-0);\n    --secondary-background-hover: var(--amber-dark-2);\n    --secondary-background-border: var(--amber-dark-3);\n    --secondary-background-active: var(--amber-dark-4);\n    --secondary-content--: var(--amber--);\n    --secondary-content-inverse: var(--neutral-white);\n    --secondary-content-hover: var(--amber-light-7);\n    --secondary-content-active: var(--amber-light-6);\n    --success-background-app: var(--green-dark-1);\n    --success-background-component: var(--green-dark-0);\n    --success-background-hover: var(--green-dark-2);\n    --success-background-border: var(--green-dark-3);\n    --success-background-active: var(--green-dark-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-light-7);\n    --success-content-active: var(--green-light-6);\n    --warning-background-app: var(--yellow-dark-1);\n    --warning-background-component: var(--yellow-dark-0);\n    --warning-background-hover: var(--yellow-dark-2);\n    --warning-background-border: var(--yellow-dark-3);\n    --warning-background-active: var(--yellow-dark-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-light-7);\n    --warning-content-active: var(--yellow-light-6);\n    --error-background-app: var(--red-dark-1);\n    --error-background-component: var(--red-dark-0);\n    --error-background-hover: var(--red-dark-2);\n    --error-background-border: var(--red-dark-3);\n    --error-background-active: var(--red-dark-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-light-7);\n    --error-content-active: var(--red-light-6);\n    --help-background-app: var(--indigo-dark-1);\n    --help-background-component: var(--indigo-dark-0);\n    --help-background-hover: var(--indigo-dark-2);\n    --help-background-active: var(--indigo-dark-3);\n    --help-background-border: var(--indigo-dark-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-light-7);\n    --help-content-active: var(--indigo-light-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n'};class H extends HTMLElement{static get observedAttributes(){return["theme","mode","theme-path"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML="<slot></slot>"}connectedCallback(){this._applyTheme()}attributeChangedCallback(e,t,n){t!==n&&this._applyTheme()}async _applyTheme(){const e=this.getAttribute("theme-path");let t;if(e)try{const n=new URL(e,document.baseURI),r=await fetch(n.href);t=await r.text()}catch(n){console.error(`Failed to load theme from ${e}:`,n),t=""}else{const e=this.getAttribute("theme")||"blue",n=this.getAttribute("mode")||"light";t=D[`${e}-${n}`]||""}this.shadowRoot.innerHTML=`\n            <style>${o}</style>\n            ${t?`<style>${t}</style>`:""}\n            <slot></slot>\n        `,this.applyVariablesToHost(o+t)}applyVariablesToHost(e){const t=/--([\w-]+):\s*([^;]+);/g;let n;for(this._themeProps=[];null!==(n=t.exec(e));){const e=`--${n[1]}`;this.style.setProperty(e,n[2].trim()),this._themeProps.push(e)}}clearThemeProperties(){if(this._themeProps)for(const e of this._themeProps)this.style.removeProperty(e);this._themeProps=[]}}if(customElements.get("y-theme")||customElements.define("y-theme",H),"undefined"!=typeof document&&!document.querySelector("[data-yumekit-vars]")){const e=document.createElement("style");e.setAttribute("data-yumekit-vars",""),e.textContent=o,document.head.appendChild(e)}return e.YumeAppbar=c,e.YumeAvatar=l,e.YumeBadge=d,e.YumeButton=a,e.YumeCard=b,e.YumeCheckbox=u,e.YumeIcon=y,e.YumeInput=x,e.YumePanel=A,e.YumePanelBar=z,e.YumeProgress=E,e.YumeRadio=C,e.YumeSelect=_,e.YumeSlider=S,e.YumeTable=$,e.YumeTabs=M,e.YumeTag=T,e.YumeTheme=H,e.YumeToast=R,e.YumeTooltip=P,e.getIcon=r,e.registerIcon=function(e,n){t.set(e,n)},e.registerIcons=n,e}({});
+var YumeKit=function(e){"use strict";const t=new Map;function n(e){for(const[n,r]of Object.entries(e))t.set(n,r)}function r(e){return t.get(e)||""}n({ai:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 8V4H8"/>\n  <rect width="16" height="12" x="4" y="8" rx="2"/>\n  <path d="M2 14h2M20 14h2M15 13v2M9 13v2"/>\n</svg>\n',"arrow-right":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="5" y1="12" x2="19" y2="12"/>\n  <polyline points="12 5 19 12 12 19"/>\n</svg>\n',"arrow-up":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="12" y1="19" x2="12" y2="5"/>\n  <polyline points="5 12 12 5 19 12"/>\n</svg>\n',bell:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/>\n  <path d="M13.73 21a2 2 0 0 1-3.46 0"/>\n</svg>\n',bolt:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>\n</svg>\n',calendar:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="4" width="18" height="18" rx="2" ry="2"/>\n  <line x1="16" y1="2" x2="16" y2="6"/>\n  <line x1="8" y1="2" x2="8" y2="6"/>\n  <line x1="3" y1="10" x2="21" y2="10"/>\n  <rect x="7" y="14" width="3" height="3" rx="0.5"/>\n  <rect x="14" y="14" width="3" height="3" rx="0.5"/>\n</svg>\n',chart:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/>\n</svg>\n',checkmark:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="5 13 10 17 19 6"/>\n</svg>\n',"chevron-down":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="6 9 12 15 18 9"/>\n</svg>\n',"chevron-down-lg":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="4 8 12 16 20 8"/>\n</svg>\n',"chevron-right":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="9 18 15 12 9 6"/>\n</svg>\n',clock:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="10"/>\n  <polyline points="12 6 12 12 16 14"/>\n</svg>\n',close:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="18" y1="6" x2="6" y2="18"/>\n  <line x1="6" y1="6" x2="18" y2="18"/>\n</svg>\n',"collapse-left":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="11 17 6 12 11 7"/>\n  <polyline points="18 17 13 12 18 7"/>\n</svg>\n',comments:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>\n</svg>\n',compass:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="10"/>\n  <polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"/>\n</svg>\n',diagram:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="3" width="6" height="6" rx="1"/>\n  <rect x="15" y="3" width="6" height="6" rx="1"/>\n  <rect x="9" y="15" width="6" height="6" rx="1"/>\n  <line x1="6" y1="9" x2="6" y2="15"/>\n  <line x1="6" y1="15" x2="9" y2="15"/>\n  <line x1="18" y1="9" x2="18" y2="15"/>\n  <line x1="18" y1="15" x2="15" y2="15"/>\n</svg>\n',discord:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026c.462-.62.874-1.275 1.226-1.963.021-.04.001-.088-.041-.104a13.201 13.201 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028z"/>\n</svg>\n',"expand-right":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polyline points="13 17 18 12 13 7"/>\n  <polyline points="6 17 11 12 6 7"/>\n</svg>\n',features:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="3"/>\n  <path d="M12 1v4M12 19v4M4.22 4.22l2.83 2.83M16.95 16.95l2.83 2.83M1 12h4M19 12h4M4.22 19.78l2.83-2.83M16.95 7.05l2.83-2.83"/>\n</svg>\n',figma:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"/>\n  <path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"/>\n  <path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>\n  <path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"/>\n  <path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"/>\n</svg>\n',filter:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <polygon points="22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"/>\n</svg>\n',folder:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2z"/>\n</svg>\n',github:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">\n  <path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"/>\n</svg>\n',home:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>\n  <polyline points="9 22 9 12 15 12 15 22"/>\n</svg>\n',image:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>\n  <circle cx="8.5" cy="8.5" r="1.5"/>\n  <polyline points="21 15 16 10 5 21"/>\n</svg>\n',indeterminate:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="4" y="11" width="16" height="2" rx="1" ry="1" fill="currentColor"/></svg>\n',layout:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>\n  <line x1="3" y1="9" x2="21" y2="9"/>\n  <line x1="9" y1="21" x2="9" y2="9"/>\n</svg>\n',"list-check":'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="10" y1="6" x2="21" y2="6"/>\n  <line x1="10" y1="12" x2="21" y2="12"/>\n  <line x1="10" y1="18" x2="21" y2="18"/>\n  <polyline points="3 6 4 7 6 5"/>\n  <polyline points="3 12 4 13 6 11"/>\n  <polyline points="3 18 4 19 6 17"/>\n</svg>\n',logo:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 2L2 7l10 5 10-5-10-5z"/>\n  <path d="M2 17l10 5 10-5"/>\n  <path d="M2 12l10 5 10-5"/>\n</svg>\n',mail:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <rect x="2" y="4" width="20" height="16" rx="2"/>\n  <path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/>\n</svg>\n',moon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>\n</svg>\n',palette:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="13.5" cy="6.5" r="1.5"/>\n  <circle cx="17.5" cy="10.5" r="1.5"/>\n  <circle cx="8.5" cy="7.5" r="1.5"/>\n  <circle cx="6.5" cy="12.5" r="1.5"/>\n  <path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"/>\n</svg>\n',plus:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <line x1="12" y1="5" x2="12" y2="19"/>\n  <line x1="5" y1="12" x2="19" y2="12"/>\n</svg>\n',save:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/>\n  <polyline points="17 21 17 13 7 13 7 21"/>\n  <polyline points="7 3 7 8 15 8"/>\n</svg>\n',search:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="11" cy="11" r="8"/>\n  <path d="m21 21-4.35-4.35"/>\n</svg>\n',settings:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="3"/>\n  <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/>\n</svg>\n',star:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>\n</svg>\n',sun:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <circle cx="12" cy="12" r="5"/>\n  <path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/>\n</svg>\n',user:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>\n  <circle cx="12" cy="7" r="4"/>\n</svg>\n',users:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>\n  <circle cx="9" cy="7" r="4"/>\n  <path d="M23 21v-2a4 4 0 0 0-3-3.87"/>\n  <path d="M16 3.13a4 4 0 0 1 0 7.75"/>\n</svg>\n',warning:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">\n  <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/>\n  <line x1="12" y1="9" x2="12" y2="13"/>\n  <line x1="12" y1="17" x2="12.01" y2="17"/>\n</svg>\n'});var o='/* Colors */\n:root {\n    --neutral--: #7f8286ff;\n    --neutral-white: #ffffffff;\n    --neutral-black: #000000ff;\n    --neutral-light-0: #f7f7faff;\n    --neutral-light-1: #f0f0f2ff;\n    --neutral-light-2: #dfe0e3ff;\n    --neutral-light-3: #cacbcfff;\n    --neutral-light-4: #bbbdc0ff;\n    --neutral-light-5: #acaeb2ff;\n    --neutral-light-6: #9d9fa3ff;\n    --neutral-light-7: #8e9195ff;\n    --neutral-dark-0: #0c0c0dff;\n    --neutral-dark-1: #151617ff;\n    --neutral-dark-2: #292a2bff;\n    --neutral-dark-3: #37383aff;\n    --neutral-dark-4: #46474aff;\n    --neutral-dark-5: #545659ff;\n    --neutral-dark-6: #626568ff;\n    --neutral-dark-7: #717377ff;\n    --neutral-black-translucent: #0000001f;\n    --neutral-white-translucent: #1111111f;\n    --red--: #b80421ff;\n    --red-light-0: #f2e6e8ff;\n    --red-light-1: #ebcacfff;\n    --red-light-2: #e4aeb6ff;\n    --red-light-3: #dc919dff;\n    --red-light-4: #d57585ff;\n    --red-light-5: #ce596cff;\n    --red-light-6: #c73d53ff;\n    --red-light-7: #bf203aff;\n    --red-dark-0: #0d0103ff;\n    --red-dark-1: #220107ff;\n    --red-dark-2: #38020bff;\n    --red-dark-3: #4d020eff;\n    --red-dark-4: #630312ff;\n    --red-dark-5: #780316ff;\n    --red-dark-6: #8d031aff;\n    --red-dark-7: #a3041dff;\n    --red-translucent: #b804211f;\n    --orange--: #d13704ff;\n    --orange-light-0: #f2e9e6ff;\n    --orange-light-1: #eed3caff;\n    --orange-light-2: #eabdaeff;\n    --orange-light-3: #e6a691ff;\n    --orange-light-4: #e29075ff;\n    --orange-light-5: #dd7a59ff;\n    --orange-light-6: #d9643dff;\n    --orange-light-7: #d54d20ff;\n    --orange-dark-0: #0d0300ff;\n    --orange-dark-1: #260a01ff;\n    --orange-dark-2: #3e1001ff;\n    --orange-dark-3: #571702ff;\n    --orange-dark-4: #6f1d02ff;\n    --orange-dark-5: #882403ff;\n    --orange-dark-6: #a02a03ff;\n    --orange-dark-7: #b93104ff;\n    --orange-translucent: #d137041f;\n    --amber--: #d16004ff;\n    --amber-light-0: #f2ece6ff;\n    --amber-light-1: #eedbcaff;\n    --amber-light-2: #eac9aeff;\n    --amber-light-3: #e6b891ff;\n    --amber-light-4: #e2a675ff;\n    --amber-light-5: #dd9559ff;\n    --amber-light-6: #d9833dff;\n    --amber-light-7: #d57220ff;\n    --amber-dark-0: #0d0c0cff;\n    --amber-dark-1: #26170bff;\n    --amber-dark-2: #3e210aff;\n    --amber-dark-3: #572c09ff;\n    --amber-dark-4: #6f3608ff;\n    --amber-dark-5: #884107ff;\n    --amber-dark-6: #a04b06ff;\n    --amber-dark-7: #b95605ff;\n    --amber-translucent: #d160041f;\n    --yellow--: #d17f04ff;\n    --yellow-light-0: #f2eadfff;\n    --yellow-light-1: #eeddc4ff;\n    --yellow-light-2: #eacfa8ff;\n    --yellow-light-3: #e6c28dff;\n    --yellow-light-4: #e2b572ff;\n    --yellow-light-5: #dda756ff;\n    --yellow-light-6: #d99a3bff;\n    --yellow-light-7: #d58c1fff;\n    --yellow-dark-0: #0d0c0cff;\n    --yellow-dark-1: #261a0bff;\n    --yellow-dark-2: #3e290aff;\n    --yellow-dark-3: #573709ff;\n    --yellow-dark-4: #6f4608ff;\n    --yellow-dark-5: #885407ff;\n    --yellow-dark-6: #a06206ff;\n    --yellow-dark-7: #b97105ff;\n    --yellow-translucent: #d17f041f;\n    --lime--: #cad104ff;\n    --lime-light-0: #f2f2dfff;\n    --lime-light-1: #edeec4ff;\n    --lime-light-2: #e8eaa8ff;\n    --lime-light-3: #e3e68dff;\n    --lime-light-4: #dee272ff;\n    --lime-light-5: #d9dd56ff;\n    --lime-light-6: #d4d93bff;\n    --lime-light-7: #cfd51fff;\n    --lime-dark-0: #0d0d0cff;\n    --lime-dark-1: #25260bff;\n    --lime-dark-2: #3c3e0aff;\n    --lime-dark-3: #545709ff;\n    --lime-dark-4: #6c6f08ff;\n    --lime-dark-5: #838807ff;\n    --lime-dark-6: #9ba006ff;\n    --lime-dark-7: #b2b905ff;\n    --lime-translucent: #cad1041f;\n    --green--: #2dba73ff;\n    --green-light-0: #e6f2ecff;\n    --green-light-1: #cfebddff;\n    --green-light-2: #b8e4ceff;\n    --green-light-3: #a1ddbfff;\n    --green-light-4: #8ad6b0ff;\n    --green-light-5: #72cfa0ff;\n    --green-light-6: #5bc891ff;\n    --green-light-7: #44c182ff;\n    --green-dark-0: #030d08ff;\n    --green-dark-1: #082315ff;\n    --green-dark-2: #0e3823ff;\n    --green-dark-3: #134e30ff;\n    --green-dark-4: #18643eff;\n    --green-dark-5: #1d794bff;\n    --green-dark-6: #238f58ff;\n    --green-dark-7: #28a466ff;\n    --green-translucent: #2dba731f;\n    --teal--: #04b8b8ff;\n    --teal-light-0: #f2fffeff;\n    --teal-light-1: #d4f6f5ff;\n    --teal-light-2: #b7ededff;\n    --teal-light-3: #99e4e4ff;\n    --teal-light-4: #7bdcdbff;\n    --teal-light-5: #5dd3d2ff;\n    --teal-light-6: #40cacaff;\n    --teal-light-7: #22c1c1ff;\n    --teal-dark-0: #0c0d0dff;\n    --teal-dark-1: #0b2624ff;\n    --teal-dark-2: #0a3e3cff;\n    --teal-dark-3: #095753ff;\n    --teal-dark-4: #086f6aff;\n    --teal-dark-5: #078881ff;\n    --teal-dark-6: #06a099ff;\n    --teal-dark-7: #05b9b0ff;\n    --teal-translucent: #04b8b81f;\n    --blue--: #0576ffff;\n    --blue-light-0: #ebf5ffff;\n    --blue-light-1: #cee5ffff;\n    --blue-light-2: #b2d5ffff;\n    --blue-light-3: #95c5ffff;\n    --blue-light-4: #78b6ffff;\n    --blue-light-5: #5ba6ffff;\n    --blue-light-6: #3f96ffff;\n    --blue-light-7: #2286ffff;\n    --blue-dark-0: #0c0c0dff;\n    --blue-dark-1: #0b192bff;\n    --blue-dark-2: #0a274aff;\n    --blue-dark-3: #093468ff;\n    --blue-dark-4: #094186ff;\n    --blue-dark-5: #084ea4ff;\n    --blue-dark-6: #075cc3ff;\n    --blue-dark-7: #0669e1ff;\n    --blue-translucent: #0576ff1f;\n    --indigo--: #5405ffff;\n    --indigo-light-0: #f6f2ffff;\n    --indigo-light-1: #e2d4ffff;\n    --indigo-light-2: #ceb7ffff;\n    --indigo-light-3: #b999ffff;\n    --indigo-light-4: #a57cffff;\n    --indigo-light-5: #915effff;\n    --indigo-light-6: #7d40ffff;\n    --indigo-light-7: #6823ffff;\n    --indigo-dark-0: #0d0c0cff;\n    --indigo-dark-1: #160b2aff;\n    --indigo-dark-2: #1f0a49ff;\n    --indigo-dark-3: #280967ff;\n    --indigo-dark-4: #310986ff;\n    --indigo-dark-5: #3908a4ff;\n    --indigo-dark-6: #4207c2ff;\n    --indigo-dark-7: #4b06e1ff;\n    --indigo-translucent: #5405ff1f;\n    --purple--: #8a05ffff;\n    --purple-light-0: #f9f2ffff;\n    --purple-light-1: #ebd4ffff;\n    --purple-light-2: #ddb7ffff;\n    --purple-light-3: #cf99ffff;\n    --purple-light-4: #c27cffff;\n    --purple-light-5: #b45effff;\n    --purple-light-6: #a640ffff;\n    --purple-light-7: #9823ffff;\n    --purple-dark-0: #0c0c0dff;\n    --purple-dark-1: #1c0b2bff;\n    --purple-dark-2: #2c0a4aff;\n    --purple-dark-3: #3b0968ff;\n    --purple-dark-4: #4b0986ff;\n    --purple-dark-5: #5b08a4ff;\n    --purple-dark-6: #6b07c3ff;\n    --purple-dark-7: #7a06e1ff;\n    --purple-translucent: #8a05ff1f;\n    --pink--: #ff05a8ff;\n    --pink-light-0: #f9f2ffff;\n    --pink-light-1: #fad4f4ff;\n    --pink-light-2: #fbb7e9ff;\n    --pink-light-3: #fb99deff;\n    --pink-light-4: #fc7cd4ff;\n    --pink-light-5: #fd5ec9ff;\n    --pink-light-6: #fe40beff;\n    --pink-light-7: #fe23b3ff;\n    --pink-dark-0: #0c0c0dff;\n    --pink-dark-1: #2a0b20ff;\n    --pink-dark-2: #490a34ff;\n    --pink-dark-3: #670947ff;\n    --pink-dark-4: #86095bff;\n    --pink-dark-5: #a4086eff;\n    --pink-dark-6: #c20781ff;\n    --pink-dark-7: #e10695ff;\n    --pink-translucent: #ff05a81f;\n    --brown--: #ab642eff;\n    --brown-light-0: #f2dfdfff;\n    --brown-light-1: #e9d0c9ff;\n    --brown-light-2: #e0c0b3ff;\n    --brown-light-3: #d7b19dff;\n    --brown-light-4: #cfa287ff;\n    --brown-light-5: #c69270ff;\n    --brown-light-6: #bd835aff;\n    --brown-light-7: #b47344ff;\n    --brown-dark-0: #0d0c0cff;\n    --brown-dark-1: #211710ff;\n    --brown-dark-2: #352215ff;\n    --brown-dark-3: #482d19ff;\n    --brown-dark-4: #5c381dff;\n    --brown-dark-5: #704321ff;\n    --brown-dark-6: #844e26ff;\n    --brown-dark-7: #97592aff;\n    --brown-translucent: #ab642e1f;\n}\n\n/* Numerics */\n:root {\n    --border-none: 0px;\n    --border-x-thin: 1px;\n    --border-thin: 2px;\n    --border-medium: 4px;\n    --border-thick: 8px;\n    --border-x-thick: 10px;\n    --spacing-none: 0px;\n    --spacing-4x-small: 1px;\n    --spacing-2x-small: 2px;\n    --spacing-x-small: 4px;\n    --spacing-small: 6px;\n    --spacing-medium: 8px;\n    --spacing-large: 12px;\n    --spacing-x-large: 16px;\n    --spacing-2x-large: 24px;\n    --spacing-4x-large: 32px;\n    --font-size-display-1: 6em;\n    --font-size-display-2: 5.5em;\n    --font-size-display-3: 4.5em;\n    --font-size-display-4: 3.5em;\n    --font-size-h1: 2em;\n    --font-size-h2: 1.5em;\n    --font-size-h3: 1.17em;\n    --font-size-h4: 1em;\n    --font-size-h5: 0.83em;\n    --font-size-paragraph: 1em;\n    --font-size-small: 0.8em;\n    --font-size-label: 0.83em;\n    --font-size-button: 1em;\n    --font-size-quote: 1.17em;\n    --radii-none: 0px;\n    --radii-x-small: 0.125em;\n    --radii-small: 0.25em;\n    --radii-medium: 0.375em;\n    --radii-large: 0.5px;\n    --radii-x-large: 1em;\n    --radii-full: 9999px;\n    --sizing-2x-small: 16px;\n    --sizing-x-small: 19px;\n    --sizing-small: 32px;\n    --sizing-medium: 40px;\n    --sizing-large: 56px;\n}\n\n/* Components */\n\n:root {\n    /* appbar */\n    --component-appbar-collapsed-width: 48px;\n    --component-appbar-padding: var(--spacing-medium);\n    --component-appbar-width: 240px;\n    --component-appbar-z-index: 100;\n\n    /* avatar */\n    --component-avatar-border-radius-circle: var(--radii-full);\n    --component-avatar-border-radius-square: var(--radii-small);\n    --component-avatar-size-large: var(--sizing-large);\n    --component-avatar-size-medium: var(--sizing-medium);\n    --component-avatar-size-small: var(--sizing-small);\n\n    /* badge */\n    --component-badge-border-radius-circle: var(--radii-full);\n    --component-badge-border-radius-square: var(--radii-small);\n    --component-badge-padding-large: var(--spacing-small);\n    --component-badge-padding-medium: var(--spacing-x-small);\n    --component-badge-padding-small: var(--spacing-2x-small);\n    --component-badge-size-large: var(--sizing-medium);\n    --component-badge-size-medium: var(--sizing-small);\n    --component-badge-size-small: var(--sizing-2x-small);\n\n    /* button */\n    --component-button-border-radius-inner: var(--radii-x-small);\n    --component-button-border-radius-outer: var(--radii-small);\n    --component-button-border-width: var(--border-thin);\n    --component-button-border-width-2: var(--border-x-thin);\n    --component-button-padding-large: var(--spacing-x-large);\n    --component-button-padding-medium: var(--spacing-medium);\n    --component-button-padding-small: var(--spacing-x-small);\n\n    /* card */\n    --component-card-border-radius-inner: var(--radii-small);\n    --component-card-border-radius-outer: var(--radii-medium);\n    --component-card-border-width: var(--border-x-thin);\n    --component-card-inner-border-width: var(--border-x-thin);\n    --component-card-padding-inner: var(--spacing-medium);\n    --component-card-padding-outer: var(--spacing-x-large);\n\n    /* checkbox */\n    --component-checkbox-icon-size: var(--sizing-2x-small);\n    --component-checkbox-size: var(--sizing-x-small);\n\n    /* dialog */\n    --component-dialog-border-radius-inner: var(--radii-x-small);\n    --component-dialog-border-radius-outer: var(--radii-small);\n    --component-dialog-border-width: var(--border-x-thin);\n    --component-dialog-inner-border-width: var(--border-x-thin);\n    --component-dialog-padding: var(--spacing-medium);\n    --component-dialog-z-index: 1000;\n\n    /* drawer */\n    --component-drawer-border-radius: var(--radii-small);\n    --component-drawer-border-width: var(--border-x-thin);\n    --component-drawer-handle-padding: var(--spacing-x-small);\n    --component-drawer-handle-width: var(--spacing-x-small);\n    --component-drawer-padding: var(--spacing-medium);\n    --component-drawer-z-index: 5000;\n\n    /* icon */\n    --component-icon-size-large: var(--spacing-4x-large);\n    --component-icon-size-medium: var(--spacing-2x-large);\n    --component-icon-size-small: var(--spacing-x-large);\n\n    /* inputs */\n    --component-inputs-border-radius-inner: var(--radii-x-small);\n    --component-inputs-border-radius-outer: var(--radii-small);\n    --component-inputs-border-width: var(--border-thin);\n    --component-inputs-padding-large: var(--spacing-x-large);\n    --component-inputs-padding-medium: var(--spacing-medium);\n    --component-inputs-padding-small: var(--spacing-x-small);\n\n    /* menu */\n    --component-menu-border-radius: var(--radii-x-small);\n    --component-menu-border-width: var(--border-x-thin);\n    --component-menu-padding-horizontal: var(--spacing-small);\n    --component-menu-padding-vertical: var(--spacing-x-small);\n    --component-menu-z-index: 1001;\n\n    /* panelbar */\n    --component-panelbar-border-radius: var(--radii-x-small);\n    --component-panelbar-border-width: var(--border-x-thin);\n    --component-panelbar-indent: var(--spacing-x-large);\n    --component-panelbar-padding: var(--spacing-medium);\n\n    /* progress */\n    --component-progress-border-radius-inner: var(--radii-small);\n    --component-progress-border-radius-outer: calc(var(--radii-small) + 4px);\n    --component-progress-border-width: var(--border-x-thin);\n    --component-progress-padding: var(--spacing-x-small);\n    --component-progress-size-large: var(--sizing-large);\n    --component-progress-size-medium: var(--sizing-medium);\n    --component-progress-size-small: var(--sizing-small);\n\n    /* radio */\n    --component-radio-dot-offset: var(--spacing-2x-small);\n    --component-radio-dot-size: var(--spacing-medium);\n    --component-radio-size: var(--sizing-2x-small);\n\n    /* select */\n    --component-select-z-index: 6000;\n\n    /* sidebar */\n    --component-sidebar-border-radius: var(--radii-small);\n    --component-sidebar-border-width: var(--border-x-thin);\n\n    /* slider */\n    --component-slider-border-radius-inner: var(--radii-small);\n    --component-slider-border-radius-outer: calc(var(--radii-small) + 4px);\n    --component-slider-border-width: var(--border-x-thin);\n    --component-slider-padding: var(--spacing-x-small);\n    --component-slider-thumb-border-radius: var(--radii-x-small);\n\n    /* switch */\n    --component-switch-border-radius: var(--radii-full);\n    --component-switch-border-width: var(--border-x-thin);\n    --component-switch-padding: var(--spacing-2x-small);\n\n    /* tab */\n    --component-tab-border-radius-inner: var(--radii-x-small);\n    --component-tab-border-radius-outer: var(--radii-small);\n    --component-tab-border-width: var(--border-x-thin);\n    --component-tab-content-padding: var(--spacing-large);\n    --component-tab-gap-large: var(--spacing-large);\n    --component-tab-gap-medium: var(--spacing-small);\n    --component-tab-gap-small: var(--spacing-2x-small);\n    --component-tab-padding-large: var(--spacing-2x-large);\n    --component-tab-padding-medium: var(--spacing-large);\n    --component-tab-padding-small: var(--spacing-small);\n\n    /* table */\n    --component-table-border-radius: var(--radii-small);\n    --component-table-border-width: var(--border-x-thin);\n    --component-table-border-width-header: var(--border-thin);\n    --component-table-padding-large: var(--spacing-large);\n    --component-table-padding-medium: var(--spacing-medium);\n    --component-table-padding-small: var(--spacing-small);\n\n    /* tag */\n    --component-tag-border-radius-circle: var(--radii-full);\n    --component-tag-border-radius-square: var(--radii-small);\n    --component-tag-padding-large: var(--spacing-small);\n    --component-tag-padding-medium: var(--spacing-x-small);\n    --component-tag-padding-small: var(--spacing-2x-small);\n    --component-tag-size-large: var(--sizing-large);\n    --component-tag-size-medium: var(--sizing-medium);\n    --component-tag-size-small: var(--sizing-small);\n\n    /* toast */\n    --component-toast-border-radius: var(--radii-small);\n    --component-toast-offset: var(--spacing-x-large);\n    --component-toast-padding: var(--spacing-medium);\n    --component-toast-padding-h: var(--spacing-x-large);\n    --component-toast-z-index: 9000;\n\n    /* tooltip */\n    --component-tooltip-border-radius: var(--radii-small);\n    --component-tooltip-padding: var(--spacing-x-small);\n    --component-tooltip-padding-h: var(--spacing-medium);\n    --component-tooltip-z-index: 7000;\n}\n\n/* Default Theme (Blue Light) */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-light-1);\n    --primary-background-component: var(--blue-light-0);\n    --primary-background-hover: var(--blue-light-2);\n    --primary-background-active: var(--blue-light-3);\n    --primary-background-border: var(--blue-light-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-dark-7);\n    --primary-content-active: var(--blue-dark-6);\n    --secondary-background-app: var(--teal-light-1);\n    --secondary-background-component: var(--teal-light-0);\n    --secondary-background-hover: var(--teal-light-2);\n    --secondary-background-border: var(--teal-light-3);\n    --secondary-background-active: var(--teal-light-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-dark-7);\n    --secondary-content-active: var(--teal-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n';class a extends HTMLElement{static get observedAttributes(){return["left-icon","right-icon","color","size","style-type","type","disabled","name","value","autofocus","form","formaction","formenctype","formmethod","formnovalidate","formtarget","aria-label","aria-pressed","aria-hidden"]}constructor(){super(),this.attachShadow({mode:"open"}),this.init()}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.init()}attributeChangedCallback(e,t,n){t!==n&&a.observedAttributes.includes(e)&&(null===n?this.button.removeAttribute(e):this.button.setAttribute(e,n)),this.init(),["color","size","style-type","disabled"].includes(e)&&this.updateStyles()}get value(){return this.hasAttribute("multiple")?Array.from(this.selectedValues).join(","):this.selectedValues.size?Array.from(this.selectedValues)[0]:""}set value(e){this.hasAttribute("multiple")?"string"==typeof e?this.selectedValues=new Set(e.split(",").map(e=>e.trim())):Array.isArray(e)&&(this.selectedValues=new Set(e)):this.selectedValues="string"==typeof e?new Set([e.trim()]):new Set,this.setAttribute("value",e)}setOptions(e){this.setAttribute("options",JSON.stringify(e))}handleClick(){const e={},t=this.getAttribute("data-event");!this.hasAttribute("disabled")&&t&&(Array.from(this.attributes).filter(e=>e.name.startsWith("data-detail-")).forEach(t=>{const n=t.name.replace("data-detail-","");e[n]=t.value}),this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0})))}init(){this.applyStyles(),this.render(),this.proxyNativeOnClick(),this.addEventListeners()}proxyNativeOnClick(){try{Object.defineProperty(this,"onclick",{get:()=>this.button.onclick,set:e=>{this.button.onclick=e},configurable:!0,enumerable:!0})}catch(e){console.warn("Could not redefine onclick:",e)}}updateButtonAttributes(){a.observedAttributes.forEach(e=>{this.hasAttribute(e)?this.button.setAttribute(e,this.getAttribute(e)):this.button.removeAttribute(e)})}manageSlotVisibility(e,t){const n=e?this.shadowRoot.querySelector(`slot[name="${e}"]`):this.shadowRoot.querySelector("slot:not([name])"),r=this.shadowRoot.querySelector(t),o=()=>{const e=n.assignedNodes({flatten:!0}).some(e=>!(e.nodeType===Node.TEXT_NODE&&""===e.textContent.trim()));r.style.display=e?"inline-flex":"none"};o(),n.addEventListener("slotchange",o)}render(){this.button||(this.button=document.createElement("button"),this.button.classList.add("button"),this.button.setAttribute("role","button"),this.button.setAttribute("tabindex","0"),this.button.setAttribute("part","button"),this.shadowRoot.appendChild(this.button)),this.updateButtonAttributes(),this.hasAttribute("disabled")?(this.button.setAttribute("disabled",""),this.button.setAttribute("aria-disabled","true")):(this.button.removeAttribute("disabled"),this.button.setAttribute("aria-disabled","false")),this.button.innerHTML='\n          <span class="icon left-icon" part="left-icon"><slot name="left-icon"></slot></span>\n          <span class="label" part="label"><slot></slot></span>\n          <span class="icon right-icon" part="right-icon"><slot name="right-icon"></slot></span>\n      ',this.manageSlotVisibility("left-icon",".left-icon"),this.manageSlotVisibility("right-icon",".right-icon"),this.manageSlotVisibility("",".label")}applyStyles(){const e=document.createElement("style");e.textContent='\n        :host {\n          display: inline-block;\n        }\n\n        @font-face {\n            font-family: "Lexend";\n            font-display: swap;\n        }\n\n        .button {\n            box-sizing: border-box;\n            display: inline-flex;\n            min-height: var(--button-min-height, var(--sizing-medium, 40px));\n            min-width: var(--button-min-width, var(--sizing-medium, 40px));\n            padding: var(--button-padding, var(--component-button-padding-medium));\n            gap: var(--button-gap, var(--component-button-padding-medium));\n            justify-content: center;\n            align-items: center;\n            position: relative;\n            overflow: hidden;\n            border-radius: var(--component-button-border-radius-outer, 4px);\n            border: var(--component-button-border-width, 1px) solid var(--border-color, var(--base-content--, #f7f7fa));\n            background: var(--background-color, #0c0c0d);\n            transition: background-color 0.1s, color 0.1s, border-color 0.1s;\n            cursor: pointer;\n            color: var(--text-color);\n            font-family: var(--font-family-body, Lexend, sans-serif);\n            font-size: var(--font-size-button, 1em);\n            line-height: 1;\n        }\n\n        .button:disabled {\n            opacity: 0.5;\n            cursor: not-allowed;\n        }\n\n        .button:hover:not(:disabled),\n        .button:hover:not(:disabled) .button-content {\n            background: var(--hover-background-color);\n            color: var(--hover-text-color);\n            border-color: var(--hover-border-color);\n        }\n        .button:focus:not(:disabled),\n        .button:focus:not(:disabled) .button-content {\n            background: var(--focus-background-color);\n            color: var(--focus-text-color);\n            border-color: var(--focus-border-color);\n        }\n        .button:active:not(:disabled),\n        .button:active:not(:disabled) .button-content {\n            background: var(--active-background-color);\n            color: var(--active-text-color);\n            border-color: var(--active-border-color);\n        }\n        .icon {\n            display: flex;\n            min-width: 16px;\n            min-height: 1em;\n            justify-content: center;\n            align-items: center;\n        }\n        .label {\n            line-height: inherit;\n            min-height: 1em;\n            align-items: center;\n        }\n      ',this.shadowRoot.appendChild(e)}addEventListeners(){this.button.addEventListener("focus",()=>{this.dispatchEvent(new CustomEvent("focus",{bubbles:!0,composed:!0}))}),this.button.addEventListener("blur",()=>{this.dispatchEvent(new CustomEvent("blur",{bubbles:!0,composed:!0}))}),this.button.addEventListener("keydown",e=>{this.dispatchEvent(new CustomEvent("keydown",{detail:{key:e.key,code:e.code},bubbles:!0,composed:!0}))}),this.button.addEventListener("keyup",e=>{this.dispatchEvent(new CustomEvent("keyup",{detail:{key:e.key,code:e.code},bubbles:!0,composed:!0}))}),this.button.addEventListener("click",e=>{if(this.handleClick(),"submit"===this.getAttribute("type")){const t=this.closest("form");t&&(e.preventDefault(),t.requestSubmit())}})}updateStyles(){const e=this.getAttribute("color")||"base",t=this.getAttribute("size")||"medium",n=this.getAttribute("style-type")||"outlined",r={primary:["--primary-content--","--primary-content-hover","--primary-content-active","--primary-background-component","--primary-background-hover","--primary-background-active","--primary-content-inverse"],secondary:["--secondary-content--","--secondary-content-hover","--secondary-content-active","--secondary-background-component","--secondary-background-hover","--secondary-background-active","--secondary-content-inverse"],base:["--base-content--","--base-content-lighter","--base-content-lightest","--base-background-component","--base-background-hover","--base-background-active","--base-content-inverse"],success:["--success-content--","--success-content-hover","--success-content-active","--success-background-component","--success-background-hover","--success-background-active","--success-content-inverse"],error:["--error-content--","--error-content-hover","--error-content-active","--error-background-component","--error-background-hover","--error-background-active","--error-content-inverse"],warning:["--warning-content--","--warning-content-hover","--warning-content-active","--warning-background-component","--warning-background-hover","--warning-background-active","--warning-content-inverse"],help:["--help-content--","--help-content-hover","--help-content-active","--help-background-component","--help-background-hover","--help-background-active","--help-content-inverse"]},o={small:["--component-button-padding-small","--component-button-padding-small"],medium:["--component-button-padding-medium","--component-button-padding-medium"],large:["--component-button-padding-large","--component-button-padding-large"]},a={outlined:{"--background-color":`var(${r[e][3]}, #0c0c0d)`,"--border-color":`var(${r[e][0]}, #f7f7fa)`,"--text-color":`var(${r[e][0]}, #f7f7fa)`},filled:{"--background-color":`var(${r[e][0]}, #f7f7fa)`,"--border-color":`var(${r[e][0]}, #f7f7fa)`,"--text-color":`var(${r[e][6]}, #0c0c0d)`},flat:{"--background-color":`var(${r[e][3]},#0c0c0d)`,"--border-color":`var(${r[e][3]},#0c0c0d)`,"--text-color":`var(${r[e][0]},#f7f7fa)`}},i=a[n]||a.outlined;if(Object.entries(i).forEach(([e,t])=>{this.button.style.setProperty(e,t)}),"filled"===n)this.button.style.setProperty("--hover-background-color",`var(${r[e][1]}, #292a2b)`),this.button.style.setProperty("--hover-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--hover-border-color",`var(${r[e][1]}, #292a2b)`),this.button.style.setProperty("--focus-background-color",`var(${r[e][2]}, #46474a)`),this.button.style.setProperty("--focus-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--focus-border-color",`var(${r[e][2]}, #46474a)`),this.button.style.setProperty("--active-background-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-text-color",`var(${r[e][6]}, #0c0c0d)`),this.button.style.setProperty("--active-border-color",`var(${r[e][0]}, #f7f7fa)`);else{const t=`var(${r[e][0]}, #f7f7fa)`;this.button.style.setProperty("--hover-background-color",`var(${r[e][4]}, #292a2b)`),this.button.style.setProperty("--hover-text-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--focus-background-color",`var(${r[e][5]}, #46474a)`),this.button.style.setProperty("--focus-text-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-background-color",`var(${r[e][0]}, #f7f7fa)`),this.button.style.setProperty("--active-text-color",`var(${r[e][6]}, #0c0c0d)`),"outlined"===n?(this.button.style.setProperty("--hover-border-color",t),this.button.style.setProperty("--focus-border-color",t),this.button.style.setProperty("--active-border-color",t)):(this.button.style.setProperty("--hover-border-color",`var(${r[e][4]}, #292a2b)`),this.button.style.setProperty("--focus-border-color",`var(${r[e][5]}, #46474a)`),this.button.style.setProperty("--active-border-color",`var(${r[e][0]}, #f7f7fa)`))}const[s,c]=o[t]||o.medium;this.button.style.setProperty("--button-padding",`var(${c}, var(--component-button-padding-medium))`),this.button.style.setProperty("--button-gap",`var(${s}, var(--component-button-padding-medium))`);const l={small:"var(--sizing-small, 32px)",medium:"var(--sizing-medium, 40px)",large:"var(--sizing-large, 56px)"};this.button.style.setProperty("--button-min-height",l[t]||"40px"),this.button.style.setProperty("--button-min-width",l[t]||"40px")}}customElements.get("y-button")||customElements.define("y-button",a);const i=new Set(["svg","g","path","circle","ellipse","rect","line","polyline","polygon","text","tspan","defs","clippath","mask","lineargradient","radialgradient","stop","symbol","title","desc","metadata"]),s=new Set(["viewbox","xmlns","fill","stroke","stroke-width","stroke-linecap","stroke-linejoin","stroke-dasharray","stroke-dashoffset","stroke-miterlimit","stroke-opacity","fill-opacity","fill-rule","clip-rule","opacity","d","cx","cy","r","rx","ry","x","x1","x2","y","y1","y2","width","height","points","transform","id","class","clip-path","mask","offset","stop-color","stop-opacity","gradient-units","gradienttransform","gradientunits","spreadmethod","patternunits","patterntransform","font-size","font-family","font-weight","text-anchor","dominant-baseline","alignment-baseline","dx","dy","rotate","textlength","lengthadjust","display","visibility","color","vector-effect"]);const c=new Map;function l(e){if(c.has(e))return c.get(e);const t=function(e){if(!e)return"";const t=(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg");if(!t)return"";const n=e=>{for(const t of[...e.children])if(i.has(t.tagName.toLowerCase())){for(const e of[...t.attributes])s.has(e.name.toLowerCase())||t.removeAttribute(e.name);n(t)}else t.remove()};for(const e of[...t.attributes])s.has(e.name.toLowerCase())||t.removeAttribute(e.name);return n(t),t.outerHTML}(r(e));return c.set(e,t),t}class d extends HTMLElement{static get observedAttributes(){return["name","size","color","label","weight"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get name(){return this.getAttribute("name")||""}set name(e){this.setAttribute("name",e)}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||""}set color(e){e?this.setAttribute("color",e):this.removeAttribute("color")}get label(){return this.getAttribute("label")||""}set label(e){e?this.setAttribute("label",e):this.removeAttribute("label")}get weight(){return this.getAttribute("weight")||""}set weight(e){e?this.setAttribute("weight",e):this.removeAttribute("weight")}_getColor(e){const t={base:"var(--base-content--, #f7f7fa)",primary:"var(--primary-content--, #0576ff)",secondary:"var(--secondary-content--, #04b8b8)",success:"var(--success-content--, #2dba73)",warning:"var(--warning-content--, #d17f04)",error:"var(--error-content--, #b80421)",help:"var(--help-content--, #5405ff)"};return t[e]||t.base}_getSize(e){const t={small:"var(--component-icon-size-small, 16px)",medium:"var(--component-icon-size-medium, 24px)",large:"var(--component-icon-size-large, 32px)"};return t[e]||t.medium}_getWeight(e){return{thin:"1",regular:"1.5",thick:"2"}[e]||""}render(){const e=l(this.name),t=this._getSize(this.size),n=this.color?this._getColor(this.color):"inherit",r=this._getWeight(this.weight),o=this.label;o?(this.setAttribute("role","img"),this.setAttribute("aria-label",o),this.removeAttribute("aria-hidden")):(this.setAttribute("aria-hidden","true"),this.removeAttribute("role"),this.removeAttribute("aria-label"));const a=r?`.icon-wrapper svg,\n                .icon-wrapper svg * { stroke-width: ${r} !important; }`:"";this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-flex;\n                    align-items: center;\n                    justify-content: center;\n                    width: ${t};\n                    height: ${t};\n                    color: ${n};\n                    line-height: 0;\n                }\n                .icon-wrapper svg {\n                    width: 100%;\n                    height: 100%;\n                }\n                ${a}\n            </style>\n            <span class="icon-wrapper" part="icon">${e}</span>\n        `}}customElements.get("y-icon")||customElements.define("y-icon",d);class p extends HTMLElement{static get observedAttributes(){return["items","anchor","visible","direction","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onAnchorClick=this._onAnchorClick.bind(this),this._onDocumentClick=this._onDocumentClick.bind(this),this._onScrollOrResize=this._onScrollOrResize.bind(this)}connectedCallback(){this.hasAttribute("items")||(this.items=[]),this._setupAnchor(),this.render(),document.addEventListener("click",this._onDocumentClick),window.addEventListener("scroll",this._onScrollOrResize,!0),window.addEventListener("resize",this._onScrollOrResize),this.style.position="fixed",this.style.zIndex="1000",this.style.display="none"}disconnectedCallback(){this._teardownAnchor(),document.removeEventListener("click",this._onDocumentClick),window.removeEventListener("scroll",this._onScrollOrResize,!0),window.removeEventListener("resize",this._onScrollOrResize)}attributeChangedCallback(e,t,n){t!==n&&("items"!==e&&"size"!==e||this.render(),"anchor"===e&&(this._teardownAnchor(),this._setupAnchor()),"visible"===e&&this._updatePosition(),"direction"===e&&this._updatePosition())}get items(){try{return JSON.parse(this.getAttribute("items"))||[]}catch{return[]}}set items(e){this.setAttribute("items",JSON.stringify(e))}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get direction(){return this.getAttribute("direction")||"down"}set direction(e){this.setAttribute("direction",e)}get size(){const e=this.getAttribute("size");return["small","medium","large"].includes(e)?e:"medium"}set size(e){["small","medium","large"].includes(e)?this.setAttribute("size",e):this.setAttribute("size","medium")}_createMenuList(e){const t=document.createElement("ul");return e.forEach(e=>{const n=document.createElement("li");n.className="menuitem",n.setAttribute("role","menuitem"),n.setAttribute("part","menuitem"),n.tabIndex=0;const r=document.createElement("span");if(r.className="item-content",e["icon-template"]){const t=this._findTemplate(e["icon-template"]);t&&r.appendChild(t.content.cloneNode(!0))}if(e.template){const t=this._findTemplate(e.template);t?r.appendChild(t.content.cloneNode(!0)):r.textContent=e.text}else r.textContent=e.text;if(n.appendChild(r),e.url&&n.addEventListener("click",()=>{window.location.href=e.url}),e.children?.length){const t=document.createElement("span");t.className="submenu-indicator",t.textContent="▶",n.appendChild(t);const r=this._createMenuList(e.children);r.classList.add("submenu"),r.setAttribute("role","menu"),n.appendChild(r)}t.appendChild(n)}),t}_findTemplate(e){return this.querySelector(`template[slot="${e}"]`)}_onAnchorClick(e){e.stopPropagation(),this.visible=!this.visible}_onDocumentClick(e){const t=e.composedPath();this._anchorEl&&t.includes(this._anchorEl)||t.includes(this)||(this.visible=!1)}_onScrollOrResize(){this.visible&&this._updatePosition()}_setupAnchor(){const e=this.anchor;if(e){const t=this.getRootNode(),n=t?.getElementById?t.getElementById(e):document.getElementById(e);n&&(this._anchorEl=n,this._anchorEl.addEventListener("click",this._onAnchorClick))}}_teardownAnchor(){this._anchorEl&&(this._anchorEl.removeEventListener("click",this._onAnchorClick),this._anchorEl=null)}_updatePosition(){if(!this.visible||!this._anchorEl)return void(this.style.display="none");const e=this._anchorEl.getBoundingClientRect(),t=this.getBoundingClientRect(),n=window.innerWidth,r=window.innerHeight;let o,a;"right"===this.direction?(o=e.top,a=e.right,a+t.width>n&&(a=e.left-t.width),o+t.height>r&&(o=e.top-t.height)):"up"===this.direction?(o=e.top-t.height,a=e.left,o<0&&(o=e.bottom),a+t.width>n&&(a=n-t.width-10)):"left"===this.direction?(o=e.top,a=e.left-t.width,a<0&&(a=e.right),o+t.height>r&&(o=e.top-t.height)):(o=e.bottom,a=e.left,o+t.height>r&&(o=e.top-t.height),a+t.width>n&&(a=n-t.width-10)),o=Math.max(0,Math.min(o,r-t.height)),a=Math.max(0,Math.min(a,n-t.width)),this.style.top=`${o}px`,this.style.left=`${a}px`,this.style.display="block"}render(){this.shadowRoot.innerHTML="";const e=`var(--component-button-padding-${this.size}, 0.5rem)`,t=document.createElement("style");t.textContent=`\n            ul.menu,\n            ul.submenu {\n                list-style: none;\n                margin: 0;\n                padding: 0;\n                background: var(--component-menu-background, #0c0c0d);\n                border: var(--component-menu-border-width, 1px) solid var(--component-menu-border-color, #37383a);\n                border-radius: var(--component-menu-border-radius, 4px);\n                box-shadow: var(--component-menu-shadow, 0 2px 8px rgba(0, 0, 0, 0.15));\n                min-width: 150px;\n                max-height: 300px;\n                overflow-y: auto;\n            }\n\n            li.menuitem {\n                cursor: pointer;\n                padding: ${e};\n                display: flex;\n                align-items: center;\n                justify-content: space-between;\n                white-space: nowrap;\n                color: var(--component-menu-color, #f7f7fa);\n                font-size: var(--font-size-button, 1em);\n            }\n\n            li.menuitem:hover {\n                background: var(--component-menu-hover-background, #292a2b);\n            }\n\n            ul.submenu {\n                position: absolute;\n                top: 0;\n                left: 100%;\n                display: none;\n                z-index: var(--component-menu-z-index, 1001);\n            }\n\n            li.menuitem:hover > ul.submenu {\n                display: block;\n            }\n\n            .submenu-indicator {\n                font-size: 0.75em;\n                margin-left: 0.5rem;\n                opacity: 0.6;\n            }\n\n            .item-content {\n                flex: 1;\n            }\n        `,this.shadowRoot.appendChild(t);const n=this._createMenuList(this.items);n.classList.add("menu"),n.setAttribute("role","menu"),n.setAttribute("part","menu"),this.shadowRoot.appendChild(n)}}customElements.get("y-menu")||customElements.define("y-menu",p);const h='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" aria-hidden="true"><path d="M5 7 L10 12 L15 7" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" /></svg>';class b extends HTMLElement{static get observedAttributes(){return["orientation","collapsed","items","size","menu-direction","sticky"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onCollapseClick=this._onCollapseClick.bind(this),this._idCounter=0}connectedCallback(){this.render()}disconnectedCallback(){}attributeChangedCallback(e,t,n){t!==n&&this.render()}get orientation(){return this.getAttribute("orientation")||"vertical"}set orientation(e){this.setAttribute("orientation",e)}get collapsed(){return this.hasAttribute("collapsed")}set collapsed(e){e?this.setAttribute("collapsed",""):this.removeAttribute("collapsed")}get items(){try{return JSON.parse(this.getAttribute("items"))||[]}catch{return[]}}set items(e){this.setAttribute("items",JSON.stringify(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get menuDirection(){return this.getAttribute("menu-direction")||""}set menuDirection(e){e?this.setAttribute("menu-direction",e):this.removeAttribute("menu-direction")}get sticky(){const e=this.getAttribute("sticky");return!!["start","end"].includes(e)&&e}set sticky(e){"start"===e||"end"===e?this.setAttribute("sticky",e):this.removeAttribute("sticky")}toggle(){this.collapsed=!this.collapsed}_onCollapseClick(){this.toggle()}_uid(e){return`${e}-${this._idCounter++}`}_isItemActive(e){if(e.selected)return!0;if(e.href){const t=window.location,n=t.pathname+t.search+t.hash;return e.href===n||e.href===t.href}return!1}render(){const e="vertical"===this.orientation,t=this.collapsed&&e,n=this.size,r=this.menuDirection||(e?"right":"down"),o={small:{padding:"var(--spacing-x-small, 4px)",collapsedWidth:"40px",bodyGap:"2px",buttonSize:"small"},medium:{padding:"var(--spacing-small, 6px)",collapsedWidth:"52px",bodyGap:"3px",buttonSize:"medium"},large:{padding:"var(--spacing-medium, 8px)",collapsedWidth:"64px",bodyGap:"4px",buttonSize:"large"}},a=o[n]||o.medium;this.shadowRoot.innerHTML="",this._idCounter=0;const i=document.createElement("style");i.textContent='\n            :host {\n                display: block;\n                font-family: var(--font-family-body, sans-serif);\n                color: var(--component-appbar-color, #f7f7fa);\n            }\n\n            :host([sticky]) {\n                position: sticky;\n                z-index: var(--component-appbar-z-index, 100);\n            }\n            :host([orientation="vertical"][sticky="start"]),\n            :host(:not([orientation])[sticky="start"]) {\n                left: 0;\n                top: 0;\n                height: 100%;\n            }\n            :host([orientation="vertical"][sticky="end"]),\n            :host(:not([orientation])[sticky="end"]) {\n                right: 0;\n                top: 0;\n                height: 100%;\n            }\n            :host([orientation="horizontal"][sticky="start"]) {\n                top: 0;\n                left: 0;\n                width: 100%;\n            }\n            :host([orientation="horizontal"][sticky="end"]) {\n                bottom: 0;\n                left: 0;\n                width: 100%;\n            }\n\n            :host([sticky]) .appbar {\n                border-radius: 0;\n                border: none;\n            }\n            :host([orientation="vertical"][sticky="start"]) .appbar,\n            :host(:not([orientation])[sticky="start"]) .appbar {\n                border-right: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="vertical"][sticky="end"]) .appbar,\n            :host(:not([orientation])[sticky="end"]) .appbar {\n                border-left: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="horizontal"][sticky="start"]) .appbar {\n                border-bottom: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n            :host([orientation="horizontal"][sticky="end"]) .appbar {\n                border-top: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n            }\n\n            .appbar {\n                display: flex;\n                background: var(--component-appbar-background, #0c0c0d);\n                border: var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                border-radius: var(--component-appbar-border-radius, var(--component-sidebar-border-radius, 4px));\n                overflow: visible;\n                padding: var(--_appbar-padding);\n                box-sizing: border-box;\n            }\n\n            .appbar.vertical {\n                flex-direction: column;\n                width: var(--component-appbar-width, 240px);\n                height: 100%;\n                transition: width 0.2s ease;\n            }\n            .appbar.vertical.collapsed {\n                width: var(--_appbar-collapsed-width);\n            }\n\n            .appbar.horizontal {\n                flex-direction: row;\n                width: 100%;\n                height: auto;\n                align-items: center;\n            }\n\n            .appbar-header,\n            .appbar-body,\n            .appbar-footer {\n                flex-shrink: 0;\n            }\n\n            .appbar-body {\n                flex: 1;\n                overflow-y: auto;\n                overflow-x: hidden;\n                display: flex;\n                gap: var(--_appbar-body-gap);\n            }\n\n            .appbar.vertical .appbar-body {\n                flex-direction: column;\n            }\n            .appbar.horizontal .appbar-body {\n                flex-direction: row;\n                overflow-y: hidden;\n                overflow-x: auto;\n                align-items: center;\n            }\n\n            .appbar.vertical .appbar-header {\n                border-bottom: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-bottom: var(--_appbar-padding);\n                margin-bottom: var(--_appbar-padding);\n            }\n            .appbar.vertical .appbar-footer {\n                border-top: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-top: var(--_appbar-padding);\n                margin-top: var(--_appbar-padding);\n            }\n\n            .appbar.horizontal .appbar-header {\n                border-right: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-right: var(--_appbar-padding);\n                margin-right: var(--_appbar-padding);\n            }\n            .appbar.horizontal .appbar-footer {\n                border-left: var(--component-appbar-inner-border-width, var(--component-sidebar-border-width, 2px)) solid var(--component-appbar-border-color, #37383a);\n                padding-left: var(--_appbar-padding);\n                margin-left: var(--_appbar-padding);\n            }\n\n            .header-content {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-small, 8px);\n                overflow: hidden;\n            }\n            .appbar.horizontal .header-content,\n            .appbar.vertical .header-content {\n                flex-direction: row;\n            }\n            .logo-wrapper {\n                width: var(--_icon-col-width);\n                display: flex;\n                justify-content: center;\n                align-items: center;\n                flex-shrink: 0;\n            }\n\n            .header-title {\n                font-weight: bold;\n                white-space: nowrap;\n                overflow: hidden;\n                text-overflow: ellipsis;\n                font-size: var(--font-size-label, 0.9em);\n            }\n            .appbar.vertical.collapsed .header-title {\n                display: none;\n            }\n\n            .nav-item {\n                display: flex;\n                align-items: center;\n                position: relative;\n            }\n            .appbar.vertical .nav-item {\n                width: 100%;\n            }\n            .appbar.vertical .nav-item y-button {\n                display: block;\n                width: 100%;\n            }\n            .appbar.vertical .nav-item y-button::part(button),\n            .appbar.vertical .appbar-footer y-button::part(button) {\n                width: 100%;\n                justify-content: flex-start;\n                padding-left: 0;\n                padding-right: 0;\n            }\n\n            /* Fixed-width icon column — matches collapsed inner width so icons stay centred across states */\n            .appbar.vertical .nav-item y-button::part(left-icon),\n            .appbar.vertical .appbar-footer y-button::part(left-icon) {\n                width: var(--_icon-col-width);\n                display: flex;\n                justify-content: center;\n                flex-shrink: 0;\n            }\n\n            .appbar.vertical .nav-item y-button::part(right-icon) {\n                margin-left: auto;\n            }\n\n            .appbar.vertical.collapsed .nav-item y-button::part(button),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(button) {\n                min-width: 0;\n            }\n            .appbar.vertical.collapsed .nav-item y-button::part(label),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(label) {\n                display: none;\n            }\n            .appbar.vertical.collapsed .nav-item y-button::part(right-icon),\n            .appbar.vertical.collapsed .appbar-footer y-button::part(right-icon) {\n                display: none;\n            }\n\n            .appbar-footer {\n                display: flex;\n                flex-direction: column;\n                gap: 2px;\n            }\n            .appbar.horizontal .appbar-footer {\n                flex-direction: row;\n                align-items: center;\n            }\n            .appbar.vertical .appbar-footer y-button {\n                display: block;\n                width: 100%;\n            }\n\n            .appbar.vertical.collapsed .appbar-header,\n            .appbar.vertical.collapsed .appbar-body,\n            .appbar.vertical.collapsed .appbar-footer {\n                align-items: center;\n            }\n\n            ::slotted(*) {\n                display: block;\n            }\n        ',this.shadowRoot.appendChild(i),document.querySelectorAll('link[rel="stylesheet"]').forEach(e=>{this.shadowRoot.appendChild(e.cloneNode(!0))});const s=document.createElement("div");s.className="appbar "+(e?"vertical":"horizontal"),t&&s.classList.add("collapsed"),s.setAttribute("role","navigation"),s.style.setProperty("--_appbar-padding",a.padding),s.style.setProperty("--_appbar-collapsed-width",a.collapsedWidth),s.style.setProperty("--_appbar-body-gap",a.bodyGap),s.style.setProperty("--_icon-col-width",`calc(${a.collapsedWidth} - 2 * var(--_appbar-padding) - 2 * var(--component-appbar-border-width, var(--component-sidebar-border-width, 2px)))`);const c=document.createElement("div");c.className="appbar-header",c.setAttribute("part","header");const l=document.createElement("div");l.className="header-content";const d=document.createElement("div");d.className="logo-wrapper";const p=document.createElement("slot");p.name="logo",d.appendChild(p),l.appendChild(d);const h=document.createElement("div");h.className="header-title";const b=document.createElement("slot");b.name="title",h.appendChild(b),l.appendChild(h),c.appendChild(l),s.appendChild(c);const u=document.createElement("div");u.className="appbar-body",u.setAttribute("part","body");this.items.forEach(n=>{const o=n.children?.length>0,i=document.createElement("div");i.className="nav-item";const s=document.createElement("y-button"),c=this._uid("appbar-btn");s.id=c;const l=this._isItemActive(n);if(s.setAttribute("color",l?"primary":"base"),s.setAttribute("style-type","flat"),s.setAttribute("size",a.buttonSize),n.icon)if(n.icon.trim().startsWith("<")){const e=document.createElement("span");e.slot="left-icon",e.innerHTML=n.icon,s.appendChild(e)}else{const e=document.createElement("y-icon");e.slot="left-icon",e.setAttribute("name",n.icon),e.setAttribute("size","small"),s.appendChild(e)}if(n.text&&!t){const e=document.createTextNode(n.text);s.appendChild(e)}if(o&&!t){const t=document.createElement("span");t.slot="right-icon",t.innerHTML=e?'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>',s.appendChild(t)}if(n.href&&!o&&s.addEventListener("click",()=>{window.location.href=n.href}),i.appendChild(s),o){const e=document.createElement("y-menu");e.setAttribute("anchor",c),e.setAttribute("direction",r),e.setAttribute("size",a.buttonSize),e.items=n.children,i.appendChild(e)}u.appendChild(i)}),s.appendChild(u);const m=document.createElement("div");m.className="appbar-footer",m.setAttribute("part","footer");const g=document.createElement("slot");if(g.name="footer",m.appendChild(g),e){const e=document.createElement("y-button");e.setAttribute("color","base"),e.setAttribute("style-type","flat"),e.setAttribute("size",a.buttonSize),e.setAttribute("aria-label",t?"Expand sidebar":"Collapse sidebar"),e.className="collapse-btn";const n=document.createElement("span");if(n.slot="left-icon",n.innerHTML=t?'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="13 17 18 12 13 7"/><polyline points="6 17 11 12 6 7"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="11 17 6 12 11 7"/><polyline points="18 17 13 12 18 7"/></svg>',e.appendChild(n),!t){const t=document.createTextNode("Collapse");e.appendChild(t)}e.addEventListener("click",this._onCollapseClick),m.appendChild(e)}s.appendChild(m),this.shadowRoot.appendChild(s)}}customElements.get("y-appbar")||customElements.define("y-appbar",b);class u extends HTMLElement{static get observedAttributes(){return["src","alt","size","shape"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}render(){const e=this.getAttribute("src"),t=this.getAttribute("alt")||"AN",n=`var(--component-avatar-border-radius-${this.getAttribute("shape")||"circle"}, 9999px)`;let r;switch(this.getAttribute("size")||"medium"){case"small":r="var(--component-avatar-size-small, 27px)";break;case"large":r="var(--component-avatar-size-large, 51px)";break;default:r="var(--component-avatar-size-medium, 35px)"}const o=new CSSStyleSheet;let a="";if(a=e?`\n          :host {\n            display: inline-block;\n            height: ${r};\n            min-width: ${r};\n          }\n          img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            border-radius: ${n};\n          }\n        `:`\n          :host {\n            display: inline-block;\n            width: ${r};\n            height: ${r};\n            min-width: ${r};\n            font-family: var(--font-family-header, "Lexend"), sans-serif;\n            text-transform: uppercase;\n          }\n          .avatar {\n            width: 100%;\n            height: 100%;\n            border-radius: ${n};\n            background-color: var(--primary-content--, #0576ff);\n            color: var(--primary-background-component, #0c0c0d);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n          }\n          .avatar h5 {\n            margin: 0;\n            font-size: calc(${r} * 0.5);\n          }\n        `,o.replaceSync(a),this.shadowRoot.adoptedStyleSheets=[o],e)this.shadowRoot.innerHTML=`<img src="${e}" alt="${t}" part="avatar" />`;else{const e=t.trim().split(/\s+/),n=e.length>=2?e[0].charAt(0)+e[1].charAt(0):t.substring(0,2);this.shadowRoot.innerHTML=`<div class="avatar" part="avatar"><h5>${n}</h5></div>`}}}customElements.get("y-avatar")||customElements.define("y-avatar",u);class m extends HTMLElement{static get observedAttributes(){return["value","position","alignment","color","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get alignment(){return this.getAttribute("alignment")||"right"}get color(){return this.getAttribute("color")||"primary"}get position(){return this.getAttribute("position")||"top"}get size(){return this.getAttribute("size")||"small"}get value(){return this.getAttribute("value")||""}getBadgeColors(e){return{primary:["var(--primary-content--)","var(--primary-content-inverse)"],secondary:["var(--secondary-content--)","var(--secondary-content-inverse)"],base:["var(--base-content--)","var(--base-content-inverse)"],success:["var(--success-content--)","var(--success-content-inverse)"],warning:["var(--warning-content--)","var(--warning-content-inverse)"],error:["var(--error-content--)","var(--error-content-inverse)"],help:["var(--help-content--)","var(--help-content-inverse)"]}[e]||[e,"var(--neutral-white, #fff)"]}getBadgePosition(e,t){const n="var(--spacing-small, 6px)";return`${"top"===e?`top: calc(${n} * -1);`:`bottom: calc(${n} * -1);`} ${"right"===t?`right: calc(${n} * -1);`:`left: calc(${n} * -1);`}`}getSizeAttributes(e){const t={small:{fontSize:"var(--font-size-small, 0.8em)",padding:"var(--component-badge-padding-small)",minSize:"var(--component-badge-size-small)"},medium:{fontSize:"var(--font-size-label, 0.83em)",padding:"var(--component-badge-padding-medium)",minSize:"var(--component-badge-size-medium)"},large:{fontSize:"var(--font-size-paragraph, 1em)",padding:"var(--component-badge-padding-large)",minSize:"var(--component-badge-size-large)"}};return t[e]||t.small}hasTargetContent(){return Array.from(this.childNodes).some(e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent.trim())}render(){const[e,t]=this.getBadgeColors(this.color),{fontSize:n,padding:r,minSize:o}=this.getSizeAttributes(this.size),a=this.getBadgePosition(this.position,this.alignment),i=this.hasTargetContent();this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    position: ${i?"relative":"static"};\n                    display: inline-flex;\n                    align-items: center;\n                }\n                .badge {\n                    position: ${i?"absolute":"static"};\n                    ${i?a:""}\n                    background: ${e};\n                    color: ${t};\n                    font-size: ${n};\n                    font-weight: bold;\n                    padding: ${r};\n                    border-radius: var(--component-badge-border-radius-circle, 9999px);\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    font-family: var(--font-family-body, sans-serif);\n                    min-width: ${o};\n                    height: ${o};\n                    z-index: 20;\n                }\n                ::slotted(*) {\n                    position: relative;\n                    display: inline-block;\n                }\n            </style>\n            ${i?"<slot></slot>":""}\n            <div class="badge" part="badge">${this.value}</div>\n        `}}function g(e,t){const n=e.match(/var\(\s*(--[^,)]+)/);if(!n)return e;return getComputedStyle(t).getPropertyValue(n[1]).trim()||e}function v(e){const t=function(e){const t=e.match(/^#([0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i);if(t){let e=t[1];return e.length<=4&&(e=e.split("").map(e=>e+e).join("")),{r:parseInt(e.slice(0,2),16),g:parseInt(e.slice(2,4),16),b:parseInt(e.slice(4,6),16)}}const n=e.match(/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);return n?{r:parseInt(n[1],10),g:parseInt(n[2],10),b:parseInt(n[3],10)}:null}(e);return t&&function({r:e,g:t,b:n}){const[r,o,a]=[e,t,n].map(e=>(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*r+.7152*o+.0722*a}(t)>.179?"var(--neutral-black, #000000)":"var(--neutral-white, #ffffff)"}customElements.get("y-badge")||customElements.define("y-badge",m);class f extends HTMLElement{static get observedAttributes(){return["color","raised"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.updateColorStyles(),this.updateElevationStyles()}attributeChangedCallback(e,t,n){t!==n&&("color"===e&&this.updateColorStyles(),"raised"===e&&this.updateElevationStyles(),this.render())}updateColorStyles(){const e={primary:["--base-content--","--primary-background-component","--primary-background-border","--primary-background-active"],secondary:["--base-content--","--secondary-background-component","--secondary-background-border","--secondary-background-active"],base:["--base-content--","--base-background-component","--base-background-border","--base-background-active"],success:["--base-content--","--success-background-component","--success-background-border","--success-background-active"],error:["--base-content--","--error-background-component","--error-background-border","--error-background-active"],warning:["--base-content--","--warning-background-component","--warning-background-border","--warning-background-active"]},t=e[this.getAttribute("color")||"base"]||e.base;this.style.setProperty("--card-content-color",`var(${t[0]})`),this.style.setProperty("--card-border-color",`var(${t[2]})`),this.style.setProperty("--card-background",`var(${t[1]})`),this.style.setProperty("--card-section-background",`var(${t[2]})`)}updateElevationStyles(){this.hasAttribute("raised")?(this.style.setProperty("--card-border-width","0"),this.style.setProperty("--card-box-shadow","var(--base-shadow)")):(this.style.setProperty("--card-border-width","var(--component-card-border-width)"),this.style.setProperty("--card-box-shadow","none"))}render(){const e=new CSSStyleSheet;e.replaceSync("\n            :host {\n                display: block;\n                box-sizing: border-box;\n                background: var(--card-background, var(--base-background-component));\n                border: var(--card-border-width, var(--component-card-border-width)) solid var(--card-border-color, var(--base-background-border));\n                border-radius: var(--component-card-border-radius-outer);\n                font-family: var(--font-family-body);\n                color: var(--card-content-color, var(--base-content--));\n                box-shadow: var(--card-box-shadow, none);\n            }\n\n            .header {\n                padding: var(--component-card-padding-outer);\n                border-bottom: var(--component-card-inner-border-width) solid var(--card-border-color, var(--base-background-border));\n            }\n\n            .body {\n                padding: var(--component-card-padding-outer);\n            }\n\n            .footer {\n                padding: var(--component-card-padding-inner) var(--component-card-padding-outer);\n                border-top: var(--component-card-inner-border-width) solid var(--card-border-color, var(--base-background-border));\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n        "),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML='\n            <div class="header" part="header">\n                <slot name="header"></slot>\n            </div>\n            <div class="body" part="body">\n                <slot></slot>\n            </div>\n            <div class="footer" part="footer">\n                <slot name="footer"></slot>\n            </div>\n        ',function(e,t={}){Object.entries(t).forEach(([t,n])=>{const r=e.querySelector("slot"+(t?`[name="${t}"]`:":not([name])")),o=e.querySelector(n);if(r&&o){const e=r.assignedNodes({flatten:!0}).filter(e=>!(e.nodeType===Node.TEXT_NODE&&""===e.textContent.trim()));o.style.display=e.length>0?"":"none"}})}(this.shadowRoot,{header:".header",footer:".footer"})}}customElements.get("y-card")||customElements.define("y-card",f);class k extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["checked","disabled","indeterminate","label-position","name","value"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.hasAttribute("label-position")||this.setAttribute("label-position","right"),this._internals.setFormValue(this.checked?this.value:null)}attributeChangedCallback(e){"checked"!==e&&"value"!==e||this._internals.setFormValue(this.checked?this.value:null),"indeterminate"===e&&this.updateIcon(),"label-position"===e&&this.render(),this.updateState()}get checked(){return this.hasAttribute("checked")}set checked(e){e?this.setAttribute("checked",""):this.removeAttribute("checked")}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get indeterminate(){return this.hasAttribute("indeterminate")}set indeterminate(e){e?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate")}get value(){return this.getAttribute("value")||"on"}set value(e){this.setAttribute("value",e)}get name(){return this.getAttribute("name")}toggle(){this.disabled||(this.indeterminate?(this.indeterminate=!1,this.checked=!0):this.checked=!this.checked,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}updateIcon(){const e=this.shadowRoot.querySelector(".icon");e&&(this.indeterminate?e.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="4" y="11" width="16" height="2" rx="1" ry="1" fill="currentColor"/></svg>':this.checked?e.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polyline points="5 13 10 17 19 6" fill="none" stroke="currentColor" stroke-width="2"/></svg>':e.innerHTML="")}updateState(){this.shadowRoot.querySelector(".checkbox").setAttribute("aria-checked",this.indeterminate?"mixed":this.checked?"true":"false"),this.updateIcon()}render(){const e=this.getAttribute("label-position")||"right",t=this.disabled,n=new CSSStyleSheet;n.replaceSync(`\n            :host {\n                display: inline-flex;\n                align-items: center;\n                line-height: 1;\n                vertical-align: middle;\n                font-family: var(--font-family-body);\n                cursor: ${t?"not-allowed":"pointer"};\n                opacity: ${t?"0.6":"1"};\n            }\n\n            .wrapper {\n                display: inline-flex;\n                align-items: center;\n                gap: var(--spacing-x-small, 6px);\n                line-height: 1;\n                flex-direction: ${"top"===e?"column":"bottom"===e?"column-reverse":"left"===e?"row-reverse":"row"};\n            }\n\n            .checkbox {\n                width: var(--component-checkbox-size, 20px);\n                height: var(--component-checkbox-size, 20px);\n                border: var(--component-inputs-border-width, 2px) solid var(--component-checkbox-border-color);\n                border-radius: var(--component-inputs-border-radius-outer, 4px);\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                background: var(--component-checkbox-background);\n                box-sizing: border-box;\n                transition: border-color 0.2s ease;\n                line-height: 0;\n            }\n\n            :host([disabled]) .checkbox {\n                border-color: var(--component-checkbox-border-color);\n                background: var(--component-checkbox-disabled-background, var(--component-checkbox-background));\n                cursor: not-allowed;\n            }\n\n            :host([disabled]) .checkbox:hover {\n                border-color: var(--component-checkbox-border-color);\n            }\n\n            .checkbox:hover {\n                border-color: var(--component-checkbox-accent);\n            }\n\n            .checkbox svg {\n                width: var(--component-checkbox-icon-size, 16px);\n                height: var(--component-checkbox-icon-size, 16px);\n                stroke: var(--component-checkbox-accent);\n                display: block;\n            }\n\n            [part="label"] {\n                display: inline-flex;\n                align-items: center;\n                font-size: 0.9em;\n                line-height: 1;\n                color: var(--component-checkbox-color);\n            }\n\n            .icon {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                width: 100%;\n                height: 100%;\n                line-height: 0;\n            }\n\n        `),this.shadowRoot.adoptedStyleSheets=[n],this.shadowRoot.innerHTML='\n            <div class="wrapper">\n                <div class="checkbox" role="checkbox" tabindex="0">\n                    <span class="icon"></span>\n                </div>\n                <label part="label">\n                    <slot></slot>\n                </label>\n            </div>\n        ',this.shadowRoot.querySelector(".checkbox").addEventListener("click",()=>this.toggle()),this.shadowRoot.querySelector(".checkbox").addEventListener("keydown",e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),this.toggle())}),this.updateState()}}customElements.get("y-checkbox")||customElements.define("y-checkbox",k);class w extends HTMLElement{static get observedAttributes(){return["visible","anchor","closable"]}constructor(){super(),this.attachShadow({mode:"open"}),this.onKeyDown=this.onKeyDown.bind(this),this.onAnchorClick=this.onAnchorClick.bind(this)}connectedCallback(){this.render(),this.setupAnchor(),this.visible&&this.show()}attributeChangedCallback(e,t,n){t!==n&&("visible"===e&&(this.visible?this.show():this.hide()),"anchor"===e&&this.setupAnchor(),"closable"===e&&this.render())}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get closable(){return this.hasAttribute("closable")}set closable(e){e?this.setAttribute("closable",""):this.removeAttribute("closable")}show(){this.shadowRoot.querySelector(".dialog")||this.render(),document.addEventListener("keydown",this.onKeyDown);const e=this.shadowRoot.querySelector(".dialog");e&&"function"==typeof e.focus&&e.focus()}hide(){document.removeEventListener("keydown",this.onKeyDown)}setupAnchor(){if(this._anchorEl&&this._anchorEl.removeEventListener("click",this.onAnchorClick),this.anchor){const e=document.getElementById(this.anchor);e&&(this._anchorEl=e,this._anchorEl.addEventListener("click",this.onAnchorClick))}}onAnchorClick(){this.visible=!this.visible}onKeyDown(e){"Escape"===e.key&&this.visible&&(this.visible=!1)}render(){const e=document.createElement("style");e.textContent="\n            :host {\n                position: fixed;\n                top: 0; left: 0; right: 0; bottom: 0;\n                display: none;\n                align-items: center;\n                justify-content: center;\n                background: rgba(0,0,0,0.5);\n                z-index: var(--component-dialog-z-index, 1000);\n            }\n            :host([visible]) { display: flex; }\n            .dialog {\n                background: var(--component-dialog-background);\n                border: var(--component-dialog-border-width, 1px) solid var(--component-dialog-border-color);\n                border-radius: var(--component-dialog-border-radius-outer, 4px);\n                max-width: 90%;\n                max-height: 90%;\n                display: flex;\n                flex-direction: column;\n                box-shadow: var(--component-dialog-shadow, 0 2px 10px rgba(0,0,0,0.3));\n            }\n            .header {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                font-weight: bold;\n                border-bottom: var(--component-dialog-inner-border-width, 1px) solid var(--component-dialog-border-color);\n                display: flex;\n                align-items: center;\n                justify-content: space-between;\n                gap: var(--spacing-small, 8px);\n            }\n            .header-content {\n                flex: 1;\n            }\n            .close-btn {\n                background: none;\n                border: none;\n                cursor: pointer;\n                padding: var(--spacing-x-small, 4px);\n                color: var(--component-dialog-color, #f7f7fa);\n                font-size: 1.25em;\n                line-height: 1;\n                border-radius: var(--component-button-border-radius-outer, 4px);\n                display: flex;\n                align-items: center;\n                justify-content: center;\n            }\n            .close-btn:hover {\n                background: var(--component-dialog-hover-background, #292a2b);\n            }\n            .close-btn:focus-visible {\n                outline: 2px solid var(--component-dialog-accent);\n                outline-offset: -1px;\n            }\n            .body {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                overflow: auto;\n                flex: 1;\n            }\n            .footer {\n                padding: var(--component-dialog-padding, var(--spacing-medium));\n                border-top: var(--component-dialog-inner-border-width, 1px) solid var(--component-dialog-border-color);\n                text-align: right;\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n        ",this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(e);const t=document.createElement("div");t.className="dialog",t.setAttribute("role","dialog"),t.setAttribute("aria-modal","true"),t.setAttribute("tabindex","-1");const n=document.createElement("div");n.className="header",n.setAttribute("part","header");const r=document.createElement("div");if(r.className="header-content",r.innerHTML='<slot name="header"></slot>',n.appendChild(r),this.closable){const e=document.createElement("button");e.className="close-btn",e.setAttribute("aria-label","Close"),e.innerHTML="&#10005;",e.addEventListener("click",()=>{this.visible=!1}),n.appendChild(e)}const o=document.createElement("div");o.className="body",o.setAttribute("part","body"),o.innerHTML='<slot name="body"></slot>';const a=document.createElement("div");a.className="footer",a.setAttribute("part","footer"),a.innerHTML='<slot name="footer"></slot>',t.appendChild(n),t.appendChild(o),t.appendChild(a),this.shadowRoot.appendChild(t)}}customElements.get("y-dialog")||customElements.define("y-dialog",w);class y extends HTMLElement{static get observedAttributes(){return["visible","anchor","position","resizable"]}constructor(){super(),this.attachShadow({mode:"open"}),this._onAnchorClick=this._onAnchorClick.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onResizePointerDown=this._onResizePointerDown.bind(this),this._onResizePointerMove=this._onResizePointerMove.bind(this),this._onResizePointerUp=this._onResizePointerUp.bind(this)}connectedCallback(){this.render(),this._setupAnchor(),this.visible&&this._show()}disconnectedCallback(){this._teardownAnchor(),document.removeEventListener("keydown",this._onKeyDown),this._cleanupResize()}attributeChangedCallback(e,t,n){t!==n&&("visible"===e&&(this.visible?this._show():this._hide()),"anchor"===e&&(this._teardownAnchor(),this._setupAnchor()),"position"===e&&this._applyPosition(),"resizable"===e&&this._applyResizable())}get visible(){return this.hasAttribute("visible")}set visible(e){e?this.setAttribute("visible",""):this.removeAttribute("visible")}get anchor(){return this.getAttribute("anchor")}set anchor(e){this.setAttribute("anchor",e)}get position(){return this.getAttribute("position")||"left"}set position(e){this.setAttribute("position",e)}get resizable(){return this.hasAttribute("resizable")}set resizable(e){e?this.setAttribute("resizable",""):this.removeAttribute("resizable")}_setupAnchor(){const e=this.anchor;if(e){const t=document.getElementById(e);t&&(this._anchorEl=t,this._anchorEl.addEventListener("click",this._onAnchorClick))}}_teardownAnchor(){this._anchorEl&&(this._anchorEl.removeEventListener("click",this._onAnchorClick),this._anchorEl=null)}_onAnchorClick(){this.visible=!this.visible}_show(){this.style.display="block",this.offsetHeight;const e=this.shadowRoot.querySelector(".overlay"),t=this.shadowRoot.querySelector(".drawer-panel");e&&e.classList.add("open"),t&&(t.classList.add("open"),t.focus()),document.addEventListener("keydown",this._onKeyDown)}_hide(){const e=this.shadowRoot.querySelector(".overlay"),t=this.shadowRoot.querySelector(".drawer-panel");e&&e.classList.remove("open"),t&&t.classList.remove("open"),document.removeEventListener("keydown",this._onKeyDown);const n=this._getTransitionDuration(t);n>0?(clearTimeout(this._hideTimer),this._hideTimer=setTimeout(()=>{this.visible||(this.style.display="none")},n)):this.style.display="none"}_getTransitionDuration(e){if(!e)return 0;const t=getComputedStyle(e).transitionDuration||"0s",n=parseFloat(t);return isNaN(n)?0:1e3*n}_onKeyDown(e){"Escape"===e.key&&this.visible&&(this.visible=!1)}_onOverlayClick(){this.visible=!1}_applyPosition(){const e=this.shadowRoot.querySelector(".drawer-panel");e&&e.setAttribute("data-position",this.position)}_applyResizable(){const e=this.shadowRoot.querySelector(".resize-handle");e&&(e.style.display=this.resizable?"flex":"none")}_isHorizontal(){return"left"===this.position||"right"===this.position}_onResizePointerDown(e){e.preventDefault(),this._resizing=!0,this._startPointer=this._isHorizontal()?e.clientX:e.clientY;const t=this.shadowRoot.querySelector(".drawer-panel");this._startSize=this._isHorizontal()?t.offsetWidth:t.offsetHeight,t.style.transition="none",document.addEventListener("pointermove",this._onResizePointerMove),document.addEventListener("pointerup",this._onResizePointerUp)}_onResizePointerMove(e){if(!this._resizing)return;const t=this.shadowRoot.querySelector(".drawer-panel"),n=(this._isHorizontal()?e.clientX:e.clientY)-this._startPointer;let r;r="left"===this.position?this._startSize+n:"right"===this.position?this._startSize-n:"top"===this.position?this._startSize+n:this._startSize-n;r=Math.max(100,r),this._isHorizontal()?t.style.width=`${r}px`:t.style.height=`${r}px`}_onResizePointerUp(){this._resizing=!1;const e=this.shadowRoot.querySelector(".drawer-panel");e&&(e.style.transition=""),document.removeEventListener("pointermove",this._onResizePointerMove),document.removeEventListener("pointerup",this._onResizePointerUp)}_cleanupResize(){document.removeEventListener("pointermove",this._onResizePointerMove),document.removeEventListener("pointerup",this._onResizePointerUp)}_gripSVG(){return`<svg xmlns="http://www.w3.org/2000/svg" width="${(e=this._isHorizontal())?4:20}" height="${e?20:4}" viewBox="0 0 ${e?4:20} ${e?20:4}" fill="currentColor">\n            ${e?'<circle cx="2" cy="4"  r="1.5"/>\n                   <circle cx="2" cy="10" r="1.5"/>\n                   <circle cx="2" cy="16" r="1.5"/>':'<circle cx="4"  cy="2" r="1.5"/>\n                   <circle cx="10" cy="2" r="1.5"/>\n                   <circle cx="16" cy="2" r="1.5"/>'}\n        </svg>`;var e}render(){this.shadowRoot.innerHTML="";const e=document.createElement("style");e.textContent='\n            :host {\n                position: fixed;\n                top: 0; left: 0; right: 0; bottom: 0;\n                display: none;\n                z-index: var(--component-drawer-z-index, 5000);\n            }\n            :host([visible]) {\n                display: block;\n            }\n\n            .overlay {\n                position: absolute;\n                top: 0; left: 0; right: 0; bottom: 0;\n                background: rgba(0, 0, 0, 0);\n                transition: background var(--drawer-transition-duration, 0.3s) ease;\n            }\n            .overlay.open {\n                background: rgba(0, 0, 0, 0.4);\n            }\n\n            .drawer-panel {\n                position: absolute;\n                background: var(--component-drawer-background, #0c0c0d);\n                color: var(--component-drawer-color, #f7f7fa);\n                box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);\n                overflow: hidden;\n                outline: none;\n                display: flex;\n                flex-direction: column;\n                border: none;\n                border-radius: var(--component-drawer-border-radius, 0);\n                transition: transform var(--drawer-transition-duration, 0.3s) ease;\n            }\n\n            .drawer-panel[data-position="left"],\n            .drawer-panel[data-position="right"] {\n                top: 0;\n                bottom: 0;\n                width: var(--drawer-width, 300px);\n                flex-direction: row;\n            }\n            .drawer-panel[data-position="left"] {\n                left: 0;\n                transform: translateX(-100%);\n                border-right: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n            .drawer-panel[data-position="right"] {\n                right: 0;\n                transform: translateX(100%);\n                border-left: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n\n            .drawer-panel[data-position="top"],\n            .drawer-panel[data-position="bottom"] {\n                left: 0;\n                right: 0;\n                height: var(--drawer-height, 300px);\n            }\n            .drawer-panel[data-position="top"] {\n                top: 0;\n                transform: translateY(-100%);\n                border-bottom: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n            .drawer-panel[data-position="bottom"] {\n                bottom: 0;\n                transform: translateY(100%);\n                border-top: var(--component-drawer-border-width, 2px) solid var(--component-drawer-border-color, #37383a);\n            }\n\n            .drawer-panel.open { transform: translate(0, 0); }\n\n            .drawer-header {\n                padding: var(--component-drawer-padding, 1rem);\n                font-weight: bold;\n            }\n            .drawer-body {\n                padding: var(--component-drawer-padding, 1rem);\n                flex: 1;\n                overflow: auto;\n            }\n            .drawer-footer {\n                padding: var(--component-drawer-padding, 1rem);\n            }\n\n            /* Wrapper so header/body/footer stack vertically inside a row layout */\n            .drawer-content {\n                display: flex;\n                flex-direction: column;\n                flex: 1;\n                min-width: 0;\n                min-height: 0;\n                overflow: hidden;\n            }\n\n            ::slotted(*) {\n                margin: 0;\n            }\n\n            .resize-handle {\n                display: none;              /* hidden until resizable attr */\n                flex-shrink: 0;\n                align-items: center;\n                justify-content: center;\n                color: var(--component-drawer-color, #f7f7fa);\n                opacity: 0.6;\n                touch-action: none;         /* needed for pointer events */\n                user-select: none;\n                transition: opacity 0.15s, background 0.15s;\n            }\n            .resize-handle:hover,\n            .resize-handle:active {\n                opacity: 1;\n                background: var(--component-drawer-hover-background, #292a2b);\n            }\n\n            .drawer-panel[data-position="left"] > .resize-handle,\n            .drawer-panel[data-position="right"] > .resize-handle {\n                width: var(--component-drawer-handle-width, 6px);\n                padding: var(--component-drawer-handle-padding, 4px);\n                cursor: ew-resize;\n            }\n            .drawer-panel[data-position="left"] > .resize-handle {\n                order: 99;\n            }\n            .drawer-panel[data-position="right"] > .resize-handle {\n                order: -1;\n            }\n\n            .drawer-panel[data-position="top"] > .resize-handle,\n            .drawer-panel[data-position="bottom"] > .resize-handle {\n                height: var(--component-drawer-handle-width, 6px);\n                padding: var(--component-drawer-handle-padding, 4px);\n                cursor: ns-resize;\n            }\n            .drawer-panel[data-position="top"] > .resize-handle {\n                order: 99;\n            }\n            .drawer-panel[data-position="bottom"] > .resize-handle {\n                order: -1;\n            }\n        ',this.shadowRoot.appendChild(e);const t=document.createElement("div");t.className="overlay",t.setAttribute("part","overlay"),t.addEventListener("click",()=>this._onOverlayClick()),this.shadowRoot.appendChild(t);const n=document.createElement("div");n.className="drawer-panel",n.setAttribute("role","dialog"),n.setAttribute("aria-modal","true"),n.setAttribute("tabindex","-1"),n.setAttribute("part","panel"),n.setAttribute("data-position",this.position);const r=document.createElement("div");r.className="resize-handle",r.innerHTML=this._gripSVG(),r.style.display=this.resizable?"flex":"none",r.addEventListener("pointerdown",this._onResizePointerDown),n.appendChild(r);const o=document.createElement("div");o.className="drawer-content";const a=document.createElement("div");a.className="drawer-header",a.setAttribute("part","header"),a.innerHTML='<slot name="header"></slot>';const i=document.createElement("div");i.className="drawer-body",i.setAttribute("part","body"),i.innerHTML='<slot name="body"></slot>';const s=document.createElement("div");s.className="drawer-footer",s.setAttribute("part","footer"),s.innerHTML='<slot name="footer"></slot>',o.appendChild(a),o.appendChild(i),o.appendChild(s),n.appendChild(o),this.shadowRoot.appendChild(n),this.visible&&requestAnimationFrame(()=>{t.classList.add("open"),n.classList.add("open")})}}customElements.get("y-drawer")||customElements.define("y-drawer",y);class x extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["type","size","value","label-position","disabled","invalid","name"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this._internals.setFormValue(this.value)}attributeChangedCallback(e,t,n){if(t!==n)return"value"===e?(this.input&&(this.input.value=n),void(this._internals&&this._internals.setFormValue(n,this.getAttribute("name")))):void("name"!==e?"invalid"!==e?this.render():this.updateValidationState():this._internals.setFormValue(this.value,n))}get value(){return this.input?.value||""}set value(e){this.input?this.input.value=e:this.setAttribute("value",e),this._internals.setFormValue(e,this.getAttribute("name"))}checkValidity(){return this.input?.checkValidity?.()??!0}updateValidationState(){const e=this.hasAttribute("invalid"),t=this.input&&!this.checkValidity(),n=e||t;this.inputContainer?.classList.toggle("is-invalid",n),this.labelWrapper?.classList.toggle("is-invalid",n)}render(){const e=this.getAttribute("type")||"text",t=this.getAttribute("size")||"medium",n=this.getAttribute("value")||"",r=this.getAttribute("label-position")||"top",o=this.hasAttribute("disabled"),a="top"===r,i={small:"--component-inputs-padding-small",medium:"--component-inputs-padding-medium",large:"--component-inputs-padding-large"}[t],s=new CSSStyleSheet;s.replaceSync(`\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n                color: var(--component-input-color);\n                opacity: ${o?"0.75":"1"};\n                pointer-events: ${o?"none":"auto"};\n            }\n\n            .input-wrapper {\n                position: relative;\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-2x-small, 4px);\n            }\n\n            .input-container {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-x-small);\n                background: ${o?"var(--component-input-background-disabled)":"var(--component-input-background)"};\n                border: var(--component-inputs-border-width) solid var(--component-input-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                padding: var(${i});\n                box-sizing: border-box;\n                transition: border-color 0.2s ease-in-out;\n            }\n\n            .input-container.is-invalid {\n                border-color: var(--component-input-error-border-color);\n                background: var(--component-input-error-background);\n            }\n\n            .input-container.is-invalid input {\n                color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:hover {\n                border-color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:focus-within {\n                border-color: var(--component-input-error-color);\n            }\n\n            .input-container.is-invalid:focus-within input {\n                color: var(--component-input-color);\n            }\n\n            input {\n                all: unset;\n                flex: 1;\n                font-family: inherit;\n                font-size: 1em;\n                color: inherit;\n                min-width: 0;\n                min-height: 20px;\n            }\n\n            .input-container:hover {\n                border-color: var(--component-input-color);\n                transition: border-color 0.2s ease-in-out;\n            }\n\n            .input-container:focus-within {\n                border-color: var(--component-input-accent);\n            }\n\n            .label-wrapper.is-invalid ::slotted([slot="label"]) {\n                color: var(--component-input-error-color);\n            }\n\n            ::slotted([slot="label"]) {\n                font-weight: 500;\n                font-size: 0.875em;\n                color: var(--component-input-label-color);\n            }\n\n            ::slotted([slot="left-icon"]),\n            ::slotted([slot="right-icon"]) {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                color: var(--component-input-icon-color);\n            }\n        `),this.shadowRoot.adoptedStyleSheets=[s],this.shadowRoot.innerHTML=`\n            <div class="input-wrapper">\n                ${a?'<div class="label-wrapper"><slot name="label"></slot></div>':""}\n                <div class="input-container">\n                    <slot name="left-icon"></slot>\n                    <input part="input" type="${e}" value="${n}" ${o?"disabled":""} />\n                    <slot name="right-icon"></slot>\n                </div>\n                ${a?"":'<div class="label-wrapper"><slot name="label"></slot></div>'}\n            </div>\n        `,this.input=this.shadowRoot.querySelector("input"),this.inputContainer=this.shadowRoot.querySelector(".input-container"),this.labelWrapper=this.shadowRoot.querySelector(".label-wrapper"),o||(this.input.addEventListener("input",e=>{this.setAttribute("value",e.target.value),this.dispatchEvent(new CustomEvent("input",{detail:{value:e.target.value},bubbles:!0,composed:!0})),this.updateValidationState()}),this.updateValidationState())}}customElements.get("y-input")||customElements.define("y-input",x);class A extends HTMLElement{static get observedAttributes(){return["selected","expanded","href","history"]}constructor(){super(),this.attachShadow({mode:"open"}),this._expanded=!1,this._checkRouteMatchBound=this.checkRouteMatch.bind(this),this.render()}connectedCallback(){this.addHeaderListeners(),this.checkForChildren(),this.updateChildState(),this.updateSelectedState(),this.updateExpandedState(),this.hasAttribute("href")&&(this.checkRouteMatch(),window.addEventListener("popstate",this._checkRouteMatchBound))}disconnectedCallback(){this.hasAttribute("href")&&window.removeEventListener("popstate",this._checkRouteMatchBound)}attributeChangedCallback(e,t,n){t!==n&&("selected"===e&&this.updateSelectedState(),"expanded"===e&&this.updateExpandedState(),"href"===e&&this.checkRouteMatch())}get selected(){return this.hasAttribute("selected")}set selected(e){e?this.setAttribute("selected",""):this.removeAttribute("selected")}get expanded(){return this.hasAttribute("expanded")}set expanded(e){e?this.setAttribute("expanded",""):this.removeAttribute("expanded")}toggle(){if(this.hasChildren()){if(this._expanded)this.collapse();else{const e=this.closest("y-panelbar");if(e&&e.hasAttribute("exclusive")){const e=this.parentElement;(e?Array.from(e.children).filter(e=>"Y-PANEL"===e.tagName):[]).forEach(e=>{e!==this&&e.expanded&&e.collapse()})}this.expand()}this.dispatchEvent(new CustomEvent("toggle",{detail:{expanded:this._expanded},bubbles:!0,composed:!0}))}}expand(){this.hasChildren()&&(this.expanded=!0,this._expanded=!0,this.updateExpandedState(),this.dispatchEvent(new CustomEvent("expand",{detail:{expanded:!0},bubbles:!0,composed:!0})))}collapse(){this.expanded=!1,this._expanded=!1,this.updateExpandedState(),this.dispatchEvent(new CustomEvent("collapse",{detail:{expanded:!1},bubbles:!0,composed:!0}))}updateSelectedState(){this.classList.toggle("selected",this.selected)}updateChildState(){let e=0,t=this.parentElement;for(;t;){const n=t.closest("y-panel");if(!n||n===this)break;e++,t=n.parentElement}this.setAttribute("data-is-child",e>0?"true":"false"),this.style.setProperty("--panel-depth",e)}checkRouteMatch(){const e=this.getAttribute("href");e&&window.location.pathname===e?this.selected=!0:this.selected=!1}addHeaderListeners(){const e=this.shadowRoot.querySelector(".header");if(!e)return;e.addEventListener("click",e=>{if(e.stopPropagation(),this.hasAttribute("href")){const e=this.getAttribute("href");return void("false"!==this.getAttribute("history")?(history.pushState({},"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:{}}))):window.location.href=e)}this.hasChildren()?this.toggle():this.dispatchEvent(new CustomEvent("select",{detail:{selected:!0},bubbles:!0,composed:!0}))}),e.addEventListener("keydown",t=>{" "!==t.key&&"Enter"!==t.key||(t.preventDefault(),e.click())});const t=this.shadowRoot.querySelector('slot[name="children"]');t&&t.addEventListener("slotchange",()=>this.checkForChildren())}hasChildren(){const e=this.shadowRoot.querySelector('slot[name="children"]');if(!e)return!1;return e.assignedNodes({flatten:!0}).some(e=>e.nodeType!==Node.TEXT_NODE||""!==e.textContent.trim())}checkForChildren(){const e=this.hasChildren();this.setAttribute("data-has-children",e?"true":"false"),!e&&this.expanded&&(this.expanded=!1)}updateExpandedState(){const e=this.hasChildren(),t=this.shadowRoot.querySelector(".header"),n=this.expanded&&e;this._expanded=n,t&&t.setAttribute("aria-expanded",String(n))}render(){const e=new CSSStyleSheet;e.replaceSync('\n            :host {\n                display: block;\n                box-sizing: border-box;\n                background: var(--component-panel-background);\n                color: var(--component-panel-color);\n                font-family: var(--font-family-body);\n                overflow: hidden;\n            }\n\n            :host([expanded]) {\n                background: var(--component-panel-expanded-background);\n            }\n\n            :host([selected]) {\n                color: var(--component-panel-accent);\n            }\n\n            :host([data-is-child="true"]) {\n                box-shadow: inset var(--component-panelbar-border-width, 2px) 0 0 0 var(--component-panel-active-border);\n            }\n\n            :host([data-is-child="true"][selected]) {\n                box-shadow: inset var(--component-panelbar-border-width, 2px) 0 0 0 var(--component-panel-accent);\n            }\n\n            :host([selected]) .header:hover {\n                background: var(--component-panel-accent-hover-background);\n            }\n\n            :host([data-is-child="true"]) .header {\n                padding-left: calc(var(--component-panelbar-padding, 4px) + (var(--panel-depth, 1) * var(--component-panelbar-indent, 16px)));\n            }\n\n            .header {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-medium, 8px);\n                padding: var(--component-panelbar-padding, 4px);\n                cursor: pointer;\n                transition: background 0.2s ease;\n                user-select: none;\n            }\n\n            .header:hover {\n                background: var(--component-panel-hover-background);\n            }\n\n            :host([data-has-children="false"]) .header {\n                cursor: default;\n            }\n\n            .header ::slotted([slot="icon"]) {\n                margin-right: 6px;\n            }\n\n            .header ::slotted([slot="label"]) {\n                flex-grow: 1;\n                cursor: inherit;\n                font-size: 1rem;\n                line-height: 1.2;\n            }\n\n            .arrow {\n                display: inline-flex;\n                align-items: center;\n                justify-content: center;\n                width: 20px;\n                height: 20px;\n                transition: transform 0.2s ease;\n            }\n\n            :host([expanded]) .arrow {\n                transform: rotate(180deg);\n            }\n\n            .children {\n                display: none;\n                padding: 0;\n                width: 100%;\n                box-sizing: border-box;\n            }\n\n            .children ::slotted(y-panel) {\n                width: 100%;\n                box-sizing: border-box;\n            }\n\n            :host([expanded]) .children {\n                display: block;\n            }\n\n            :host([data-has-children="false"]) .arrow {\n                visibility: hidden;\n            }\n        '),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML=`\n            <div class="header" part="header" role="button" tabindex="0" aria-expanded="false">\n                <slot name="icon"></slot>\n                <slot name="label"><slot></slot></slot>\n                <span class="arrow" id="arrow" part="arrow">\n                    ${h}\n                </span>\n            </div>\n            <div class="children" id="childrenContainer" part="children">\n                <slot name="children"></slot>\n            </div>\n        `}}customElements.get("y-panel")||customElements.define("y-panel",A);class z extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.render()}render(){const e=new CSSStyleSheet;e.replaceSync("\n            :host {\n                display: block;\n            }\n        "),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML="\n            <slot></slot>\n        "}}customElements.get("y-panelbar")||customElements.define("y-panelbar",z);class E extends HTMLElement{static get observedAttributes(){return["value","min","max","step","size","color","label-display","label-format","indeterminate","disabled"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("min")||this.setAttribute("min","0"),this.hasAttribute("max")||this.setAttribute("max","100"),this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get value(){const e=parseFloat(this.getAttribute("value"));return Number.isNaN(e)?null:e}set value(e){null==e?this.removeAttribute("value"):this.setAttribute("value",String(e))}get min(){return parseFloat(this.getAttribute("min"))||0}set min(e){this.setAttribute("min",String(e))}get max(){return parseFloat(this.getAttribute("max"))||100}set max(e){this.setAttribute("max",String(e))}get step(){const e=parseFloat(this.getAttribute("step"));return Number.isNaN(e)||e<=0?null:e}set step(e){null==e?this.removeAttribute("step"):this.setAttribute("step",String(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||"primary"}set color(e){this.setAttribute("color",e)}get labelDisplay(){return"false"!==this.getAttribute("label-display")}set labelDisplay(e){this.setAttribute("label-display",e?"true":"false")}get labelFormat(){return this.getAttribute("label-format")||"percent"}set labelFormat(e){this.setAttribute("label-format",e)}get indeterminate(){return this.hasAttribute("indeterminate")}set indeterminate(e){e?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate")}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}increment(){if(null===this.value)return;const e=this.step||1;this.value=Math.min(this.value+e,this.max)}decrement(){if(null===this.value)return;const e=this.step||1;this.value=Math.max(this.value-e,this.min)}get percentage(){if(null===this.value)return 0;const e=this.max-this.min;if(e<=0)return 0;let t=(this.value-this.min)/e*100;if(this.step){const n=this.step/e*100;t=Math.round(t/n)*n}return Math.max(0,Math.min(100,t))}getBarColor(e){return{primary:"var(--primary-content--)",secondary:"var(--secondary-content--)",base:"var(--base-content--)",success:"var(--success-content--)",warning:"var(--warning-content--)",error:"var(--error-content--)",help:"var(--help-content--)"}[e]||e}getSizeVar(e){const t={small:"var(--component-progress-size-small)",medium:"var(--component-progress-size-medium)",large:"var(--component-progress-size-large)"};return t[e]||t.medium}getLabel(){if(this.indeterminate)return"";if(null===this.value)return"";switch(this.labelFormat){case"value":return`${this.value} / ${this.max}`;case"fraction":return`${this.value-this.min} / ${this.max-this.min}`;default:return`${Math.round(this.percentage)}%`}}render(){const e=this.indeterminate,t=this.percentage,n=this.getBarColor(this.color),r=this.getSizeVar(this.size),o=this.disabled,a=this.labelDisplay&&!e,i=this.getLabel(),s=null!==this.value?this.value:void 0;this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: block;\n                    font-family: var(--font-family-body);\n                    color: var(--base-content--);\n                    opacity: ${o?"0.5":"1"};\n                    pointer-events: ${o?"none":"auto"};\n                }\n\n                .progress-wrapper {\n                    display: flex;\n                    flex-direction: column;\n                    gap: var(--spacing-2x-small, 4px);\n                }\n\n                .progress-header {\n                    display: flex;\n                    align-items: center;\n                    justify-content: space-between;\n                    font-size: var(--font-size-label, 0.83em);\n                }\n\n                .label {\n                    color: var(--base-content--);\n                }\n\n                .track {\n                    position: relative;\n                    width: 100%;\n                    height: ${r};\n                    background: var(--base-background-component);\n                    border: var(--component-progress-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-progress-border-radius-outer);\n                    overflow: hidden;\n                    box-sizing: border-box;\n                    padding: var(--component-progress-padding);\n                }\n\n                .bar {\n                    position: relative;\n                    height: 100%;\n                    background: ${n};\n                    border-radius: var(--component-progress-border-radius-inner);\n                    width: ${e?"30%":`${t}%`};\n                    transition: ${e?"none":"width 0.3s ease"};\n                    overflow: hidden;\n                    ${e?"animation: indeterminate 1.5s ease-in-out infinite;":""}\n                }\n\n                .value-label {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    right: 0;\n                    bottom: 0;\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    font-size: var(--font-size-small, 0.75em);\n                    font-variant-numeric: tabular-nums;\n                    white-space: nowrap;\n                    pointer-events: none;\n                    font-weight: 600;\n                }\n\n                .value-label--track {\n                    color: ${n};\n                }\n\n                .value-label--bar {\n                    color: var(--base-background-component);\n                    width: calc(100% / (${t||1} / 100));\n                }\n\n                @keyframes indeterminate {\n                    0% {\n                        transform: translateX(0%);\n                    }\n                    50% {\n                        transform: translateX(233%);\n                    }\n                    100% {\n                        transform: translateX(0%);\n                    }\n                }\n            </style>\n\n            <div class="progress-wrapper">\n                <div class="progress-header">\n                    <span class="label"><slot></slot></span>\n                </div>\n                <div\n                    class="track"\n                    part="track"\n                    role="progressbar"\n                    aria-valuenow="${void 0!==s?s:""}"\n                    aria-valuemin="${this.min}"\n                    aria-valuemax="${this.max}"\n                    ${e?'aria-busy="true"':""}\n                >\n                    ${a?`<span class="value-label value-label--track" part="value-label">${i}</span>`:""}\n                    <div class="bar" part="bar">${a?`<span class="value-label value-label--bar">${i}</span>`:""}</div>\n                </div>\n            </div>\n        `}}customElements.get("y-progress")||customElements.define("y-progress",E);class C extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["options","name","value","disabled"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this._value=""}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&("value"===e?(this._value=n,this._internals.setFormValue(n,this.name),this.updateChecked()):["options","name","disabled"].includes(e)&&this.render())}get value(){return this._value}set value(e){this._value=e,this.setAttribute("value",e),this._internals.setFormValue(e,this.name),this.updateChecked()}get name(){return this.getAttribute("name")||""}get options(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch{return[]}}set options(e){this.setAttribute("options",JSON.stringify(e))}updateChecked(){this.shadowRoot.querySelectorAll("input[type=radio]").forEach((e,t)=>{const n=e.value===this.value;e.checked=n,e.setAttribute("aria-checked",n),e.setAttribute("tabindex",n?"0":"-1")})}handleKey(e,t,n){const r=n.length;let o=t;if("ArrowDown"===e.key||"ArrowRight"===e.key)e.preventDefault(),o=(t+1)%r;else{if("ArrowUp"!==e.key&&"ArrowLeft"!==e.key)return" "===e.key||"Enter"===e.key?(e.preventDefault(),this.value=n[t].value,void this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))):void 0;e.preventDefault(),o=(t-1+r)%r}n[o].focus()}render(){const e=this.name,t=this.hasAttribute("disabled"),n=this.value,r=this.options;this.shadowRoot.innerHTML=`\n            <style>\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n            }\n            fieldset {\n                border: none;\n                padding: 0;\n                margin: 0;\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-x-small, 8px);\n            }\n            label {\n                display: flex;\n                align-items: center;\n                gap: 0.5em;\n                cursor: pointer;\n            }\n            input[type="radio"] {\n                appearance: none;\n                width: var(--component-radio-size, 16px);\n                height: var(--component-radio-size, 16px);\n                border: var(--component-inputs-border-width, 2px) solid var(--component-radio-color);\n                border-radius: 50%;\n                position: relative;\n                outline: none;\n                cursor: pointer;\n            }\n            input[type="radio"]:checked::after {\n                content: '';\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                width: var(--component-radio-dot-size, 8px);\n                height: var(--component-radio-dot-size, 8px);\n                background: var(--component-radio-color);\n                border-radius: 50%;\n                transform: translate(-50%, -50%);\n            }\n            input[type="radio"]:focus-visible {\n                outline: 2px solid var(--component-radio-accent);\n                outline-offset: 2px;\n            }\n            input[disabled] {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n        </style>\n            <fieldset role="radiogroup" part="radio">\n                ${r.map((r,o)=>`\n                    <label part="label">\n                        <input\n                            type="radio"\n                            name="${e}"\n                            value="${r.value}"\n                            ${t?"disabled":""}\n                            ${n===r.value?"checked":""}\n                            tabindex="${n?n===r.value?"0":"-1":0===o?"0":"-1"}"\n                            role="radio"\n                            aria-checked="${n===r.value}"\n                        />\n                        ${r.label}\n                    </label>\n                `).join("")}\n            </fieldset>\n        `,this.shadowRoot.querySelectorAll("input[type=radio]").forEach((e,t,n)=>{e.addEventListener("keydown",e=>this.handleKey(e,t,n)),e.addEventListener("click",e=>{this.value=e.target.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))})})}}customElements.get("y-radio")||customElements.define("y-radio",C);class _ extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["label-position","disabled","invalid","required","value","name","placeholder","options","display-mode","close-on-click-outside"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this.selectedValues=new Set,this._onDocumentClick=this._onDocumentClick.bind(this),this.render()}connectedCallback(){this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this.updateValidation(),this._internals.setFormValue(this.value)}disconnectedCallback(){this.closeDropdown()}_onDocumentClick(e){if("false"===this.getAttribute("close-on-click-outside"))return;!e.composedPath().includes(this)&&this.dropdown?.classList.contains("open")&&this.closeDropdown()}attributeChangedCallback(e,t,n){t!==n&&("value"===e&&(this.updateDisplay(),this._internals.setFormValue(n,this.getAttribute("name")),this.updateSelectedStyles()),["label-position","disabled","invalid","required","placeholder","options"].includes(e)&&this.render(),"name"===e&&this._internals.setFormValue(this.value,n))}get value(){return this.hasAttribute("multiple")?Array.from(this.selectedValues).join(","):this._value||""}set value(e){this.hasAttribute("multiple")?"string"==typeof e?this.selectedValues=new Set(e.split(",").map(e=>e.trim())):Array.isArray(e)&&(this.selectedValues=new Set(e)):this._value=e,this.setAttribute("value",e),this._internals.setFormValue(this.value,this.getAttribute("name")),this.updateDisplay(),this.updateSelectedStyles()}getOptions(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch(e){return[]}}getDisplayText(){const e=this.getOptions(),t=this.hasAttribute("multiple"),n="tag"===this.getAttribute("display-mode");if(t&&n)return"";if(t){const t=e.filter(e=>this.selectedValues.has(e.value)).length;return t>0?`${t} Selected`:this.getAttribute("placeholder")||"Select..."}{const t=e.find(e=>e.value===this.value);return t?.label||this.getAttribute("placeholder")||"Select..."}}toggleDropdown(){this.dropdown.classList.contains("open")?this.closeDropdown():(this.dropdown.classList.add("open"),this.selectContainer.classList.add("open"),this._positionDropdown(),this._onScrollOrResize=this._positionDropdown.bind(this),window.addEventListener("scroll",this._onScrollOrResize,!0),window.addEventListener("resize",this._onScrollOrResize),document.addEventListener("click",this._onDocumentClick,!0))}closeDropdown(){this.dropdown?.classList.remove("open"),this.selectContainer?.classList.remove("open"),document.removeEventListener("click",this._onDocumentClick,!0),this._onScrollOrResize&&(window.removeEventListener("scroll",this._onScrollOrResize,!0),window.removeEventListener("resize",this._onScrollOrResize),this._onScrollOrResize=null)}_positionDropdown(){const e=this.selectContainer.getBoundingClientRect();this.dropdown.style.left=`${e.left}px`,this.dropdown.style.width=`${e.width}px`;const t=window.innerHeight-e.bottom-4;t>=200||t>=e.top?(this.dropdown.style.top=`${e.bottom+4}px`,this.dropdown.style.bottom="auto"):(this.dropdown.style.bottom=window.innerHeight-e.top+4+"px",this.dropdown.style.top="auto")}queryRefs(){this.selectContainer=this.shadowRoot.querySelector(".select-container"),this.dropdown=this.shadowRoot.querySelector(".dropdown"),this.labelWrapper=this.shadowRoot.querySelector(".label-wrapper"),this.displayElement=this.shadowRoot.querySelector(".value-display")}attachEventListeners(){this.selectContainer.addEventListener("click",()=>this.toggleDropdown()),this.dropdown.querySelectorAll(".dropdown-item").forEach(e=>{e.addEventListener("click",()=>{const t=e.getAttribute("data-value"),n=this.hasAttribute("required");if(this.hasAttribute("multiple"))this.selectedValues.has(t)?(!n||this.selectedValues.size>1)&&this.selectedValues.delete(t):this.selectedValues.add(t),this.setAttribute("value",Array.from(this.selectedValues).join(","));else{const e=t===this.value;this.value=e&&!n?"":t}this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0})),this.updateValidation(),this.closeDropdown()})})}renderTags(){const e=this.hasAttribute("multiple"),t="tag"===this.getAttribute("display-mode");if(!e||!t||!this.displayElement)return;const n=this.getOptions();this.displayElement.innerHTML="";n.filter(e=>this.selectedValues.has(e.value)).forEach(e=>{const t=document.createElement("y-tag");t.setAttribute("removable",""),t.setAttribute("color","primary"),t.setAttribute("style-type","filled"),t.textContent=e.label,t.dataset.value=e.value,t.addEventListener("remove",()=>{this.selectedValues.delete(e.value),this.setAttribute("value",Array.from(this.selectedValues).join(",")),this.renderTags(),this.updateSelectedStyles(),this.updateValidation(),this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))}),this.displayElement.appendChild(t)})}updateDisplay(){"tag"===this.getAttribute("display-mode")?this.renderTags():this.displayElement&&(this.displayElement.textContent=this.getDisplayText())}updateSelectedStyles(){const e=this.hasAttribute("multiple")?this.selectedValues:new Set([this.value]);this.dropdown?.querySelectorAll(".dropdown-item").forEach(t=>{const n=t.getAttribute("data-value");t.classList.toggle("selected",e.has(n))})}updateValidation(){const e=this.hasAttribute("required"),t=this.hasAttribute("multiple")?this.selectedValues.size>0:this.value&&""!==this.value;e&&!t?this.setAttribute("invalid",""):this.removeAttribute("invalid")}updateValidationState(){const e=this.hasAttribute("invalid");this.selectContainer?.classList.toggle("is-invalid",e),this.labelWrapper?.classList.toggle("is-invalid",e)}render(){this.closeDropdown(),this.applyStyles(),this.shadowRoot.innerHTML=this.generateTemplate(),this.queryRefs(),this.attachEventListeners(),this.updateValidationState()}applyStyles(){const e=this.hasAttribute("disabled"),t=new CSSStyleSheet;t.replaceSync(`\n            :host {\n                display: block;\n                font-family: var(--font-family-body);\n                color: var(--component-select-color);\n                opacity: ${e?"0.75":"1"};\n                pointer-events: ${e?"none":"auto"};\n            }\n\n            .select-wrapper {\n                display: flex;\n                flex-direction: column;\n                gap: var(--spacing-2x-small, 4px);\n                position: relative;\n            }\n\n            .select-container {\n                display: flex;\n                align-items: center;\n                gap: var(--spacing-x-small);\n                background: var(--component-select-background);\n                border: var(--component-inputs-border-width) solid var(--component-select-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                padding: var(--component-inputs-padding-medium);\n                box-sizing: border-box;\n                transition: border-color 0.2s ease-in-out;\n                cursor: pointer;\n            }\n\n            .select-container:hover {\n                border-color: var(--component-select-color);\n            }\n\n            .select-container:focus-within {\n                border-color: var(--component-select-accent);\n            }\n\n            .select-container.is-invalid {\n                border-color: var(--component-select-error-border-color);\n                background: var(--component-select-error-background);\n            }\n\n            .select-container.is-invalid:hover {\n                border-color: var(--component-select-error-color);\n            }\n\n            .select-container.is-invalid:focus-within {\n                border-color: var(--component-select-error-color);\n            }\n\n            .label-wrapper.is-invalid ::slotted([slot="label"]) {\n                color: var(--component-select-error-color);\n            }\n\n            ::slotted([slot="label"]) {\n                font-weight: 500;\n                font-size: 0.875em;\n                color: var(--component-select-label-color);\n            }\n\n            .dropdown {\n                position: fixed;\n                z-index: var(--component-select-z-index, 6000);\n                background: var(--component-select-background);\n                border: var(--component-inputs-border-width) solid var(--component-select-border-color);\n                border-radius: var(--component-inputs-border-radius-outer);\n                box-shadow: var(--component-select-shadow, 0 2px 8px rgba(0,0,0,0.1));\n                max-height: 200px;\n                overflow-y: auto;\n                display: none;\n            }\n\n            .dropdown.open {\n                display: block;\n            }\n\n            .dropdown-item {\n                padding: var(--spacing-small, 6px);\n                cursor: pointer;\n            }\n\n            .dropdown-item:hover {\n                background: var(--component-select-hover-background);\n            }\n\n            .dropdown-item.selected {\n                background: var(--component-select-accent);\n                color: var(--component-select-accent-contrast);\n            }\n\n            .value-display {\n                flex: 1;\n                font-size: 1em;\n                color: inherit;\n                display: flex;\n                gap: var(--spacing-x-small);\n            }\n\n            .label-wrapper {\n                display: block;\n            }\n\n            .chevron-icon {\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                margin-left: auto;\n                transition: transform 0.2s ease;\n            }\n\n            .chevron-icon svg {\n                transition: transform 0.2s ease;\n                transform-origin: center;\n            }\n\n            .select-container.open .chevron-icon svg {\n                transform: scaleY(-1);\n            }\n        `),this.shadowRoot.adoptedStyleSheets=[t]}generateTemplate(){const e="top"===(this.getAttribute("label-position")||"top"),t=this.hasAttribute("invalid"),n=this.hasAttribute("multiple")?this.selectedValues:new Set([this.value]);return`\n            <div class="select-wrapper">\n                ${e?'<div class="label-wrapper"><slot name="label"></slot></div>':""}\n                <div class="select-container ${t?"is-invalid":""}" tabindex="0">\n                    <div class="value-display">${this.getDisplayText()}</div>\n                    <div class="chevron-icon" part="chevron-icon">\n                        ${h}\n                    </div>\n                </div>\n                ${e?"":'<div class="label-wrapper"><slot name="label"></slot></div>'}\n                <div class="dropdown" part="dropdown">\n                    ${this.getOptions().map(e=>`\n                        <div class="dropdown-item ${n.has(e.value)?"selected":""}" data-value="${e.value}">\n                            ${e.label}\n                        </div>\n                    `).join("")}\n                </div>\n            </div>\n        `}}customElements.get("y-select")||customElements.define("y-select",_);class S extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["value","min","max","step","size","color","disabled","name","orientation"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"}),this._dragging=!1}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("min")||this.setAttribute("min","0"),this.hasAttribute("max")||this.setAttribute("max","100"),this.hasAttribute("value")||this.setAttribute("value","50"),this._internals.setFormValue(this.value),this.render(),this._bindEvents()}attributeChangedCallback(e,t,n){t!==n&&("value"!==e&&"name"!==e||this._internals.setFormValue(this.value,this.getAttribute("name")),"value"===e&&this.shadowRoot.querySelector(".slider-track")?this._updateVisuals():(this.render(),this._bindEvents()))}get value(){const e=parseFloat(this.getAttribute("value"));return Number.isNaN(e)?0:e}set value(e){const t=Math.max(this.min,Math.min(this.max,Number(e))),n=this._snapToStep(t);this.setAttribute("value",String(n))}get min(){return parseFloat(this.getAttribute("min"))||0}set min(e){this.setAttribute("min",String(e))}get max(){return parseFloat(this.getAttribute("max"))||100}set max(e){this.setAttribute("max",String(e))}get step(){const e=parseFloat(this.getAttribute("step"));return Number.isNaN(e)||e<=0?null:e}set step(e){null==e?this.removeAttribute("step"):this.setAttribute("step",String(e))}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}get color(){return this.getAttribute("color")||"primary"}set color(e){this.setAttribute("color",e)}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get orientation(){return this.getAttribute("orientation")||"horizontal"}set orientation(e){this.setAttribute("orientation",e)}get percentage(){const e=this.max-this.min;if(e<=0)return 0;const t=(this.value-this.min)/e*100;return Math.max(0,Math.min(100,t))}_snapToStep(e){if(!this.step)return e;const t=Math.round((e-this.min)/this.step);return Math.max(this.min,Math.min(this.max,this.min+t*this.step))}getTrackColor(e){return{primary:"var(--primary-background-hover)",secondary:"var(--secondary-background-hover)",base:"var(--base-background-active)",success:"var(--success-background-hover)",warning:"var(--warning-background-hover)",error:"var(--error-background-hover)",help:"var(--help-background-hover)"}[e]||e}getThumbColor(e){return{primary:"var(--primary-content--)",secondary:"var(--secondary-content--)",base:"var(--base-content--)",success:"var(--success-content--)",warning:"var(--warning-content--)",error:"var(--error-content--)",help:"var(--help-content--)"}[e]||e}getSizeVars(e){const t={small:{trackHeight:"var(--sizing-small, 27px)"},medium:{trackHeight:"var(--sizing-medium, 35px)"},large:{trackHeight:"var(--sizing-large, 51px)"}};return t[e]||t.medium}_bindEvents(){const e=this.shadowRoot.querySelector(".slider-track"),t=this.shadowRoot.querySelector(".thumb");if(!e||!t)return;const n=e=>{this.disabled||(e.preventDefault(),this._dragging=!0,this._updateFromPointer(e),document.addEventListener("pointermove",r),document.addEventListener("pointerup",o))},r=e=>{this._dragging&&this._updateFromPointer(e)},o=()=>{this._dragging=!1,document.removeEventListener("pointermove",r),document.removeEventListener("pointerup",o),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))};e.addEventListener("pointerdown",n),t.addEventListener("pointerdown",n),e.addEventListener("keydown",e=>{if(this.disabled)return;const t=this.step||1;let n=!0;switch(e.key){case"ArrowRight":case"ArrowUp":this.value=this.value+t;break;case"ArrowLeft":case"ArrowDown":this.value=this.value-t;break;case"Home":this.value=this.min;break;case"End":this.value=this.max;break;default:n=!1}n&&(e.preventDefault(),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))})}_updateFromPointer(e){const t=this.shadowRoot.querySelector(".slider-track"),n=(this.shadowRoot.querySelector(".slider-inner")||t).getBoundingClientRect(),r=Math.max(0,Math.min(1,(e.clientX-n.left)/n.width)),o=this.min+r*(this.max-this.min);this.value=o,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}_updateVisuals(){const e=this.percentage,t=this.shadowRoot.querySelector(".fill"),n=this.shadowRoot.querySelector(".thumb"),r=this.shadowRoot.querySelector(".slider-track");t&&(t.style.width=`${e}%`),n&&(n.style.left=`${e}%`),r&&r.setAttribute("aria-valuenow",String(this.value))}render(){const e=this.percentage,t=this.getTrackColor(this.color),n=this.getThumbColor(this.color),{trackHeight:r}=this.getSizeVars(this.size),o=this.disabled;this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-block;\n                    width: var(--component-slider-width, 129px);\n                    font-family: var(--font-family-body);\n                    color: var(--base-content--);\n                    opacity: ${o?"0.5":"1"};\n                    pointer-events: ${o?"none":"auto"};\n                }\n\n                .slider-wrapper {\n                    display: flex;\n                    flex-direction: column;\n                    gap: var(--spacing-2x-small, 4px);\n                }\n\n                .slider-track {\n                    position: relative;\n                    width: 100%;\n                    height: ${r};\n                    background: var(--base-background-component);\n                    border: var(--component-slider-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-slider-border-radius-outer);\n                    box-sizing: border-box;\n                    padding: var(--component-slider-padding);\n                    cursor: pointer;\n                    outline: none;\n                }\n\n                .slider-track:focus-visible {\n                    border-color: ${n};\n                }\n\n                .slider-inner {\n                    position: relative;\n                    width: 100%;\n                    height: 100%;\n                    overflow: hidden;\n                }\n\n                .fill {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    height: 100%;\n                    background: ${t};\n                    border-radius: var(--component-slider-border-radius-inner) 0 0 var(--component-slider-border-radius-inner);\n                    width: ${e}%;\n                    pointer-events: none;\n                }\n\n                .thumb {\n                    position: absolute;\n                    top: 0;\n                    left: ${e}%;\n                    transform: translateX(-50%);\n                    width: 8px;\n                    height: 100%;\n                    background: ${n};\n                    border-radius: var(--component-slider-thumb-border-radius);\n                    cursor: grab;\n                    z-index: 1;\n                    touch-action: none;\n                }\n\n                .thumb:active {\n                    cursor: grabbing;\n                }\n            </style>\n\n            <div class="slider-wrapper">\n                <div\n                    class="slider-track"\n                    part="track"\n                    role="slider"\n                    tabindex="${o?"-1":"0"}"\n                    aria-valuenow="${this.value}"\n                    aria-valuemin="${this.min}"\n                    aria-valuemax="${this.max}"\n                    ${this.step?`aria-valuestep="${this.step}"`:""}\n                    aria-orientation="${this.orientation}"\n                    ${o?'aria-disabled="true"':""}\n                >\n                    <div class="slider-inner">\n                        <div class="fill" part="fill"></div>\n                        <div class="thumb" part="thumb"></div>\n                    </div>\n                </div>\n            </div>\n        `}}customElements.get("y-slider")||customElements.define("y-slider",S);class L extends HTMLElement{static formAssociated=!0;static get observedAttributes(){return["checked","disabled","animate","toggle-label","label-display","label-position","size","value"]}constructor(){super(),this._internals=this.attachInternals(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("label-display")||this.setAttribute("label-display","true"),this.hasAttribute("label-position")||this.setAttribute("label-position","top"),this.hasAttribute("animate")||this.setAttribute("animate","true"),this.render(),this.mirrorToggleLabels();const e=this.shadowRoot.querySelector(".switch");e.addEventListener("click",()=>this.toggle()),e.addEventListener("keydown",e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),this.toggle())})}attributeChangedCallback(e,t,n){t!==n&&this.update()}get checked(){return this.hasAttribute("checked")}set checked(e){e?this.setAttribute("checked",""):this.removeAttribute("checked"),this.update()}get value(){return this.getAttribute("value")||"on"}set value(e){this.setAttribute("value",e),this.update()}toggle(){this.hasAttribute("disabled")||(this.checked=!this.checked,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}labelTag(e){if("false"===this.getAttribute("label-display"))return"";const t=this.getAttribute("label-position");return"top"===e&&("top"===t||"left"===t)||"bottom"===e&&("bottom"===t||"right"===t)?'<label><slot name="label"></slot></label>':""}mirrorToggleLabels(){requestAnimationFrame(()=>{const e=this.shadowRoot?.querySelector(".toggle");if(!e)return;e.innerHTML="";const t=this.querySelector('[slot="off-label"]'),n=this.querySelector('[slot="on-label"]'),r=document.createTextNode("Off"),o=document.createTextNode("On"),a=t?.cloneNode(!0)||r,i=n?.cloneNode(!0)||o,s=document.createElement("span");s.className="off",s.appendChild(a);const c=document.createElement("span");c.className="on",c.appendChild(i),e.appendChild(s),e.appendChild(c)})}update(){this.updateSizeStyles(),this.updateTogglePosition(),this.updateToggleLabelDisplay(),this.updateLabelDisplay(),this.updateDirection(),this.updateAria(),this.updateFormValue(),this.mirrorToggleLabels()}updateSizeStyles(){const e=this.getAttribute("size")||"medium";this.style.setProperty("--switch-height",{small:"24px",medium:"32px",large:"40px"}[e]),this.style.setProperty("--switch-width-fixed",{small:"44px",medium:"56px",large:"72px"}[e]),this.style.setProperty("--toggle-size","calc(var(--switch-height) - (var(--switch-padding) * 2) - (var(--component-switch-border-width, 0px) * 2))"),this.style.setProperty("--switch-font-size",{small:"var(--font-size-small)",medium:"var(--font-size-label)",large:"var(--font-size-h4)"}[e])}updateTogglePosition(){const e=this.checked,t=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--toggle-x",e?t?"100%":"calc(var(--switch-width) - var(--toggle-size) - (var(--switch-padding) * 2) - (var(--component-switch-border-width, 0px) * 2))":"0"),this.style.setProperty("--toggle-bg",e?"var(--primary-content--)":"var(--base-content-light)"),this.style.setProperty("--toggle-transition","false"===this.getAttribute("animate")?"none":"transform 0.25s ease, background 0.25s ease")}updateLabelDisplay(){const e=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--show-labels",e?"flex":"none")}updateToggleLabelDisplay(){const e=this.hasAttribute("toggle-label")&&"false"!==this.getAttribute("toggle-label");this.style.setProperty("--show-toggle-label",e?"inline-flex":"none"),this.style.setProperty("--switch-width",e?"max-content":"var(--switch-width-fixed)"),this.style.setProperty("--toggle-width",e?"auto":"var(--toggle-size)"),this.style.setProperty("--toggle-padding",e?"0 var(--spacing-small)":"0"),this.style.setProperty("--toggle-radius",e?"var(--component-switch-border-radius)":"9999px")}updateDirection(){const e=this.getAttribute("label-position");this.style.setProperty("--switch-dir",{top:"column",bottom:"column-reverse",left:"row-reverse",right:"row"}[e]||"column")}updateAria(){const e=this.shadowRoot?.querySelector(".switch");e&&(e.setAttribute("aria-checked",this.checked),e.setAttribute("aria-disabled",this.disabled?"true":"false"))}updateFormValue(){this._internals.setFormValue(this.checked?this.value:"")}render(){this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-flex;\n                    flex-direction: var(--switch-dir, column);\n                    align-items: center;\n                    gap: var(--spacing-x-small);\n                    font-family: var(--font-family-body);\n                    --switch-padding: var(--component-switch-padding, 2px);\n                    --show-labels: flex;\n                    --show-toggle-label: none;\n                    --switch-width: max-content;\n                    --toggle-width: auto;\n                    --toggle-padding: 0 var(--spacing-small);\n                    --toggle-radius: var(--component-switch-border-radius);\n                }\n\n                .label {\n                    font-size: var(--font-size-label);\n                    color: var(--base-content--);\n                }\n\n                .switch {\n                    position: relative;\n                    display: inline-flex;\n                    align-items: center;\n                    background: var(--base-background-component);\n                    border: var(--component-switch-border-width) solid var(--base-background-border);\n                    border-radius: var(--component-switch-border-radius);\n                    cursor: pointer;\n                    height: var(--switch-height);\n                    font-size: var(--switch-font-size);\n                    box-sizing: border-box;\n                    padding: var(--switch-padding);\n                    width: var(--switch-width, max-content);\n                }\n\n                .track {\n                    display: flex;\n                    align-items: center;\n                    height: 100%;\n                    position: relative;\n                    z-index: 0;\n                }\n\n                .label-content {\n                    flex: 0 0 auto;\n                    align-items: center;\n                    justify-content: center;\n                    padding: 0 var(--spacing-small);\n                    white-space: nowrap;\n                    position: relative;\n                    z-index: 0;\n                    color: var(--base-content-light);\n                    display: var(--show-labels, flex);\n                }\n\n                .toggle {\n                    position: absolute;\n                    top: var(--switch-padding);\n                    bottom: var(--switch-padding);\n                    left: var(--switch-padding);\n                    height: calc(100% - (var(--switch-padding) + var(--switch-padding)));\n                    width: var(--toggle-width, auto);\n                    background: var(--toggle-bg, var(--base-content-light));\n                    color: var(--base-background-component);\n                    border-radius: var(--toggle-radius, var(--component-switch-border-radius));\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    padding: var(--toggle-padding, 0 var(--spacing-small));\n                    font-weight: 500;\n                    z-index: 1;\n                    white-space: nowrap;\n                    transform: translateX(var(--toggle-x, 0));\n                    transition: var(--toggle-transition, transform 0.25s ease, background 0.25s ease);\n                }\n\n                .toggle .on,\n                .toggle .off {\n                    display: none;\n                }\n\n                :host([checked]) .toggle .on {\n                    display: var(--show-toggle-label, none);\n                }\n\n                :host(:not([checked])) .toggle .off {\n                    display: var(--show-toggle-label, none);\n                }\n\n\n                :host([animate="false"]) .toggle {\n                    transition: none !important;\n                }\n            </style>\n\n            ${this.labelTag("top")}\n\n            <div class="switch" part="switch" tabindex="0" role="switch" aria-checked="${this.checked}" aria-disabled="${this.disabled}">\n                <div class="track">\n                    <div class="label-content"><slot name="off-label">Off</slot></div>\n                    <div class="label-content"><slot name="on-label">On</slot></div>\n                </div>\n                <div class="toggle" part="toggle">\n                    <span class="off"></span>\n                    <span class="on"></span>\n                </div>\n            </div>\n\n            ${this.labelTag("bottom")}\n        `,this.update()}}customElements.get("y-switch")||customElements.define("y-switch",L);class $ extends HTMLElement{static get observedAttributes(){return["columns","data","striped","size"]}constructor(){super(),this.attachShadow({mode:"open"}),this._sortField=null,this._sortDir="none",this._parsedData=[],this._parsedColumns=[]}connectedCallback(){this._parseAttributes(),this.render()}attributeChangedCallback(e,t,n){t!==n&&(this._parseAttributes(),this.render())}get columns(){return this.getAttribute("columns")}set columns(e){this.setAttribute("columns","string"==typeof e?e:JSON.stringify(e))}get data(){return this.getAttribute("data")}set data(e){this.setAttribute("data","string"==typeof e?e:JSON.stringify(e))}get striped(){return this.hasAttribute("striped")}set striped(e){e?this.setAttribute("striped",""):this.removeAttribute("striped")}get size(){return this.getAttribute("size")||"medium"}set size(e){this.setAttribute("size",e)}_parseAttributes(){try{this._parsedColumns=JSON.parse(this.columns||"[]")}catch{this._parsedColumns=[]}try{this._parsedData=JSON.parse(this.data||"[]")}catch{this._parsedData=[]}}_onHeaderClick(e){this._sortField===e?(this._sortDir="asc"===this._sortDir?"desc":"desc"===this._sortDir?"none":"asc","none"===this._sortDir&&(this._sortField=null)):(this._sortField=e,this._sortDir="asc"),this.dispatchEvent(new CustomEvent("sort",{detail:{field:this._sortField,direction:this._sortDir},bubbles:!0,composed:!0})),this.render()}_getSortedData(){const e=[...this._parsedData];if(!this._sortField||"none"===this._sortDir)return e;const t="asc"===this._sortDir?1:-1,n=this._sortField;return e.sort((e,r)=>{const o=e[n],a=r[n];return null==o&&null==a?0:null==o?1:null==a?-1:"number"==typeof o&&"number"==typeof a?(o-a)*t:String(o).localeCompare(String(a))*t})}_sortIcon(e){const t=this._sortField===e?this._sortDir:"none";return function(e,t){return`<svg class="sort-icon" xmlns="http://www.w3.org/2000/svg" width="12" height="16" viewBox="0 0 12 16" aria-hidden="true">\n            <path d="M6 1 L11 7 L1 7 Z" fill="${e}"/>\n            <path d="M6 15 L11 9 L1 9 Z" fill="${t}"/>\n        </svg>`}("asc"===t?"var(--component-table-color, #f7f7fa)":"var(--component-table-color-light, #acaeb2)","desc"===t?"var(--component-table-color, #f7f7fa)":"var(--component-table-color-light, #acaeb2)")}render(){const e=this._parsedColumns,t=this._getSortedData(),n=this.size,r=this.striped,o=`var(--component-table-padding-${n}, 8px)`;this.shadowRoot.innerHTML="";const a=document.createElement("style");a.textContent=`\n            :host {\n                display: block;\n                font-family: var(--font-family-body, sans-serif);\n                color: var(--component-table-color, #f7f7fa);\n            }\n\n            .table-wrapper {\n                overflow-x: auto;\n            }\n\n            table {\n                width: 100%;\n                border-collapse: collapse;\n                table-layout: auto;\n            }\n\n            thead th {\n                position: relative;\n                padding: ${o};\n                text-align: left;\n                font-weight: 500;\n                font-size: var(--font-size-paragraph, 1em);\n                white-space: nowrap;\n                background: transparent;\n                border-bottom: var(--component-table-border-width-header, 2px) solid var(--component-table-border-color, #37383a);\n                user-select: none;\n            }\n\n            thead th.sortable {\n                cursor: pointer;\n            }\n\n            thead th.sortable:hover {\n                background: var(--component-table-hover-background, #292a2b);\n            }\n\n            .th-content {\n                display: inline-flex;\n                align-items: center;\n                gap: 6px;\n            }\n\n            .sort-icon {\n                flex-shrink: 0;\n                vertical-align: middle;\n            }\n\n            tbody td {\n                padding: ${o};\n                font-size: var(--font-size-paragraph, 1em);\n                border-bottom: var(--component-table-border-width, 2px) solid var(--component-table-border-color, #37383a);\n            }\n\n            tbody tr:last-child td {\n                border-bottom: none;\n            }\n\n            tbody td.row-header {\n                font-weight: 500;\n            }\n\n            ${r?"tbody tr:nth-child(even) {\n                    background: var(--component-table-hover-background, #292a2b);\n                }":""}\n\n            tbody tr:hover {\n                background: var(--component-table-active-background, #46474a);\n            }\n        `,this.shadowRoot.appendChild(a);const i=document.createElement("div");i.className="table-wrapper";const s=document.createElement("table");s.setAttribute("role","grid"),s.setAttribute("part","table");const c=document.createElement("thead");c.setAttribute("part","header");const l=document.createElement("tr");e.forEach(e=>{const t=document.createElement("th");t.setAttribute("scope","col");const n=!1!==e.sortable;n&&(t.classList.add("sortable"),t.setAttribute("aria-sort",this._sortField===e.field?"asc"===this._sortDir?"ascending":"desc"===this._sortDir?"descending":"none":"none"),t.addEventListener("click",()=>this._onHeaderClick(e.field)));const r=document.createElement("span");if(r.className="th-content",r.textContent=e.header||e.field,n){const t=document.createElement("span");t.innerHTML=this._sortIcon(e.field),r.appendChild(t)}t.appendChild(r),l.appendChild(t)}),c.appendChild(l),s.appendChild(c);const d=document.createElement("tbody");t.forEach(t=>{const n=document.createElement("tr");n.setAttribute("part","row"),e.forEach((e,r)=>{const o=document.createElement("td");o.setAttribute("part","cell"),(e.rowHeader||0===r)&&o.classList.add("row-header"),o.textContent=t[e.field]??"",n.appendChild(o)}),d.appendChild(n)}),s.appendChild(d),i.appendChild(s),this.shadowRoot.appendChild(i)}}customElements.get("y-table")||customElements.define("y-table",$);class T extends HTMLElement{static get observedAttributes(){return["removable","color","style-type","shape"]}constructor(){super(),this.attachShadow({mode:"open"}),this.render()}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}render(){const e=this.hasAttribute("removable"),t=this.getAttribute("color")||"base",n=this.getAttribute("style-type")||"filled",r=this.getAttribute("shape")||"square",o=document.createElement("style");o.textContent=this.getStyle(t,n,r),this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(o),this.shadowRoot.innerHTML+=`\n            <span class="tag" part="tag">\n                <slot></slot>\n                ${e?'\n                    <button class="remove" part="remove" aria-label="Remove tag">\n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="14" height="14" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"><line x1="6" y1="6" x2="14" y2="14" /><line x1="14" y1="6" x2="6" y2="14" /></svg>\n                    </button>\n                ':""}\n            </span>\n        `,e&&this.shadowRoot.querySelector(".remove").addEventListener("click",e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("remove",{bubbles:!0,composed:!0}))})}getStyle(e,t,n){const r={primary:["--primary-content--","--primary-content-hover","--primary-background-component","--primary-content-inverse"],secondary:["--secondary-content--","--secondary-content-hover","--secondary-background-component","--secondary-content-inverse"],base:["--base-content--","--base-content-lighter","--base-background-component","--base-content-inverse"],success:["--success-content--","--success-content-hover","--success-background-component","--success-content-inverse"],error:["--error-content--","--error-content-hover","--error-background-component","--error-content-inverse"],warning:["--warning-content--","--warning-content-hover","--warning-background-component","--warning-content-inverse"],help:["--help-content--","--help-content-hover","--help-background-component","--help-content-inverse"]},[o,a,i,s]=r[e]||r.base,c={filled:`\n                .tag {\n                    background: var(${o});\n                    color: var(${s});\n                }\n                .remove {\n                    color: var(${s});\n                }\n            `,outlined:`\n                .tag {\n                    border: 1px solid var(${o});\n                    background: transparent;\n                    color: var(${o});\n                }\n                .remove {\n                    color: var(${o});\n                }\n            `,flat:`\n                .tag {\n                    background: transparent;\n                    color: var(${o});\n                }\n                .remove {\n                    color: var(${o});\n                }\n            `};return`\n            :host {\n                display: inline-block;\n                font-family: var(--font-family-body, sans-serif);\n                font-size: var(--font-size-label, 0.83em);\n            }\n            .tag {\n                display: inline-flex;\n                align-items: center;\n                gap: var(--spacing-2x-small);\n                padding: 0 var(--component-tag-padding-medium, var(--spacing-x-small));\n                border: 1px solid transparent;\n                transition: background-color 0.2s, color 0.2s;\n                border-radius: ${"round"===n?"var(--component-tag-border-radius-circle)":"var(--component-tag-border-radius-square)"};\n            }\n            .remove {\n                all: unset;\n                cursor: pointer;\n                display: flex;\n                align-items: center;\n            }\n            .remove svg {\n                pointer-events: none;\n            }\n        `+(c[t]||c.filled)}}customElements.get("y-tag")||customElements.define("y-tag",T);class M extends HTMLElement{static get observedAttributes(){return["options","size","position"]}constructor(){super(),this.attachShadow({mode:"open"}),this._activeTab=""}connectedCallback(){this.hasAttribute("size")||this.setAttribute("size","medium"),this.hasAttribute("position")||this.setAttribute("position","top"),this.render()}attributeChangedCallback(e,t,n){"options"!==e&&"size"!==e&&"position"!==e||t===n||this.render()}get options(){try{return JSON.parse(this.getAttribute("options")||"[]")}catch{return[]}}set options(e){this.setAttribute("options",JSON.stringify(e)),this.render()}get size(){const e=this.getAttribute("size");return["small","medium","large"].includes(e)?e:"medium"}set size(e){["small","medium","large"].includes(e)?this.setAttribute("size",e):this.setAttribute("size","medium")}get position(){const e=this.getAttribute("position");return["top","bottom","left","right"].includes(e)?e:"top"}set position(e){["top","bottom","left","right"].includes(e)?this.setAttribute("position",e):this.setAttribute("position","top")}activateTab(e){const t=this.options.find(t=>t.id===e);t&&!t.disabled&&this._activeTab!==e&&(this._activeTab=e,this.render())}_setupEvents(){const e=Array.from(this.shadowRoot.querySelectorAll("button"));e.forEach(t=>{t.disabled||(t.addEventListener("click",()=>this.activateTab(t.dataset.id)),t.addEventListener("keydown",t=>{this._handleTabKeydown(t,e)}))})}_handleTabKeydown(e,t){const n=t.indexOf(e.currentTarget);"ArrowRight"===e.key?(e.preventDefault(),this._findSiblingButton(t,n,1)?.focus()):"ArrowLeft"===e.key?(e.preventDefault(),this._findSiblingButton(t,n,-1)?.focus()):"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.activateTab(e.currentTarget.dataset.id))}_findSiblingButton(e,t,n){for(let r=1;r<=e.length;r++){const o=e[(t+r*n+e.length)%e.length];if(!o.disabled)return o}return null}_resolveActiveTab(e){const t=!this._activeTab||e.find(e=>e.id===this._activeTab)?.disabled;e.length&&t&&(this._activeTab=e.find(e=>!e.disabled)?.id||"")}_getStyles(){return`\n            :host {\n                display: flex;\n                font-family: var(--component-tabs-font-family, var(--font-family-body));\n            }\n            :host([position="top"]) { flex-direction: column; }\n            :host([position="bottom"]) { flex-direction: column-reverse; }\n            :host([position="left"]) { flex-direction: row; }\n            :host([position="right"]) { flex-direction: row-reverse; }\n\n            .tablist {\n                display: flex;\n                gap: 0;\n                position: relative;\n                z-index: 1;\n            }\n            :host([position="top"])    .tablist { margin-bottom: -1px; margin-top: 0; }\n            :host([position="bottom"]) .tablist { margin-top: -1px; margin-bottom: 0; }\n            :host([position="left"])   .tablist { flex-direction: column; margin-right: -1px; margin-left: 0; }\n            :host([position="right"])  .tablist { flex-direction: column; margin-left: -1px; margin-right: 0; }\n\n            :host([position="top"])    .tablist button { border-bottom: none; }\n            :host([position="bottom"]) .tablist button { border-top: none; }\n            :host([position="left"])   .tablist button { border-right: none; }\n            :host([position="right"])  .tablist button { border-left: none; }\n\n            button {\n                background: var(--component-tabs-border-color);\n                color: var(--component-tabs-color);\n                border: var(--component-tab-border-width) solid var(--component-tabs-border-color);\n                margin: 0;\n                padding: ${`var(--component-tab-padding-${this.size})`};\n                cursor: pointer;\n                font-size: var(--font-size-label);\n                display: inline-flex;\n                align-items: center;\n                gap: ${`var(--component-tab-gap-${this.size})`};\n                transition: background 0.2s ease;\n                outline: none;\n                font-family: inherit;\n            }\n            :host([position="top"])    .tablist button:first-child { border-top-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="top"])    .tablist button:last-child  { border-top-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="bottom"]) .tablist button:first-child { border-bottom-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="bottom"]) .tablist button:last-child  { border-bottom-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="left"])   .tablist button:first-child   { border-top-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="left"])   .tablist button:last-child    { border-bottom-left-radius: var(--component-tab-border-radius-outer); }\n            :host([position="right"])  .tablist button:first-child  { border-top-right-radius: var(--component-tab-border-radius-outer); }\n            :host([position="right"])  .tablist button:last-child   { border-bottom-right-radius: var(--component-tab-border-radius-outer); }\n\n            button[aria-selected="true"] {\n                background: var(--component-tabs-background);\n            }\n            button:focus-visible {\n                outline: 2px solid var(--component-tabs-accent);\n                outline-offset: -1px;\n            }\n            button[disabled] {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n            .icon-slot {\n                display: inline-flex;\n                align-items: center;\n                margin: 0 4px;\n            }\n            .tabpanel {\n                position: relative;\n                z-index: 0;\n                border: var(--component-tab-border-width) solid var(--component-tabs-border-color);\n                border-radius: var(--component-tab-border-radius-outer);\n                padding: var(--component-tab-content-padding);\n                background: var(--component-tabs-background);\n            }\n            :host([position="top"])    .tabpanel { border-top-left-radius: 0; }\n            :host([position="bottom"]) .tabpanel { border-bottom-left-radius: 0; }\n            :host([position="left"])   .tabpanel { border-top-left-radius: 0; }\n            :host([position="right"])  .tabpanel { border-top-right-radius: 0; }\n            :host([position="top"])    .tabpanel { margin-top: -1px; }\n            :host([position="bottom"]) .tabpanel { margin-bottom: -1px; }\n            :host([position="left"])   .tabpanel { margin-left: -1px; }\n            :host([position="right"])  .tabpanel { margin-right: -1px; }\n        `}_createTabButton(e){const t=e.id===this._activeTab,n=!!e.disabled,r=document.createElement("button");if(r.id=`tab-${e.id}`,r.setAttribute("role","tab"),r.setAttribute("part","tab"),r.setAttribute("aria-selected",t),r.setAttribute("aria-controls",`panel-${e.id}`),r.setAttribute("aria-disabled",n),n&&(r.disabled=!0),r.tabIndex=t&&!n?0:-1,r.dataset.id=e.id,this.querySelector(`[slot="left-icon-${e.id}"]`)){const t=document.createElement("slot");t.name=`left-icon-${e.id}`,t.className="icon-slot",r.appendChild(t)}const o=document.createElement("span");if(o.textContent=e.label,r.appendChild(o),this.querySelector(`[slot="right-icon-${e.id}"]`)){const t=document.createElement("slot");t.name=`right-icon-${e.id}`,t.className="icon-slot",r.appendChild(t)}return r}_createPanel(e){const t=document.createElement("div");t.className="tabpanel",t.id=`panel-${this._activeTab}`,t.setAttribute("role","tabpanel"),t.setAttribute("part","content"),t.setAttribute("aria-labelledby",`tab-${this._activeTab}`);const n=document.createElement("slot");return n.name=e,t.appendChild(n),t}render(){const e=this.options;this._resolveActiveTab(e);const t=e.find(e=>e.id===this._activeTab);this.shadowRoot.innerHTML="";const n=document.createElement("style");n.textContent=this._getStyles(),this.shadowRoot.appendChild(n);const r=document.createElement("div");r.className="tablist",r.setAttribute("role","tablist"),r.setAttribute("part","tablist"),e.forEach(e=>r.appendChild(this._createTabButton(e))),this.shadowRoot.appendChild(r),this.shadowRoot.appendChild(this._createPanel(t?.slot||"")),this._setupEvents()}}customElements.get("y-tabs")||customElements.define("y-tabs",M);class R extends HTMLElement{static get observedAttributes(){return["position","duration","max"]}constructor(){super(),this.attachShadow({mode:"open"}),this._queue=[]}connectedCallback(){this.render()}attributeChangedCallback(e,t,n){t!==n&&this.render()}get position(){return this.getAttribute("position")||"bottom-right"}set position(e){this.setAttribute("position",e)}get duration(){return parseInt(this.getAttribute("duration")??"4000",10)}set duration(e){this.setAttribute("duration",String(e))}get max(){return parseInt(this.getAttribute("max")??"5",10)}set max(e){this.setAttribute("max",String(e))}show(e={}){const{message:t="",color:n="base",duration:r=this.duration,dismissible:o=!0,icon:a=null}=e,i=this.shadowRoot.querySelector(".toast-container");if(!i)return null;const s=i.querySelectorAll(".toast");s.length>=this.max&&this._removeToast(s[0]);const c=document.createElement("div");c.className=`toast color-${n}`,c.setAttribute("role","alert"),c.setAttribute("aria-live","assertive"),c.setAttribute("part","toast");const l=this._getColorBg(n),d=v(g(l,this));if(c.style.backgroundColor=l,c.style.color=d,a){const e=document.createElement("y-icon");e.setAttribute("name",a),e.setAttribute("size","small"),e.className="toast-icon",e.setAttribute("part","icon"),c.appendChild(e)}const p=document.createElement("span");if(p.className="toast-message",p.setAttribute("part","message"),p.textContent=t,c.appendChild(p),o){const e=document.createElement("button");e.className="toast-close",e.setAttribute("aria-label","Dismiss"),e.innerHTML="&#215;",e.addEventListener("click",()=>this._removeToast(c)),c.appendChild(e)}return i.appendChild(c),requestAnimationFrame(()=>{c.classList.add("visible")}),r>0&&(c._timeout=setTimeout(()=>this._removeToast(c),r)),this.dispatchEvent(new CustomEvent("y-toast-show",{detail:{message:t,color:n},bubbles:!0})),c}clear(){const e=this.shadowRoot.querySelector(".toast-container");e&&e.querySelectorAll(".toast").forEach(e=>this._removeToast(e))}_removeToast(e){e&&!e._removing&&(e._removing=!0,clearTimeout(e._timeout),e.classList.remove("visible"),e.classList.add("exit"),e.addEventListener("transitionend",()=>{e.remove(),this.dispatchEvent(new CustomEvent("y-toast-dismiss",{bubbles:!0}))},{once:!0}),setTimeout(()=>{e.parentNode&&e.remove()},350))}_getPositionStyles(){const e="position: fixed; z-index: var(--component-toast-z-index, 9000); display: flex; flex-direction: column; gap: var(--spacing-small, 6px); pointer-events: none; max-width: 420px; min-width: 280px;",t="var(--component-toast-offset, var(--spacing-x-large, 16px))",n={"top-right":`${e} top: ${t}; right: ${t}; align-items: flex-end;`,"top-left":`${e} top: ${t}; left: ${t}; align-items: flex-start;`,"top-center":`${e} top: ${t}; left: 50%; transform: translateX(-50%); align-items: center;`,"bottom-right":`${e} bottom: ${t}; right: ${t}; align-items: flex-end;`,"bottom-left":`${e} bottom: ${t}; left: ${t}; align-items: flex-start;`,"bottom-center":`${e} bottom: ${t}; left: 50%; transform: translateX(-50%); align-items: center;`};return n[this.position]||n["bottom-right"]}_getColorBg(e){const t={base:"var(--base-content--, #fff)",primary:"var(--primary-content--, #0070f3)",secondary:"var(--secondary-content--, #6c757d)",success:"var(--success-content--, #28a745)",warning:"var(--warning-content--, #ffc107)",error:"var(--error-content--, #dc3545)",help:"var(--help-content--, #6f42c1)"};return t[e]||t.base}render(){this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    font-family: var(--font-family-body, sans-serif);\n                }\n\n                .toast-container {\n                    ${this._getPositionStyles()}\n                }\n\n                .toast {\n                    pointer-events: auto;\n                    display: flex;\n                    align-items: center;\n                    gap: var(--spacing-medium, 8px);\n                    padding: var(--component-toast-padding, var(--spacing-medium, 8px));\n                    border-radius: var(--component-toast-border-radius, var(--radii-small, 4px));\n                    font-size: var(--font-size-paragraph, 1em);\n                    line-height: 1.4;\n                    opacity: 0;\n                    transform: translateY(8px);\n                    transition: opacity 0.25s ease, transform 0.25s ease;\n                    box-shadow: var(--base-shadow, 0 2px 6px rgba(0,0,0,0.15));\n                }\n\n                .toast.visible {\n                    opacity: 1;\n                    transform: translateY(0);\n                }\n\n                .toast.exit {\n                    opacity: 0;\n                    transform: translateY(-8px);\n                }\n\n                .toast-icon {\n                    flex-shrink: 0;\n                    font-size: 1.1em;\n                }\n\n                .toast-message {\n                    flex: 1;\n                }\n\n                .toast-close {\n                    flex-shrink: 0;\n                    align-self: flex-start;\n                    background: none;\n                    border: none;\n                    color: inherit;\n                    font-size: 1.2em;\n                    cursor: pointer;\n                    padding: 0 0 0 var(--spacing-small, 6px);\n                    opacity: 0.7;\n                    line-height: 1;\n                }\n                .toast-close:hover {\n                    opacity: 1;\n                }\n            </style>\n            <div class="toast-container"></div>\n        `}}customElements.get("y-toast")||customElements.define("y-toast",R);class P extends HTMLElement{static get observedAttributes(){return["text","position","delay","color"]}constructor(){super(),this.attachShadow({mode:"open"}),this._showTimeout=null,this._hideTimeout=null,this._visible=!1,this._onMouseEnter=this._onMouseEnter.bind(this),this._onMouseLeave=this._onMouseLeave.bind(this),this._onFocusIn=this._onFocusIn.bind(this),this._onFocusOut=this._onFocusOut.bind(this),this._onKeyDown=this._onKeyDown.bind(this)}connectedCallback(){this.render(),this.addEventListener("mouseenter",this._onMouseEnter),this.addEventListener("mouseleave",this._onMouseLeave),this.addEventListener("focusin",this._onFocusIn),this.addEventListener("focusout",this._onFocusOut),document.addEventListener("keydown",this._onKeyDown)}disconnectedCallback(){this.removeEventListener("mouseenter",this._onMouseEnter),this.removeEventListener("mouseleave",this._onMouseLeave),this.removeEventListener("focusin",this._onFocusIn),this.removeEventListener("focusout",this._onFocusOut),document.removeEventListener("keydown",this._onKeyDown),clearTimeout(this._showTimeout),clearTimeout(this._hideTimeout)}attributeChangedCallback(e,t,n){t!==n&&this.render()}get text(){return this.getAttribute("text")||""}set text(e){this.setAttribute("text",e)}get position(){return this.getAttribute("position")||"top"}set position(e){this.setAttribute("position",e)}get delay(){return parseInt(this.getAttribute("delay")??"200",10)}set delay(e){this.setAttribute("delay",String(e))}get color(){return this.getAttribute("color")||"base"}set color(e){this.setAttribute("color",e)}show(){clearTimeout(this._hideTimeout),this._showTimeout=setTimeout(()=>{this._visible=!0;const e=this.shadowRoot.querySelector(".tooltip");if(e){const t=g(this._getBg(),this);e.style.color=v(t),e.classList.add("visible")}},this.delay)}hide(){clearTimeout(this._showTimeout),this._visible=!1;const e=this.shadowRoot.querySelector(".tooltip");e&&e.classList.remove("visible")}_onMouseEnter(){this.show()}_onMouseLeave(){this.hide()}_onFocusIn(){this.show()}_onFocusOut(){this.hide()}_onKeyDown(e){"Escape"===e.key&&this._visible&&this.hide()}_getBg(){const e={base:"var(--base-content--, #555)",primary:"var(--primary-content--, #0070f3)",secondary:"var(--secondary-content--, #6c757d)",success:"var(--success-content--, #28a745)",warning:"var(--warning-content--, #ffc107)",error:"var(--error-content--, #dc3545)",help:"var(--help-content--, #6f42c1)"};return e[this.color]||e.base}render(){const e=this.position,t=this._getBg(),n=v(g(t,this));this.shadowRoot.innerHTML=`\n            <style>\n                :host {\n                    display: inline-block;\n                    position: relative;\n                    font-family: var(--font-family-body, sans-serif);\n                }\n\n                .trigger {\n                    display: inline-block;\n                }\n\n                .tooltip {\n                    position: absolute;\n                    z-index: var(--component-tooltip-z-index, 7000);\n                    white-space: nowrap;\n                    pointer-events: none;\n                    opacity: 0;\n                    transform: scale(0.95);\n                    transition: opacity 0.15s ease, transform 0.15s ease;\n                    padding: var(--component-tooltip-padding, var(--spacing-x-small, 4px)) var(--component-tooltip-padding-h, var(--spacing-medium, 8px));\n                    border-radius: var(--component-tooltip-border-radius, var(--radii-small, 4px));\n                    font-size: var(--font-size-small, 0.8em);\n                    background: ${t};\n                    color: ${n};\n                    line-height: 1.4;\n                }\n\n                .tooltip.visible {\n                    opacity: 1;\n                    transform: scale(1);\n                }\n\n                .tooltip::after {\n                    content: "";\n                    position: absolute;\n                    border: 5px solid transparent;\n                }\n\n                .tooltip.top {\n                    bottom: 100%;\n                    left: 50%;\n                    transform: translateX(-50%) scale(0.95);\n                    margin-bottom: 6px;\n                }\n                .tooltip.top.visible {\n                    transform: translateX(-50%) scale(1);\n                }\n                .tooltip.top::after {\n                    top: 100%;\n                    left: 50%;\n                    transform: translateX(-50%);\n                    border-top-color: ${t};\n                }\n\n                .tooltip.bottom {\n                    top: 100%;\n                    left: 50%;\n                    transform: translateX(-50%) scale(0.95);\n                    margin-top: 6px;\n                }\n                .tooltip.bottom.visible {\n                    transform: translateX(-50%) scale(1);\n                }\n                .tooltip.bottom::after {\n                    bottom: 100%;\n                    left: 50%;\n                    transform: translateX(-50%);\n                    border-bottom-color: ${t};\n                }\n\n                .tooltip.left {\n                    right: 100%;\n                    top: 50%;\n                    transform: translateY(-50%) scale(0.95);\n                    margin-right: 6px;\n                }\n                .tooltip.left.visible {\n                    transform: translateY(-50%) scale(1);\n                }\n                .tooltip.left::after {\n                    left: 100%;\n                    top: 50%;\n                    transform: translateY(-50%);\n                    border-left-color: ${t};\n                }\n\n                .tooltip.right {\n                    left: 100%;\n                    top: 50%;\n                    transform: translateY(-50%) scale(0.95);\n                    margin-left: 6px;\n                }\n                .tooltip.right.visible {\n                    transform: translateY(-50%) scale(1);\n                }\n                .tooltip.right::after {\n                    right: 100%;\n                    top: 50%;\n                    transform: translateY(-50%);\n                    border-right-color: ${t};\n                }\n            </style>\n            <slot class="trigger"></slot>\n            <div class="tooltip ${e}" role="tooltip" part="tooltip">${this.text}</div>\n        `}}customElements.get("y-tooltip")||customElements.define("y-tooltip",P);const H={"blue-light":'/* Themes - Blue Light */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-light-1);\n    --primary-background-component: var(--blue-light-0);\n    --primary-background-hover: var(--blue-light-2);\n    --primary-background-active: var(--blue-light-3);\n    --primary-background-border: var(--blue-light-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-dark-7);\n    --primary-content-active: var(--blue-dark-6);\n    --secondary-background-app: var(--teal-light-1);\n    --secondary-background-component: var(--teal-light-0);\n    --secondary-background-hover: var(--teal-light-2);\n    --secondary-background-border: var(--teal-light-3);\n    --secondary-background-active: var(--teal-light-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-dark-7);\n    --secondary-content-active: var(--teal-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"blue-dark":'/* Themes - Blue Dark */\n:root {\n    --base-background-app: var(--neutral-dark-1);\n    --base-background-component: var(--neutral-dark-0);\n    --base-background-hover: var(--neutral-dark-2);\n    --base-background-border: var(--neutral-dark-3);\n    --base-background-active: var(--neutral-dark-4);\n    --base-content--: var(--neutral-light-0);\n    --base-content-inverse: var(--neutral-black);\n    --base-content-light: var(--neutral-light-1);\n    --base-content-lighter: var(--neutral-light-3);\n    --base-content-lightest: var(--neutral-light-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--blue-dark-1);\n    --primary-background-component: var(--blue-dark-0);\n    --primary-background-hover: var(--blue-dark-2);\n    --primary-background-active: var(--blue-dark-3);\n    --primary-background-border: var(--blue-dark-4);\n    --primary-content--: var(--blue--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--blue-light-7);\n    --primary-content-active: var(--blue-light-6);\n    --secondary-background-app: var(--teal-dark-1);\n    --secondary-background-component: var(--teal-dark-0);\n    --secondary-background-hover: var(--teal-dark-2);\n    --secondary-background-border: var(--teal-dark-3);\n    --secondary-background-active: var(--teal-dark-4);\n    --secondary-content--: var(--teal--);\n    --secondary-content-inverse: var(--neutral-black);\n    --secondary-content-hover: var(--teal-light-7);\n    --secondary-content-active: var(--teal-light-6);\n    --success-background-app: var(--green-dark-1);\n    --success-background-component: var(--green-dark-0);\n    --success-background-hover: var(--green-dark-2);\n    --success-background-border: var(--green-dark-3);\n    --success-background-active: var(--green-dark-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-light-7);\n    --success-content-active: var(--green-light-6);\n    --warning-background-app: var(--yellow-dark-1);\n    --warning-background-component: var(--yellow-dark-0);\n    --warning-background-hover: var(--yellow-dark-2);\n    --warning-background-border: var(--yellow-dark-3);\n    --warning-background-active: var(--yellow-dark-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-light-7);\n    --warning-content-active: var(--yellow-light-6);\n    --error-background-app: var(--red-dark-1);\n    --error-background-component: var(--red-dark-0);\n    --error-background-hover: var(--red-dark-2);\n    --error-background-border: var(--red-dark-3);\n    --error-background-active: var(--red-dark-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-light-7);\n    --error-content-active: var(--red-light-6);\n    --help-background-app: var(--indigo-dark-1);\n    --help-background-component: var(--indigo-dark-0);\n    --help-background-hover: var(--indigo-dark-2);\n    --help-background-active: var(--indigo-dark-3);\n    --help-background-border: var(--indigo-dark-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-light-7);\n    --help-content-active: var(--indigo-light-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"orange-light":'/* Themes - Orange Light */\n:root {\n    --base-background-app: var(--neutral-light-1);\n    --base-background-component: var(--neutral-light-0);\n    --base-background-hover: var(--neutral-light-2);\n    --base-background-border: var(--neutral-light-3);\n    --base-background-active: var(--neutral-light-4);\n    --base-content--: var(--neutral-dark-0);\n    --base-content-inverse: var(--neutral-white);\n    --base-content-light: var(--neutral-dark-1);\n    --base-content-lighter: var(--neutral-dark-3);\n    --base-content-lightest: var(--neutral-dark-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--orange-light-1);\n    --primary-background-component: var(--orange-light-0);\n    --primary-background-hover: var(--orange-light-2);\n    --primary-background-active: var(--orange-light-3);\n    --primary-background-border: var(--orange-light-4);\n    --primary-content--: var(--orange--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--orange-dark-7);\n    --primary-content-active: var(--orange-dark-6);\n    --secondary-background-app: var(--amber-light-1);\n    --secondary-background-component: var(--amber-light-0);\n    --secondary-background-hover: var(--amber-light-2);\n    --secondary-background-border: var(--amber-light-3);\n    --secondary-background-active: var(--amber-light-4);\n    --secondary-content--: var(--amber--);\n    --secondary-content-inverse: var(--neutral-white);\n    --secondary-content-hover: var(--amber-dark-7);\n    --secondary-content-active: var(--amber-dark-6);\n    --success-background-app: var(--green-light-1);\n    --success-background-component: var(--green-light-0);\n    --success-background-hover: var(--green-light-2);\n    --success-background-border: var(--green-light-3);\n    --success-background-active: var(--green-light-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-dark-7);\n    --success-content-active: var(--green-dark-6);\n    --warning-background-app: var(--yellow-light-1);\n    --warning-background-component: var(--yellow-light-0);\n    --warning-background-hover: var(--yellow-light-2);\n    --warning-background-border: var(--yellow-light-3);\n    --warning-background-active: var(--yellow-light-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-dark-7);\n    --warning-content-active: var(--yellow-dark-6);\n    --error-background-app: var(--red-light-1);\n    --error-background-component: var(--red-light-0);\n    --error-background-hover: var(--red-light-2);\n    --error-background-border: var(--red-light-3);\n    --error-background-active: var(--red-light-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-dark-7);\n    --error-content-active: var(--red-dark-6);\n    --help-background-app: var(--indigo-light-1);\n    --help-background-component: var(--indigo-light-0);\n    --help-background-hover: var(--indigo-light-2);\n    --help-background-active: var(--indigo-light-3);\n    --help-background-border: var(--indigo-light-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-dark-7);\n    --help-content-active: var(--indigo-dark-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n',"orange-dark":'/* Themes - Orange Dark */\n:root {\n    --base-background-app: var(--neutral-dark-1);\n    --base-background-component: var(--neutral-dark-0);\n    --base-background-hover: var(--neutral-dark-2);\n    --base-background-border: var(--neutral-dark-3);\n    --base-background-active: var(--neutral-dark-4);\n    --base-content--: var(--neutral-light-0);\n    --base-content-inverse: var(--neutral-black);\n    --base-content-light: var(--neutral-light-1);\n    --base-content-lighter: var(--neutral-light-3);\n    --base-content-lightest: var(--neutral-light-5);\n    --base-shadow: 0 2px 6px var(--neutral-black-translucent);\n    --primary-background-app: var(--orange-dark-1);\n    --primary-background-component: var(--orange-dark-0);\n    --primary-background-hover: var(--orange-dark-2);\n    --primary-background-active: var(--orange-dark-3);\n    --primary-background-border: var(--orange-dark-4);\n    --primary-content--: var(--orange--);\n    --primary-content-inverse: var(--neutral-white);\n    --primary-content-hover: var(--orange-light-7);\n    --primary-content-active: var(--orange-light-6);\n    --secondary-background-app: var(--amber-dark-1);\n    --secondary-background-component: var(--amber-dark-0);\n    --secondary-background-hover: var(--amber-dark-2);\n    --secondary-background-border: var(--amber-dark-3);\n    --secondary-background-active: var(--amber-dark-4);\n    --secondary-content--: var(--amber--);\n    --secondary-content-inverse: var(--neutral-white);\n    --secondary-content-hover: var(--amber-light-7);\n    --secondary-content-active: var(--amber-light-6);\n    --success-background-app: var(--green-dark-1);\n    --success-background-component: var(--green-dark-0);\n    --success-background-hover: var(--green-dark-2);\n    --success-background-border: var(--green-dark-3);\n    --success-background-active: var(--green-dark-4);\n    --success-content--: var(--green--);\n    --success-content-inverse: var(--neutral-black);\n    --success-content-hover: var(--green-light-7);\n    --success-content-active: var(--green-light-6);\n    --warning-background-app: var(--yellow-dark-1);\n    --warning-background-component: var(--yellow-dark-0);\n    --warning-background-hover: var(--yellow-dark-2);\n    --warning-background-border: var(--yellow-dark-3);\n    --warning-background-active: var(--yellow-dark-4);\n    --warning-content--: var(--yellow--);\n    --warning-content-inverse: var(--neutral-black);\n    --warning-content-hover: var(--yellow-light-7);\n    --warning-content-active: var(--yellow-light-6);\n    --error-background-app: var(--red-dark-1);\n    --error-background-component: var(--red-dark-0);\n    --error-background-hover: var(--red-dark-2);\n    --error-background-border: var(--red-dark-3);\n    --error-background-active: var(--red-dark-4);\n    --error-content--: var(--red--);\n    --error-content-inverse: var(--neutral-white);\n    --error-content-hover: var(--red-light-7);\n    --error-content-active: var(--red-light-6);\n    --help-background-app: var(--indigo-dark-1);\n    --help-background-component: var(--indigo-dark-0);\n    --help-background-hover: var(--indigo-dark-2);\n    --help-background-active: var(--indigo-dark-3);\n    --help-background-border: var(--indigo-dark-4);\n    --help-content--: var(--indigo--);\n    --help-content-inverse: var(--neutral-white);\n    --help-content-hover: var(--indigo-light-7);\n    --help-content-active: var(--indigo-light-6);\n    --component-appbar-background: var(--base-background-component);\n    --component-appbar-color: var(--base-content--);\n    --component-appbar-border-color: var(--base-background-border);\n    --component-appbar-border-width: var(--component-sidebar-border-width);\n    --component-appbar-border-radius: var(--component-sidebar-border-radius);\n    --component-appbar-inner-border-width: var(\n        --component-sidebar-border-width\n    );\n    --component-checkbox-background: var(--base-background-component);\n    --component-checkbox-color: var(--base-content--);\n    --component-checkbox-border-color: var(--base-content--);\n    --component-checkbox-accent: var(--primary-content--);\n    --component-dialog-background: var(--base-background-component);\n    --component-dialog-color: var(--base-content--);\n    --component-dialog-border-color: var(--base-background-border);\n    --component-dialog-hover-background: var(--base-background-hover);\n    --component-dialog-accent: var(--primary-content--);\n    --component-dialog-shadow: var(--base-shadow);\n    --component-drawer-background: var(--base-background-component);\n    --component-drawer-color: var(--base-content--);\n    --component-drawer-border-color: var(--base-background-border);\n    --component-drawer-hover-background: var(--base-background-hover);\n    --component-input-background: var(--base-background-app);\n    --component-input-background-disabled: var(--base-background-component);\n    --component-input-color: var(--base-content--);\n    --component-input-border-color: var(--base-background-border);\n    --component-input-accent: var(--primary-content--);\n    --component-input-label-color: var(--base-content-light);\n    --component-input-icon-color: var(--base-content-lighter);\n    --component-input-error-color: var(--error-content--);\n    --component-input-error-background: var(--error-background-component);\n    --component-input-error-border-color: var(--error-background-border);\n    --component-menu-background: var(--base-background-component);\n    --component-menu-color: var(--base-content--);\n    --component-menu-border-color: var(--base-background-border);\n    --component-menu-hover-background: var(--base-background-hover);\n    --component-menu-shadow: var(--base-shadow);\n    --component-panel-background: var(--base-background-component);\n    --component-panel-color: var(--base-content--);\n    --component-panel-expanded-background: var(--base-background-app);\n    --component-panel-accent: var(--primary-content--);\n    --component-panel-active-border: var(--base-background-active);\n    --component-panel-accent-hover-background: var(--primary-background-active);\n    --component-panel-hover-background: var(--base-background-hover);\n    --component-radio-color: var(--base-content--);\n    --component-radio-accent: var(--primary-content--);\n    --component-select-background: var(--base-background-app);\n    --component-select-color: var(--base-content--);\n    --component-select-border-color: var(--base-background-border);\n    --component-select-accent: var(--primary-content--);\n    --component-select-accent-contrast: var(--base-background-component);\n    --component-select-label-color: var(--base-content-light);\n    --component-select-hover-background: var(--base-background-hover);\n    --component-select-shadow: var(--base-shadow);\n    --component-select-error-color: var(--error-content--);\n    --component-select-error-background: var(--error-background-component);\n    --component-select-error-border-color: var(--error-background-border);\n    --component-table-color: var(--base-content--);\n    --component-table-border-color: var(--base-background-border);\n    --component-table-hover-background: var(--base-background-hover);\n    --component-table-active-background: var(--base-background-active);\n    --component-table-color-light: var(--base-content-lightest);\n    --component-tabs-background: var(--base-background-component);\n    --component-tabs-color: var(--base-content--);\n    --component-tabs-border-color: var(--base-background-border);\n    --component-tabs-accent: var(--primary-content--);\n    --component-tabs-font-family: var(--font-family-body);\n    --component-slider-width: 129px;\n    --font-family-header: "Lexend", sans-serif;\n    --font-family-body: "Lexend", sans-serif;\n}\n'};class D extends HTMLElement{static get observedAttributes(){return["theme","mode","theme-path"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML="<slot></slot>"}connectedCallback(){this._applyTheme()}attributeChangedCallback(e,t,n){t!==n&&this._applyTheme()}async _applyTheme(){const e=this.getAttribute("theme-path");let t;if(e)try{const n=new URL(e,document.baseURI),r=await fetch(n.href);t=await r.text()}catch(n){console.error(`Failed to load theme from ${e}:`,n),t=""}else{const e=this.getAttribute("theme")||"blue",n=this.getAttribute("mode")||"light";t=H[`${e}-${n}`]||""}this.shadowRoot.innerHTML=`\n            <style>${o}</style>\n            ${t?`<style>${t}</style>`:""}\n            <slot></slot>\n        `,this.applyVariablesToHost(o+t)}applyVariablesToHost(e){const t=/--([\w-]+):\s*([^;]+);/g;let n;for(this._themeProps=[];null!==(n=t.exec(e));){const e=`--${n[1]}`;this.style.setProperty(e,n[2].trim()),this._themeProps.push(e)}}clearThemeProperties(){if(this._themeProps)for(const e of this._themeProps)this.style.removeProperty(e);this._themeProps=[]}}if(customElements.get("y-theme")||customElements.define("y-theme",D),"undefined"!=typeof document&&!document.querySelector("[data-yumekit-vars]")){const e=document.createElement("style");e.setAttribute("data-yumekit-vars",""),e.textContent=o,document.head.appendChild(e)}return e.YumeAppbar=b,e.YumeAvatar=u,e.YumeBadge=m,e.YumeButton=a,e.YumeCard=f,e.YumeCheckbox=k,e.YumeIcon=d,e.YumeInput=x,e.YumePanel=A,e.YumePanelBar=z,e.YumeProgress=E,e.YumeRadio=C,e.YumeSelect=_,e.YumeSlider=S,e.YumeTable=$,e.YumeTabs=M,e.YumeTag=T,e.YumeTheme=D,e.YumeToast=R,e.YumeTooltip=P,e.getIcon=r,e.registerIcon=function(e,n){t.set(e,n)},e.registerIcons=n,e}({});