@kumori/aurora-wui-components 0.0.300 → 0.0.303-dev4490.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/dist/components/axebow-border-container/axebow-border-container.d.ts +11 -0
  2. package/dist/components/axebow-border-container/axebow-border-container.d.ts.map +1 -0
  3. package/dist/components/axebow-boxed-input/axebow-boxed-input.d.ts +31 -0
  4. package/dist/components/axebow-boxed-input/axebow-boxed-input.d.ts.map +1 -0
  5. package/dist/components/axebow-call-to-action-feature/axebow-call-to-action-feature.d.ts +9 -1
  6. package/dist/components/axebow-call-to-action-feature/axebow-call-to-action-feature.d.ts.map +1 -1
  7. package/dist/components/axebow-call-to-action-row/axebow-call-to-action-row.d.ts +1 -0
  8. package/dist/components/axebow-call-to-action-row/axebow-call-to-action-row.d.ts.map +1 -1
  9. package/dist/components/axebow-call-to-action-row/call-to-action-notification.d.ts +44 -0
  10. package/dist/components/axebow-call-to-action-row/call-to-action-notification.d.ts.map +1 -0
  11. package/dist/components/axebow-carousel/axebow-carousel.d.ts +25 -0
  12. package/dist/components/axebow-carousel/axebow-carousel.d.ts.map +1 -0
  13. package/dist/components/axebow-copy-icon/axebow-copy-icon.d.ts +20 -0
  14. package/dist/components/axebow-copy-icon/axebow-copy-icon.d.ts.map +1 -0
  15. package/dist/components/axebow-cta-dialog/axebow-cta-dialog.d.ts +2 -1
  16. package/dist/components/axebow-cta-dialog/axebow-cta-dialog.d.ts.map +1 -1
  17. package/dist/components/axebow-delete-data-popup/axebow-delete-data-popup.d.ts +35 -0
  18. package/dist/components/axebow-delete-data-popup/axebow-delete-data-popup.d.ts.map +1 -0
  19. package/dist/components/axebow-expandable-header/axebow-expandable-header.d.ts +1 -0
  20. package/dist/components/axebow-expandable-header/axebow-expandable-header.d.ts.map +1 -1
  21. package/dist/components/axebow-header/axebow-header.d.ts +0 -3
  22. package/dist/components/axebow-header/axebow-header.d.ts.map +1 -1
  23. package/dist/components/axebow-header/parts/axebow-header-actions.d.ts +0 -4
  24. package/dist/components/axebow-header/parts/axebow-header-actions.d.ts.map +1 -1
  25. package/dist/components/axebow-hyperlink-switch/axebow-hyperlink-switch.d.ts +1 -0
  26. package/dist/components/axebow-hyperlink-switch/axebow-hyperlink-switch.d.ts.map +1 -1
  27. package/dist/components/axebow-learning-center/axebow-learning-center.d.ts +17 -0
  28. package/dist/components/axebow-learning-center/axebow-learning-center.d.ts.map +1 -0
  29. package/dist/components/axebow-mobile-warning-banner/axebow-mobile-warning-banner.d.ts +11 -0
  30. package/dist/components/axebow-mobile-warning-banner/axebow-mobile-warning-banner.d.ts.map +1 -0
  31. package/dist/components/axebow-modal/axebow-modal.d.ts +3 -0
  32. package/dist/components/axebow-modal/axebow-modal.d.ts.map +1 -1
  33. package/dist/components/axebow-page-actions/axebow-page-actions.d.ts +20 -0
  34. package/dist/components/axebow-page-actions/axebow-page-actions.d.ts.map +1 -0
  35. package/dist/components/axebow-paginated-table/axebow-paginated-table.d.ts +22 -0
  36. package/dist/components/axebow-paginated-table/axebow-paginated-table.d.ts.map +1 -0
  37. package/dist/components/axebow-pem-dialog/axebow-pem-dialog.d.ts +29 -0
  38. package/dist/components/axebow-pem-dialog/axebow-pem-dialog.d.ts.map +1 -0
  39. package/dist/components/axebow-plan-providers-modal/axebow-plan-providers-modal.d.ts +16 -0
  40. package/dist/components/axebow-plan-providers-modal/axebow-plan-providers-modal.d.ts.map +1 -0
  41. package/dist/components/axebow-premium-plan-popup/axebow-premium-plan-popup.d.ts +30 -0
  42. package/dist/components/axebow-premium-plan-popup/axebow-premium-plan-popup.d.ts.map +1 -0
  43. package/dist/components/axebow-services-panel/axebow-services-panel.d.ts.map +1 -1
  44. package/dist/components/axebow-summary/axebow-summary-card.d.ts +8 -2
  45. package/dist/components/axebow-summary/axebow-summary-card.d.ts.map +1 -1
  46. package/dist/components/axebow-tenant-card/axebow-tenant-card.d.ts +5 -0
  47. package/dist/components/axebow-tenant-card/axebow-tenant-card.d.ts.map +1 -1
  48. package/dist/components/axebow-tenant-resource-table/axebow-tenant-resource-table.d.ts +4 -0
  49. package/dist/components/axebow-tenant-resource-table/axebow-tenant-resource-table.d.ts.map +1 -1
  50. package/dist/components/axebow-ul/axebow-ul.d.ts +8 -0
  51. package/dist/components/axebow-ul/axebow-ul.d.ts.map +1 -0
  52. package/dist/components/axebow-white-container/axebow-white-container.d.ts +9 -0
  53. package/dist/components/axebow-white-container/axebow-white-container.d.ts.map +1 -0
  54. package/dist/components/cards/axebow-base-card.d.ts +6 -0
  55. package/dist/components/cards/axebow-base-card.d.ts.map +1 -1
  56. package/dist/components/cards/card.models.d.ts +3 -0
  57. package/dist/components/cards/card.models.d.ts.map +1 -1
  58. package/dist/components/cards/parts/axebow-card-footer.d.ts +3 -0
  59. package/dist/components/cards/parts/axebow-card-footer.d.ts.map +1 -1
  60. package/dist/components/cards/parts/axebow-card-stat-item.d.ts +5 -0
  61. package/dist/components/cards/parts/axebow-card-stat-item.d.ts.map +1 -1
  62. package/dist/components/cards/parts/axebow-card-stats-row.d.ts +1 -1
  63. package/dist/components/cards/parts/axebow-card-stats-row.d.ts.map +1 -1
  64. package/dist/components/cards/parts/axebow-card-status.d.ts +5 -0
  65. package/dist/components/cards/parts/axebow-card-status.d.ts.map +1 -1
  66. package/dist/components/cards/parts/axebow-role-tooltip.d.ts +1 -0
  67. package/dist/components/cards/parts/axebow-role-tooltip.d.ts.map +1 -1
  68. package/dist/components/usage-chart/usage-chart.d.ts +15 -0
  69. package/dist/components/usage-chart/usage-chart.d.ts.map +1 -0
  70. package/dist/components/wizard-page-layout/wizard-page-layout.d.ts +22 -0
  71. package/dist/components/wizard-page-layout/wizard-page-layout.d.ts.map +1 -0
  72. package/dist/index.d.ts +17 -0
  73. package/dist/index.d.ts.map +1 -1
  74. package/dist/index.js +2730 -274
  75. package/dist/index.js.map +1 -1
  76. package/dist/playground/schemas/axebow-call-to-action-feature.schema.d.ts.map +1 -1
  77. package/dist/playground/schemas/axebow-expandable-header.schema.d.ts.map +1 -1
  78. package/dist/playground/schemas/axebow-hyperlink-switch.schema.d.ts.map +1 -1
  79. package/dist/playground/schemas/axebow-role-tooltip.schema.d.ts.map +1 -1
  80. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -218,7 +218,7 @@ var STATUS_COLORS = {
218
218
  };
219
219
  //#endregion
220
220
  //#region src/styles/tailwind.css?inline
221
- var tailwind_default = "/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n@layer properties {\n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *, :before, :after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: \"Open Sans\", sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-50: oklch(97.1% .013 17.38);\n --color-red-100: oklch(93.6% .032 17.717);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-800: oklch(44.4% .177 26.899);\n --color-yellow-600: oklch(68.1% .162 75.834);\n --color-yellow-800: oklch(47.6% .114 61.907);\n --color-green-50: oklch(98.2% .018 155.826);\n --color-green-200: oklch(92.5% .084 155.995);\n --color-green-600: oklch(62.7% .194 149.214);\n --color-green-800: oklch(44.8% .119 151.328);\n --color-sky-50: oklch(97.7% .013 236.62);\n --color-sky-100: oklch(95.1% .026 236.824);\n --color-blue-50: oklch(97% .014 254.604);\n --color-blue-100: oklch(93.2% .032 255.585);\n --color-blue-200: oklch(88.2% .059 254.128);\n --color-blue-500: oklch(62.3% .214 259.815);\n --color-blue-600: oklch(54.6% .245 262.881);\n --color-blue-800: oklch(42.4% .199 265.638);\n --color-gray-50: oklch(98.5% .002 247.839);\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-gray-200: oklch(92.8% .006 264.531);\n --color-gray-300: oklch(87.2% .01 258.338);\n --color-gray-400: oklch(70.7% .022 261.325);\n --color-gray-500: oklch(55.1% .027 264.364);\n --color-gray-600: oklch(44.6% .03 256.802);\n --color-gray-700: oklch(37.3% .034 259.733);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-3xl: 1.875rem;\n --text-5xl: 3rem;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-black: 900;\n --tracking-wider: .05em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-relaxed: 1.625;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --ease-out: cubic-bezier(0, 0, .2, 1);\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --animate-spin: spin 1s linear infinite;\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --spacing-18: 4.5rem;\n --spacing-30: 7.5rem;\n --spacing-38: 9.5rem;\n --spacing-43: 10.75rem;\n --spacing-50: 12.5rem;\n --spacing-75: 18.75rem;\n --spacing-100: 25rem;\n --spacing-120: 30rem;\n --spacing-150: 37.5rem;\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-auto {\n pointer-events: auto;\n }\n\n .pointer-events-none {\n pointer-events: none;\n }\n\n .visible {\n visibility: visible;\n }\n\n .absolute {\n position: absolute;\n }\n\n .fixed {\n position: fixed;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .sticky {\n position: sticky;\n }\n\n .-top-2\\.25 {\n top: calc(var(--spacing) * -2.25);\n }\n\n .top-0 {\n top: 0;\n }\n\n .top-1 {\n top: var(--spacing);\n }\n\n .top-1\\/2 {\n top: 50%;\n }\n\n .top-3 {\n top: calc(var(--spacing) * 3);\n }\n\n .top-25 {\n top: calc(var(--spacing) * 25);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-\\[0\\.9375rem\\] {\n top: .9375rem;\n }\n\n .top-\\[min\\(6\\.25rem\\,calc\\(100vh_-_var\\(--card-fixed-height\\)_-_1rem\\)\\)\\] {\n top: min(6.25rem, calc(100vh - var(--card-fixed-height) - 1rem));\n }\n\n .top-full {\n top: 100%;\n }\n\n .-right-2\\.25 {\n right: calc(var(--spacing) * -2.25);\n }\n\n .right-0 {\n right: 0;\n }\n\n .right-0\\.5 {\n right: calc(var(--spacing) * .5);\n }\n\n .right-1 {\n right: var(--spacing);\n }\n\n .right-1\\.5 {\n right: calc(var(--spacing) * 1.5);\n }\n\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n\n .bottom-0 {\n bottom: 0;\n }\n\n .bottom-0\\.5 {\n bottom: calc(var(--spacing) * .5);\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .left-1\\/2 {\n left: 50%;\n }\n\n .left-\\[-7px\\] {\n left: -7px;\n }\n\n .left-\\[3\\.625rem\\] {\n left: 3.625rem;\n }\n\n .left-\\[calc\\(100\\%\\+10px\\)\\] {\n left: calc(100% + 10px);\n }\n\n .z-5 {\n z-index: 5;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-2000 {\n z-index: 2000;\n }\n\n .z-2001 {\n z-index: 2001;\n }\n\n .z-9999 {\n z-index: 9999;\n }\n\n .row-1 {\n grid-row: 1;\n }\n\n .row-2 {\n grid-row: 2;\n }\n\n .container {\n width: 100%;\n }\n\n @media (min-width: 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n\n @media (min-width: 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n\n @media (min-width: 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n\n @media (min-width: 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n\n @media (min-width: 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mx-2 {\n margin-inline: calc(var(--spacing) * 2);\n }\n\n .mx-6 {\n margin-inline: calc(var(--spacing) * 6);\n }\n\n .mx-12 {\n margin-inline: calc(var(--spacing) * 12);\n }\n\n .mx-auto {\n margin-inline: auto;\n }\n\n .my-0\\.5 {\n margin-block: calc(var(--spacing) * .5);\n }\n\n .my-1\\.5 {\n margin-block: calc(var(--spacing) * 1.5);\n }\n\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n\n .my-4 {\n margin-block: calc(var(--spacing) * 4);\n }\n\n .ms-auto {\n margin-inline-start: auto;\n }\n\n .mt-0 {\n margin-top: 0;\n }\n\n .mt-1 {\n margin-top: var(--spacing);\n }\n\n .mt-1\\.5 {\n margin-top: calc(var(--spacing) * 1.5);\n }\n\n .mt-1\\.75 {\n margin-top: calc(var(--spacing) * 1.75);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mt-2\\.25 {\n margin-top: calc(var(--spacing) * 2.25);\n }\n\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n\n .mt-4\\.5 {\n margin-top: calc(var(--spacing) * 4.5);\n }\n\n .mt-5 {\n margin-top: calc(var(--spacing) * 5);\n }\n\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n\n .mt-6\\.75 {\n margin-top: calc(var(--spacing) * 6.75);\n }\n\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n\n .mt-auto {\n margin-top: auto;\n }\n\n .mr-0\\.5 {\n margin-right: calc(var(--spacing) * .5);\n }\n\n .mr-1 {\n margin-right: var(--spacing);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mr-4 {\n margin-right: calc(var(--spacing) * 4);\n }\n\n .mr-8 {\n margin-right: calc(var(--spacing) * 8);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n }\n\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n\n .mb-6\\.5 {\n margin-bottom: calc(var(--spacing) * 6.5);\n }\n\n .mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n }\n\n .ml-0\\.5 {\n margin-left: calc(var(--spacing) * .5);\n }\n\n .ml-1 {\n margin-left: var(--spacing);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n\n .ml-12 {\n margin-left: calc(var(--spacing) * 12);\n }\n\n .ml-\\[0\\.5rem\\] {\n margin-left: .5rem;\n }\n\n .ml-\\[1\\.265625rem\\] {\n margin-left: 1.26563rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .box-content {\n box-sizing: content-box;\n }\n\n .line-clamp-1 {\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-2 {\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-11 {\n -webkit-line-clamp: 11;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .block {\n display: block;\n }\n\n .contents {\n display: contents;\n }\n\n .flex {\n display: flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .inline {\n display: inline;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .table {\n display: table;\n }\n\n .aspect-square {\n aspect-ratio: 1;\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-2\\.25 {\n height: calc(var(--spacing) * 2.25);\n }\n\n .h-2\\.75 {\n height: calc(var(--spacing) * 2.75);\n }\n\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-4\\.5 {\n height: calc(var(--spacing) * 4.5);\n }\n\n .h-4\\.25 {\n height: calc(var(--spacing) * 4.25);\n }\n\n .h-4\\.75 {\n height: calc(var(--spacing) * 4.75);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-5\\.5 {\n height: calc(var(--spacing) * 5.5);\n }\n\n .h-5\\.25 {\n height: calc(var(--spacing) * 5.25);\n }\n\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n\n .h-6\\.75 {\n height: calc(var(--spacing) * 6.75);\n }\n\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n\n .h-7\\.5 {\n height: calc(var(--spacing) * 7.5);\n }\n\n .h-7\\.25 {\n height: calc(var(--spacing) * 7.25);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-8\\.75 {\n height: calc(var(--spacing) * 8.75);\n }\n\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n\n .h-9\\.5 {\n height: calc(var(--spacing) * 9.5);\n }\n\n .h-9\\.75 {\n height: calc(var(--spacing) * 9.75);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-10\\.5 {\n height: calc(var(--spacing) * 10.5);\n }\n\n .h-10\\.25 {\n height: calc(var(--spacing) * 10.25);\n }\n\n .h-11 {\n height: calc(var(--spacing) * 11);\n }\n\n .h-11\\.5 {\n height: calc(var(--spacing) * 11.5);\n }\n\n .h-11\\.25 {\n height: calc(var(--spacing) * 11.25);\n }\n\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n\n .h-12\\.5 {\n height: calc(var(--spacing) * 12.5);\n }\n\n .h-12\\.25 {\n height: calc(var(--spacing) * 12.25);\n }\n\n .h-12\\.75 {\n height: calc(var(--spacing) * 12.75);\n }\n\n .h-14 {\n height: calc(var(--spacing) * 14);\n }\n\n .h-14\\.25 {\n height: calc(var(--spacing) * 14.25);\n }\n\n .h-15\\.5 {\n height: calc(var(--spacing) * 15.5);\n }\n\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n\n .h-17\\.75 {\n height: calc(var(--spacing) * 17.75);\n }\n\n .h-19\\.75 {\n height: calc(var(--spacing) * 19.75);\n }\n\n .h-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-20\\.75 {\n height: calc(var(--spacing) * 20.75);\n }\n\n .h-22\\.75 {\n height: calc(var(--spacing) * 22.75);\n }\n\n .h-32\\.25 {\n height: calc(var(--spacing) * 32.25);\n }\n\n .h-40\\.75 {\n height: calc(var(--spacing) * 40.75);\n }\n\n .h-45\\.5 {\n height: calc(var(--spacing) * 45.5);\n }\n\n .h-49\\.5 {\n height: calc(var(--spacing) * 49.5);\n }\n\n .h-52\\.75 {\n height: calc(var(--spacing) * 52.75);\n }\n\n .h-57\\.5 {\n height: calc(var(--spacing) * 57.5);\n }\n\n .h-77\\.25 {\n height: calc(var(--spacing) * 77.25);\n }\n\n .h-79 {\n height: calc(var(--spacing) * 79);\n }\n\n .h-83\\.25 {\n height: calc(var(--spacing) * 83.25);\n }\n\n .h-89\\.25 {\n height: calc(var(--spacing) * 89.25);\n }\n\n .h-102\\.25 {\n height: calc(var(--spacing) * 102.25);\n }\n\n .h-106\\.5 {\n height: calc(var(--spacing) * 106.5);\n }\n\n .h-112 {\n height: calc(var(--spacing) * 112);\n }\n\n .h-113\\.25 {\n height: calc(var(--spacing) * 113.25);\n }\n\n .h-\\[2\\.125rem\\] {\n height: 2.125rem;\n }\n\n .h-\\[6\\.8125rem\\] {\n height: 6.8125rem;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-fit {\n height: fit-content;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-px {\n height: 1px;\n }\n\n .h-screen {\n height: 100vh;\n }\n\n .max-h-\\(--card-fixed-height\\) {\n max-height: var(--card-fixed-height);\n }\n\n .max-h-40 {\n max-height: calc(var(--spacing) * 40);\n }\n\n .max-h-48 {\n max-height: calc(var(--spacing) * 48);\n }\n\n .max-h-75 {\n max-height: var(--spacing-75);\n }\n\n .max-h-111 {\n max-height: calc(var(--spacing) * 111);\n }\n\n .max-h-\\[40vh\\] {\n max-height: 40vh;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-0 {\n min-height: 0;\n }\n\n .min-h-5 {\n min-height: calc(var(--spacing) * 5);\n }\n\n .min-h-9 {\n min-height: calc(var(--spacing) * 9);\n }\n\n .min-h-12 {\n min-height: calc(var(--spacing) * 12);\n }\n\n .min-h-14 {\n min-height: calc(var(--spacing) * 14);\n }\n\n .min-h-14\\.5 {\n min-height: calc(var(--spacing) * 14.5);\n }\n\n .min-h-19 {\n min-height: calc(var(--spacing) * 19);\n }\n\n .min-h-35 {\n min-height: calc(var(--spacing) * 35);\n }\n\n .w-1\\.75 {\n width: calc(var(--spacing) * 1.75);\n }\n\n .w-1\\/3 {\n width: 33.3333%;\n }\n\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-4\\.5 {\n width: calc(var(--spacing) * 4.5);\n }\n\n .w-4\\.25 {\n width: calc(var(--spacing) * 4.25);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n\n .w-7 {\n width: calc(var(--spacing) * 7);\n }\n\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n\n .w-9\\.5 {\n width: calc(var(--spacing) * 9.5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-10\\.5 {\n width: calc(var(--spacing) * 10.5);\n }\n\n .w-11\\.5 {\n width: calc(var(--spacing) * 11.5);\n }\n\n .w-11\\.25 {\n width: calc(var(--spacing) * 11.25);\n }\n\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n\n .w-12\\.5 {\n width: calc(var(--spacing) * 12.5);\n }\n\n .w-12\\.75 {\n width: calc(var(--spacing) * 12.75);\n }\n\n .w-15\\.5 {\n width: calc(var(--spacing) * 15.5);\n }\n\n .w-15\\.25 {\n width: calc(var(--spacing) * 15.25);\n }\n\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n\n .w-17 {\n width: calc(var(--spacing) * 17);\n }\n\n .w-18 {\n width: var(--spacing-18);\n }\n\n .w-18\\.5 {\n width: calc(var(--spacing) * 18.5);\n }\n\n .w-18\\.75 {\n width: calc(var(--spacing) * 18.75);\n }\n\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n\n .w-20\\.5 {\n width: calc(var(--spacing) * 20.5);\n }\n\n .w-21\\.5 {\n width: calc(var(--spacing) * 21.5);\n }\n\n .w-22\\.25 {\n width: calc(var(--spacing) * 22.25);\n }\n\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n\n .w-24\\.75 {\n width: calc(var(--spacing) * 24.75);\n }\n\n .w-25 {\n width: calc(var(--spacing) * 25);\n }\n\n .w-25\\.5 {\n width: calc(var(--spacing) * 25.5);\n }\n\n .w-25\\.25 {\n width: calc(var(--spacing) * 25.25);\n }\n\n .w-26\\.25 {\n width: calc(var(--spacing) * 26.25);\n }\n\n .w-26\\.75 {\n width: calc(var(--spacing) * 26.75);\n }\n\n .w-27 {\n width: calc(var(--spacing) * 27);\n }\n\n .w-27\\.5 {\n width: calc(var(--spacing) * 27.5);\n }\n\n .w-28\\.25 {\n width: calc(var(--spacing) * 28.25);\n }\n\n .w-30 {\n width: var(--spacing-30);\n }\n\n .w-30\\.75 {\n width: calc(var(--spacing) * 30.75);\n }\n\n .w-33\\.25 {\n width: calc(var(--spacing) * 33.25);\n }\n\n .w-34\\.25 {\n width: calc(var(--spacing) * 34.25);\n }\n\n .w-35 {\n width: calc(var(--spacing) * 35);\n }\n\n .w-36 {\n width: calc(var(--spacing) * 36);\n }\n\n .w-37 {\n width: calc(var(--spacing) * 37);\n }\n\n .w-38 {\n width: var(--spacing-38);\n }\n\n .w-38\\.5 {\n width: calc(var(--spacing) * 38.5);\n }\n\n .w-39\\.5 {\n width: calc(var(--spacing) * 39.5);\n }\n\n .w-41 {\n width: calc(var(--spacing) * 41);\n }\n\n .w-41\\.75 {\n width: calc(var(--spacing) * 41.75);\n }\n\n .w-42 {\n width: calc(var(--spacing) * 42);\n }\n\n .w-44 {\n width: calc(var(--spacing) * 44);\n }\n\n .w-45 {\n width: calc(var(--spacing) * 45);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\n }\n\n .w-48 {\n width: calc(var(--spacing) * 48);\n }\n\n .w-48\\.5 {\n width: calc(var(--spacing) * 48.5);\n }\n\n .w-53 {\n width: calc(var(--spacing) * 53);\n }\n\n .w-53\\.25 {\n width: calc(var(--spacing) * 53.25);\n }\n\n .w-53\\.75 {\n width: calc(var(--spacing) * 53.75);\n }\n\n .w-56\\.5 {\n width: calc(var(--spacing) * 56.5);\n }\n\n .w-57\\.5 {\n width: calc(var(--spacing) * 57.5);\n }\n\n .w-58\\.75 {\n width: calc(var(--spacing) * 58.75);\n }\n\n .w-60\\.5 {\n width: calc(var(--spacing) * 60.5);\n }\n\n .w-62\\.5 {\n width: calc(var(--spacing) * 62.5);\n }\n\n .w-63\\.5 {\n width: calc(var(--spacing) * 63.5);\n }\n\n .w-66 {\n width: calc(var(--spacing) * 66);\n }\n\n .w-68 {\n width: calc(var(--spacing) * 68);\n }\n\n .w-70 {\n width: calc(var(--spacing) * 70);\n }\n\n .w-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\n }\n\n .w-74\\.75 {\n width: calc(var(--spacing) * 74.75);\n }\n\n .w-87 {\n width: calc(var(--spacing) * 87);\n }\n\n .w-91 {\n width: calc(var(--spacing) * 91);\n }\n\n .w-92 {\n width: calc(var(--spacing) * 92);\n }\n\n .w-95 {\n width: calc(var(--spacing) * 95);\n }\n\n .w-99\\.75 {\n width: calc(var(--spacing) * 99.75);\n }\n\n .w-100 {\n width: var(--spacing-100);\n }\n\n .w-100\\.5 {\n width: calc(var(--spacing) * 100.5);\n }\n\n .w-102 {\n width: calc(var(--spacing) * 102);\n }\n\n .w-120 {\n width: var(--spacing-120);\n }\n\n .w-127\\.75 {\n width: calc(var(--spacing) * 127.75);\n }\n\n .w-130\\.25 {\n width: calc(var(--spacing) * 130.25);\n }\n\n .w-131 {\n width: calc(var(--spacing) * 131);\n }\n\n .w-139 {\n width: calc(var(--spacing) * 139);\n }\n\n .w-140\\.75 {\n width: calc(var(--spacing) * 140.75);\n }\n\n .w-144\\.75 {\n width: calc(var(--spacing) * 144.75);\n }\n\n .w-148\\.75 {\n width: calc(var(--spacing) * 148.75);\n }\n\n .w-186\\.5 {\n width: calc(var(--spacing) * 186.5);\n }\n\n .w-186\\.25 {\n width: calc(var(--spacing) * 186.25);\n }\n\n .w-194\\.25 {\n width: calc(var(--spacing) * 194.25);\n }\n\n .w-198\\.25 {\n width: calc(var(--spacing) * 198.25);\n }\n\n .w-270 {\n width: calc(var(--spacing) * 270);\n }\n\n .w-282 {\n width: calc(var(--spacing) * 282);\n }\n\n .w-286 {\n width: calc(var(--spacing) * 286);\n }\n\n .w-293\\.5 {\n width: calc(var(--spacing) * 293.5);\n }\n\n .w-\\[22\\.833125rem\\] {\n width: 22.8331rem;\n }\n\n .w-\\[calc\\(100\\%-10px\\)\\] {\n width: calc(100% - 10px);\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-fit {\n width: fit-content;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-px {\n width: 1px;\n }\n\n .max-w-36 {\n max-width: calc(var(--spacing) * 36);\n }\n\n .max-w-38 {\n max-width: var(--spacing-38);\n }\n\n .max-w-43 {\n max-width: var(--spacing-43);\n }\n\n .max-w-44 {\n max-width: calc(var(--spacing) * 44);\n }\n\n .max-w-51\\.5 {\n max-width: calc(var(--spacing) * 51.5);\n }\n\n .max-w-65 {\n max-width: calc(var(--spacing) * 65);\n }\n\n .max-w-95 {\n max-width: calc(var(--spacing) * 95);\n }\n\n .max-w-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\n }\n\n .max-w-\\[33\\.125rem\\] {\n max-width: 33.125rem;\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .min-w-0 {\n min-width: 0;\n }\n\n .min-w-4 {\n min-width: calc(var(--spacing) * 4);\n }\n\n .min-w-10 {\n min-width: calc(var(--spacing) * 10);\n }\n\n .min-w-20 {\n min-width: calc(var(--spacing) * 20);\n }\n\n .min-w-30 {\n min-width: var(--spacing-30);\n }\n\n .min-w-32 {\n min-width: calc(var(--spacing) * 32);\n }\n\n .min-w-36 {\n min-width: calc(var(--spacing) * 36);\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .min-w-50 {\n min-width: var(--spacing-50);\n }\n\n .min-w-53\\.25 {\n min-width: calc(var(--spacing) * 53.25);\n }\n\n .min-w-55 {\n min-width: calc(var(--spacing) * 55);\n }\n\n .min-w-105 {\n min-width: calc(var(--spacing) * 105);\n }\n\n .min-w-160 {\n min-width: calc(var(--spacing) * 160);\n }\n\n .min-w-\\[8\\.2rem\\] {\n min-width: 8.2rem;\n }\n\n .min-w-fit {\n min-width: fit-content;\n }\n\n .min-w-full {\n min-width: 100%;\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .flex-shrink {\n flex-shrink: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .border-collapse {\n border-collapse: collapse;\n }\n\n .-translate-x-1 {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .scale-\\[1\\.02\\] {\n scale: 1.02;\n }\n\n .rotate-180 {\n rotate: 180deg;\n }\n\n .transform {\n transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );\n }\n\n .animate-spin {\n animation: var(--animate-spin);\n }\n\n .cursor-default {\n cursor: default;\n }\n\n .cursor-grab {\n cursor: grab;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .cursor-text {\n cursor: text;\n }\n\n .touch-none {\n touch-action: none;\n }\n\n .resize {\n resize: both;\n }\n\n .appearance-none {\n appearance: none;\n }\n\n .grid-cols-\\[7\\.5rem_7\\.5rem_7\\.5rem\\] {\n grid-template-columns: 7.5rem 7.5rem 7.5rem;\n }\n\n .grid-cols-\\[minmax\\(4\\.875rem\\,auto\\)_auto_1fr_auto\\] {\n grid-template-columns: minmax(4.875rem, auto) auto 1fr auto;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .items-baseline {\n align-items: baseline;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-start {\n align-items: flex-start;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .gap-0 {\n gap: 0;\n }\n\n .gap-0\\.5 {\n gap: calc(var(--spacing) * .5);\n }\n\n .gap-1 {\n gap: var(--spacing);\n }\n\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n\n .gap-1\\.25 {\n gap: calc(var(--spacing) * 1.25);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .gap-2\\.25 {\n gap: calc(var(--spacing) * 2.25);\n }\n\n .gap-2\\.75 {\n gap: calc(var(--spacing) * 2.75);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n\n .gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n\n .gap-8\\.75 {\n gap: calc(var(--spacing) * 8.75);\n }\n\n .gap-12 {\n gap: calc(var(--spacing) * 12);\n }\n\n .gap-19 {\n gap: calc(var(--spacing) * 19);\n }\n\n .gap-\\[0\\.625rem\\] {\n gap: .625rem;\n }\n\n .gap-\\[0\\.53125rem\\] {\n gap: .53125rem;\n }\n\n .gap-\\[2\\%\\] {\n gap: 2%;\n }\n\n .gap-px {\n gap: 1px;\n }\n\n :where(.space-y-1 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));\n margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-2 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-3 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n .gap-x-2 {\n column-gap: calc(var(--spacing) * 2);\n }\n\n .gap-x-4 {\n column-gap: calc(var(--spacing) * 4);\n }\n\n .gap-x-6 {\n column-gap: calc(var(--spacing) * 6);\n }\n\n .gap-y-1 {\n row-gap: var(--spacing);\n }\n\n .self-end {\n align-self: flex-end;\n }\n\n .self-start {\n align-self: flex-start;\n }\n\n .truncate {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-visible {\n overflow: visible;\n }\n\n .overflow-x-auto {\n overflow-x: auto;\n }\n\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-y-hidden {\n overflow-y: hidden;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-full {\n border-radius: 3.40282e38px;\n }\n\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n\n .rounded-md {\n border-radius: var(--radius-md);\n }\n\n .rounded-none {\n border-radius: 0;\n }\n\n .rounded-none\\! {\n border-radius: 0 !important;\n }\n\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-xl {\n border-radius: var(--radius-xl);\n }\n\n .rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n }\n\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n\n .rounded-t-xl {\n border-top-left-radius: var(--radius-xl);\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-l-xl {\n border-top-left-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .rounded-tl-xl {\n border-top-left-radius: var(--radius-xl);\n }\n\n .rounded-r-md {\n border-top-right-radius: var(--radius-md);\n border-bottom-right-radius: var(--radius-md);\n }\n\n .rounded-tr-xl {\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-b-lg {\n border-bottom-right-radius: var(--radius-lg);\n border-bottom-left-radius: var(--radius-lg);\n }\n\n .rounded-b-md {\n border-bottom-right-radius: var(--radius-md);\n border-bottom-left-radius: var(--radius-md);\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-x {\n border-inline-style: var(--tw-border-style);\n border-inline-width: 1px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-0 {\n border-top-style: var(--tw-border-style);\n border-top-width: 0;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0;\n }\n\n .border-l-4 {\n border-left-style: var(--tw-border-style);\n border-left-width: 4px;\n }\n\n .border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n\n .border-\\(--axebow-border-gray\\) {\n border-color: var(--axebow-border-gray);\n }\n\n .border-\\(--axebow-dark-yellow\\) {\n border-color: var(--axebow-dark-yellow);\n }\n\n .border-\\(--axebow-error-border\\) {\n border-color: var(--axebow-error-border);\n }\n\n .border-\\(--axebow-gray\\) {\n border-color: var(--axebow-gray);\n }\n\n .border-\\(--axebow-light-gray\\) {\n border-color: var(--axebow-light-gray);\n }\n\n .border-\\(--axebow-premium-text\\) {\n border-color: var(--axebow-premium-text);\n }\n\n .border-\\(--axebow-primary\\) {\n border-color: var(--axebow-primary);\n }\n\n .border-\\(--axebow-table-border\\) {\n border-color: var(--axebow-table-border);\n }\n\n .border-\\(--axebow-table-header-border\\) {\n border-color: var(--axebow-table-header-border);\n }\n\n .border-\\(--axebow-tertiary\\) {\n border-color: var(--axebow-tertiary);\n }\n\n .border-\\[\\#0ECD9A80\\] {\n border-color: #0ecd9a80;\n }\n\n .border-\\[\\#344966\\] {\n border-color: #344966;\n }\n\n .border-\\[\\#DBDDE4\\] {\n border-color: #dbdde4;\n }\n\n .border-\\[var\\(--axebow-error\\)\\] {\n border-color: var(--axebow-error);\n }\n\n .border-\\[var\\(--axebow-gray\\)\\] {\n border-color: var(--axebow-gray);\n }\n\n .border-\\[var\\(--axebow-tertiary\\)\\] {\n border-color: var(--axebow-tertiary);\n }\n\n .border-black {\n border-color: var(--color-black);\n }\n\n .border-black\\/10 {\n border-color: #0000001a;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n\n .border-blue-200 {\n border-color: var(--color-blue-200);\n }\n\n .border-gray-100 {\n border-color: var(--color-gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--color-gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--color-gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--color-gray-500);\n }\n\n .border-green-200 {\n border-color: var(--color-green-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-white {\n border-color: var(--color-white);\n }\n\n .bg-\\(--axebow-anti-flash-white\\) {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\(--axebow-base\\) {\n background-color: var(--axebow-base);\n }\n\n .bg-\\(--axebow-error\\) {\n background-color: var(--axebow-error);\n }\n\n .bg-\\(--axebow-error-bg\\) {\n background-color: var(--axebow-error-bg);\n }\n\n .bg-\\(--axebow-gray\\) {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\(--axebow-light-gray\\), .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: var(--axebow-light-gray);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: color-mix(in oklab, var(--axebow-light-gray) 80%, transparent);\n }\n }\n\n .bg-\\(--axebow-primary\\) {\n background-color: var(--axebow-primary);\n }\n\n .bg-\\(--axebow-primary-light\\) {\n background-color: var(--axebow-primary-light);\n }\n\n .bg-\\(--axebow-success\\) {\n background-color: var(--axebow-success);\n }\n\n .bg-\\(--axebow-tertiary\\), .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: var(--axebow-tertiary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: color-mix(in oklab, var(--axebow-tertiary) 15%, transparent);\n }\n }\n\n .bg-\\(--axebow-warning\\) {\n background-color: var(--axebow-warning);\n }\n\n .bg-\\(--axebow-warning-bg\\) {\n background-color: var(--axebow-warning-bg);\n }\n\n .bg-\\(--axebow-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-\\[\\#0ECD9A1A\\] {\n background-color: #0ecd9a1a;\n }\n\n .bg-\\[\\#006BFF\\] {\n background-color: #006bff;\n }\n\n .bg-\\[\\#78787A1A\\] {\n background-color: #78787a1a;\n }\n\n .bg-\\[\\#C7DCFA\\] {\n background-color: #c7dcfa;\n }\n\n .bg-\\[\\#F0F1F5\\] {\n background-color: #f0f1f5;\n }\n\n .bg-\\[\\#F3FDFA\\] {\n background-color: #f3fdfa;\n }\n\n .bg-blue-50 {\n background-color: var(--color-blue-50);\n }\n\n .bg-gray-50 {\n background-color: var(--color-gray-50);\n }\n\n .bg-gray-50\\/50 {\n background-color: #f9fafb80;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-gray-50\\/50 {\n background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent);\n }\n }\n\n .bg-gray-100 {\n background-color: var(--color-gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--color-gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n\n .bg-green-50 {\n background-color: var(--color-green-50);\n }\n\n .bg-red-50 {\n background-color: var(--color-red-50);\n }\n\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n\n .bg-sky-50 {\n background-color: var(--color-sky-50);\n }\n\n .bg-sky-100 {\n background-color: var(--color-sky-100);\n }\n\n .bg-transparent {\n background-color: #0000;\n }\n\n .bg-white {\n background-color: var(--color-white);\n }\n\n .object-contain {\n object-fit: contain;\n }\n\n .object-cover {\n object-fit: cover;\n }\n\n .p-0 {\n padding: 0;\n }\n\n .p-1 {\n padding: var(--spacing);\n }\n\n .p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n\n .p-3\\.25 {\n padding: calc(var(--spacing) * 3.25);\n }\n\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n\n .p-5 {\n padding: calc(var(--spacing) * 5);\n }\n\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n\n .px-0\\.5 {\n padding-inline: calc(var(--spacing) * .5);\n }\n\n .px-1 {\n padding-inline: var(--spacing);\n }\n\n .px-1\\.5 {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .px-3\\.5 {\n padding-inline: calc(var(--spacing) * 3.5);\n }\n\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\n }\n\n .py-0\\.5 {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .py-1 {\n padding-block: var(--spacing);\n }\n\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .py-1\\.25 {\n padding-block: calc(var(--spacing) * 1.25);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n\n .py-2\\.75 {\n padding-block: calc(var(--spacing) * 2.75);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .py-3\\.25 {\n padding-block: calc(var(--spacing) * 3.25);\n }\n\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n\n .py-4\\.75 {\n padding-block: calc(var(--spacing) * 4.75);\n }\n\n .py-8 {\n padding-block: calc(var(--spacing) * 8);\n }\n\n .py-px {\n padding-block: 1px;\n }\n\n .ps-4 {\n padding-inline-start: calc(var(--spacing) * 4);\n }\n\n .ps-8 {\n padding-inline-start: calc(var(--spacing) * 8);\n }\n\n .pe-4 {\n padding-inline-end: calc(var(--spacing) * 4);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-1 {\n padding-top: var(--spacing);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n\n .pt-6 {\n padding-top: calc(var(--spacing) * 6);\n }\n\n .pt-8 {\n padding-top: calc(var(--spacing) * 8);\n }\n\n .pt-px {\n padding-top: 1px;\n }\n\n .pr-1 {\n padding-right: var(--spacing);\n }\n\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .pr-3\\.25 {\n padding-right: calc(var(--spacing) * 3.25);\n }\n\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n\n .pr-4\\.5 {\n padding-right: calc(var(--spacing) * 4.5);\n }\n\n .pr-5 {\n padding-right: calc(var(--spacing) * 5);\n }\n\n .pr-14 {\n padding-right: calc(var(--spacing) * 14);\n }\n\n .pb-0 {\n padding-bottom: 0;\n }\n\n .pb-1 {\n padding-bottom: var(--spacing);\n }\n\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .pb-3\\.5 {\n padding-bottom: calc(var(--spacing) * 3.5);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n\n .pl-1 {\n padding-left: var(--spacing);\n }\n\n .pl-1\\.5 {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n\n .pl-4\\.25 {\n padding-left: calc(var(--spacing) * 4.25);\n }\n\n .pl-5 {\n padding-left: calc(var(--spacing) * 5);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .pl-8 {\n padding-left: calc(var(--spacing) * 8);\n }\n\n .pl-11\\.75 {\n padding-left: calc(var(--spacing) * 11.75);\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-right {\n text-align: right;\n }\n\n .text-start {\n text-align: start;\n }\n\n .align-middle {\n vertical-align: middle;\n }\n\n .font-\\[Material_Symbols_Outlined\\] {\n font-family: Material Symbols Outlined;\n }\n\n .font-\\[inherit\\] {\n font-family: inherit;\n }\n\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .text-md {\n font-size: var(--text-md);\n line-height: var(--tw-leading, var(--text-md--line-height));\n }\n\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .text-\\[0\\.9375rem\\] {\n font-size: .9375rem;\n }\n\n .text-\\[1\\.25rem\\] {\n font-size: 1.25rem;\n }\n\n .text-\\[18px\\] {\n font-size: 18px;\n }\n\n .leading-3 {\n --tw-leading: calc(var(--spacing) * 3);\n line-height: calc(var(--spacing) * 3);\n }\n\n .leading-3\\.5 {\n --tw-leading: calc(var(--spacing) * 3.5);\n line-height: calc(var(--spacing) * 3.5);\n }\n\n .leading-4\\.25 {\n --tw-leading: calc(var(--spacing) * 4.25);\n line-height: calc(var(--spacing) * 4.25);\n }\n\n .leading-\\[1\\.125rem\\] {\n --tw-leading: 1.125rem;\n line-height: 1.125rem;\n }\n\n .leading-\\[1\\.0625rem\\] {\n --tw-leading: 1.0625rem;\n line-height: 1.0625rem;\n }\n\n .leading-\\[1\\.1875rem\\] {\n --tw-leading: 1.1875rem;\n line-height: 1.1875rem;\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n }\n\n .font-black {\n --tw-font-weight: var(--font-weight-black);\n font-weight: var(--font-weight-black);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .tracking-wider {\n --tw-tracking: var(--tracking-wider);\n letter-spacing: var(--tracking-wider);\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .break-all {\n word-break: break-all;\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-normal {\n white-space: normal;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\(--axebow-anti-flash-white\\) {\n color: var(--axebow-anti-flash-white);\n }\n\n .text-\\(--axebow-black\\) {\n color: var(--axebow-black);\n }\n\n .text-\\(--axebow-error\\) {\n color: var(--axebow-error);\n }\n\n .text-\\(--axebow-gray\\) {\n color: var(--axebow-gray);\n }\n\n .text-\\(--axebow-primary\\) {\n color: var(--axebow-primary);\n }\n\n .text-\\(--axebow-rich-black\\) {\n color: var(--axebow-rich-black);\n }\n\n .text-\\(--axebow-secondary\\) {\n color: var(--axebow-secondary);\n }\n\n .text-\\(--axebow-strong-gray\\) {\n color: var(--axebow-strong-gray);\n }\n\n .text-\\(--axebow-success\\) {\n color: var(--axebow-success);\n }\n\n .text-\\(--axebow-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\(--axebow-text-gray\\) {\n color: var(--axebow-text-gray);\n }\n\n .text-\\(--hyperlink-color\\) {\n color: var(--hyperlink-color);\n }\n\n .text-\\[\\#8A94AE\\] {\n color: #8a94ae;\n }\n\n .text-\\[\\#78787A\\] {\n color: #78787a;\n }\n\n .text-\\[\\#344966\\] {\n color: #344966;\n }\n\n .text-\\[\\#E93A3A\\] {\n color: #e93a3a;\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-black {\n color: var(--color-black);\n }\n\n .text-blue-600 {\n color: var(--color-blue-600);\n }\n\n .text-blue-800 {\n color: var(--color-blue-800);\n }\n\n .text-gray-300 {\n color: var(--color-gray-300);\n }\n\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n\n .text-gray-500 {\n color: var(--color-gray-500);\n }\n\n .text-gray-600 {\n color: var(--color-gray-600);\n }\n\n .text-gray-700 {\n color: var(--color-gray-700);\n }\n\n .text-green-600 {\n color: var(--color-green-600);\n }\n\n .text-green-800 {\n color: var(--color-green-800);\n }\n\n .text-inherit {\n color: inherit;\n }\n\n .text-red-800 {\n color: var(--color-red-800);\n }\n\n .text-white {\n color: var(--color-white);\n }\n\n .text-yellow-600 {\n color: var(--color-yellow-600);\n }\n\n .text-yellow-800 {\n color: var(--color-yellow-800);\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .italic {\n font-style: italic;\n }\n\n .not-italic {\n font-style: normal;\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .decoration-\\(--axebow-error\\) {\n -webkit-text-decoration-color: var(--axebow-error);\n -webkit-text-decoration-color: var(--axebow-error);\n text-decoration-color: var(--axebow-error);\n }\n\n .placeholder-gray-400::placeholder {\n color: var(--color-gray-400);\n }\n\n .opacity-0 {\n opacity: 0;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-60 {\n opacity: .6;\n }\n\n .opacity-70 {\n opacity: .7;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[0_-8px_8px_-8px_rgba\\(13\\,24\\,33\\,0\\.15\\)\\] {\n --tw-shadow: 0 -8px 8px -8px var(--tw-shadow-color, #0d182126);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_2px_6px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\] {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0003);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 0 4px 12px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_6px_16px_rgba\\(13\\,24\\,33\\,0\\.18\\)\\] {\n --tw-shadow: 0 6px 16px var(--tw-shadow-color, #0d18212e);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[2px_2px_25px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 2px 25px 0px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-none {\n --tw-shadow: 0 0 #0000;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .axebow-shadow-hover {\n transition: box-shadow .2s ease-in-out;\n }\n\n .axebow-shadow-hover:hover {\n box-shadow: 0 4px 12px #0d182114;\n }\n\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .blur {\n --tw-blur: blur(8px);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .grayscale {\n --tw-grayscale: grayscale(100%);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .filter {\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .backdrop-filter {\n -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n }\n\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .delay-100 {\n transition-delay: .1s;\n }\n\n .duration-120 {\n --tw-duration: .12s;\n transition-duration: .12s;\n }\n\n .duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .duration-300 {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_0\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_1\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 1,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n @media (hover: hover) {\n .group-hover\\:pointer-events-auto:is(:where(.group):hover *) {\n pointer-events: auto;\n }\n\n .group-hover\\:translate-x-0:is(:where(.group):hover *) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-hover\\:rotate-15:is(:where(.group):hover *) {\n rotate: 15deg;\n }\n\n .group-hover\\:font-semibold:is(:where(.group):hover *) {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .group-hover\\:text-\\(--axebow-gray\\):is(:where(.group):hover *) {\n color: var(--axebow-gray);\n }\n\n .group-hover\\:text-\\(--axebow-primary\\):is(:where(.group):hover *) {\n color: var(--axebow-primary);\n }\n\n .group-hover\\:opacity-100:is(:where(.group):hover *) {\n opacity: 1;\n }\n }\n\n .last\\:border-b-0:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .focus-within\\:border-black:focus-within {\n border-color: var(--color-black);\n }\n\n .focus-within\\:border-blue-500:focus-within {\n border-color: var(--color-blue-500);\n }\n\n .focus-within\\:ring-2:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-within\\:ring-blue-100:focus-within {\n --tw-ring-color: var(--color-blue-100);\n }\n\n @media (hover: hover) {\n .hover\\:scale-105:hover {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .hover\\:border-\\(--axebow-gray\\):hover {\n border-color: var(--axebow-gray);\n }\n\n .hover\\:border-\\(--axebow-tertiary\\):hover, .hover\\:border-\\[var\\(--axebow-tertiary\\)\\]:hover {\n border-color: var(--axebow-tertiary);\n }\n\n .hover\\:border-red-300:hover {\n border-color: var(--color-red-300);\n }\n\n .hover\\:bg-\\(--axebow-anti-flash-white\\):hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-\\(--axebow-base\\):hover {\n background-color: var(--axebow-base);\n }\n\n .hover\\:bg-\\(--axebow-gray\\):hover {\n background-color: var(--axebow-gray);\n }\n\n .hover\\:bg-\\(--axebow-light-gray\\):hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-\\(--axebow-primary\\):hover {\n background-color: var(--axebow-primary);\n }\n\n .hover\\:bg-\\[var\\(--axebow-anti-flash-white\\)\\]:hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-gray-50:hover {\n background-color: var(--color-gray-50);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:bg-gray-200:hover {\n background-color: var(--color-gray-200);\n }\n\n .hover\\:bg-red-50:hover {\n background-color: var(--color-red-50);\n }\n\n .hover\\:bg-white:hover {\n background-color: var(--color-white);\n }\n\n .hover\\:font-semibold:hover {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .hover\\:text-\\(--axebow-error\\):hover {\n color: var(--axebow-error);\n }\n\n .hover\\:text-\\(--axebow-gray\\):hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:text-\\(--axebow-primary\\):hover {\n color: var(--axebow-primary);\n }\n\n .hover\\:text-\\(--axebow-tertiary\\):hover {\n color: var(--axebow-tertiary);\n }\n\n .hover\\:text-black:hover {\n color: var(--color-black);\n }\n\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .hover\\:opacity-80:hover {\n opacity: .8;\n }\n\n .hover\\:opacity-100:hover {\n opacity: 1;\n }\n\n .hover\\:shadow-\\[0_2px_6px_rgba\\(13\\,24\\,33\\,0\\.14\\)\\]:hover {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0d182124);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .hover\\:shadow-\\[0_4px_12px_0_rgba\\(13\\,24\\,33\\,0\\.08\\)\\]:hover {\n --tw-shadow: 0 4px 12px 0 var(--tw-shadow-color, #0d182114);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n\n .focus\\:outline-2:focus {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus\\:outline-offset-1:focus {\n outline-offset: 1px;\n }\n\n .focus\\:outline-blue-500:focus {\n outline-color: var(--color-blue-500);\n }\n\n .focus\\:outline-none:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-\\[\\#006BFF\\]:focus-visible {\n --tw-ring-color: #006bff;\n }\n\n .focus-visible\\:outline-2:focus-visible {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus-visible\\:outline-\\(--axebow-tertiary\\):focus-visible {\n outline-color: var(--axebow-tertiary);\n }\n\n .active\\:cursor-grabbing:active {\n cursor: grabbing;\n }\n\n @media (hover: hover) {\n .enabled\\:hover\\:text-\\(--hyperlink-hover-color\\):enabled:hover {\n color: var(--hyperlink-hover-color);\n }\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n\n @media (min-width: 48rem) {\n .md\\:gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n }\n\n @media (min-width: 64rem) {\n .lg\\:sticky {\n position: sticky;\n }\n\n .lg\\:block {\n display: block;\n }\n\n .lg\\:flex {\n display: flex;\n }\n\n .lg\\:hidden {\n display: none;\n }\n\n .lg\\:inline {\n display: inline;\n }\n\n .lg\\:h-\\(--card-fixed-height\\) {\n height: var(--card-fixed-height);\n }\n\n .lg\\:min-h-\\(--card-height\\) {\n min-height: var(--card-height);\n }\n\n .lg\\:min-h-\\[calc\\(100vh-7\\.25rem\\)\\] {\n min-height: calc(100vh - 7.25rem);\n }\n\n .lg\\:w-\\(--card-width\\) {\n width: var(--card-width);\n }\n\n .lg\\:min-w-150 {\n min-width: var(--spacing-150);\n }\n\n .lg\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:rounded-md {\n border-radius: var(--radius-md);\n }\n\n .lg\\:border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .lg\\:text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .lg\\:text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .lg\\:shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n\n:host {\n font-family: var(--font-sans);\n font-size: var(--text-base);\n line-height: var(--text-base--line-height);\n --font-sans: \"Open Sans\", sans-serif;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-2xl: 1.5rem;\n --text-2xl--line-height: 2rem;\n --text-3xl: 1.875rem;\n --text-3xl--line-height: 2.25rem;\n --text-4xl: 2.25rem;\n --text-4xl--line-height: 2.5rem;\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 4.625rem;\n --text-8xl--line-height: 1;\n --text-9xl: 6.125rem;\n --text-9xl--line-height: 1;\n}\n\n:root {\n --sl-font-sans: \"Open Sans\", sans-serif;\n --sl-font-size-2x-small: var(--text-xs);\n --sl-font-size-x-small: var(--text-xs);\n --sl-font-size-small: var(--text-sm);\n --sl-font-size-medium: var(--text-base);\n --sl-font-size-large: var(--text-md);\n --sl-font-size-x-large: var(--text-lg);\n --sl-font-size-2x-large: var(--text-xl);\n --sl-font-size-3x-large: var(--text-3xl);\n --sl-font-size-4x-large: var(--text-5xl);\n --sl-input-font-size-small: var(--text-sm);\n --sl-input-font-size-medium: var(--text-base);\n --sl-input-font-size-large: var(--text-md);\n --sl-button-font-size-small: var(--text-sm);\n --sl-button-font-size-medium: var(--text-base);\n --sl-button-font-size-large: var(--text-md);\n --sl-tooltip-font-size: var(--text-base);\n}\n\nbutton, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n}\n\ninput, select, textarea, sl-menu-item::part(label), sl-option::part(label) {\n font-size: var(--text-base);\n}\n\n:root {\n --axebow-scrollbar-line-color: var(--axebow-tertiary, #e51c8e);\n --axebow-scrollbar-track-color: #f0f1f5;\n --axebow-scrollbar-thumb-color: #cbd5e1;\n --axebow-scrollbar-thumb-hover-color: #94a3b8;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-select::part(listbox), sl-dropdown::part(panel), sl-menu::part(base) {\n scrollbar-width: thin;\n scrollbar-color: var(--axebow-scrollbar-thumb-color) transparent;\n}\n\nsl-select::part(listbox), sl-select::part(menu) {\n width: max-content !important;\n min-width: 100% !important;\n max-width: 90vw !important;\n}\n\n:root, sl-input::part(base), sl-select::part(combobox), sl-textarea::part(base) {\n --sl-input-focus-ring-color: transparent;\n --sl-input-border-color-focus: var(--axebow-black, #000);\n --sl-focus-ring-color: transparent;\n}\n\nsl-input:focus-within::part(base), sl-select:focus-within::part(combobox), sl-textarea:focus-within::part(base) {\n border-color: var(--axebow-black, #000) !important;\n box-shadow: none !important;\n outline: none !important;\n}\n\n.axebow-blue-button::part(base) {\n background-color: var(--axebow-tertiary);\n}\n\n.info-container-page {\n flex-wrap: wrap;\n display: flex;\n}\n\nsl-divider {\n background: var(--axebow-light-gray);\n height: 1px;\n margin-top: .5rem;\n margin-bottom: .5rem;\n}\n\n.axebow-shadow {\n box-shadow: 2px 2px 25px #0000001a;\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n";
221
+ var tailwind_default = "/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n@layer properties {\n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *, :before, :after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: \"Open Sans\", sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-50: oklch(97.1% .013 17.38);\n --color-red-100: oklch(93.6% .032 17.717);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-800: oklch(44.4% .177 26.899);\n --color-yellow-600: oklch(68.1% .162 75.834);\n --color-yellow-800: oklch(47.6% .114 61.907);\n --color-green-50: oklch(98.2% .018 155.826);\n --color-green-200: oklch(92.5% .084 155.995);\n --color-green-600: oklch(62.7% .194 149.214);\n --color-green-800: oklch(44.8% .119 151.328);\n --color-sky-50: oklch(97.7% .013 236.62);\n --color-sky-100: oklch(95.1% .026 236.824);\n --color-blue-50: oklch(97% .014 254.604);\n --color-blue-100: oklch(93.2% .032 255.585);\n --color-blue-200: oklch(88.2% .059 254.128);\n --color-blue-500: oklch(62.3% .214 259.815);\n --color-blue-600: oklch(54.6% .245 262.881);\n --color-blue-800: oklch(42.4% .199 265.638);\n --color-gray-50: oklch(98.5% .002 247.839);\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-gray-200: oklch(92.8% .006 264.531);\n --color-gray-300: oklch(87.2% .01 258.338);\n --color-gray-400: oklch(70.7% .022 261.325);\n --color-gray-500: oklch(55.1% .027 264.364);\n --color-gray-600: oklch(44.6% .03 256.802);\n --color-gray-700: oklch(37.3% .034 259.733);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-3xl: 1.875rem;\n --text-5xl: 3rem;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-black: 900;\n --tracking-wider: .05em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-relaxed: 1.625;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --ease-out: cubic-bezier(0, 0, .2, 1);\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --animate-spin: spin 1s linear infinite;\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --spacing-18: 4.5rem;\n --spacing-30: 7.5rem;\n --spacing-38: 9.5rem;\n --spacing-43: 10.75rem;\n --spacing-50: 12.5rem;\n --spacing-75: 18.75rem;\n --spacing-100: 25rem;\n --spacing-120: 30rem;\n --spacing-150: 37.5rem;\n --spacing-750: 187.5rem;\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-auto {\n pointer-events: auto;\n }\n\n .pointer-events-none {\n pointer-events: none;\n }\n\n .visible {\n visibility: visible;\n }\n\n .absolute {\n position: absolute;\n }\n\n .fixed {\n position: fixed;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .sticky {\n position: sticky;\n }\n\n .-top-2\\.25 {\n top: calc(var(--spacing) * -2.25);\n }\n\n .top-0 {\n top: 0;\n }\n\n .top-1 {\n top: var(--spacing);\n }\n\n .top-1\\/2 {\n top: 50%;\n }\n\n .top-3 {\n top: calc(var(--spacing) * 3);\n }\n\n .top-25 {\n top: calc(var(--spacing) * 25);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-\\[0\\.9375rem\\] {\n top: .9375rem;\n }\n\n .top-\\[min\\(6\\.25rem\\,calc\\(100vh_-_var\\(--card-actual-height\\)_-_1rem\\)\\)\\] {\n top: min(6.25rem, calc(100vh - var(--card-actual-height) - 1rem));\n }\n\n .top-full {\n top: 100%;\n }\n\n .-right-2\\.25 {\n right: calc(var(--spacing) * -2.25);\n }\n\n .right-0 {\n right: 0;\n }\n\n .right-0\\.5 {\n right: calc(var(--spacing) * .5);\n }\n\n .right-1 {\n right: var(--spacing);\n }\n\n .right-1\\.5 {\n right: calc(var(--spacing) * 1.5);\n }\n\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n\n .bottom-0 {\n bottom: 0;\n }\n\n .bottom-0\\.5 {\n bottom: calc(var(--spacing) * .5);\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .left-1\\/2 {\n left: 50%;\n }\n\n .left-\\[-7px\\] {\n left: -7px;\n }\n\n .left-\\[3\\.625rem\\] {\n left: 3.625rem;\n }\n\n .left-\\[calc\\(100\\%\\+10px\\)\\] {\n left: calc(100% + 10px);\n }\n\n .z-5 {\n z-index: 5;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-2000 {\n z-index: 2000;\n }\n\n .z-2001 {\n z-index: 2001;\n }\n\n .z-9999 {\n z-index: 9999;\n }\n\n .row-1 {\n grid-row: 1;\n }\n\n .row-2 {\n grid-row: 2;\n }\n\n .container {\n width: 100%;\n }\n\n @media (min-width: 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n\n @media (min-width: 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n\n @media (min-width: 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n\n @media (min-width: 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n\n @media (min-width: 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mx-2 {\n margin-inline: calc(var(--spacing) * 2);\n }\n\n .mx-3 {\n margin-inline: calc(var(--spacing) * 3);\n }\n\n .mx-6 {\n margin-inline: calc(var(--spacing) * 6);\n }\n\n .mx-12 {\n margin-inline: calc(var(--spacing) * 12);\n }\n\n .mx-auto {\n margin-inline: auto;\n }\n\n .my-1\\.5 {\n margin-block: calc(var(--spacing) * 1.5);\n }\n\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n\n .my-4 {\n margin-block: calc(var(--spacing) * 4);\n }\n\n .ms-auto {\n margin-inline-start: auto;\n }\n\n .mt-0 {\n margin-top: 0;\n }\n\n .mt-1 {\n margin-top: var(--spacing);\n }\n\n .mt-1\\.5 {\n margin-top: calc(var(--spacing) * 1.5);\n }\n\n .mt-1\\.75 {\n margin-top: calc(var(--spacing) * 1.75);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mt-2\\.25 {\n margin-top: calc(var(--spacing) * 2.25);\n }\n\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n\n .mt-4\\.5 {\n margin-top: calc(var(--spacing) * 4.5);\n }\n\n .mt-5 {\n margin-top: calc(var(--spacing) * 5);\n }\n\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n\n .mt-6\\.75 {\n margin-top: calc(var(--spacing) * 6.75);\n }\n\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n\n .mt-auto {\n margin-top: auto;\n }\n\n .mr-0\\.5 {\n margin-right: calc(var(--spacing) * .5);\n }\n\n .mr-1 {\n margin-right: var(--spacing);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mr-3 {\n margin-right: calc(var(--spacing) * 3);\n }\n\n .mr-4 {\n margin-right: calc(var(--spacing) * 4);\n }\n\n .mr-6 {\n margin-right: calc(var(--spacing) * 6);\n }\n\n .mr-7 {\n margin-right: calc(var(--spacing) * 7);\n }\n\n .mr-8 {\n margin-right: calc(var(--spacing) * 8);\n }\n\n .mr-10 {\n margin-right: calc(var(--spacing) * 10);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n }\n\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n\n .mb-6\\.5 {\n margin-bottom: calc(var(--spacing) * 6.5);\n }\n\n .mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n }\n\n .ml-0\\.5 {\n margin-left: calc(var(--spacing) * .5);\n }\n\n .ml-1 {\n margin-left: var(--spacing);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n\n .ml-12 {\n margin-left: calc(var(--spacing) * 12);\n }\n\n .ml-\\[0\\.5rem\\] {\n margin-left: .5rem;\n }\n\n .ml-\\[1\\.265625rem\\] {\n margin-left: 1.26563rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .box-content {\n box-sizing: content-box;\n }\n\n .line-clamp-1 {\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-2 {\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-3 {\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-11 {\n -webkit-line-clamp: 11;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .block {\n display: block;\n }\n\n .contents {\n display: contents;\n }\n\n .flex {\n display: flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .inline {\n display: inline;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .table {\n display: table;\n }\n\n .aspect-square {\n aspect-ratio: 1;\n }\n\n .h-1\\.5 {\n height: calc(var(--spacing) * 1.5);\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-2\\.25 {\n height: calc(var(--spacing) * 2.25);\n }\n\n .h-2\\.75 {\n height: calc(var(--spacing) * 2.75);\n }\n\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-4\\.5 {\n height: calc(var(--spacing) * 4.5);\n }\n\n .h-4\\.25 {\n height: calc(var(--spacing) * 4.25);\n }\n\n .h-4\\.75 {\n height: calc(var(--spacing) * 4.75);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-5\\.5 {\n height: calc(var(--spacing) * 5.5);\n }\n\n .h-5\\.25 {\n height: calc(var(--spacing) * 5.25);\n }\n\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n\n .h-6\\.75 {\n height: calc(var(--spacing) * 6.75);\n }\n\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n\n .h-7\\.5 {\n height: calc(var(--spacing) * 7.5);\n }\n\n .h-7\\.25 {\n height: calc(var(--spacing) * 7.25);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-8\\.75 {\n height: calc(var(--spacing) * 8.75);\n }\n\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n\n .h-9\\.5 {\n height: calc(var(--spacing) * 9.5);\n }\n\n .h-9\\.75 {\n height: calc(var(--spacing) * 9.75);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-10\\.5 {\n height: calc(var(--spacing) * 10.5);\n }\n\n .h-10\\.25 {\n height: calc(var(--spacing) * 10.25);\n }\n\n .h-11 {\n height: calc(var(--spacing) * 11);\n }\n\n .h-11\\.5 {\n height: calc(var(--spacing) * 11.5);\n }\n\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n\n .h-12\\.5 {\n height: calc(var(--spacing) * 12.5);\n }\n\n .h-12\\.25 {\n height: calc(var(--spacing) * 12.25);\n }\n\n .h-12\\.75 {\n height: calc(var(--spacing) * 12.75);\n }\n\n .h-14 {\n height: calc(var(--spacing) * 14);\n }\n\n .h-14\\.25 {\n height: calc(var(--spacing) * 14.25);\n }\n\n .h-15\\.5 {\n height: calc(var(--spacing) * 15.5);\n }\n\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n\n .h-17\\.75 {\n height: calc(var(--spacing) * 17.75);\n }\n\n .h-19\\.75 {\n height: calc(var(--spacing) * 19.75);\n }\n\n .h-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-20\\.75 {\n height: calc(var(--spacing) * 20.75);\n }\n\n .h-22\\.75 {\n height: calc(var(--spacing) * 22.75);\n }\n\n .h-32\\.25 {\n height: calc(var(--spacing) * 32.25);\n }\n\n .h-40\\.75 {\n height: calc(var(--spacing) * 40.75);\n }\n\n .h-45\\.5 {\n height: calc(var(--spacing) * 45.5);\n }\n\n .h-49\\.5 {\n height: calc(var(--spacing) * 49.5);\n }\n\n .h-52\\.75 {\n height: calc(var(--spacing) * 52.75);\n }\n\n .h-57\\.5 {\n height: calc(var(--spacing) * 57.5);\n }\n\n .h-77\\.25 {\n height: calc(var(--spacing) * 77.25);\n }\n\n .h-79 {\n height: calc(var(--spacing) * 79);\n }\n\n .h-83\\.25 {\n height: calc(var(--spacing) * 83.25);\n }\n\n .h-89\\.25 {\n height: calc(var(--spacing) * 89.25);\n }\n\n .h-102\\.25 {\n height: calc(var(--spacing) * 102.25);\n }\n\n .h-106\\.5 {\n height: calc(var(--spacing) * 106.5);\n }\n\n .h-112 {\n height: calc(var(--spacing) * 112);\n }\n\n .h-113\\.25 {\n height: calc(var(--spacing) * 113.25);\n }\n\n .h-\\[1\\.725rem\\] {\n height: 1.725rem;\n }\n\n .h-\\[2\\.125rem\\] {\n height: 2.125rem;\n }\n\n .h-\\[6\\.8125rem\\] {\n height: 6.8125rem;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-fit {\n height: fit-content;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-px {\n height: 1px;\n }\n\n .h-screen {\n height: 100vh;\n }\n\n .max-h-\\(--card-max-height\\) {\n max-height: var(--card-max-height);\n }\n\n .max-h-12 {\n max-height: calc(var(--spacing) * 12);\n }\n\n .max-h-30 {\n max-height: var(--spacing-30);\n }\n\n .max-h-40 {\n max-height: calc(var(--spacing) * 40);\n }\n\n .max-h-48 {\n max-height: calc(var(--spacing) * 48);\n }\n\n .max-h-75 {\n max-height: var(--spacing-75);\n }\n\n .max-h-111 {\n max-height: calc(var(--spacing) * 111);\n }\n\n .max-h-750 {\n max-height: var(--spacing-750);\n }\n\n .max-h-\\[40vh\\] {\n max-height: 40vh;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-0 {\n min-height: 0;\n }\n\n .min-h-5 {\n min-height: calc(var(--spacing) * 5);\n }\n\n .min-h-9 {\n min-height: calc(var(--spacing) * 9);\n }\n\n .min-h-12 {\n min-height: calc(var(--spacing) * 12);\n }\n\n .min-h-14 {\n min-height: calc(var(--spacing) * 14);\n }\n\n .min-h-14\\.5 {\n min-height: calc(var(--spacing) * 14.5);\n }\n\n .min-h-19 {\n min-height: calc(var(--spacing) * 19);\n }\n\n .min-h-35 {\n min-height: calc(var(--spacing) * 35);\n }\n\n .w-1\\.5 {\n width: calc(var(--spacing) * 1.5);\n }\n\n .w-1\\.75 {\n width: calc(var(--spacing) * 1.75);\n }\n\n .w-1\\/3 {\n width: 33.3333%;\n }\n\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-4\\.5 {\n width: calc(var(--spacing) * 4.5);\n }\n\n .w-4\\.25 {\n width: calc(var(--spacing) * 4.25);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n\n .w-7 {\n width: calc(var(--spacing) * 7);\n }\n\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n\n .w-9\\.5 {\n width: calc(var(--spacing) * 9.5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-10\\.5 {\n width: calc(var(--spacing) * 10.5);\n }\n\n .w-11 {\n width: calc(var(--spacing) * 11);\n }\n\n .w-11\\.5 {\n width: calc(var(--spacing) * 11.5);\n }\n\n .w-11\\.25 {\n width: calc(var(--spacing) * 11.25);\n }\n\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n\n .w-12\\.5 {\n width: calc(var(--spacing) * 12.5);\n }\n\n .w-12\\.75 {\n width: calc(var(--spacing) * 12.75);\n }\n\n .w-15\\.5 {\n width: calc(var(--spacing) * 15.5);\n }\n\n .w-15\\.25 {\n width: calc(var(--spacing) * 15.25);\n }\n\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n\n .w-17 {\n width: calc(var(--spacing) * 17);\n }\n\n .w-18 {\n width: var(--spacing-18);\n }\n\n .w-18\\.5 {\n width: calc(var(--spacing) * 18.5);\n }\n\n .w-18\\.75 {\n width: calc(var(--spacing) * 18.75);\n }\n\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n\n .w-20\\.5 {\n width: calc(var(--spacing) * 20.5);\n }\n\n .w-21\\.5 {\n width: calc(var(--spacing) * 21.5);\n }\n\n .w-22 {\n width: calc(var(--spacing) * 22);\n }\n\n .w-22\\.25 {\n width: calc(var(--spacing) * 22.25);\n }\n\n .w-23\\.5 {\n width: calc(var(--spacing) * 23.5);\n }\n\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n\n .w-24\\.75 {\n width: calc(var(--spacing) * 24.75);\n }\n\n .w-25 {\n width: calc(var(--spacing) * 25);\n }\n\n .w-25\\.5 {\n width: calc(var(--spacing) * 25.5);\n }\n\n .w-25\\.25 {\n width: calc(var(--spacing) * 25.25);\n }\n\n .w-26\\.25 {\n width: calc(var(--spacing) * 26.25);\n }\n\n .w-26\\.75 {\n width: calc(var(--spacing) * 26.75);\n }\n\n .w-27 {\n width: calc(var(--spacing) * 27);\n }\n\n .w-27\\.5 {\n width: calc(var(--spacing) * 27.5);\n }\n\n .w-28\\.25 {\n width: calc(var(--spacing) * 28.25);\n }\n\n .w-30 {\n width: var(--spacing-30);\n }\n\n .w-30\\.75 {\n width: calc(var(--spacing) * 30.75);\n }\n\n .w-33\\.25 {\n width: calc(var(--spacing) * 33.25);\n }\n\n .w-34\\.25 {\n width: calc(var(--spacing) * 34.25);\n }\n\n .w-35 {\n width: calc(var(--spacing) * 35);\n }\n\n .w-36 {\n width: calc(var(--spacing) * 36);\n }\n\n .w-37 {\n width: calc(var(--spacing) * 37);\n }\n\n .w-38 {\n width: var(--spacing-38);\n }\n\n .w-38\\.5 {\n width: calc(var(--spacing) * 38.5);\n }\n\n .w-39\\.5 {\n width: calc(var(--spacing) * 39.5);\n }\n\n .w-41 {\n width: calc(var(--spacing) * 41);\n }\n\n .w-41\\.75 {\n width: calc(var(--spacing) * 41.75);\n }\n\n .w-42 {\n width: calc(var(--spacing) * 42);\n }\n\n .w-44 {\n width: calc(var(--spacing) * 44);\n }\n\n .w-45 {\n width: calc(var(--spacing) * 45);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\n }\n\n .w-48 {\n width: calc(var(--spacing) * 48);\n }\n\n .w-48\\.5 {\n width: calc(var(--spacing) * 48.5);\n }\n\n .w-53 {\n width: calc(var(--spacing) * 53);\n }\n\n .w-53\\.25 {\n width: calc(var(--spacing) * 53.25);\n }\n\n .w-53\\.75 {\n width: calc(var(--spacing) * 53.75);\n }\n\n .w-56\\.5 {\n width: calc(var(--spacing) * 56.5);\n }\n\n .w-57\\.5 {\n width: calc(var(--spacing) * 57.5);\n }\n\n .w-58\\.75 {\n width: calc(var(--spacing) * 58.75);\n }\n\n .w-60\\.5 {\n width: calc(var(--spacing) * 60.5);\n }\n\n .w-62\\.5 {\n width: calc(var(--spacing) * 62.5);\n }\n\n .w-63\\.5 {\n width: calc(var(--spacing) * 63.5);\n }\n\n .w-66 {\n width: calc(var(--spacing) * 66);\n }\n\n .w-68 {\n width: calc(var(--spacing) * 68);\n }\n\n .w-70 {\n width: calc(var(--spacing) * 70);\n }\n\n .w-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\n }\n\n .w-74\\.75 {\n width: calc(var(--spacing) * 74.75);\n }\n\n .w-87 {\n width: calc(var(--spacing) * 87);\n }\n\n .w-91 {\n width: calc(var(--spacing) * 91);\n }\n\n .w-92 {\n width: calc(var(--spacing) * 92);\n }\n\n .w-95 {\n width: calc(var(--spacing) * 95);\n }\n\n .w-99\\.75 {\n width: calc(var(--spacing) * 99.75);\n }\n\n .w-100 {\n width: var(--spacing-100);\n }\n\n .w-100\\.5 {\n width: calc(var(--spacing) * 100.5);\n }\n\n .w-102 {\n width: calc(var(--spacing) * 102);\n }\n\n .w-120 {\n width: var(--spacing-120);\n }\n\n .w-127\\.75 {\n width: calc(var(--spacing) * 127.75);\n }\n\n .w-130\\.25 {\n width: calc(var(--spacing) * 130.25);\n }\n\n .w-131 {\n width: calc(var(--spacing) * 131);\n }\n\n .w-139 {\n width: calc(var(--spacing) * 139);\n }\n\n .w-140\\.75 {\n width: calc(var(--spacing) * 140.75);\n }\n\n .w-144\\.75 {\n width: calc(var(--spacing) * 144.75);\n }\n\n .w-148\\.75 {\n width: calc(var(--spacing) * 148.75);\n }\n\n .w-186\\.5 {\n width: calc(var(--spacing) * 186.5);\n }\n\n .w-186\\.25 {\n width: calc(var(--spacing) * 186.25);\n }\n\n .w-194\\.25 {\n width: calc(var(--spacing) * 194.25);\n }\n\n .w-198\\.25 {\n width: calc(var(--spacing) * 198.25);\n }\n\n .w-270 {\n width: calc(var(--spacing) * 270);\n }\n\n .w-282 {\n width: calc(var(--spacing) * 282);\n }\n\n .w-286 {\n width: calc(var(--spacing) * 286);\n }\n\n .w-293\\.5 {\n width: calc(var(--spacing) * 293.5);\n }\n\n .w-\\[1\\.725rem\\] {\n width: 1.725rem;\n }\n\n .w-\\[6\\.1875rem\\] {\n width: 6.1875rem;\n }\n\n .w-\\[22\\.833125rem\\] {\n width: 22.8331rem;\n }\n\n .w-\\[calc\\(100\\%-10px\\)\\] {\n width: calc(100% - 10px);\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-fit {\n width: fit-content;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-px {\n width: 1px;\n }\n\n .max-w-12 {\n max-width: calc(var(--spacing) * 12);\n }\n\n .max-w-36 {\n max-width: calc(var(--spacing) * 36);\n }\n\n .max-w-38 {\n max-width: var(--spacing-38);\n }\n\n .max-w-43 {\n max-width: var(--spacing-43);\n }\n\n .max-w-44 {\n max-width: calc(var(--spacing) * 44);\n }\n\n .max-w-51\\.5 {\n max-width: calc(var(--spacing) * 51.5);\n }\n\n .max-w-65 {\n max-width: calc(var(--spacing) * 65);\n }\n\n .max-w-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\n }\n\n .max-w-\\[11\\.395625rem\\] {\n max-width: 11.3956rem;\n }\n\n .max-w-\\[33\\.125rem\\] {\n max-width: 33.125rem;\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .min-w-0 {\n min-width: 0;\n }\n\n .min-w-4 {\n min-width: calc(var(--spacing) * 4);\n }\n\n .min-w-10 {\n min-width: calc(var(--spacing) * 10);\n }\n\n .min-w-20 {\n min-width: calc(var(--spacing) * 20);\n }\n\n .min-w-30 {\n min-width: var(--spacing-30);\n }\n\n .min-w-32 {\n min-width: calc(var(--spacing) * 32);\n }\n\n .min-w-36 {\n min-width: calc(var(--spacing) * 36);\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .min-w-50 {\n min-width: var(--spacing-50);\n }\n\n .min-w-53\\.25 {\n min-width: calc(var(--spacing) * 53.25);\n }\n\n .min-w-55 {\n min-width: calc(var(--spacing) * 55);\n }\n\n .min-w-105 {\n min-width: calc(var(--spacing) * 105);\n }\n\n .min-w-160 {\n min-width: calc(var(--spacing) * 160);\n }\n\n .min-w-fit {\n min-width: fit-content;\n }\n\n .min-w-full {\n min-width: 100%;\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .flex-shrink {\n flex-shrink: 1;\n }\n\n .flex-shrink-0, .shrink-0 {\n flex-shrink: 0;\n }\n\n .flex-grow, .grow {\n flex-grow: 1;\n }\n\n .border-collapse {\n border-collapse: collapse;\n }\n\n .origin-center {\n transform-origin: center;\n }\n\n .-translate-x-1 {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .scale-\\[1\\.02\\] {\n scale: 1.02;\n }\n\n .rotate-180 {\n rotate: 180deg;\n }\n\n .transform {\n transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );\n }\n\n .animate-spin {\n animation: var(--animate-spin);\n }\n\n .cursor-default {\n cursor: default;\n }\n\n .cursor-grab {\n cursor: grab;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .cursor-text {\n cursor: text;\n }\n\n .touch-none {\n touch-action: none;\n }\n\n .resize {\n resize: both;\n }\n\n .resize-none {\n resize: none;\n }\n\n .list-none {\n list-style-type: none;\n }\n\n .appearance-none {\n appearance: none;\n }\n\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .grid-cols-\\[minmax\\(4\\.875rem\\,auto\\)_auto_1fr_auto\\] {\n grid-template-columns: minmax(4.875rem, auto) auto 1fr auto;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .items-baseline {\n align-items: baseline;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-start {\n align-items: flex-start;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .justify-start {\n justify-content: flex-start;\n }\n\n .gap-0 {\n gap: 0;\n }\n\n .gap-0\\.5 {\n gap: calc(var(--spacing) * .5);\n }\n\n .gap-0\\.75 {\n gap: calc(var(--spacing) * .75);\n }\n\n .gap-1 {\n gap: var(--spacing);\n }\n\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n\n .gap-1\\.25 {\n gap: calc(var(--spacing) * 1.25);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .gap-2\\.25 {\n gap: calc(var(--spacing) * 2.25);\n }\n\n .gap-2\\.75 {\n gap: calc(var(--spacing) * 2.75);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n\n .gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n\n .gap-8\\.75 {\n gap: calc(var(--spacing) * 8.75);\n }\n\n .gap-12 {\n gap: calc(var(--spacing) * 12);\n }\n\n .gap-19 {\n gap: calc(var(--spacing) * 19);\n }\n\n .gap-\\[0\\.625rem\\] {\n gap: .625rem;\n }\n\n .gap-\\[0\\.53125rem\\] {\n gap: .53125rem;\n }\n\n .gap-\\[2\\%\\] {\n gap: 2%;\n }\n\n .gap-\\[4\\%\\] {\n gap: 4%;\n }\n\n .gap-px {\n gap: 1px;\n }\n\n :where(.space-y-1 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));\n margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-2 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-3 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n .gap-x-2 {\n column-gap: calc(var(--spacing) * 2);\n }\n\n .gap-x-4 {\n column-gap: calc(var(--spacing) * 4);\n }\n\n .gap-x-6 {\n column-gap: calc(var(--spacing) * 6);\n }\n\n .gap-y-1 {\n row-gap: var(--spacing);\n }\n\n .self-end {\n align-self: flex-end;\n }\n\n .self-start {\n align-self: flex-start;\n }\n\n .truncate {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-visible {\n overflow: visible;\n }\n\n .overflow-x-auto {\n overflow-x: auto;\n }\n\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-y-hidden {\n overflow-y: hidden;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-full {\n border-radius: 3.40282e38px;\n }\n\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n\n .rounded-md {\n border-radius: var(--radius-md);\n }\n\n .rounded-none {\n border-radius: 0;\n }\n\n .rounded-none\\! {\n border-radius: 0 !important;\n }\n\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-xl {\n border-radius: var(--radius-xl);\n }\n\n .rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n }\n\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n\n .rounded-t-xl {\n border-top-left-radius: var(--radius-xl);\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-l-xl {\n border-top-left-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .rounded-tl-xl {\n border-top-left-radius: var(--radius-xl);\n }\n\n .rounded-r-md {\n border-top-right-radius: var(--radius-md);\n border-bottom-right-radius: var(--radius-md);\n }\n\n .rounded-tr-xl {\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-b-lg {\n border-bottom-right-radius: var(--radius-lg);\n border-bottom-left-radius: var(--radius-lg);\n }\n\n .rounded-b-md {\n border-bottom-right-radius: var(--radius-md);\n border-bottom-left-radius: var(--radius-md);\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-x {\n border-inline-style: var(--tw-border-style);\n border-inline-width: 1px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-0 {\n border-top-style: var(--tw-border-style);\n border-top-width: 0;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0;\n }\n\n .border-l-4 {\n border-left-style: var(--tw-border-style);\n border-left-width: 4px;\n }\n\n .border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n\n .border-\\(--axebow-border-gray\\) {\n border-color: var(--axebow-border-gray);\n }\n\n .border-\\(--axebow-dark-yellow\\) {\n border-color: var(--axebow-dark-yellow);\n }\n\n .border-\\(--axebow-error-border\\) {\n border-color: var(--axebow-error-border);\n }\n\n .border-\\(--axebow-gray\\) {\n border-color: var(--axebow-gray);\n }\n\n .border-\\(--axebow-light-gray\\) {\n border-color: var(--axebow-light-gray);\n }\n\n .border-\\(--axebow-premium-text\\) {\n border-color: var(--axebow-premium-text);\n }\n\n .border-\\(--axebow-primary\\) {\n border-color: var(--axebow-primary);\n }\n\n .border-\\(--axebow-table-border\\) {\n border-color: var(--axebow-table-border);\n }\n\n .border-\\(--axebow-table-header-border\\) {\n border-color: var(--axebow-table-header-border);\n }\n\n .border-\\(--axebow-tertiary\\) {\n border-color: var(--axebow-tertiary);\n }\n\n .border-\\(--axebow-white\\) {\n border-color: var(--axebow-white);\n }\n\n .border-\\[\\#0ECD9A80\\] {\n border-color: #0ecd9a80;\n }\n\n .border-\\[\\#344966\\] {\n border-color: #344966;\n }\n\n .border-\\[\\#DBDDE4\\] {\n border-color: #dbdde4;\n }\n\n .border-\\[var\\(--axebow-error\\)\\] {\n border-color: var(--axebow-error);\n }\n\n .border-\\[var\\(--axebow-gray\\)\\] {\n border-color: var(--axebow-gray);\n }\n\n .border-\\[var\\(--axebow-tertiary\\)\\] {\n border-color: var(--axebow-tertiary);\n }\n\n .border-black {\n border-color: var(--color-black);\n }\n\n .border-black\\/10 {\n border-color: #0000001a;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n\n .border-blue-200 {\n border-color: var(--color-blue-200);\n }\n\n .border-gray-100 {\n border-color: var(--color-gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--color-gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--color-gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--color-gray-500);\n }\n\n .border-green-200 {\n border-color: var(--color-green-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-white {\n border-color: var(--color-white);\n }\n\n .bg-\\(--axebow-anti-flash-white\\) {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\(--axebow-base\\) {\n background-color: var(--axebow-base);\n }\n\n .bg-\\(--axebow-error\\) {\n background-color: var(--axebow-error);\n }\n\n .bg-\\(--axebow-error-bg\\) {\n background-color: var(--axebow-error-bg);\n }\n\n .bg-\\(--axebow-error-light\\) {\n background-color: var(--axebow-error-light);\n }\n\n .bg-\\(--axebow-gray\\) {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\(--axebow-light-gray\\), .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: var(--axebow-light-gray);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: color-mix(in oklab, var(--axebow-light-gray) 80%, transparent);\n }\n }\n\n .bg-\\(--axebow-primary\\) {\n background-color: var(--axebow-primary);\n }\n\n .bg-\\(--axebow-primary-light\\) {\n background-color: var(--axebow-primary-light);\n }\n\n .bg-\\(--axebow-success\\) {\n background-color: var(--axebow-success);\n }\n\n .bg-\\(--axebow-tertiary\\), .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: var(--axebow-tertiary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: color-mix(in oklab, var(--axebow-tertiary) 15%, transparent);\n }\n }\n\n .bg-\\(--axebow-warning\\) {\n background-color: var(--axebow-warning);\n }\n\n .bg-\\(--axebow-warning-bg\\) {\n background-color: var(--axebow-warning-bg);\n }\n\n .bg-\\(--axebow-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-\\[\\#0ECD9A1A\\] {\n background-color: #0ecd9a1a;\n }\n\n .bg-\\[\\#006BFF\\] {\n background-color: #006bff;\n }\n\n .bg-\\[\\#78787A1A\\] {\n background-color: #78787a1a;\n }\n\n .bg-\\[\\#C7DCFA\\] {\n background-color: #c7dcfa;\n }\n\n .bg-\\[\\#F0F1F5\\] {\n background-color: #f0f1f5;\n }\n\n .bg-\\[\\#F3FDFA\\] {\n background-color: #f3fdfa;\n }\n\n .bg-blue-50 {\n background-color: var(--color-blue-50);\n }\n\n .bg-gray-50 {\n background-color: var(--color-gray-50);\n }\n\n .bg-gray-50\\/50 {\n background-color: #f9fafb80;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-gray-50\\/50 {\n background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent);\n }\n }\n\n .bg-gray-100 {\n background-color: var(--color-gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--color-gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n\n .bg-green-50 {\n background-color: var(--color-green-50);\n }\n\n .bg-red-50 {\n background-color: var(--color-red-50);\n }\n\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n\n .bg-sky-50 {\n background-color: var(--color-sky-50);\n }\n\n .bg-sky-100 {\n background-color: var(--color-sky-100);\n }\n\n .bg-transparent {\n background-color: #0000;\n }\n\n .bg-white {\n background-color: var(--color-white);\n }\n\n .object-contain {\n object-fit: contain;\n }\n\n .object-cover {\n object-fit: cover;\n }\n\n .p-0 {\n padding: 0;\n }\n\n .p-1 {\n padding: var(--spacing);\n }\n\n .p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n\n .p-3\\.25 {\n padding: calc(var(--spacing) * 3.25);\n }\n\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n\n .p-5 {\n padding: calc(var(--spacing) * 5);\n }\n\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n\n .p-8 {\n padding: calc(var(--spacing) * 8);\n }\n\n .px-0\\.5 {\n padding-inline: calc(var(--spacing) * .5);\n }\n\n .px-1 {\n padding-inline: var(--spacing);\n }\n\n .px-1\\.5 {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .px-3\\.5 {\n padding-inline: calc(var(--spacing) * 3.5);\n }\n\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\n }\n\n .py-0\\.5 {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .py-1 {\n padding-block: var(--spacing);\n }\n\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .py-1\\.25 {\n padding-block: calc(var(--spacing) * 1.25);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n\n .py-2\\.75 {\n padding-block: calc(var(--spacing) * 2.75);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .py-3\\.25 {\n padding-block: calc(var(--spacing) * 3.25);\n }\n\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n\n .py-4\\.75 {\n padding-block: calc(var(--spacing) * 4.75);\n }\n\n .py-8 {\n padding-block: calc(var(--spacing) * 8);\n }\n\n .py-\\[0\\.71875rem\\] {\n padding-block: .71875rem;\n }\n\n .py-px {\n padding-block: 1px;\n }\n\n .ps-4 {\n padding-inline-start: calc(var(--spacing) * 4);\n }\n\n .ps-8 {\n padding-inline-start: calc(var(--spacing) * 8);\n }\n\n .pe-4 {\n padding-inline-end: calc(var(--spacing) * 4);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-1 {\n padding-top: var(--spacing);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n\n .pt-6 {\n padding-top: calc(var(--spacing) * 6);\n }\n\n .pt-8 {\n padding-top: calc(var(--spacing) * 8);\n }\n\n .pt-11\\.75 {\n padding-top: calc(var(--spacing) * 11.75);\n }\n\n .pt-px {\n padding-top: 1px;\n }\n\n .pr-1 {\n padding-right: var(--spacing);\n }\n\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .pr-3 {\n padding-right: calc(var(--spacing) * 3);\n }\n\n .pr-3\\.25 {\n padding-right: calc(var(--spacing) * 3.25);\n }\n\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n\n .pr-4\\.5 {\n padding-right: calc(var(--spacing) * 4.5);\n }\n\n .pr-5 {\n padding-right: calc(var(--spacing) * 5);\n }\n\n .pr-14 {\n padding-right: calc(var(--spacing) * 14);\n }\n\n .pb-0 {\n padding-bottom: 0;\n }\n\n .pb-1 {\n padding-bottom: var(--spacing);\n }\n\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .pb-3\\.5 {\n padding-bottom: calc(var(--spacing) * 3.5);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n\n .pl-1 {\n padding-left: var(--spacing);\n }\n\n .pl-1\\.5 {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n\n .pl-4\\.25 {\n padding-left: calc(var(--spacing) * 4.25);\n }\n\n .pl-5 {\n padding-left: calc(var(--spacing) * 5);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .pl-8 {\n padding-left: calc(var(--spacing) * 8);\n }\n\n .pl-11\\.75 {\n padding-left: calc(var(--spacing) * 11.75);\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-right {\n text-align: right;\n }\n\n .text-start {\n text-align: start;\n }\n\n .align-middle {\n vertical-align: middle;\n }\n\n .font-\\[Material_Symbols_Outlined\\] {\n font-family: Material Symbols Outlined;\n }\n\n .font-\\[inherit\\] {\n font-family: inherit;\n }\n\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .text-md {\n font-size: var(--text-md);\n line-height: var(--tw-leading, var(--text-md--line-height));\n }\n\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .text-\\[0\\.9375rem\\] {\n font-size: .9375rem;\n }\n\n .text-\\[1\\.25rem\\] {\n font-size: 1.25rem;\n }\n\n .text-\\[18px\\] {\n font-size: 18px;\n }\n\n .leading-3\\.5 {\n --tw-leading: calc(var(--spacing) * 3.5);\n line-height: calc(var(--spacing) * 3.5);\n }\n\n .leading-4\\.25 {\n --tw-leading: calc(var(--spacing) * 4.25);\n line-height: calc(var(--spacing) * 4.25);\n }\n\n .leading-\\[1\\.125rem\\] {\n --tw-leading: 1.125rem;\n line-height: 1.125rem;\n }\n\n .leading-\\[1\\.0625rem\\] {\n --tw-leading: 1.0625rem;\n line-height: 1.0625rem;\n }\n\n .leading-\\[1\\.1875rem\\] {\n --tw-leading: 1.1875rem;\n line-height: 1.1875rem;\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n }\n\n .font-black {\n --tw-font-weight: var(--font-weight-black);\n font-weight: var(--font-weight-black);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .tracking-wider {\n --tw-tracking: var(--tracking-wider);\n letter-spacing: var(--tracking-wider);\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .break-all {\n word-break: break-all;\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-normal {\n white-space: normal;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\(--axebow-anti-flash-white\\) {\n color: var(--axebow-anti-flash-white);\n }\n\n .text-\\(--axebow-black\\) {\n color: var(--axebow-black);\n }\n\n .text-\\(--axebow-error\\) {\n color: var(--axebow-error);\n }\n\n .text-\\(--axebow-gray\\) {\n color: var(--axebow-gray);\n }\n\n .text-\\(--axebow-primary\\) {\n color: var(--axebow-primary);\n }\n\n .text-\\(--axebow-rich-black\\) {\n color: var(--axebow-rich-black);\n }\n\n .text-\\(--axebow-secondary\\) {\n color: var(--axebow-secondary);\n }\n\n .text-\\(--axebow-strong-gray\\) {\n color: var(--axebow-strong-gray);\n }\n\n .text-\\(--axebow-success\\) {\n color: var(--axebow-success);\n }\n\n .text-\\(--axebow-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\(--axebow-text-gray\\) {\n color: var(--axebow-text-gray);\n }\n\n .text-\\(--hyperlink-color\\) {\n color: var(--hyperlink-color);\n }\n\n .text-\\[\\#8A94AE\\] {\n color: #8a94ae;\n }\n\n .text-\\[\\#78787A\\] {\n color: #78787a;\n }\n\n .text-\\[\\#344966\\] {\n color: #344966;\n }\n\n .text-\\[\\#E93A3A\\] {\n color: #e93a3a;\n }\n\n .text-\\[var\\(--axebow-clickable-blue\\)\\] {\n color: var(--axebow-clickable-blue);\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-\\[var\\(--axebow-gray\\)\\] {\n color: var(--axebow-gray);\n }\n\n .text-\\[var\\(--axebow-primary\\)\\] {\n color: var(--axebow-primary);\n }\n\n .text-black {\n color: var(--color-black);\n }\n\n .text-blue-600 {\n color: var(--color-blue-600);\n }\n\n .text-blue-800 {\n color: var(--color-blue-800);\n }\n\n .text-gray-300 {\n color: var(--color-gray-300);\n }\n\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n\n .text-gray-500 {\n color: var(--color-gray-500);\n }\n\n .text-gray-600 {\n color: var(--color-gray-600);\n }\n\n .text-gray-700 {\n color: var(--color-gray-700);\n }\n\n .text-green-600 {\n color: var(--color-green-600);\n }\n\n .text-green-800 {\n color: var(--color-green-800);\n }\n\n .text-inherit {\n color: inherit;\n }\n\n .text-red-800 {\n color: var(--color-red-800);\n }\n\n .text-white {\n color: var(--color-white);\n }\n\n .text-yellow-600 {\n color: var(--color-yellow-600);\n }\n\n .text-yellow-800 {\n color: var(--color-yellow-800);\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .italic {\n font-style: italic;\n }\n\n .not-italic {\n font-style: normal;\n }\n\n .no-underline {\n text-decoration-line: none;\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .decoration-\\(--axebow-error\\) {\n -webkit-text-decoration-color: var(--axebow-error);\n -webkit-text-decoration-color: var(--axebow-error);\n text-decoration-color: var(--axebow-error);\n }\n\n .placeholder-gray-400::placeholder {\n color: var(--color-gray-400);\n }\n\n .accent-\\(--axebow-tertiary\\) {\n accent-color: var(--axebow-tertiary);\n }\n\n .opacity-0 {\n opacity: 0;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-60 {\n opacity: .6;\n }\n\n .opacity-70 {\n opacity: .7;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[0_-8px_8px_-8px_rgba\\(13\\,24\\,33\\,0\\.15\\)\\] {\n --tw-shadow: 0 -8px 8px -8px var(--tw-shadow-color, #0d182126);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_2px_6px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\] {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0003);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 0 4px 12px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_6px_16px_rgba\\(13\\,24\\,33\\,0\\.18\\)\\] {\n --tw-shadow: 0 6px 16px var(--tw-shadow-color, #0d18212e);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[2px_2px_25px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 2px 25px 0px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-none {\n --tw-shadow: 0 0 #0000;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .axebow-shadow-hover {\n transition: box-shadow .2s ease-in-out;\n }\n\n .axebow-shadow-hover:hover {\n box-shadow: 0 4px 12px #0d182114;\n }\n\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .blur {\n --tw-blur: blur(8px);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .grayscale {\n --tw-grayscale: grayscale(100%);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .filter {\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .backdrop-filter {\n -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n }\n\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .delay-100 {\n transition-delay: .1s;\n }\n\n .duration-120 {\n --tw-duration: .12s;\n transition-duration: .12s;\n }\n\n .duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .duration-300 {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_0\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_1\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 1,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n @media (hover: hover) {\n .group-hover\\:pointer-events-auto:is(:where(.group):hover *) {\n pointer-events: auto;\n }\n\n .group-hover\\:translate-x-0:is(:where(.group):hover *) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-hover\\:rotate-15:is(:where(.group):hover *) {\n rotate: 15deg;\n }\n\n .group-hover\\:font-semibold:is(:where(.group):hover *) {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .group-hover\\:text-\\(--axebow-gray\\):is(:where(.group):hover *) {\n color: var(--axebow-gray);\n }\n\n .group-hover\\:text-\\(--axebow-primary\\):is(:where(.group):hover *) {\n color: var(--axebow-primary);\n }\n\n .group-hover\\:opacity-100:is(:where(.group):hover *) {\n opacity: 1;\n }\n }\n\n .last\\:border-b-0:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .focus-within\\:border-black:focus-within {\n border-color: var(--color-black);\n }\n\n .focus-within\\:border-blue-500:focus-within {\n border-color: var(--color-blue-500);\n }\n\n .focus-within\\:ring-2:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-within\\:ring-blue-100:focus-within {\n --tw-ring-color: var(--color-blue-100);\n }\n\n @media (hover: hover) {\n .hover\\:-translate-y-1:hover {\n --tw-translate-y: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .hover\\:scale-105:hover {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .hover\\:scale-110:hover {\n --tw-scale-x: 110%;\n --tw-scale-y: 110%;\n --tw-scale-z: 110%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .hover\\:border-\\(--axebow-gray\\):hover {\n border-color: var(--axebow-gray);\n }\n\n .hover\\:border-\\(--axebow-tertiary\\):hover, .hover\\:border-\\[var\\(--axebow-tertiary\\)\\]:hover {\n border-color: var(--axebow-tertiary);\n }\n\n .hover\\:border-red-300:hover {\n border-color: var(--color-red-300);\n }\n\n .hover\\:bg-\\(--axebow-anti-flash-white\\):hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-\\(--axebow-base\\):hover {\n background-color: var(--axebow-base);\n }\n\n .hover\\:bg-\\(--axebow-gray\\):hover {\n background-color: var(--axebow-gray);\n }\n\n .hover\\:bg-\\(--axebow-light-gray\\):hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-\\(--axebow-primary\\):hover {\n background-color: var(--axebow-primary);\n }\n\n .hover\\:bg-\\[var\\(--axebow-anti-flash-white\\)\\]:hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-gray-50:hover {\n background-color: var(--color-gray-50);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:bg-gray-200:hover {\n background-color: var(--color-gray-200);\n }\n\n .hover\\:bg-red-50:hover {\n background-color: var(--color-red-50);\n }\n\n .hover\\:bg-white:hover {\n background-color: var(--color-white);\n }\n\n .hover\\:font-semibold:hover {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .hover\\:text-\\(--axebow-error\\):hover {\n color: var(--axebow-error);\n }\n\n .hover\\:text-\\(--axebow-gray\\):hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:text-\\(--axebow-primary\\):hover {\n color: var(--axebow-primary);\n }\n\n .hover\\:text-\\(--axebow-tertiary\\):hover {\n color: var(--axebow-tertiary);\n }\n\n .hover\\:text-black:hover {\n color: var(--color-black);\n }\n\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .hover\\:opacity-80:hover {\n opacity: .8;\n }\n\n .hover\\:opacity-100:hover {\n opacity: 1;\n }\n\n .hover\\:shadow-\\[0_2px_6px_rgba\\(13\\,24\\,33\\,0\\.14\\)\\]:hover {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0d182124);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .hover\\:shadow-\\[0_4px_12px_0_rgba\\(13\\,24\\,33\\,0\\.08\\)\\]:hover {\n --tw-shadow: 0 4px 12px 0 var(--tw-shadow-color, #0d182114);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n\n .focus\\:outline-2:focus {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus\\:outline-offset-1:focus {\n outline-offset: 1px;\n }\n\n .focus\\:outline-blue-500:focus {\n outline-color: var(--color-blue-500);\n }\n\n .focus\\:outline-none:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-\\[\\#006BFF\\]:focus-visible {\n --tw-ring-color: #006bff;\n }\n\n .focus-visible\\:outline-2:focus-visible {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus-visible\\:outline-\\(--axebow-tertiary\\):focus-visible {\n outline-color: var(--axebow-tertiary);\n }\n\n .active\\:scale-95:active {\n --tw-scale-x: 95%;\n --tw-scale-y: 95%;\n --tw-scale-z: 95%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .active\\:cursor-grabbing:active {\n cursor: grabbing;\n }\n\n @media (hover: hover) {\n .enabled\\:hover\\:text-\\(--hyperlink-hover-color\\):enabled:hover {\n color: var(--hyperlink-hover-color);\n }\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n\n @media not all and (min-width: 46.875rem) {\n .max-\\[46\\.875rem\\]\\:gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .max-\\[46\\.875rem\\]\\:text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n }\n\n @media (min-width: 40rem) {\n .sm\\:max-h-56 {\n max-height: calc(var(--spacing) * 56);\n }\n\n .sm\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .sm\\:px-1 {\n padding-inline: var(--spacing);\n }\n\n .sm\\:text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n }\n\n @media (min-width: 48rem) {\n .md\\:max-h-75 {\n max-height: var(--spacing-75);\n }\n\n .md\\:grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .md\\:gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n }\n\n @media (min-width: 64rem) {\n .lg\\:sticky {\n position: sticky;\n }\n\n .lg\\:block {\n display: block;\n }\n\n .lg\\:flex {\n display: flex;\n }\n\n .lg\\:hidden {\n display: none;\n }\n\n .lg\\:inline {\n display: inline;\n }\n\n .lg\\:min-h-\\(--card-height\\) {\n min-height: var(--card-height);\n }\n\n .lg\\:min-h-\\[calc\\(100vh-7\\.25rem\\)\\] {\n min-height: calc(100vh - 7.25rem);\n }\n\n .lg\\:w-\\(--card-width\\) {\n width: var(--card-width);\n }\n\n .lg\\:w-194\\.5 {\n width: calc(var(--spacing) * 194.5);\n }\n\n .lg\\:w-auto {\n width: auto;\n }\n\n .lg\\:min-w-150 {\n min-width: var(--spacing-150);\n }\n\n .lg\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .lg\\:flex-row {\n flex-direction: row;\n }\n\n .lg\\:gap-7\\.75 {\n gap: calc(var(--spacing) * 7.75);\n }\n\n .lg\\:rounded-md {\n border-radius: var(--radius-md);\n }\n\n .lg\\:border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .lg\\:text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .lg\\:text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .lg\\:text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n\n .lg\\:shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n}\n\n:host {\n font-family: var(--font-sans);\n font-size: var(--text-base);\n line-height: var(--text-base--line-height);\n --font-sans: \"Open Sans\", sans-serif;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-2xl: 1.5rem;\n --text-2xl--line-height: 2rem;\n --text-3xl: 1.875rem;\n --text-3xl--line-height: 2.25rem;\n --text-4xl: 2.25rem;\n --text-4xl--line-height: 2.5rem;\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 4.625rem;\n --text-8xl--line-height: 1;\n --text-9xl: 6.125rem;\n --text-9xl--line-height: 1;\n}\n\n:root {\n --sl-font-sans: \"Open Sans\", sans-serif;\n --sl-font-size-2x-small: var(--text-xs);\n --sl-font-size-x-small: var(--text-xs);\n --sl-font-size-small: var(--text-sm);\n --sl-font-size-medium: var(--text-base);\n --sl-font-size-large: var(--text-md);\n --sl-font-size-x-large: var(--text-lg);\n --sl-font-size-2x-large: var(--text-xl);\n --sl-font-size-3x-large: var(--text-3xl);\n --sl-font-size-4x-large: var(--text-5xl);\n --sl-input-font-size-small: var(--text-sm);\n --sl-input-font-size-medium: var(--text-base);\n --sl-input-font-size-large: var(--text-md);\n --sl-button-font-size-small: var(--text-sm);\n --sl-button-font-size-medium: var(--text-base);\n --sl-button-font-size-large: var(--text-md);\n --sl-tooltip-font-size: var(--text-base);\n}\n\nbutton, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n}\n\ninput, select, textarea, sl-menu-item::part(label), sl-option::part(label) {\n font-size: var(--text-base);\n}\n\n:root {\n --axebow-scrollbar-line-color: var(--axebow-tertiary, #e51c8e);\n --axebow-scrollbar-track-color: #f0f1f5;\n --axebow-scrollbar-thumb-color: #cbd5e1;\n --axebow-scrollbar-thumb-hover-color: #94a3b8;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-select::part(listbox), sl-dropdown::part(panel), sl-menu::part(base) {\n scrollbar-width: thin;\n scrollbar-color: var(--axebow-scrollbar-thumb-color) transparent;\n}\n\nsl-select::part(listbox), sl-select::part(menu) {\n width: max-content !important;\n min-width: 100% !important;\n max-width: 90vw !important;\n}\n\n:root, sl-input::part(base), sl-select::part(combobox), sl-textarea::part(base) {\n --sl-input-focus-ring-color: transparent;\n --sl-input-border-color-focus: var(--axebow-black, #000);\n --sl-focus-ring-color: transparent;\n}\n\nsl-input:focus-within::part(base), sl-select:focus-within::part(combobox), sl-textarea:focus-within::part(base) {\n border-color: var(--axebow-black, #000) !important;\n box-shadow: none !important;\n outline: none !important;\n}\n\n.axebow-blue-button::part(base) {\n background-color: var(--axebow-tertiary);\n}\n\n.info-container-page {\n flex-wrap: wrap;\n display: flex;\n}\n\nsl-divider {\n background: var(--axebow-light-gray);\n height: 1px;\n margin-top: .5rem;\n margin-bottom: .5rem;\n}\n\n.axebow-shadow {\n box-shadow: 2px 2px 25px #0000001a;\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n";
222
222
  //#endregion
223
223
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/decorate.js
224
224
  function __decorate(decorators, target, key, desc) {
@@ -491,9 +491,9 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
491
491
  }
492
492
  _renderSearchItem() {
493
493
  return html`
494
- <div class="filter-bar-item flex flex-col gap-2 flex-1 min-w-36 max-w-95">
495
- <div class="flex items-center justify-between gap-2">
496
- <h4 class="m-0 text-base font-semibold text-black">${this.searchLabel}</h4>
494
+ <div class="filter-bar-item flex flex-col gap-2 flex-1 min-w-36 max-w-[11.395625rem]">
495
+ <div class="flex items-center justify-between gap-2 h-4.25">
496
+ <h4 class="m-0 min-w-0 truncate text-base leading-4.25 font-semibold text-black">${this.searchLabel}</h4>
497
497
  </div>
498
498
  <sl-input
499
499
  class="w-full"
@@ -514,11 +514,11 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
514
514
  const hasValue = isLockable && item.value && item.value !== "all" && item.value !== "";
515
515
  return html`
516
516
  <div
517
- class="filter-bar-item flex flex-col gap-2 flex-1 min-w-36 max-w-95"
517
+ class="filter-bar-item flex flex-col gap-2 flex-1 min-w-36 max-w-[11.395625rem]"
518
518
  ?data-separate=${item.separate}
519
519
  >
520
- <div class="flex items-center justify-between gap-2">
521
- <h4 class="m-0 text-base font-semibold text-black">${item.label}</h4>
520
+ <div class="flex items-center justify-between gap-2 h-4.25">
521
+ <h4 class="m-0 min-w-0 truncate text-base leading-4.25 font-semibold text-black">${item.label}</h4>
522
522
  ${hasValue && this.clearFilterLabel ? html`
523
523
  <div class="w-17 h-4.25 shrink-0">
524
524
  <button
@@ -594,7 +594,7 @@ var AxebowButton = class AxebowButton extends LitElement {
594
594
  this._guardDisabledClick = (event) => {
595
595
  if (this.disabled || this.loading) {
596
596
  event.preventDefault();
597
- event.stopPropagation();
597
+ event.stopImmediatePropagation();
598
598
  }
599
599
  };
600
600
  this.addEventListener("click", this._guardDisabledClick, { capture: true });
@@ -1637,12 +1637,9 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
1637
1637
  this.onLogout = () => {};
1638
1638
  this.notificationsLabel = "";
1639
1639
  this.notifications = [];
1640
- this.actionNeededNotifications = [];
1641
1640
  this.myNotificationsTabLabel = "";
1642
- this.actionNeededTabLabel = "";
1643
1641
  this.noNotificationsLabel = "";
1644
1642
  this.noUnreadNotificationsLabel = "";
1645
- this.noActionNotificationsLabel = "";
1646
1643
  this.showUnreadOnlyLabel = "";
1647
1644
  this.onLabel = "";
1648
1645
  this.offLabel = "";
@@ -1710,10 +1707,9 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
1710
1707
  </div>
1711
1708
  <sl-tab-group class="bg-white rounded-md w-120 text-base">
1712
1709
  <sl-tab slot="nav" panel="my_notifications">${this.myNotificationsTabLabel}</sl-tab>
1713
- <sl-tab slot="nav" panel="action_needed">${this.actionNeededTabLabel}</sl-tab>
1714
1710
 
1715
1711
  <sl-tab-panel class="bg-gray-100" name="my_notifications">
1716
- <div class="flex flex-col gap-2 px-4 max-h-[40vh] overflow-auto w-full">
1712
+ <div class="flex flex-col gap-2 px-4 pb-4 max-h-[40vh] overflow-auto w-full">
1717
1713
  ${this.notifications.length === 0 ? this.renderEmptyState(this.noNotificationsLabel) : html`
1718
1714
  <div class="flex flex-col text-black gap-4">
1719
1715
  <div class="flex justify-between items-center flex-wrap gap-4">
@@ -1736,15 +1732,6 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
1736
1732
  `}
1737
1733
  </div>
1738
1734
  </sl-tab-panel>
1739
- <sl-tab-panel class="bg-gray-100" name="action_needed">
1740
- <div class="flex flex-col gap-2 px-4 max-h-[40vh] overflow-auto w-full">
1741
- ${this.actionNeededNotifications.length === 0 ? this.renderEmptyState(this.noActionNotificationsLabel) : html`
1742
- <div class="flex flex-col text-black gap-4">
1743
- ${this.actionNeededNotifications.map((item) => this.renderNotificationCard(item))}
1744
- </div>
1745
- `}
1746
- </div>
1747
- </sl-tab-panel>
1748
1735
  </sl-tab-group>
1749
1736
  </sl-dropdown>
1750
1737
  <sl-dropdown class="shrink-0">
@@ -1828,12 +1815,9 @@ __decorate([property({ type: String })], AxebowHeaderActions.prototype, "logoutL
1828
1815
  __decorate([property({ attribute: false })], AxebowHeaderActions.prototype, "onLogout", void 0);
1829
1816
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "notificationsLabel", void 0);
1830
1817
  __decorate([property({ type: Array })], AxebowHeaderActions.prototype, "notifications", void 0);
1831
- __decorate([property({ type: Array })], AxebowHeaderActions.prototype, "actionNeededNotifications", void 0);
1832
1818
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "myNotificationsTabLabel", void 0);
1833
- __decorate([property({ type: String })], AxebowHeaderActions.prototype, "actionNeededTabLabel", void 0);
1834
1819
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "noNotificationsLabel", void 0);
1835
1820
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "noUnreadNotificationsLabel", void 0);
1836
- __decorate([property({ type: String })], AxebowHeaderActions.prototype, "noActionNotificationsLabel", void 0);
1837
1821
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "showUnreadOnlyLabel", void 0);
1838
1822
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "onLabel", void 0);
1839
1823
  __decorate([property({ type: String })], AxebowHeaderActions.prototype, "offLabel", void 0);
@@ -1865,12 +1849,9 @@ var AxebowHeader = class AxebowHeader extends LitElement {
1865
1849
  this.onLogout = () => {};
1866
1850
  this.notificationsLabel = "";
1867
1851
  this.notifications = [];
1868
- this.actionNeededNotifications = [];
1869
1852
  this.myNotificationsTabLabel = "";
1870
- this.actionNeededTabLabel = "";
1871
1853
  this.noNotificationsLabel = "";
1872
1854
  this.noUnreadNotificationsLabel = "";
1873
- this.noActionNotificationsLabel = "";
1874
1855
  this.showUnreadOnlyLabel = "";
1875
1856
  this.onLabel = "";
1876
1857
  this.offLabel = "";
@@ -1918,12 +1899,9 @@ var AxebowHeader = class AxebowHeader extends LitElement {
1918
1899
  .onLogout=${this.onLogout}
1919
1900
  .notificationsLabel=${this.notificationsLabel}
1920
1901
  .notifications=${this.notifications}
1921
- .actionNeededNotifications=${this.actionNeededNotifications}
1922
1902
  .myNotificationsTabLabel=${this.myNotificationsTabLabel}
1923
- .actionNeededTabLabel=${this.actionNeededTabLabel}
1924
1903
  .noNotificationsLabel=${this.noNotificationsLabel}
1925
1904
  .noUnreadNotificationsLabel=${this.noUnreadNotificationsLabel}
1926
- .noActionNotificationsLabel=${this.noActionNotificationsLabel}
1927
1905
  .showUnreadOnlyLabel=${this.showUnreadOnlyLabel}
1928
1906
  .onLabel=${this.onLabel}
1929
1907
  .offLabel=${this.offLabel}
@@ -1957,12 +1935,9 @@ __decorate([property({ type: String })], AxebowHeader.prototype, "logoutLabel",
1957
1935
  __decorate([property({ attribute: false })], AxebowHeader.prototype, "onLogout", void 0);
1958
1936
  __decorate([property({ type: String })], AxebowHeader.prototype, "notificationsLabel", void 0);
1959
1937
  __decorate([property({ type: Array })], AxebowHeader.prototype, "notifications", void 0);
1960
- __decorate([property({ type: Array })], AxebowHeader.prototype, "actionNeededNotifications", void 0);
1961
1938
  __decorate([property({ type: String })], AxebowHeader.prototype, "myNotificationsTabLabel", void 0);
1962
- __decorate([property({ type: String })], AxebowHeader.prototype, "actionNeededTabLabel", void 0);
1963
1939
  __decorate([property({ type: String })], AxebowHeader.prototype, "noNotificationsLabel", void 0);
1964
1940
  __decorate([property({ type: String })], AxebowHeader.prototype, "noUnreadNotificationsLabel", void 0);
1965
- __decorate([property({ type: String })], AxebowHeader.prototype, "noActionNotificationsLabel", void 0);
1966
1941
  __decorate([property({ type: String })], AxebowHeader.prototype, "showUnreadOnlyLabel", void 0);
1967
1942
  __decorate([property({ type: String })], AxebowHeader.prototype, "onLabel", void 0);
1968
1943
  __decorate([property({ type: String })], AxebowHeader.prototype, "offLabel", void 0);
@@ -5897,6 +5872,35 @@ __decorate([property({ type: String })], AxebowMoreActions.prototype, "fixedHeig
5897
5872
  __decorate([state()], AxebowMoreActions.prototype, "_fixedPos", void 0);
5898
5873
  AxebowMoreActions = __decorate([customElement("axebow-more-actions")], AxebowMoreActions);
5899
5874
  //#endregion
5875
+ //#region src/components/axebow-badge/axebow-badge.ts
5876
+ var AxebowBadge = class AxebowBadge extends LitElement {
5877
+ constructor(..._args) {
5878
+ super(..._args);
5879
+ this.bgColor = "var(--axebow-base)";
5880
+ this.textColor = "var(--axebow-secondary)";
5881
+ }
5882
+ static {
5883
+ this.styles = [unsafeCSS(tailwind_default), css`
5884
+ :host {
5885
+ display: inline-block;
5886
+ }
5887
+ `];
5888
+ }
5889
+ render() {
5890
+ return html`
5891
+ <div
5892
+ class="inline-flex items-center justify-center h-4 box-border px-2 py-px rounded border border-solid text-xs leading-none font-semibold whitespace-nowrap"
5893
+ style="background-color: ${this.bgColor}; color: ${this.textColor}; border-color: ${this.textColor};"
5894
+ >
5895
+ <slot></slot>
5896
+ </div>
5897
+ `;
5898
+ }
5899
+ };
5900
+ __decorate([property({ type: String })], AxebowBadge.prototype, "bgColor", void 0);
5901
+ __decorate([property({ type: String })], AxebowBadge.prototype, "textColor", void 0);
5902
+ AxebowBadge = __decorate([customElement("axebow-badge")], AxebowBadge);
5903
+ //#endregion
5900
5904
  //#region src/components/cards/parts/axebow-card-cloud-logo.ts
5901
5905
  var AxebowCardCloudLogo = class AxebowCardCloudLogo extends LitElement {
5902
5906
  constructor(..._args) {
@@ -6088,6 +6092,7 @@ var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
6088
6092
  this.heading = "";
6089
6093
  this.items = [];
6090
6094
  this.color = "var(--axebow-primary)";
6095
+ this.boxSize = "";
6091
6096
  }
6092
6097
  static {
6093
6098
  this.styles = [unsafeCSS(tailwind_default), css`
@@ -6121,7 +6126,17 @@ var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
6121
6126
  ${this.items.map((item) => html`<li>${item}</li>`)}
6122
6127
  </ul>
6123
6128
  </div>
6124
- <axebow-icon iconName="info" class="cursor-pointer" iconColor=${this.color}></axebow-icon>
6129
+ ${this.boxSize ? html`<div
6130
+ class="flex items-center justify-center not-italic"
6131
+ style="width: ${this.boxSize}; height: ${this.boxSize};"
6132
+ >
6133
+ <axebow-icon
6134
+ iconName="info"
6135
+ size=${this.boxSize}
6136
+ class="cursor-pointer leading-none"
6137
+ iconColor=${this.color}
6138
+ ></axebow-icon>
6139
+ </div>` : html`<axebow-icon iconName="info" class="cursor-pointer" iconColor=${this.color}></axebow-icon>`}
6125
6140
  </axebow-tooltip>
6126
6141
  `;
6127
6142
  }
@@ -6129,6 +6144,7 @@ var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
6129
6144
  __decorate([property({ type: String })], AxebowRoleTooltip.prototype, "heading", void 0);
6130
6145
  __decorate([property({ type: Array })], AxebowRoleTooltip.prototype, "items", void 0);
6131
6146
  __decorate([property({ type: String })], AxebowRoleTooltip.prototype, "color", void 0);
6147
+ __decorate([property({ type: String })], AxebowRoleTooltip.prototype, "boxSize", void 0);
6132
6148
  AxebowRoleTooltip = __decorate([customElement("axebow-role-tooltip")], AxebowRoleTooltip);
6133
6149
  //#endregion
6134
6150
  //#region src/components/cards/parts/axebow-card-header.ts
@@ -6276,14 +6292,32 @@ var AxebowCardStatItem = class AxebowCardStatItem extends LitElement {
6276
6292
  this.title = "";
6277
6293
  this.label = "";
6278
6294
  this.active = true;
6295
+ this.ctaCount = 0;
6296
+ this.ctaIconName = "info";
6297
+ this.ctaIconColor = "var(--axebow-error)";
6298
+ this.tall = false;
6279
6299
  }
6280
6300
  static {
6281
6301
  this.styles = [unsafeCSS(tailwind_default), css`:host { display: block; }`];
6282
6302
  }
6283
6303
  render() {
6284
6304
  return html`
6285
- <div class="flex flex-col items-center justify-center text-center w-30">
6286
- <h4 class="text-[18px] leading-none text-(--axebow-primary) font-bold m-0 whitespace-nowrap">${this.value}</h4>
6305
+ <div class="flex flex-col items-start justify-center text-left w-23.5 ${this.tall ? "h-17.75" : "h-11.5"}">
6306
+ <div class="flex items-center gap-1">
6307
+ <h4 class="text-[18px] leading-none text-(--axebow-primary) font-bold m-0 whitespace-nowrap">${this.value}</h4>
6308
+ ${this.ctaCount > 0 ? html`
6309
+ <span
6310
+ class="flex items-center gap-0.5 cursor-pointer"
6311
+ style="color: ${this.ctaIconColor};"
6312
+ @click=${this._onCtaClick}
6313
+ >
6314
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center">
6315
+ <axebow-icon iconName=${this.ctaIconName} iconColor=${this.ctaIconColor} size="md"></axebow-icon>
6316
+ </div>
6317
+ <span class="text-base font-semibold leading-none whitespace-nowrap">${this.ctaCount}</span>
6318
+ </span>
6319
+ ` : ""}
6320
+ </div>
6287
6321
  <p class="mt-2 text-base leading-none m-0 whitespace-nowrap">${this.title}</p>
6288
6322
  <div class="mt-1.75 h-3.5 leading-none">
6289
6323
  ${this.label ? html`
@@ -6302,11 +6336,21 @@ var AxebowCardStatItem = class AxebowCardStatItem extends LitElement {
6302
6336
  composed: true
6303
6337
  }));
6304
6338
  }
6339
+ _onCtaClick() {
6340
+ this.dispatchEvent(new CustomEvent("cta-click", {
6341
+ bubbles: true,
6342
+ composed: true
6343
+ }));
6344
+ }
6305
6345
  };
6306
6346
  __decorate([property({ type: Number })], AxebowCardStatItem.prototype, "value", void 0);
6307
6347
  __decorate([property({ type: String })], AxebowCardStatItem.prototype, "title", void 0);
6308
6348
  __decorate([property({ type: String })], AxebowCardStatItem.prototype, "label", void 0);
6309
6349
  __decorate([property({ type: Boolean })], AxebowCardStatItem.prototype, "active", void 0);
6350
+ __decorate([property({ type: Number })], AxebowCardStatItem.prototype, "ctaCount", void 0);
6351
+ __decorate([property({ type: String })], AxebowCardStatItem.prototype, "ctaIconName", void 0);
6352
+ __decorate([property({ type: String })], AxebowCardStatItem.prototype, "ctaIconColor", void 0);
6353
+ __decorate([property({ type: Boolean })], AxebowCardStatItem.prototype, "tall", void 0);
6310
6354
  AxebowCardStatItem = __decorate([customElement("axebow-card-stat-item")], AxebowCardStatItem);
6311
6355
  //#endregion
6312
6356
  //#region src/components/cards/parts/axebow-card-stats-row.ts
@@ -6319,21 +6363,29 @@ var AxebowCardStatsRow = class AxebowCardStatsRow extends LitElement {
6319
6363
  static {
6320
6364
  this.styles = [unsafeCSS(tailwind_default), css`:host { display: block; }`];
6321
6365
  }
6322
- _hasButtons() {
6323
- return this.cardType === "account" || this.cardType === "environment" || this.cardType === "tenant";
6324
- }
6325
6366
  render() {
6367
+ const isEnvironment = this.cardType === "environment";
6368
+ const firstGap = isEnvironment ? "mr-6" : "mr-4";
6369
+ const secondGap = isEnvironment ? "mr-7" : "mr-10";
6326
6370
  return html`
6327
- <div class="grid grid-cols-[7.5rem_7.5rem_7.5rem] items-center gap-0.5 w-91 ${this._hasButtons() ? "h-17.75" : "h-11.25"} box-border">
6328
- ${this.stats.map((stat, index) => html`
6371
+ <div class="flex flex-row items-center mx-2 box-border">
6372
+ ${this.stats.map((stat, index) => {
6373
+ return html`
6329
6374
  <axebow-card-stat-item
6375
+ class=${index === 0 && this.stats.length > 1 ? firstGap : index === 1 && this.stats.length > 2 ? secondGap : ""}
6376
+ .tall=${index === 0}
6330
6377
  .value=${stat.value}
6331
6378
  .title=${stat.title}
6332
6379
  .label=${stat.label}
6333
6380
  .active=${stat.active !== false}
6381
+ .ctaCount=${stat.ctaCount ?? 0}
6382
+ .ctaIconName=${stat.ctaIconName ?? "info"}
6383
+ .ctaIconColor=${stat.ctaIconColor ?? "var(--axebow-error)"}
6334
6384
  @label-click=${() => this._handleLabelClick(index)}
6385
+ @cta-click=${() => this._handleCtaClick(index)}
6335
6386
  ></axebow-card-stat-item>
6336
- `)}
6387
+ `;
6388
+ })}
6337
6389
  </div>
6338
6390
  `;
6339
6391
  }
@@ -6344,6 +6396,13 @@ var AxebowCardStatsRow = class AxebowCardStatsRow extends LitElement {
6344
6396
  composed: true
6345
6397
  }));
6346
6398
  }
6399
+ _handleCtaClick(index) {
6400
+ this.dispatchEvent(new CustomEvent("stat-cta-click", {
6401
+ detail: { index },
6402
+ bubbles: true,
6403
+ composed: true
6404
+ }));
6405
+ }
6347
6406
  };
6348
6407
  __decorate([property({ type: Array })], AxebowCardStatsRow.prototype, "stats", void 0);
6349
6408
  __decorate([property({ type: String })], AxebowCardStatsRow.prototype, "cardType", void 0);
@@ -6745,6 +6804,9 @@ var AxebowCardStatus = class AxebowCardStatus extends LitElement {
6745
6804
  this.statusMessage = "";
6746
6805
  this.borderColor = "";
6747
6806
  this.showSpinner = false;
6807
+ this.ctaText = "";
6808
+ this.ctaIconName = "info";
6809
+ this.ctaIconColor = "var(--axebow-error)";
6748
6810
  }
6749
6811
  static {
6750
6812
  this.styles = [unsafeCSS(tailwind_default), css`
@@ -6754,22 +6816,54 @@ var AxebowCardStatus = class AxebowCardStatus extends LitElement {
6754
6816
  `];
6755
6817
  }
6756
6818
  render() {
6819
+ if (this.ctaText) return html`
6820
+ <div
6821
+ class="flex items-center gap-1 min-w-0 w-full text-base whitespace-nowrap cursor-pointer"
6822
+ style="color: ${this.ctaIconColor};"
6823
+ role="button"
6824
+ tabindex="0"
6825
+ @click=${this._onCtaClick}
6826
+ @keydown=${this._onCtaKeydown}
6827
+ >
6828
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center">
6829
+ <axebow-icon iconName=${this.ctaIconName} iconColor=${this.ctaIconColor} size="md"></axebow-icon>
6830
+ </div>
6831
+ <p class="m-0 truncate">${this.ctaText}</p>
6832
+ </div>
6833
+ `;
6757
6834
  if (!this.statusCode) return html`<div class="w-full whitespace-nowrap overflow-hidden text-ellipsis"><slot></slot></div>`;
6758
6835
  return html`
6759
6836
  <div class="flex items-center gap-1 min-w-0 w-full">
6760
- ${this.showSpinner ? html`<sl-spinner style="--indicator-color:${this.borderColor};"></sl-spinner>` : ""}
6761
- <p class="font-bold m-0 line-clamp-1" style="color:${this.borderColor};" title=${this.statusCode}>${this.statusCode}</p>
6762
6837
  <axebow-tooltip content=${this.statusMessage}>
6763
- <axebow-icon class="cursor-pointer shrink-0" iconColor=${this.borderColor} iconName="info" size="md"></axebow-icon>
6838
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center">
6839
+ <axebow-icon class="cursor-pointer" iconColor=${this.borderColor} iconName="info" size="md"></axebow-icon>
6840
+ </div>
6764
6841
  </axebow-tooltip>
6842
+ <p class="font-bold m-0 line-clamp-1" style="color:${this.borderColor};" title=${this.statusCode}>${this.statusCode}</p>
6843
+ ${this.showSpinner ? html`<sl-spinner style="--indicator-color:${this.borderColor};"></sl-spinner>` : ""}
6765
6844
  </div>
6766
6845
  `;
6767
6846
  }
6847
+ _onCtaClick() {
6848
+ this.dispatchEvent(new CustomEvent("cta-click", {
6849
+ bubbles: true,
6850
+ composed: true
6851
+ }));
6852
+ }
6853
+ _onCtaKeydown(e) {
6854
+ if (e.key === "Enter" || e.key === " ") {
6855
+ e.preventDefault();
6856
+ this._onCtaClick();
6857
+ }
6858
+ }
6768
6859
  };
6769
6860
  __decorate([property({ type: String })], AxebowCardStatus.prototype, "statusCode", void 0);
6770
6861
  __decorate([property({ type: String })], AxebowCardStatus.prototype, "statusMessage", void 0);
6771
6862
  __decorate([property({ type: String })], AxebowCardStatus.prototype, "borderColor", void 0);
6772
6863
  __decorate([property({ type: Boolean })], AxebowCardStatus.prototype, "showSpinner", void 0);
6864
+ __decorate([property({ type: String })], AxebowCardStatus.prototype, "ctaText", void 0);
6865
+ __decorate([property({ type: String })], AxebowCardStatus.prototype, "ctaIconName", void 0);
6866
+ __decorate([property({ type: String })], AxebowCardStatus.prototype, "ctaIconColor", void 0);
6773
6867
  AxebowCardStatus = __decorate([customElement("axebow-card-status")], AxebowCardStatus);
6774
6868
  //#endregion
6775
6869
  //#region src/components/cards/parts/axebow-card-footer.ts
@@ -6787,6 +6881,9 @@ var AxebowCardFooter = class AxebowCardFooter extends LitElement {
6787
6881
  this.closeLabel = "Close";
6788
6882
  this.moreActionsLabel = "More";
6789
6883
  this.actionLabel = "";
6884
+ this.ctaText = "";
6885
+ this.ctaIconName = "info";
6886
+ this.ctaIconColor = "var(--axebow-error)";
6790
6887
  }
6791
6888
  static {
6792
6889
  this.styles = [unsafeCSS(tailwind_default), css`:host { display: block; }`];
@@ -6801,12 +6898,16 @@ var AxebowCardFooter = class AxebowCardFooter extends LitElement {
6801
6898
  .statusMessage=${this.statusMessage}
6802
6899
  .borderColor=${this.borderColor}
6803
6900
  .showSpinner=${this.showSpinner}
6901
+ .ctaText=${this.ctaText}
6902
+ .ctaIconName=${this.ctaIconName}
6903
+ .ctaIconColor=${this.ctaIconColor}
6804
6904
  >
6805
6905
  <slot></slot>
6806
6906
  </axebow-card-status>
6807
6907
  ${showDropdown ? html`
6808
6908
  <axebow-more-actions
6809
6909
  class="w-27.5 h-8 shrink-0"
6910
+ fixedHeight="2rem"
6810
6911
  placement="top"
6811
6912
  .open=${this.moreActionsOpen}
6812
6913
  .options=${this.moreActionsOptions}
@@ -6853,6 +6954,9 @@ __decorate([property({ type: Array })], AxebowCardFooter.prototype, "moreActions
6853
6954
  __decorate([property({ type: String })], AxebowCardFooter.prototype, "closeLabel", void 0);
6854
6955
  __decorate([property({ type: String })], AxebowCardFooter.prototype, "moreActionsLabel", void 0);
6855
6956
  __decorate([property({ type: String })], AxebowCardFooter.prototype, "actionLabel", void 0);
6957
+ __decorate([property({ type: String })], AxebowCardFooter.prototype, "ctaText", void 0);
6958
+ __decorate([property({ type: String })], AxebowCardFooter.prototype, "ctaIconName", void 0);
6959
+ __decorate([property({ type: String })], AxebowCardFooter.prototype, "ctaIconColor", void 0);
6856
6960
  AxebowCardFooter = __decorate([customElement("axebow-card-footer")], AxebowCardFooter);
6857
6961
  //#endregion
6858
6962
  //#region src/components/cards/axebow-base-card.ts
@@ -6893,6 +6997,12 @@ var AxebowBaseCard = class AxebowBaseCard extends LitElement {
6893
6997
  this.statusCode = "";
6894
6998
  this.statusMessage = "";
6895
6999
  this.serviceDetailLabel = "Service detail";
7000
+ this.ctaText = "";
7001
+ this.ctaIconName = "info";
7002
+ this.ctaIconColor = "var(--axebow-error)";
7003
+ this.ctaBadgeLabel = "";
7004
+ this.ctaBadgeBgColor = "var(--axebow-base)";
7005
+ this.ctaBadgeTextColor = "var(--axebow-secondary)";
6896
7006
  this.showActionBanner = false;
6897
7007
  this.showWarningBanner = false;
6898
7008
  this.manageLabel = "Manage";
@@ -6981,9 +7091,9 @@ var AxebowBaseCard = class AxebowBaseCard extends LitElement {
6981
7091
 
6982
7092
  <div class="w-full flex flex-col gap-2">
6983
7093
  ${isRuntime ? html`
6984
- <div class="flex flex-row justify-between items-center h-6.75 overflow-hidden">
7094
+ <div class="flex flex-row justify-between items-center h-6.75 overflow-hidden px-2 py-[0.71875rem]">
6985
7095
  <span class="deploy-time text-(--axebow-black) pl-2"><slot name="time-elapsed"></slot></span>
6986
- ${this.isDeployed ? html`<div class="pr-2"><span class="inline-flex items-center justify-center w-15.5 h-4 box-border border border-[#0ECD9A80] text-(--axebow-success) bg-[#F3FDFA] rounded whitespace-nowrap text-xs">${this.deployedLabel}</span></div>` : ""}
7096
+ ${this.ctaBadgeLabel ? html`<axebow-badge bgColor=${this.ctaBadgeBgColor} textColor=${this.ctaBadgeTextColor}>${this.ctaBadgeLabel}</axebow-badge>` : this.isDeployed ? html`<div class="pr-2"><span class="inline-flex items-center justify-center w-15.5 h-4 box-border border border-[#0ECD9A80] text-(--axebow-success) bg-[#F3FDFA] rounded whitespace-nowrap text-xs">${this.deployedLabel}</span></div>` : ""}
6987
7097
  </div>
6988
7098
  ` : html`
6989
7099
  <axebow-card-stats-row
@@ -6993,6 +7103,11 @@ var AxebowBaseCard = class AxebowBaseCard extends LitElement {
6993
7103
  detail: e.detail,
6994
7104
  bubbles: true,
6995
7105
  composed: true
7106
+ }))}
7107
+ @stat-cta-click=${(e) => !this.isDeleting && this.dispatchEvent(new CustomEvent("stat-cta-click", {
7108
+ detail: e.detail,
7109
+ bubbles: true,
7110
+ composed: true
6996
7111
  }))}
6997
7112
  ></axebow-card-stats-row>
6998
7113
  `}
@@ -7088,6 +7203,9 @@ var AxebowBaseCard = class AxebowBaseCard extends LitElement {
7088
7203
  .closeLabel=${this.closeLabel}
7089
7204
  .moreActionsLabel=${this.moreActionsLabel}
7090
7205
  .actionLabel=${isRuntime ? this.serviceDetailLabel : ""}
7206
+ .ctaText=${this.ctaText}
7207
+ .ctaIconName=${this.ctaIconName}
7208
+ .ctaIconColor=${this.ctaIconColor}
7091
7209
  @more-actions-toggled=${(e) => this.dispatchEvent(new CustomEvent("more-actions-toggled", {
7092
7210
  detail: e.detail,
7093
7211
  bubbles: true,
@@ -7140,6 +7258,12 @@ __decorate([property({ type: String })], AxebowBaseCard.prototype, "borderColor"
7140
7258
  __decorate([property({ type: String })], AxebowBaseCard.prototype, "statusCode", void 0);
7141
7259
  __decorate([property({ type: String })], AxebowBaseCard.prototype, "statusMessage", void 0);
7142
7260
  __decorate([property({ type: String })], AxebowBaseCard.prototype, "serviceDetailLabel", void 0);
7261
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaText", void 0);
7262
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaIconName", void 0);
7263
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaIconColor", void 0);
7264
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaBadgeLabel", void 0);
7265
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaBadgeBgColor", void 0);
7266
+ __decorate([property({ type: String })], AxebowBaseCard.prototype, "ctaBadgeTextColor", void 0);
7143
7267
  __decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "showActionBanner", void 0);
7144
7268
  __decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "showWarningBanner", void 0);
7145
7269
  __decorate([property({ type: String })], AxebowBaseCard.prototype, "manageLabel", void 0);
@@ -7374,7 +7498,7 @@ var AxebowDraggableService = class AxebowDraggableService extends LitElement {
7374
7498
  <axebow-icon class="w-4.5 h-4.5 shrink-0" iconName="drag_indicator" iconColor="var(--axebow-gray)"></axebow-icon>
7375
7499
  <div class="flex flex-col gap-1 min-w-0 flex-1">
7376
7500
  <div class="h-4.25 flex items-center gap-1 min-w-0">
7377
- <h1 class="w-27 h-4.25 leading-4.25 truncate m-0 text-base font-semibold text-(--axebow-black)">
7501
+ <h1 class="w-27 h-4.25 leading-4.25 truncate m-0 text-base font-semibold text-(--axebow-primary)">
7378
7502
  ${this.serviceName}
7379
7503
  </h1>
7380
7504
  ${this.showVersionSelector ? html`<div class="flex-1 min-w-0 flex justify-end">
@@ -7419,6 +7543,7 @@ var AxebowServicesPanel = class AxebowServicesPanel extends LitElement {
7419
7543
  :host {
7420
7544
  display: block;
7421
7545
  flex-shrink: 0;
7546
+ height: 100%;
7422
7547
  }
7423
7548
  `
7424
7549
  ];
@@ -7433,7 +7558,7 @@ var AxebowServicesPanel = class AxebowServicesPanel extends LitElement {
7433
7558
  </div>
7434
7559
  `;
7435
7560
  return html`
7436
- <div class="flex items-start">
7561
+ <div class="flex items-start h-full">
7437
7562
  ${this._renderCard()}
7438
7563
  <div
7439
7564
  class="w-4.25 h-4.5 mt-2.25 pl-px flex items-center justify-center border border-l-0 border-solid border-(--axebow-tertiary) hover:border-(--axebow-gray) transition-colors duration-200 rounded cursor-pointer bg-(--axebow-tertiary)/15"
@@ -7446,10 +7571,10 @@ var AxebowServicesPanel = class AxebowServicesPanel extends LitElement {
7446
7571
  }
7447
7572
  _renderCard() {
7448
7573
  return html`
7449
- <div class="flex flex-col gap-2 w-60.5 shrink-0">
7574
+ <div class="flex flex-col gap-2 w-60.5 shrink-0 h-full">
7450
7575
  <div class="h-full bg-white rounded-md axebow-shadow p-2 box-border">
7451
7576
  <div class="flex justify-between items-center gap-4">
7452
- <h1 class="font-semibold text-base text-(--axebow-secondary) uppercase px-1">${this.title}</h1>
7577
+ <h1 class="text-base text-(--axebow-secondary) uppercase">${this.title}</h1>
7453
7578
  </div>
7454
7579
  <div class="w-full h-px bg-(--axebow-light-gray)/80"></div>
7455
7580
  <axebow-search
@@ -7461,7 +7586,7 @@ var AxebowServicesPanel = class AxebowServicesPanel extends LitElement {
7461
7586
  ></axebow-search>
7462
7587
  <div class="w-full h-px bg-(--axebow-light-gray)/80 my-1.5"></div>
7463
7588
  <p class="text-base text-center text-(--axebow-secondary) px-2">${this.dragDropText}</p>
7464
- <div class="w-full h-px bg-(--axebow-light-gray)/80"></div>
7589
+ <div class="w-full h-px bg-(--axebow-light-gray)/80 my-1.5"></div>
7465
7590
  ${this._renderServicesList()}
7466
7591
  </div>
7467
7592
  </div>
@@ -7784,28 +7909,28 @@ var AxebowHelpBubble = class AxebowHelpBubble extends LitElement {
7784
7909
  @mouseleave=${() => this._isOpen = false}
7785
7910
  >
7786
7911
  ${this._isOpen ? html`
7787
- <div class="flex flex-col bg-white rounded-md axebow-shadow overflow-hidden min-w-[8.2rem]">
7788
- <div class="flex justify-center px-3 py-1">
7789
- <div class="flex flex-col">
7790
- ${this.options.map((option) => html`
7791
- <div
7792
- class="flex items-center gap-2 px-3 py-1 my-0.5 rounded-md cursor-pointer hover:bg-[var(--axebow-anti-flash-white)] transition-colors"
7793
- @click=${() => this._openLink(option.url)}
7794
- >
7795
- <span class="text-sm font-semibold text-(--axebow-primary) whitespace-nowrap"
7796
- >${option.label}</span
7797
- >
7798
- <axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="base"></axebow-icon>
7799
- </div>
7800
- `)}
7801
- </div>
7802
- </div>
7912
+ <div
7913
+ class="flex flex-col items-center gap-0.75 box-border w-[6.1875rem] p-2 bg-white rounded-md axebow-shadow overflow-hidden"
7914
+ >
7915
+ ${this.options.map((option) => html`
7916
+ <div
7917
+ class="flex items-center gap-2 px-2 w-22 h-8 shrink-0 box-border rounded-md cursor-pointer hover:bg-[var(--axebow-anti-flash-white)] transition-colors"
7918
+ @click=${() => this._openLink(option.url)}
7919
+ >
7920
+ <span class="text-sm font-semibold text-(--axebow-primary) whitespace-nowrap"
7921
+ >${option.label}</span
7922
+ >
7923
+ <axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="base"></axebow-icon>
7924
+ </div>
7925
+ `)}
7803
7926
  </div>
7804
7927
  ` : ""}
7805
7928
  <div
7806
- class="w-12 h-12 rounded-full flex items-center justify-center cursor-pointer shadow-lg transition-colors duration-200 self-end ${this._isOpen ? "bg-(--axebow-gray)" : "bg-(--axebow-tertiary)"}"
7929
+ class="w-11 h-11 rounded-full flex items-center justify-center cursor-pointer shadow-lg transition-colors duration-200 self-end ${this._isOpen ? "bg-(--axebow-gray)" : "bg-(--axebow-tertiary)"}"
7807
7930
  >
7808
- <axebow-icon iconName="contact_support" iconColor="white" size="xl"></axebow-icon>
7931
+ <div class="w-[1.725rem] h-[1.725rem] shrink-0 flex items-center justify-center leading-none">
7932
+ <axebow-icon iconName="contact_support" iconColor="white" size="1.725rem"></axebow-icon>
7933
+ </div>
7809
7934
  </div>
7810
7935
  </div>
7811
7936
  `;
@@ -8732,9 +8857,18 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
8732
8857
  }
8733
8858
  _toggle(id) {
8734
8859
  const next = new Set(this._expanded);
8735
- if (next.has(id)) next.delete(id);
8736
- else next.add(id);
8860
+ const willExpand = !next.has(id);
8861
+ if (willExpand) next.add(id);
8862
+ else next.delete(id);
8737
8863
  this._expanded = next;
8864
+ this.dispatchEvent(new CustomEvent("row-toggle", {
8865
+ detail: {
8866
+ id,
8867
+ expanded: willExpand
8868
+ },
8869
+ bubbles: true,
8870
+ composed: true
8871
+ }));
8738
8872
  }
8739
8873
  get _activeLabels() {
8740
8874
  const title = this.labels?.rowTitle ?? this.labels?.accountsEnv ?? DEFAULT_LABELS.rowTitle;
@@ -8808,13 +8942,21 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
8808
8942
  }
8809
8943
  _renderStatusIcon(icon) {
8810
8944
  if (!icon) return "";
8811
- const iconEl = icon.spinner ? html`<sl-spinner style="font-size: 0.85rem; --indicator-color: var(--axebow-tertiary);"></sl-spinner>` : html`<axebow-icon
8812
- iconName=${icon.iconName}
8813
- iconColor=${icon.iconColor}
8814
- size="md"
8815
- class="cursor-pointer shrink-0"
8816
- ></axebow-icon>`;
8817
- return icon.tooltip ? html`<axebow-tooltip content=${icon.tooltip}>${iconEl}</axebow-tooltip>` : iconEl;
8945
+ const content = html`
8946
+ <div
8947
+ class="flex items-center gap-1 shrink-0 cursor-pointer"
8948
+ @click=${icon.onClick ? (e) => {
8949
+ e.stopPropagation();
8950
+ icon.onClick();
8951
+ } : null}
8952
+ >
8953
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center">
8954
+ ${icon.spinner ? html`<sl-spinner style="font-size: 0.85rem; --indicator-color: var(--axebow-tertiary);"></sl-spinner>` : html`<axebow-icon iconName=${icon.iconName} iconColor=${icon.iconColor} size="md"></axebow-icon>`}
8955
+ </div>
8956
+ ${icon.label ? html`<span class="text-sm font-semibold" style="color: ${icon.iconColor};">: ${icon.label}</span>` : ""}
8957
+ </div>
8958
+ `;
8959
+ return icon.tooltip ? html`<axebow-tooltip content=${icon.tooltip}>${content}</axebow-tooltip>` : content;
8818
8960
  }
8819
8961
  _renderTableRow(row, index) {
8820
8962
  const children = row.subRows ?? row.environments;
@@ -8843,6 +8985,7 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
8843
8985
  <div class="w-38 min-w-0 h-[2.125rem] flex items-center">
8844
8986
  <span class="line-clamp-2 wrap-break-word leading-[1.0625rem]">${row.name}</span>
8845
8987
  </div>
8988
+ ${this._renderStatusIcon(row.ctaIcon)}
8846
8989
  ${this._renderStatusIcon(row.statusIcon)}
8847
8990
  <span class="flex-1"></span>
8848
8991
  ${this._renderStatusIcon(row.warningIcon)}
@@ -8902,6 +9045,7 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
8902
9045
  <div class="w-44 min-w-0 h-[2.125rem] flex items-center">
8903
9046
  <span class="font-normal text-gray-700 line-clamp-2 wrap-break-word leading-[1.0625rem]">${subRow.name}</span>
8904
9047
  </div>
9048
+ ${this._renderStatusIcon(subRow.ctaIcon)}
8905
9049
  <span class="flex-1"></span>
8906
9050
  ${this._renderStatusIcon(subRow.warningIcon)}
8907
9051
  </div>
@@ -8924,7 +9068,10 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
8924
9068
  fixedWidth="9.9375rem"
8925
9069
  fixedHeight="2rem"
8926
9070
  ?disabled=${actionBtnDisabled}
8927
- @click=${() => onActionBtn?.()}
9071
+ @click=${() => {
9072
+ if (actionBtnDisabled) return;
9073
+ onActionBtn?.();
9074
+ }}
8928
9075
  >
8929
9076
  ${actionBtnLabel}
8930
9077
  </axebow-button>` : ""}
@@ -9288,6 +9435,116 @@ __decorate([property({ type: String })], AxebowServiceDetailHeader.prototype, "a
9288
9435
  __decorate([property({ type: String })], AxebowServiceDetailHeader.prototype, "deployLabel", void 0);
9289
9436
  AxebowServiceDetailHeader = __decorate([customElement("axebow-service-detail-header")], AxebowServiceDetailHeader);
9290
9437
  //#endregion
9438
+ //#region src/components/axebow-call-to-action-row/axebow-call-to-action-row.ts
9439
+ var CRITICALITY_STYLES = {
9440
+ critical: {
9441
+ bg: "var(--axebow-critical-bg)",
9442
+ color: "var(--axebow-error)",
9443
+ iconName: "error"
9444
+ },
9445
+ high: {
9446
+ bg: "var(--axebow-high-bg)",
9447
+ color: "var(--axebow-dark-yellow)",
9448
+ iconName: "warning"
9449
+ },
9450
+ low: {
9451
+ bg: "var(--axebow-base)",
9452
+ color: "var(--axebow-secondary)",
9453
+ iconName: "info"
9454
+ }
9455
+ };
9456
+ var AxebowCallToActionRow = class AxebowCallToActionRow extends LitElement {
9457
+ constructor(..._args) {
9458
+ super(..._args);
9459
+ this.criticality = "low";
9460
+ this.heading = "";
9461
+ this.badgeLabel = "";
9462
+ this.description = "";
9463
+ this.buttons = [];
9464
+ this.lowNoteText = "";
9465
+ this.count = 1;
9466
+ }
9467
+ static {
9468
+ this.styles = [
9469
+ unsafeCSS(tailwind_default),
9470
+ axebowTheme,
9471
+ css`
9472
+ :host {
9473
+ display: block;
9474
+ width: 100%;
9475
+ }
9476
+ `
9477
+ ];
9478
+ }
9479
+ render() {
9480
+ const { bg, color, iconName } = CRITICALITY_STYLES[this.criticality] ?? CRITICALITY_STYLES.low;
9481
+ return html`
9482
+ <div class="w-full box-border border-t border-solid border-(--axebow-table-header-border) bg-white p-4 flex flex-row items-center gap-4">
9483
+ <div class="w-10 h-10 rounded-md shrink-0 flex items-center justify-center" style="background-color: ${bg};">
9484
+ <div class="w-6 h-6 flex items-center justify-center">
9485
+ <axebow-icon iconName=${iconName} iconColor=${color} size="2xl"></axebow-icon>
9486
+ </div>
9487
+ </div>
9488
+
9489
+ <div class="flex-1 min-w-0 flex flex-col gap-1">
9490
+ <div class="w-full flex flex-row items-center gap-2">
9491
+ <span class="text-base font-semibold truncate">${this.heading}</span>
9492
+ ${this.badgeLabel ? html`<axebow-badge bgColor=${bg} textColor=${color}>${this.badgeLabel}</axebow-badge>` : ""}
9493
+ ${this.count > 1 ? html`<div
9494
+ class="w-5 h-5 shrink-0 rounded-full flex items-center justify-center text-sm font-semibold"
9495
+ style="background-color: ${bg}; color: ${color};"
9496
+ >
9497
+ ${this.count}
9498
+ </div>` : ""}
9499
+ </div>
9500
+ <div class="w-full text-(--axebow-gray)">${this.description}</div>
9501
+ </div>
9502
+
9503
+ ${this.criticality === "low" ? this._renderLowNote() : this._renderButtons()}
9504
+ </div>
9505
+ `;
9506
+ }
9507
+ _renderLowNote() {
9508
+ return html`
9509
+ <div
9510
+ class="w-91 h-11 shrink-0 box-border rounded-md py-1 px-3 flex items-center text-(--axebow-gray)"
9511
+ style="background-color: var(--axebow-base);"
9512
+ >
9513
+ ${this.lowNoteText}
9514
+ </div>
9515
+ `;
9516
+ }
9517
+ _renderButtons() {
9518
+ if (!this.buttons.length) return "";
9519
+ return html`
9520
+ <div class="flex flex-row items-center gap-4 shrink-0">
9521
+ ${this.buttons.map((button) => html`
9522
+ <axebow-button
9523
+ variant=${button.variant ?? "primary"}
9524
+ ?outline=${button.outline ?? false}
9525
+ @click=${() => button.onClick?.()}
9526
+ >
9527
+ ${button.label}
9528
+ ${button.iconName ? html`<axebow-icon
9529
+ slot="suffix"
9530
+ iconName=${button.iconName}
9531
+ iconColor=${button.iconColor ?? "currentColor"}
9532
+ ></axebow-icon>` : ""}
9533
+ </axebow-button>
9534
+ `)}
9535
+ </div>
9536
+ `;
9537
+ }
9538
+ };
9539
+ __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "criticality", void 0);
9540
+ __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "heading", void 0);
9541
+ __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "badgeLabel", void 0);
9542
+ __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "description", void 0);
9543
+ __decorate([property({ type: Array })], AxebowCallToActionRow.prototype, "buttons", void 0);
9544
+ __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "lowNoteText", void 0);
9545
+ __decorate([property({ type: Number })], AxebowCallToActionRow.prototype, "count", void 0);
9546
+ AxebowCallToActionRow = __decorate([customElement("axebow-call-to-action-row")], AxebowCallToActionRow);
9547
+ //#endregion
9291
9548
  //#region src/components/axebow-tenant-card/axebow-tenant-card.ts
9292
9549
  var AxebowTenantCard = class AxebowTenantCard extends LitElement {
9293
9550
  constructor(..._args) {
@@ -9310,6 +9567,9 @@ var AxebowTenantCard = class AxebowTenantCard extends LitElement {
9310
9567
  this.invitedNoticeText = "";
9311
9568
  this.showNoAccountsWarning = false;
9312
9569
  this.noAccountsWarningText = "";
9570
+ this.showCallToActionIssues = false;
9571
+ this.callToActionIssuesText = "";
9572
+ this.callToActionCriticality = "low";
9313
9573
  this.contentState = "table";
9314
9574
  this.invitationText = "";
9315
9575
  this.emptyTextPrefix = "";
@@ -9447,10 +9707,23 @@ var AxebowTenantCard = class AxebowTenantCard extends LitElement {
9447
9707
  </span>
9448
9708
  `)}
9449
9709
  </div>
9450
- ${this.showInvitedNotice ? html`<span class="text-base text-black">${this.invitedNoticeText}</span>` : this.showNoAccountsWarning ? html`<span class="flex items-center gap-1 text-base text-black">
9451
- <axebow-icon iconName="warning" iconColor="var(--axebow-warning)" size="md"></axebow-icon>
9452
- ${this.noAccountsWarningText}
9453
- </span>` : ""}
9710
+ ${this.showInvitedNotice ? html`<span class="text-base text-black">${this.invitedNoticeText}</span>` : this.showCallToActionIssues ? html`<span
9711
+ class="flex items-center gap-1 text-base cursor-pointer"
9712
+ style="color: ${CRITICALITY_STYLES[this.callToActionCriticality].color};"
9713
+ @click=${() => this.onCallToActionClick?.()}
9714
+ >
9715
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center">
9716
+ <axebow-icon
9717
+ iconName=${CRITICALITY_STYLES[this.callToActionCriticality].iconName}
9718
+ iconColor=${CRITICALITY_STYLES[this.callToActionCriticality].color}
9719
+ size="md"
9720
+ ></axebow-icon>
9721
+ </div>
9722
+ ${this.callToActionIssuesText}
9723
+ </span>` : this.showNoAccountsWarning ? html`<span class="flex items-center gap-1 text-base text-black">
9724
+ <axebow-icon iconName="warning" iconColor="var(--axebow-warning)" size="md"></axebow-icon>
9725
+ ${this.noAccountsWarningText}
9726
+ </span>` : ""}
9454
9727
  </div>
9455
9728
 
9456
9729
  <div class="w-full">
@@ -9483,6 +9756,10 @@ __decorate([property({ type: Boolean })], AxebowTenantCard.prototype, "showInvit
9483
9756
  __decorate([property({ type: String })], AxebowTenantCard.prototype, "invitedNoticeText", void 0);
9484
9757
  __decorate([property({ type: Boolean })], AxebowTenantCard.prototype, "showNoAccountsWarning", void 0);
9485
9758
  __decorate([property({ type: String })], AxebowTenantCard.prototype, "noAccountsWarningText", void 0);
9759
+ __decorate([property({ type: Boolean })], AxebowTenantCard.prototype, "showCallToActionIssues", void 0);
9760
+ __decorate([property({ type: String })], AxebowTenantCard.prototype, "callToActionIssuesText", void 0);
9761
+ __decorate([property({ type: String })], AxebowTenantCard.prototype, "callToActionCriticality", void 0);
9762
+ __decorate([property({ attribute: false })], AxebowTenantCard.prototype, "onCallToActionClick", void 0);
9486
9763
  __decorate([property({ type: String })], AxebowTenantCard.prototype, "contentState", void 0);
9487
9764
  __decorate([property({ type: String })], AxebowTenantCard.prototype, "invitationText", void 0);
9488
9765
  __decorate([property({ type: String })], AxebowTenantCard.prototype, "emptyTextPrefix", void 0);
@@ -9740,6 +10017,7 @@ var AxebowHyperlinkSwitch = class AxebowHyperlinkSwitch extends LitElement {
9740
10017
  super(..._args);
9741
10018
  this.text = "";
9742
10019
  this.checked = false;
10020
+ this.alwaysActive = false;
9743
10021
  this.color = "var(--axebow-tertiary)";
9744
10022
  this.hoverColor = "var(--axebow-gray)";
9745
10023
  this.fontSize = "0.875rem";
@@ -9763,13 +10041,14 @@ var AxebowHyperlinkSwitch = class AxebowHyperlinkSwitch extends LitElement {
9763
10041
  </div>` : toggle;
9764
10042
  }
9765
10043
  render() {
10044
+ const active = this.alwaysActive || this.checked;
9766
10045
  return html`
9767
10046
  <div class="inline-flex items-center gap-2">
9768
10047
  <axebow-manage-hyperlinks
9769
- class="${this.checked ? "" : "opacity-50"}"
10048
+ class="${active ? "" : "opacity-50"}"
9770
10049
  .text=${this.text}
9771
- .color=${this.checked ? this.color : "var(--axebow-gray)"}
9772
- .hoverColor=${this.checked ? this.hoverColor : "var(--axebow-gray)"}
10050
+ .color=${active ? this.color : "var(--axebow-gray)"}
10051
+ .hoverColor=${active ? this.hoverColor : "var(--axebow-gray)"}
9773
10052
  .fontSize=${this.fontSize}
9774
10053
  .onClick=${() => this.onChange?.(!this.checked)}
9775
10054
  ></axebow-manage-hyperlinks>
@@ -9780,6 +10059,7 @@ var AxebowHyperlinkSwitch = class AxebowHyperlinkSwitch extends LitElement {
9780
10059
  };
9781
10060
  __decorate([property({ type: String })], AxebowHyperlinkSwitch.prototype, "text", void 0);
9782
10061
  __decorate([property({ type: Boolean })], AxebowHyperlinkSwitch.prototype, "checked", void 0);
10062
+ __decorate([property({ type: Boolean })], AxebowHyperlinkSwitch.prototype, "alwaysActive", void 0);
9783
10063
  __decorate([property({ type: String })], AxebowHyperlinkSwitch.prototype, "color", void 0);
9784
10064
  __decorate([property({ type: String })], AxebowHyperlinkSwitch.prototype, "hoverColor", void 0);
9785
10065
  __decorate([property({ type: String })], AxebowHyperlinkSwitch.prototype, "fontSize", void 0);
@@ -9794,6 +10074,7 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
9794
10074
  super(..._args);
9795
10075
  this.title = "";
9796
10076
  this.expanded = false;
10077
+ this.alwaysActive = false;
9797
10078
  this.stateLabel = "";
9798
10079
  this.tooltipContent = "";
9799
10080
  }
@@ -9814,6 +10095,7 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
9814
10095
  <axebow-hyperlink-switch
9815
10096
  .text=${this.title}
9816
10097
  .checked=${this.expanded}
10098
+ .alwaysActive=${this.alwaysActive}
9817
10099
  switchWidth="2.5rem"
9818
10100
  switchHeight="1.25rem"
9819
10101
  .onChange=${(checked) => this.onToggle?.(checked)}
@@ -9831,6 +10113,7 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
9831
10113
  };
9832
10114
  __decorate([property({ type: String })], AxebowExpandableHeader.prototype, "title", void 0);
9833
10115
  __decorate([property({ type: Boolean })], AxebowExpandableHeader.prototype, "expanded", void 0);
10116
+ __decorate([property({ type: Boolean })], AxebowExpandableHeader.prototype, "alwaysActive", void 0);
9834
10117
  __decorate([property({ type: String })], AxebowExpandableHeader.prototype, "stateLabel", void 0);
9835
10118
  __decorate([property({ type: String })], AxebowExpandableHeader.prototype, "tooltipContent", void 0);
9836
10119
  __decorate([property({ attribute: false })], AxebowExpandableHeader.prototype, "onToggle", void 0);
@@ -10983,7 +11266,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
10983
11266
  <axebow-summary-card
10984
11267
  title="${this.summaryTitle}"
10985
11268
  cardWidth="22.875rem"
10986
- fixedHeight="max(40.8125rem, calc(100vh - 7.25rem))"
11269
+ maxHeight="max(40.8125rem, calc(100vh - 7.25rem))"
10987
11270
  >
10988
11271
  ${this.showDownloadButton ? html`
10989
11272
  <axebow-button slot="header-actions" variant="text" size="medium" @click=${this._handleDownloadBundle}>
@@ -11612,8 +11895,9 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
11612
11895
  this.title = "Summary";
11613
11896
  this.cardWidth = "24.125rem";
11614
11897
  this.cardHeight = "";
11615
- this.fixedHeight = "";
11898
+ this.maxHeight = "";
11616
11899
  this.isSummaryOpen = true;
11900
+ this._cardHeightPx = 0;
11617
11901
  }
11618
11902
  static {
11619
11903
  this.styles = [
@@ -11636,21 +11920,21 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
11636
11920
  sl-card::part(body) {
11637
11921
  height: 100%;
11638
11922
  }
11639
- sl-card.fixed-height::part(body) {
11923
+ sl-card.capped::part(body) {
11640
11924
  min-height: 0;
11641
11925
  overflow-x: hidden;
11642
11926
  overflow-y: auto;
11643
11927
  }
11644
- sl-card.fixed-height::part(body)::-webkit-scrollbar {
11928
+ sl-card.capped::part(body)::-webkit-scrollbar {
11645
11929
  width: 0.375rem;
11646
11930
  }
11647
- sl-card.fixed-height::part(body)::-webkit-scrollbar-button {
11931
+ sl-card.capped::part(body)::-webkit-scrollbar-button {
11648
11932
  display: none;
11649
11933
  }
11650
- sl-card.fixed-height::part(body)::-webkit-scrollbar-track {
11934
+ sl-card.capped::part(body)::-webkit-scrollbar-track {
11651
11935
  background: transparent;
11652
11936
  }
11653
- sl-card.fixed-height::part(body)::-webkit-scrollbar-thumb {
11937
+ sl-card.capped::part(body)::-webkit-scrollbar-thumb {
11654
11938
  background-color: #dbdde4;
11655
11939
  border-radius: 0.375rem;
11656
11940
  min-height: 11.25rem;
@@ -11658,27 +11942,42 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
11658
11942
  `
11659
11943
  ];
11660
11944
  }
11945
+ disconnectedCallback() {
11946
+ super.disconnectedCallback();
11947
+ this._resizeObserver?.disconnect();
11948
+ }
11949
+ firstUpdated() {
11950
+ if (!this._card) return;
11951
+ this._resizeObserver = new ResizeObserver(() => this._syncCardHeight());
11952
+ this._resizeObserver.observe(this._card);
11953
+ this._syncCardHeight();
11954
+ }
11955
+ _syncCardHeight() {
11956
+ if (!this._card) return;
11957
+ this._cardHeightPx = Math.round(this._card.getBoundingClientRect().height);
11958
+ }
11661
11959
  get _heightClass() {
11662
- if (this.fixedHeight) return "";
11960
+ if (this.maxHeight) return "";
11663
11961
  return this.cardHeight ? "lg:min-h-(--card-height)" : "lg:min-h-[calc(100vh-7.25rem)]";
11664
11962
  }
11665
11963
  get _topClass() {
11666
- return this.fixedHeight ? "top-[min(6.25rem,calc(100vh_-_var(--card-fixed-height)_-_1rem))]" : "top-25";
11964
+ return this.maxHeight ? "top-[min(6.25rem,calc(100vh_-_var(--card-actual-height)_-_1rem))]" : "top-25";
11667
11965
  }
11668
- get _fixedClass() {
11669
- return this.fixedHeight ? "fixed-height flex flex-col max-h-(--card-fixed-height) lg:h-(--card-fixed-height)" : "";
11966
+ get _cappedClass() {
11967
+ return this.maxHeight ? "capped flex flex-col max-h-(--card-max-height)" : "";
11670
11968
  }
11671
11969
  render() {
11672
11970
  const height = this._heightClass;
11673
11971
  const top = this._topClass;
11674
- const fixed = this._fixedClass;
11972
+ const capped = this._cappedClass;
11675
11973
  return html`
11676
11974
  <div
11975
+ data-summary-card
11677
11976
  class="w-full lg:w-(--card-width) lg:sticky static ${top} h-auto ${height} rounded-md z-10 transition-all duration-300"
11678
- style="--card-width: ${this.cardWidth}; --card-height: ${this.cardHeight}; --card-fixed-height: ${this.fixedHeight};"
11977
+ style="--card-width: ${this.cardWidth}; --card-height: ${this.cardHeight}; --card-max-height: ${this.maxHeight}; --card-actual-height: ${this._cardHeightPx}px;"
11679
11978
  >
11680
11979
  <sl-card
11681
- class="w-full h-full shadow-none border-t border-l-0 border-r-0 border-b-0 rounded-none lg:shadow lg:border lg:rounded-md ${fixed}"
11980
+ class="w-full h-full shadow-none border-t border-l-0 border-r-0 border-b-0 rounded-none lg:shadow lg:border lg:rounded-md ${capped}"
11682
11981
  >
11683
11982
  <div class="h-full flex flex-col">
11684
11983
  ${this._renderHeader()}
@@ -11729,8 +12028,10 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
11729
12028
  __decorate([property({ type: String })], AxebowSummaryCard.prototype, "title", void 0);
11730
12029
  __decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardWidth", void 0);
11731
12030
  __decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardHeight", void 0);
11732
- __decorate([property({ type: String })], AxebowSummaryCard.prototype, "fixedHeight", void 0);
12031
+ __decorate([property({ type: String })], AxebowSummaryCard.prototype, "maxHeight", void 0);
11733
12032
  __decorate([state()], AxebowSummaryCard.prototype, "isSummaryOpen", void 0);
12033
+ __decorate([state()], AxebowSummaryCard.prototype, "_cardHeightPx", void 0);
12034
+ __decorate([query("[data-summary-card]")], AxebowSummaryCard.prototype, "_card", void 0);
11734
12035
  AxebowSummaryCard = __decorate([customElement("axebow-summary-card")], AxebowSummaryCard);
11735
12036
  //#endregion
11736
12037
  //#region src/components/axebow-summary/axebow-summary-limits.ts
@@ -13846,6 +14147,7 @@ var AxebowModal = class AxebowModal extends LitElement {
13846
14147
  this.height = "calc(100% - 2rem)";
13847
14148
  this.title = "";
13848
14149
  this.description = "";
14150
+ this.closeIconName = "close";
13849
14151
  this._hasFooterSlotContent = false;
13850
14152
  this._isScrollLocked = false;
13851
14153
  }
@@ -13956,8 +14258,12 @@ var AxebowModal = class AxebowModal extends LitElement {
13956
14258
  ${this.description ? html`<p class="text-(--axebow-gray) mt-1 m-0">${this.description}</p>` : ""}
13957
14259
  <slot name="description"></slot>
13958
14260
 
13959
- <div class="close-button" @click=${this._handleClose}>
13960
- <axebow-icon iconName="close" size="xl"></axebow-icon>
14261
+ <div
14262
+ class="close-button"
14263
+ style=${ifDefined(this.closeButtonSize ? `width: ${this.closeButtonSize}; height: ${this.closeButtonSize}; padding: 0;` : void 0)}
14264
+ @click=${this._handleClose}
14265
+ >
14266
+ <axebow-icon iconName=${this.closeIconName} iconColor=${ifDefined(this.closeIconColor)} size="xl"></axebow-icon>
13961
14267
  </div>
13962
14268
  </div>
13963
14269
  ` : ""}
@@ -13985,65 +14291,80 @@ __decorate([property()], AxebowModal.prototype, "maxHeight", void 0);
13985
14291
  __decorate([property()], AxebowModal.prototype, "height", void 0);
13986
14292
  __decorate([property()], AxebowModal.prototype, "title", void 0);
13987
14293
  __decorate([property()], AxebowModal.prototype, "description", void 0);
14294
+ __decorate([property()], AxebowModal.prototype, "closeIconName", void 0);
14295
+ __decorate([property()], AxebowModal.prototype, "closeIconColor", void 0);
14296
+ __decorate([property()], AxebowModal.prototype, "closeButtonSize", void 0);
13988
14297
  __decorate([state()], AxebowModal.prototype, "_hasFooterSlotContent", void 0);
13989
14298
  AxebowModal = __decorate([customElement("axebow-modal")], AxebowModal);
13990
14299
  //#endregion
13991
- //#region src/components/axebow-badge/axebow-badge.ts
13992
- var AxebowBadge = class AxebowBadge extends LitElement {
14300
+ //#region src/components/axebow-call-to-action-row/call-to-action-notification.ts
14301
+ var DEFAULT_LOW_NOTE_TEXT = "No action needed";
14302
+ var BUTTON_TYPE_TO_VARIANT = {
14303
+ primary: "primary",
14304
+ secondary: "tertiary",
14305
+ text: "text"
14306
+ };
14307
+ function getHighestCriticality(notifications) {
14308
+ if (notifications.some((n) => n.criticality === "critical")) return "critical";
14309
+ if (notifications.some((n) => n.criticality === "high")) return "high";
14310
+ return "low";
14311
+ }
14312
+ function getCtaHeading(notification) {
14313
+ return (notification.info_content?.code || notification.subtype).replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
14314
+ }
14315
+ function getCtaDescription(notification) {
14316
+ return notification.info_content?.message ?? "";
14317
+ }
14318
+ function getCtaBadgeLabel(notification) {
14319
+ return notification.criticality.charAt(0).toUpperCase() + notification.criticality.slice(1);
14320
+ }
14321
+ function groupCallToActionNotifications(notifications) {
14322
+ const groups = /* @__PURE__ */ new Map();
14323
+ notifications.forEach((notification) => {
14324
+ const key = `${notification.criticality}|${getCtaHeading(notification)}|${getCtaDescription(notification)}`;
14325
+ const existing = groups.get(key);
14326
+ if (existing) existing.count += 1;
14327
+ else groups.set(key, {
14328
+ notification,
14329
+ count: 1
14330
+ });
14331
+ });
14332
+ return [...groups.values()];
14333
+ }
14334
+ function buildCtaButtons(notification, dispatch) {
14335
+ return (notification.actions ?? []).map((action) => ({
14336
+ label: action.label,
14337
+ variant: BUTTON_TYPE_TO_VARIANT[action.buttonType] ?? "primary",
14338
+ outline: action.outlined,
14339
+ iconName: action.icon,
14340
+ iconColor: action.iconColor,
14341
+ onClick: () => dispatch({
14342
+ notification,
14343
+ action
14344
+ })
14345
+ }));
14346
+ }
14347
+ //#endregion
14348
+ //#region src/components/axebow-call-to-action-feature/axebow-call-to-action-feature.ts
14349
+ var _AxebowCallToActionFeature;
14350
+ var AxebowCallToActionFeature = class AxebowCallToActionFeature extends LitElement {
14351
+ static {
14352
+ _AxebowCallToActionFeature = this;
14353
+ }
13993
14354
  constructor(..._args) {
13994
14355
  super(..._args);
13995
- this.bgColor = "var(--axebow-base)";
13996
- this.textColor = "var(--axebow-secondary)";
14356
+ this.callToActions = [];
14357
+ this.actionNeededLabel = "Action needed";
14358
+ this.noActionsLabel = "No action needed!";
14359
+ this.lastUpdatedText = "";
14360
+ this.expanded = false;
14361
+ this.refreshing = false;
13997
14362
  }
13998
14363
  static {
13999
- this.styles = [unsafeCSS(tailwind_default), css`
14000
- :host {
14001
- display: inline-block;
14002
- }
14003
- `];
14364
+ this.REFRESH_DURATION_MS = 2500;
14004
14365
  }
14005
- render() {
14006
- return html`
14007
- <div
14008
- class="inline-flex items-center justify-center px-2 py-px rounded border border-solid text-xs leading-3 font-semibold whitespace-nowrap"
14009
- style="background-color: ${this.bgColor}; color: ${this.textColor}; border-color: ${this.textColor};"
14010
- >
14011
- <slot></slot>
14012
- </div>
14013
- `;
14014
- }
14015
- };
14016
- __decorate([property({ type: String })], AxebowBadge.prototype, "bgColor", void 0);
14017
- __decorate([property({ type: String })], AxebowBadge.prototype, "textColor", void 0);
14018
- AxebowBadge = __decorate([customElement("axebow-badge")], AxebowBadge);
14019
- //#endregion
14020
- //#region src/components/axebow-call-to-action-row/axebow-call-to-action-row.ts
14021
- var CRITICALITY_STYLES = {
14022
- critical: {
14023
- bg: "var(--axebow-critical-bg)",
14024
- color: "var(--axebow-error)",
14025
- iconName: "error"
14026
- },
14027
- high: {
14028
- bg: "var(--axebow-high-bg)",
14029
- color: "var(--axebow-dark-yellow)",
14030
- iconName: "warning"
14031
- },
14032
- low: {
14033
- bg: "var(--axebow-base)",
14034
- color: "var(--axebow-secondary)",
14035
- iconName: "info"
14036
- }
14037
- };
14038
- var AxebowCallToActionRow = class AxebowCallToActionRow extends LitElement {
14039
- constructor(..._args) {
14040
- super(..._args);
14041
- this.criticality = "low";
14042
- this.heading = "";
14043
- this.badgeLabel = "";
14044
- this.description = "";
14045
- this.buttons = [];
14046
- this.lowNoteText = "";
14366
+ static {
14367
+ this.REFRESH_SKELETON_ROWS = 4;
14047
14368
  }
14048
14369
  static {
14049
14370
  this.styles = [
@@ -14054,147 +14375,115 @@ var AxebowCallToActionRow = class AxebowCallToActionRow extends LitElement {
14054
14375
  display: block;
14055
14376
  width: 100%;
14056
14377
  }
14057
- `
14058
- ];
14059
- }
14060
- render() {
14061
- const { bg, color, iconName } = CRITICALITY_STYLES[this.criticality] ?? CRITICALITY_STYLES.low;
14062
- return html`
14063
- <div class="w-full bg-white p-4 flex flex-row items-center gap-4">
14064
- <div class="w-10 h-10 rounded-md shrink-0 flex items-center justify-center" style="background-color: ${bg};">
14065
- <div class="w-6 h-6 flex items-center justify-center">
14066
- <axebow-icon iconName=${iconName} iconColor=${color} size="2xl"></axebow-icon>
14067
- </div>
14068
- </div>
14069
14378
 
14070
- <div class="flex-1 min-w-0 flex flex-col gap-1">
14071
- <div class="w-full flex flex-row items-center gap-2">
14072
- <span class="text-base font-semibold truncate">${this.heading}</span>
14073
- ${this.badgeLabel ? html`<axebow-badge bgColor=${bg} textColor=${color}>${this.badgeLabel}</axebow-badge>` : ""}
14074
- </div>
14075
- <div class="w-full text-(--axebow-gray)">${this.description}</div>
14076
- </div>
14379
+ @keyframes cta-skeleton-pulse {
14380
+ 0%,
14381
+ 100% {
14382
+ opacity: 1;
14383
+ }
14384
+ 50% {
14385
+ opacity: 0.4;
14386
+ }
14387
+ }
14077
14388
 
14078
- ${this.criticality === "low" ? this._renderLowNote() : this._renderButtons()}
14079
- </div>
14080
- `;
14081
- }
14082
- _renderLowNote() {
14083
- return html`
14084
- <div
14085
- class="w-91 h-11 shrink-0 box-border rounded-md py-1 px-3 flex items-center text-(--axebow-gray)"
14086
- style="background-color: var(--axebow-base);"
14087
- >
14088
- ${this.lowNoteText}
14089
- </div>
14090
- `;
14091
- }
14092
- _renderButtons() {
14093
- if (!this.buttons.length) return "";
14094
- return html`
14095
- <div class="flex flex-row items-center gap-4 shrink-0">
14096
- ${this.buttons.map((button) => html`
14097
- <axebow-button
14098
- variant=${button.variant ?? "primary"}
14099
- ?outline=${button.outline ?? false}
14100
- @click=${() => button.onClick?.()}
14101
- >
14102
- ${button.label}
14103
- ${button.iconName ? html`<axebow-icon
14104
- slot="suffix"
14105
- iconName=${button.iconName}
14106
- iconColor=${button.iconColor ?? "currentColor"}
14107
- ></axebow-icon>` : ""}
14108
- </axebow-button>
14109
- `)}
14110
- </div>
14111
- `;
14112
- }
14113
- };
14114
- __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "criticality", void 0);
14115
- __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "heading", void 0);
14116
- __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "badgeLabel", void 0);
14117
- __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "description", void 0);
14118
- __decorate([property({ type: Array })], AxebowCallToActionRow.prototype, "buttons", void 0);
14119
- __decorate([property({ type: String })], AxebowCallToActionRow.prototype, "lowNoteText", void 0);
14120
- AxebowCallToActionRow = __decorate([customElement("axebow-call-to-action-row")], AxebowCallToActionRow);
14121
- //#endregion
14122
- //#region src/components/axebow-call-to-action-feature/axebow-call-to-action-feature.ts
14123
- var AxebowCallToActionFeature = class AxebowCallToActionFeature extends LitElement {
14124
- constructor(..._args) {
14125
- super(..._args);
14126
- this.notifications = [];
14127
- this.actionNeededLabel = "Action needed";
14128
- this.lastUpdatedText = "";
14129
- this.expanded = false;
14130
- }
14131
- static {
14132
- this.styles = [
14133
- unsafeCSS(tailwind_default),
14134
- axebowTheme,
14135
- css`
14136
- :host {
14137
- display: block;
14138
- width: 100%;
14389
+ .cta-skeleton-bar {
14390
+ animation: cta-skeleton-pulse 1.5s ease-in-out infinite;
14139
14391
  }
14140
14392
  `
14141
14393
  ];
14142
14394
  }
14143
14395
  get _highestCriticality() {
14144
- if (this.notifications.some((n) => n?.criticality === "critical")) return "critical";
14145
- if (this.notifications.some((n) => n?.criticality === "high")) return "high";
14146
- return "low";
14396
+ return getHighestCriticality(this.callToActions);
14147
14397
  }
14148
14398
  _toggle() {
14399
+ if (this.callToActions.length === 0) return;
14149
14400
  this.expanded = !this.expanded;
14150
14401
  }
14402
+ _handleRefresh() {
14403
+ if (this.refreshing) return;
14404
+ this.refreshing = true;
14405
+ setTimeout(() => {
14406
+ this.refreshing = false;
14407
+ }, _AxebowCallToActionFeature.REFRESH_DURATION_MS);
14408
+ }
14409
+ _renderSkeletonRow() {
14410
+ return html`
14411
+ <div
14412
+ class="w-full box-border border-t border-solid border-(--axebow-table-header-border) bg-white p-4 flex flex-row items-center gap-4"
14413
+ >
14414
+ <div
14415
+ class="cta-skeleton-bar w-10 h-10 rounded-md shrink-0"
14416
+ style="background-color: var(--axebow-base);"
14417
+ ></div>
14418
+ <div class="flex-1 min-w-0 flex flex-col gap-2">
14419
+ <div class="cta-skeleton-bar h-4 rounded" style="background-color: var(--axebow-base); width: 40%;"></div>
14420
+ <div class="cta-skeleton-bar h-3 rounded" style="background-color: var(--axebow-base); width: 70%;"></div>
14421
+ </div>
14422
+ </div>
14423
+ `;
14424
+ }
14151
14425
  render() {
14152
14426
  const { color: criticalityColor, iconName } = CRITICALITY_STYLES[this._highestCriticality];
14153
14427
  const chevronIconName = this.expanded ? "keyboard_arrow_down" : "chevron_right";
14428
+ const hasCallToActions = this.callToActions.length > 0;
14154
14429
  return html`
14155
- <div class="w-full flex flex-col">
14430
+ <div class="w-full box-border border border-solid border-(--axebow-table-header-border) rounded-lg overflow-hidden flex flex-col">
14156
14431
  <div
14157
- class="w-full box-border py-3 px-5 flex flex-row items-center justify-between"
14158
- style="background-color: ${this.expanded ? "var(--axebow-base)" : "var(--axebow-white)"};"
14432
+ class="w-full box-border py-3 px-5 flex flex-row items-center justify-between ${hasCallToActions ? "cursor-pointer" : ""}"
14433
+ style="background-color: ${this.expanded || this.refreshing ? "var(--axebow-base)" : "var(--axebow-white)"};"
14434
+ @click=${() => this._toggle()}
14159
14435
  >
14160
14436
  <div class="flex flex-row items-center gap-2">
14161
- <axebow-icon iconName=${iconName} iconColor=${criticalityColor} size="2xl"></axebow-icon>
14162
- <span class="text-base font-semibold">${this.actionNeededLabel}</span>
14437
+ ${hasCallToActions ? html`<axebow-icon iconName=${iconName} iconColor=${criticalityColor} size="2xl"></axebow-icon>` : ""}
14438
+ <span class="text-base font-semibold">${hasCallToActions ? this.actionNeededLabel : this.noActionsLabel}</span>
14163
14439
  <div
14164
14440
  class="w-6 h-6 shrink-0 rounded-full flex items-center justify-center"
14165
- style="background-color: ${this.expanded ? "var(--axebow-white)" : "var(--axebow-base)"};"
14441
+ style="background-color: ${hasCallToActions ? this.expanded ? "var(--axebow-white)" : "var(--axebow-base)" : "#0ECD9A"};"
14166
14442
  >
14167
- <span class="text-base">${this.notifications.length}</span>
14443
+ <span class="text-base" style="color: ${hasCallToActions ? "inherit" : "var(--axebow-white)"};">${this.callToActions.length}</span>
14168
14444
  </div>
14169
14445
  </div>
14170
14446
 
14171
14447
  <div class="flex flex-row items-center gap-3">
14172
14448
  <span class="text-sm text-(--axebow-gray) whitespace-nowrap">${this.lastUpdatedText}</span>
14173
14449
  <div
14174
- class="w-7 h-7 shrink-0 rounded-md border border-solid flex items-center justify-center"
14450
+ class="w-7 h-7 shrink-0 rounded-md border border-solid flex items-center justify-center cursor-pointer"
14175
14451
  style="border-color: var(--axebow-gray);"
14452
+ @click=${(e) => {
14453
+ e.stopPropagation();
14454
+ this._handleRefresh();
14455
+ }}
14176
14456
  >
14177
- <axebow-icon iconName="undo" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
14178
- </div>
14179
- <div
14180
- class="w-5 h-5 shrink-0 flex items-center justify-center cursor-pointer"
14181
- @click=${() => this._toggle()}
14182
- >
14183
- <axebow-icon iconName=${chevronIconName} iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
14457
+ <axebow-icon iconName="refresh" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
14184
14458
  </div>
14459
+ ${hasCallToActions ? html`
14460
+ <div class="w-5 h-5 shrink-0 flex items-center justify-center cursor-pointer">
14461
+ <axebow-icon iconName=${chevronIconName} iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
14462
+ </div>
14463
+ ` : ""}
14185
14464
  </div>
14186
14465
  </div>
14187
14466
 
14188
- ${this.expanded ? html`
14467
+ ${this.refreshing ? html`
14189
14468
  <div class="w-full flex flex-col">
14190
- ${this.notifications.map((notification) => html`
14469
+ ${Array.from({ length: _AxebowCallToActionFeature.REFRESH_SKELETON_ROWS }, () => this._renderSkeletonRow())}
14470
+ </div>
14471
+ ` : ""}
14472
+ ${!this.refreshing && this.expanded && hasCallToActions ? html`
14473
+ <div class="w-full flex flex-col">
14474
+ ${groupCallToActionNotifications(this.callToActions).map(({ notification, count }) => html`
14191
14475
  <axebow-call-to-action-row
14192
- criticality=${ifDefined(notification?.criticality)}
14193
- heading=${ifDefined(notification?.heading)}
14194
- badgeLabel=${ifDefined(notification?.badgeLabel)}
14195
- description=${ifDefined(notification?.description)}
14196
- lowNoteText=${ifDefined(notification?.lowNoteText)}
14197
- .buttons=${notification?.buttons ?? []}
14476
+ criticality=${notification.criticality}
14477
+ heading=${getCtaHeading(notification)}
14478
+ badgeLabel=${getCtaBadgeLabel(notification)}
14479
+ description=${getCtaDescription(notification)}
14480
+ lowNoteText=${DEFAULT_LOW_NOTE_TEXT}
14481
+ count=${count}
14482
+ .buttons=${buildCtaButtons(notification, (detail) => this.dispatchEvent(new CustomEvent("cta-action", {
14483
+ detail,
14484
+ bubbles: true,
14485
+ composed: true
14486
+ })))}
14198
14487
  ></axebow-call-to-action-row>
14199
14488
  `)}
14200
14489
  </div>
@@ -14203,11 +14492,13 @@ var AxebowCallToActionFeature = class AxebowCallToActionFeature extends LitEleme
14203
14492
  `;
14204
14493
  }
14205
14494
  };
14206
- __decorate([property({ type: Array })], AxebowCallToActionFeature.prototype, "notifications", void 0);
14495
+ __decorate([property({ type: Array })], AxebowCallToActionFeature.prototype, "callToActions", void 0);
14207
14496
  __decorate([property({ type: String })], AxebowCallToActionFeature.prototype, "actionNeededLabel", void 0);
14497
+ __decorate([property({ type: String })], AxebowCallToActionFeature.prototype, "noActionsLabel", void 0);
14208
14498
  __decorate([property({ type: String })], AxebowCallToActionFeature.prototype, "lastUpdatedText", void 0);
14209
14499
  __decorate([state()], AxebowCallToActionFeature.prototype, "expanded", void 0);
14210
- AxebowCallToActionFeature = __decorate([customElement("axebow-call-to-action-feature")], AxebowCallToActionFeature);
14500
+ __decorate([state()], AxebowCallToActionFeature.prototype, "refreshing", void 0);
14501
+ AxebowCallToActionFeature = _AxebowCallToActionFeature = __decorate([customElement("axebow-call-to-action-feature")], AxebowCallToActionFeature);
14211
14502
  //#endregion
14212
14503
  //#region src/components/axebow-cta-dialog/axebow-cta-dialog.ts
14213
14504
  var AxebowCtaDialog = class AxebowCtaDialog extends LitElement {
@@ -14235,24 +14526,32 @@ var AxebowCtaDialog = class AxebowCtaDialog extends LitElement {
14235
14526
  title=${this.dialogTitle}
14236
14527
  width="76.25rem"
14237
14528
  maxWidth="100%"
14238
- height="auto"
14529
+ height="40.625rem"
14530
+ closeIconName="cancel"
14531
+ closeIconColor="#8A94AE"
14532
+ closeButtonSize="1.5rem"
14239
14533
  @close=${() => this._handleClose()}
14240
14534
  >
14241
14535
  <div class="flex flex-col gap-2 p-6">
14242
- ${this.notifications.map((notification) => html`
14536
+ ${groupCallToActionNotifications(this.notifications).map(({ notification, count }) => html`
14243
14537
  <axebow-call-to-action-row
14244
- criticality=${ifDefined(notification?.criticality)}
14245
- heading=${ifDefined(notification?.heading)}
14246
- badgeLabel=${ifDefined(notification?.badgeLabel)}
14247
- description=${ifDefined(notification?.description)}
14248
- lowNoteText=${ifDefined(notification?.lowNoteText)}
14249
- .buttons=${notification?.buttons ?? []}
14538
+ criticality=${notification.criticality}
14539
+ heading=${getCtaHeading(notification)}
14540
+ badgeLabel=${getCtaBadgeLabel(notification)}
14541
+ description=${getCtaDescription(notification)}
14542
+ lowNoteText=${DEFAULT_LOW_NOTE_TEXT}
14543
+ count=${count}
14544
+ .buttons=${buildCtaButtons(notification, (detail) => this.dispatchEvent(new CustomEvent("cta-action", {
14545
+ detail,
14546
+ bubbles: true,
14547
+ composed: true
14548
+ })))}
14250
14549
  ></axebow-call-to-action-row>
14251
14550
  `)}
14252
14551
  </div>
14253
14552
 
14254
14553
  <div slot="footer" class="flex items-center justify-end p-4">
14255
- <axebow-button variant="primary" @click=${() => this._handleClose()}>${this.goBackLabel}</axebow-button>
14554
+ <axebow-button variant="primary" outline @click=${() => this._handleClose()}>${this.goBackLabel}</axebow-button>
14256
14555
  </div>
14257
14556
  </axebow-modal>
14258
14557
  `;
@@ -14268,6 +14567,2163 @@ __decorate([property({ type: Array })], AxebowCtaDialog.prototype, "notification
14268
14567
  __decorate([property({ attribute: false })], AxebowCtaDialog.prototype, "onClose", void 0);
14269
14568
  AxebowCtaDialog = __decorate([customElement("axebow-cta-dialog")], AxebowCtaDialog);
14270
14569
  //#endregion
14271
- export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBadge, AxebowBanner, AxebowBaseCard, AxebowBoxSection, AxebowBreadcrumbHeader, AxebowButton, AxebowCallToActionFeature, AxebowCallToActionRow, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarouselInput, AxebowCarouselSelectorItem, AxebowCarouselSelectorTenant, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowCopyBox, AxebowCtaDialog, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDivider, AxebowDragDropUploadFile, AxebowDraggableService, AxebowEmptyState, AxebowExpandableCard, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowGraph, AxebowHeader, AxebowHelpBubble, AxebowHyperlinkSwitch, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowInstancesTable, AxebowLimitsCounter, AxebowManageHyperlinks, AxebowMarketplaceCard, AxebowModal, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowObservabilityContainer, AxebowPill, AxebowPlanSelectField, AxebowProgressBar, AxebowPromotionDropdown, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowRefreshPeriodPanel, AxebowRegistrySelector, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourceLimitInput, AxebowResourceLimitsPanel, AxebowResourcesCounter, AxebowRoleCard, AxebowRoleContainerDropdown, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSearchBarFilters, AxebowSelectInput, AxebowSelectInputWithDivider, AxebowSelectorCard, AxebowSelectorSlider, AxebowServiceDetailHeader, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryFlavors, AxebowSummaryKeyValue, AxebowSummaryLimits, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowSwitchInput, AxebowTabSelector, AxebowTabsSubmenu, AxebowTagsInput, AxebowTenantCard, AxebowTenantResourceTable, AxebowTenantsTable, AxebowTextInput, AxebowTimeRangePanel, AxebowTooltip, AxebowUndeployCard, AxebowUnderlineTabSelector, AxebowUsageTooltip, CRITICALITY_STYLES, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, TableChart, axebowTheme, buildAddButton, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon };
14570
+ //#region src/components/axebow-ul/axebow-ul.ts
14571
+ var AxebowUl = class AxebowUl extends LitElement {
14572
+ constructor(..._args) {
14573
+ super(..._args);
14574
+ this._items = [];
14575
+ }
14576
+ static {
14577
+ this.styles = [
14578
+ unsafeCSS(tailwind_default),
14579
+ axebowTheme,
14580
+ css`
14581
+ ::slotted(*) {
14582
+ display: none !important;
14583
+ }
14584
+ `
14585
+ ];
14586
+ }
14587
+ _handleSlotChange(e) {
14588
+ const slot = e.target;
14589
+ this._items = slot.assignedElements({ flatten: true }).filter((el) => el.tagName === "LI").map((el) => el.innerHTML);
14590
+ }
14591
+ render() {
14592
+ return html`
14593
+ <slot @slotchange=${this._handleSlotChange}></slot>
14594
+ <ul class="list-none mt-2 mb-4 ml-2">
14595
+ ${this._items.map((item) => html`
14596
+ <li class="flex items-center gap-2">
14597
+ <span class="block shrink-0 w-1.5 h-1.5 rounded-full bg-(--axebow-gray)"></span>
14598
+ ${unsafeHTML(item)}
14599
+ </li>
14600
+ `)}
14601
+ </ul>
14602
+ `;
14603
+ }
14604
+ };
14605
+ __decorate([state()], AxebowUl.prototype, "_items", void 0);
14606
+ AxebowUl = __decorate([customElement("axebow-ul")], AxebowUl);
14607
+ //#endregion
14608
+ //#region src/components/axebow-border-container/axebow-border-container.ts
14609
+ var AxebowBorderContainer = class AxebowBorderContainer extends LitElement {
14610
+ constructor(..._args) {
14611
+ super(..._args);
14612
+ this.error = false;
14613
+ this.disabled = false;
14614
+ this.label = "";
14615
+ this.required = false;
14616
+ this.compact = false;
14617
+ }
14618
+ static {
14619
+ this.styles = css`
14620
+ :host {
14621
+ display: block;
14622
+ width: 100%;
14623
+ }
14624
+ .container {
14625
+ border: 1px solid #e2e8f0;
14626
+ border-radius: 0.375rem;
14627
+ padding: 0.375rem 0.625rem;
14628
+ background-color: #fff;
14629
+ transition:
14630
+ border-color 0.2s ease,
14631
+ background-color 0.2s ease;
14632
+ display: flex;
14633
+ flex-direction: column;
14634
+ gap: 0.125rem;
14635
+ }
14636
+ .container.compact {
14637
+ width: 14.625rem;
14638
+ height: 2.9375rem;
14639
+ box-sizing: border-box;
14640
+ padding: 0.375rem 0.5rem;
14641
+ justify-content: flex-start;
14642
+ gap: 0.125rem;
14643
+ }
14644
+ ::slotted(*) {
14645
+ margin: 0;
14646
+ }
14647
+ .container:focus-within:not(.disabled) {
14648
+ border-color: var(--axebow-primary);
14649
+ }
14650
+ .container.error {
14651
+ border-color: var(--axebow-error);
14652
+ }
14653
+ .container.disabled {
14654
+ background-color: var(--axebow-anti-flash-white);
14655
+ }
14656
+ .label {
14657
+ font-size: 0.75rem;
14658
+ color: var(--axebow-gray);
14659
+ font-weight: 500;
14660
+ line-height: 1;
14661
+ user-select: none;
14662
+ display: flex;
14663
+ align-items: center;
14664
+ gap: 0.125rem;
14665
+ }
14666
+ .asterisk {
14667
+ color: var(--axebow-error);
14668
+ }
14669
+ `;
14670
+ }
14671
+ render() {
14672
+ return html`
14673
+ <div
14674
+ class="container ${this.compact ? "compact" : ""} ${this.error ? "error" : ""} ${this.disabled ? "disabled" : ""}"
14675
+ >
14676
+ ${this.label || this.required ? html`
14677
+ <div class="label">${this.required ? html`<span class="asterisk">*</span>` : ""} ${this.label}</div>
14678
+ ` : ""}
14679
+ <slot></slot>
14680
+ </div>
14681
+ `;
14682
+ }
14683
+ };
14684
+ __decorate([property({ type: Boolean })], AxebowBorderContainer.prototype, "error", void 0);
14685
+ __decorate([property({ type: Boolean })], AxebowBorderContainer.prototype, "disabled", void 0);
14686
+ __decorate([property({ type: String })], AxebowBorderContainer.prototype, "label", void 0);
14687
+ __decorate([property({ type: Boolean })], AxebowBorderContainer.prototype, "required", void 0);
14688
+ __decorate([property({ type: Boolean })], AxebowBorderContainer.prototype, "compact", void 0);
14689
+ AxebowBorderContainer = __decorate([customElement("axebow-border-container")], AxebowBorderContainer);
14690
+ //#endregion
14691
+ //#region src/components/axebow-copy-icon/axebow-copy-icon.ts
14692
+ var AxebowCopyIcon = class AxebowCopyIcon extends LitElement {
14693
+ constructor(..._args) {
14694
+ super(..._args);
14695
+ this.value = "";
14696
+ this.label = "";
14697
+ this.showText = false;
14698
+ this.iconName = "content_copy";
14699
+ this.successIconName = "verified";
14700
+ this.iconColor = "var(--axebow-tertiary)";
14701
+ this.successIconColor = "var(--axebow-success)";
14702
+ this.size = "small";
14703
+ this.containerClass = "cursor-pointer flex items-center gap-1 h-full";
14704
+ this.successContainerClass = "";
14705
+ this.copyTooltip = "";
14706
+ this.copiedText = "";
14707
+ this.copied = false;
14708
+ }
14709
+ static {
14710
+ this.styles = [
14711
+ unsafeCSS(tailwind_default),
14712
+ axebowTheme,
14713
+ css`
14714
+ :host {
14715
+ display: flex;
14716
+ height: 100%;
14717
+ align-items: center;
14718
+ gap: 0.25rem;
14719
+ }
14720
+ `
14721
+ ];
14722
+ }
14723
+ handleCopy(e) {
14724
+ if (this.copied || !this.value) return;
14725
+ e.stopPropagation();
14726
+ this.copied = true;
14727
+ this.dispatchEvent(new CustomEvent("axebow-copy", {
14728
+ bubbles: true,
14729
+ composed: true,
14730
+ detail: {
14731
+ value: this.value,
14732
+ label: this.label
14733
+ }
14734
+ }));
14735
+ setTimeout(() => {
14736
+ this.copied = false;
14737
+ }, 2e3);
14738
+ }
14739
+ render() {
14740
+ return html`
14741
+ <div
14742
+ class="h-full ${this.copied ? this.successContainerClass || this.containerClass : this.containerClass}"
14743
+ title="${this.copyTooltip}"
14744
+ @click=${this.handleCopy}
14745
+ >
14746
+ <axebow-icon
14747
+ iconName=${this.copied ? this.successIconName : this.iconName}
14748
+ iconColor=${this.copied ? this.successIconColor : this.iconColor}
14749
+ size=${this.size}
14750
+ ></axebow-icon>
14751
+ ${this.showText && this.copied ? html`<span class="text-sm transition-opacity duration-300" style="color: ${this.successIconColor}"
14752
+ >${this.copiedText}</span
14753
+ >` : ""}
14754
+ </div>
14755
+ `;
14756
+ }
14757
+ };
14758
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "value", void 0);
14759
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "label", void 0);
14760
+ __decorate([property({ type: Boolean })], AxebowCopyIcon.prototype, "showText", void 0);
14761
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "iconName", void 0);
14762
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "successIconName", void 0);
14763
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "iconColor", void 0);
14764
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "successIconColor", void 0);
14765
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "size", void 0);
14766
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "containerClass", void 0);
14767
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "successContainerClass", void 0);
14768
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "copyTooltip", void 0);
14769
+ __decorate([property({ type: String })], AxebowCopyIcon.prototype, "copiedText", void 0);
14770
+ __decorate([state()], AxebowCopyIcon.prototype, "copied", void 0);
14771
+ AxebowCopyIcon = __decorate([customElement("axebow-copy-icon")], AxebowCopyIcon);
14772
+ //#endregion
14773
+ //#region src/components/axebow-page-actions/axebow-page-actions.ts
14774
+ var AxebowPageActions = class AxebowPageActions extends LitElement {
14775
+ constructor(..._args) {
14776
+ super(..._args);
14777
+ this.actions = [];
14778
+ this.gap = "0.75rem";
14779
+ this._hoveredIndex = -1;
14780
+ }
14781
+ static {
14782
+ this.styles = [unsafeCSS(tailwind_default)];
14783
+ }
14784
+ handleActionClick(index) {
14785
+ const action = this.actions[index];
14786
+ if (action && typeof action.onClick === "function") action.onClick();
14787
+ }
14788
+ render() {
14789
+ if (this.actions.length === 0) return html``;
14790
+ return html`
14791
+ <div class="flex flex-wrap items-center" style="gap: ${this.gap};">
14792
+ ${this.actions.map((action, i) => {
14793
+ const outlined = this.actions.length > 1 && i > 0;
14794
+ const isHovered = this._hoveredIndex === i;
14795
+ const iconColor = action.iconColor ?? (outlined ? isHovered ? "var(--axebow-gray)" : "var(--axebow-tertiary)" : "white");
14796
+ return html`
14797
+ <axebow-button
14798
+ variant="primary"
14799
+ ?outline=${outlined}
14800
+ .disabled=${!!action.disabled}
14801
+ fixedWidth=${ifDefined(this.buttonWidth)}
14802
+ fixedHeight=${ifDefined(this.buttonHeight)}
14803
+ @click=${() => this.handleActionClick(i)}
14804
+ @mouseenter=${() => this._hoveredIndex = i}
14805
+ @mouseleave=${() => this._hoveredIndex = -1}
14806
+ >
14807
+ ${action.title}
14808
+ ${action.iconName ? html`<axebow-icon
14809
+ slot="suffix"
14810
+ iconName="${action.iconName}"
14811
+ iconColor="${iconColor}"
14812
+ size="${action.iconSize ?? "medium"}"
14813
+ ></axebow-icon>` : ""}
14814
+ </axebow-button>
14815
+ `;
14816
+ })}
14817
+ </div>
14818
+ `;
14819
+ }
14820
+ };
14821
+ __decorate([property({ type: Array })], AxebowPageActions.prototype, "actions", void 0);
14822
+ __decorate([property({ type: String })], AxebowPageActions.prototype, "buttonWidth", void 0);
14823
+ __decorate([property({ type: String })], AxebowPageActions.prototype, "buttonHeight", void 0);
14824
+ __decorate([property({ type: String })], AxebowPageActions.prototype, "gap", void 0);
14825
+ __decorate([state()], AxebowPageActions.prototype, "_hoveredIndex", void 0);
14826
+ AxebowPageActions = __decorate([customElement("axebow-page-actions")], AxebowPageActions);
14827
+ //#endregion
14828
+ //#region src/components/axebow-mobile-warning-banner/axebow-mobile-warning-banner.ts
14829
+ var AxebowMobileWarningBanner = class AxebowMobileWarningBanner extends LitElement {
14830
+ constructor(..._args) {
14831
+ super(..._args);
14832
+ this.show = false;
14833
+ this.heading = "";
14834
+ this.message = "";
14835
+ this.closeAriaLabel = "";
14836
+ }
14837
+ static {
14838
+ this.styles = [unsafeCSS(tailwind_default), css`
14839
+ :host {
14840
+ display: block;
14841
+ }
14842
+
14843
+ .banner-container {
14844
+ position: fixed;
14845
+ top: 80px;
14846
+ left: 0;
14847
+ right: 0;
14848
+ z-index: 9999;
14849
+ padding: 1rem;
14850
+ background: linear-gradient(135deg, #fbbf24 0%, var(--axebow-warning) 100%);
14851
+ box-shadow:
14852
+ 0 4px 6px -1px rgba(0, 0, 0, 0.1),
14853
+ 0 2px 4px -1px rgba(0, 0, 0, 0.06);
14854
+ animation: slideDown 0.3s ease-out;
14855
+ }
14856
+
14857
+ @keyframes slideDown {
14858
+ from {
14859
+ transform: translateY(-100%);
14860
+ opacity: 0;
14861
+ }
14862
+ to {
14863
+ transform: translateY(0);
14864
+ opacity: 1;
14865
+ }
14866
+ }
14867
+
14868
+ .banner-content {
14869
+ max-width: 1200px;
14870
+ margin: 0 auto;
14871
+ display: flex;
14872
+ align-items: center;
14873
+ gap: 1rem;
14874
+ }
14875
+
14876
+ .icon-container {
14877
+ flex-shrink: 0;
14878
+ width: 2rem;
14879
+ height: 2rem;
14880
+ background: rgba(255, 255, 255, 0.9);
14881
+ border-radius: 50%;
14882
+ display: flex;
14883
+ align-items: center;
14884
+ justify-content: center;
14885
+ }
14886
+
14887
+ .message-container {
14888
+ flex: 1;
14889
+ color: white;
14890
+ }
14891
+
14892
+ .message-title {
14893
+ font-weight: 600;
14894
+ font-size: 1rem;
14895
+ margin-bottom: 0.25rem;
14896
+ }
14897
+
14898
+ .message-text {
14899
+ font-size: 0.875rem;
14900
+ opacity: 0.95;
14901
+ }
14902
+
14903
+ .close-button {
14904
+ flex-shrink: 0;
14905
+ background: rgba(255, 255, 255, 0.2);
14906
+ border: none;
14907
+ border-radius: 0.375rem;
14908
+ padding: 0.5rem;
14909
+ cursor: pointer;
14910
+ transition: all 0.2s;
14911
+ display: flex;
14912
+ align-items: center;
14913
+ justify-content: center;
14914
+ color: white;
14915
+ }
14916
+
14917
+ .close-button:hover {
14918
+ background: rgba(255, 255, 255, 0.3);
14919
+ }
14920
+
14921
+ .close-button:active {
14922
+ transform: scale(0.95);
14923
+ }
14924
+ `];
14925
+ }
14926
+ handleClose() {
14927
+ this.show = false;
14928
+ this.dispatchEvent(new CustomEvent("close", {
14929
+ bubbles: true,
14930
+ composed: true
14931
+ }));
14932
+ }
14933
+ render() {
14934
+ if (!this.show) return html``;
14935
+ return html`
14936
+ <div class="banner-container">
14937
+ <div class="banner-content">
14938
+ <div class="icon-container">
14939
+ <axebow-icon iconName="warning" iconColor="var(--axebow-warning)" size="md"></axebow-icon>
14940
+ </div>
14941
+ <div class="message-container">
14942
+ <div class="message-title">${this.heading}</div>
14943
+ <div class="message-text">${this.message}</div>
14944
+ </div>
14945
+ <button class="close-button" @click=${this.handleClose} aria-label="${this.closeAriaLabel}">
14946
+ <axebow-icon iconName="close" iconColor="white" size="md"></axebow-icon>
14947
+ </button>
14948
+ </div>
14949
+ </div>
14950
+ `;
14951
+ }
14952
+ };
14953
+ __decorate([property({ type: Boolean })], AxebowMobileWarningBanner.prototype, "show", void 0);
14954
+ __decorate([property({ type: String })], AxebowMobileWarningBanner.prototype, "heading", void 0);
14955
+ __decorate([property({ type: String })], AxebowMobileWarningBanner.prototype, "message", void 0);
14956
+ __decorate([property({ type: String })], AxebowMobileWarningBanner.prototype, "closeAriaLabel", void 0);
14957
+ AxebowMobileWarningBanner = __decorate([customElement("axebow-mobile-warning-banner")], AxebowMobileWarningBanner);
14958
+ //#endregion
14959
+ //#region src/components/axebow-boxed-input/axebow-boxed-input.ts
14960
+ var AxebowBoxedInput = class AxebowBoxedInput extends LitElement {
14961
+ constructor(..._args) {
14962
+ super(..._args);
14963
+ this.required = false;
14964
+ this.label = "";
14965
+ this.type = "input";
14966
+ this.options = [];
14967
+ this.value = "";
14968
+ this.disabled = false;
14969
+ this.clearable = true;
14970
+ this.compact = false;
14971
+ this.password = false;
14972
+ this.showPlaceholder = true;
14973
+ this.bordered = false;
14974
+ this.copyable = false;
14975
+ this.noTypeSelectedText = "";
14976
+ this.showPassword = false;
14977
+ }
14978
+ static {
14979
+ this.styles = [
14980
+ unsafeCSS(tailwind_default),
14981
+ axebowTheme,
14982
+ css`
14983
+ sl-select::part(listbox) {
14984
+ max-height: 200px;
14985
+ overflow-y: auto;
14986
+ scrollbar-width: thin;
14987
+ }
14988
+ .compact-mode sl-select::part(combobox) {
14989
+ background-color: transparent !important;
14990
+ }
14991
+
14992
+ .boxed-container:focus-within {
14993
+ border-color: black !important;
14994
+ box-shadow: 0 0 0 1px black !important;
14995
+ }
14996
+
14997
+ .boxed-container sl-select:focus-within::part(combobox),
14998
+ .boxed-container sl-select::part(combobox) {
14999
+ border-color: transparent !important;
15000
+ box-shadow: none !important;
15001
+ }
15002
+
15003
+ .boxed-container-bordered {
15004
+ border: 1px solid var(--axebow-border-gray) !important;
15005
+ transition:
15006
+ border-color 0.15s ease,
15007
+ box-shadow 0.15s ease;
15008
+ }
15009
+
15010
+ .boxed-container-bordered:focus-within {
15011
+ border-color: black !important;
15012
+ box-shadow: 0 0 0 1px black !important;
15013
+ }
15014
+
15015
+ .boxed-container-bordered sl-select:focus-within::part(combobox),
15016
+ .boxed-container-bordered sl-select::part(combobox) {
15017
+ border-color: transparent !important;
15018
+ box-shadow: none !important;
15019
+ }
15020
+
15021
+ textarea {
15022
+ line-height: 1.5;
15023
+ }
15024
+
15025
+ textarea::-webkit-scrollbar {
15026
+ width: 8px;
15027
+ }
15028
+
15029
+ textarea::-webkit-scrollbar-track {
15030
+ background: #f1f1f1;
15031
+ border-radius: 0.25rem;
15032
+ }
15033
+
15034
+ textarea::-webkit-scrollbar-thumb {
15035
+ background: #888;
15036
+ border-radius: 0.25rem;
15037
+ }
15038
+
15039
+ textarea::-webkit-scrollbar-thumb:hover {
15040
+ background: #555;
15041
+ }
15042
+ `
15043
+ ];
15044
+ }
15045
+ updated(changedProperties) {
15046
+ super.updated(changedProperties);
15047
+ if (changedProperties.has("value") && this.type === "textarea") this.adjustTextareaHeight();
15048
+ }
15049
+ adjustTextareaHeight() {
15050
+ const textarea = this.shadowRoot?.querySelector("textarea");
15051
+ if (textarea) {
15052
+ const maxHeight = 120;
15053
+ textarea.style.height = "auto";
15054
+ const newHeight = Math.min(textarea.scrollHeight, maxHeight);
15055
+ textarea.style.height = `${newHeight}px`;
15056
+ }
15057
+ }
15058
+ renderActions(icons) {
15059
+ if (!icons.length) return html``;
15060
+ return html` <div class="flex items-center gap-1 pr-3 shrink-0">${icons}</div> `;
15061
+ }
15062
+ get _showCopyAction() {
15063
+ return !!(this.onCopy || this.copyable);
15064
+ }
15065
+ render() {
15066
+ const disabledStyles = this.disabled ? " opacity-70 cursor-not-allowed" : "";
15067
+ const borderClass = this.bordered ? "boxed-container-bordered" : "boxed-container";
15068
+ const checkboxInput = `flex flex-col rounded-lg border border-gray-300 mx-2 mb-4 items-start justify-between ${borderClass} transition-all` + disabledStyles;
15069
+ const checkboxInputTall = checkboxInput + " py-2";
15070
+ const checkboxInputNormal = checkboxInput + " h-14";
15071
+ const textareaInput = `flex flex-col rounded-lg border border-gray-300 mx-2 mb-4 items-start justify-start gap-2 ${borderClass} transition-all` + disabledStyles;
15072
+ const label = "flex flex-row w-full px-4 gap-2 mt-2";
15073
+ switch (this.type) {
15074
+ case "input": {
15075
+ const actions = [];
15076
+ if (this.password) actions.push(html`
15077
+ <div @click=${() => this.showPassword = !this.showPassword} class="cursor-pointer flex items-center">
15078
+ <axebow-icon
15079
+ iconName="visibility${this.showPassword ? "_off" : ""}"
15080
+ iconColor="var(--axebow-tertiary)"
15081
+ ></axebow-icon>
15082
+ </div>
15083
+ `);
15084
+ if (this._showCopyAction) actions.push(html`
15085
+ <slot
15086
+ name="copy-action"
15087
+ @click=${(e) => e.preventDefault()}
15088
+ @mousedown=${(e) => e.preventDefault()}
15089
+ ></slot>
15090
+ `);
15091
+ if (this.compact) return html`
15092
+ <div part="base" style="${`display:flex; align-items:center; border-radius: 0.375rem; border:1px solid var(--boxed-input-border-color, #d1d5db); width:100%; padding:0 12px; height:var(--sl-input-height-medium,40px); box-sizing:border-box;${this.disabled ? " opacity:0.7; cursor:not-allowed;" : ""}`}">
15093
+ <input
15094
+ type=${this.password && !this.showPassword ? "password" : "text"}
15095
+ .value=${this.value}
15096
+ ?disabled=${this.disabled}
15097
+ @input=${this.handleInputChange}
15098
+ @change=${this.handleInputChange}
15099
+ style="flex:1; border:none; outline:none; background:transparent; font-size:0.875rem; cursor:${this.disabled ? "not-allowed" : "auto"};"
15100
+ placeholder="${this.showPlaceholder && this.label ? `Enter ${this.label.toLowerCase()}` : ""}"
15101
+ maxlength="${this.maxlength || 255}"
15102
+ />
15103
+ ${this.renderActions(actions)}
15104
+ </div>
15105
+ `;
15106
+ return html`
15107
+ <div class="${this.bordered ? checkboxInputTall : checkboxInputNormal}">
15108
+ <div class="${label}">
15109
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15110
+ <span class="text-(--axebow-gray)"> ${this.label}</span>
15111
+ </div>
15112
+ <div class="flex flex-row items-center w-full pl-4 ${this.bordered && this.password ? "pb-1" : ""}">
15113
+ <input
15114
+ type=${this.password && !this.showPassword ? "password" : "text"}
15115
+ .value=${this.value}
15116
+ ?disabled=${this.disabled}
15117
+ @input=${this.handleInputChange}
15118
+ @change=${this.handleInputChange}
15119
+ style="flex: 1; border: none; outline: none; background: transparent; font-size: var(--font-base)"
15120
+ class="${this.disabled ? "cursor-not-allowed" : ""}"
15121
+ placeholder="${this.showPlaceholder ? `Enter ${this.label.toLowerCase()}` : ""}"
15122
+ maxlength="${this.maxlength || 255}"
15123
+ />
15124
+ ${this.renderActions(actions)}
15125
+ </div>
15126
+ </div>
15127
+ `;
15128
+ }
15129
+ case "textarea": return html`
15130
+ <div class="${textareaInput}">
15131
+ <div class="${label}">
15132
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15133
+ <span class="text-(--axebow-gray)"> ${this.label}</span>
15134
+ </div>
15135
+ <div class="flex flex-col w-full px-4 mb-2">
15136
+ <textarea
15137
+ .value=${this.value}
15138
+ ?disabled=${this.disabled}
15139
+ @input=${this.handleTextareaChange}
15140
+ class="w-full border-none outline-none bg-transparent resize-none max-h-30 overflow-y-auto text-sm p-0 ${this.disabled ? "cursor-not-allowed" : ""}"
15141
+ placeholder="${this.showPlaceholder ? `Enter ${this.label.toLowerCase()}` : ""}"
15142
+ ></textarea>
15143
+ </div>
15144
+ </div>
15145
+ `;
15146
+ case "checkbox": return html`
15147
+ <div class="${this.bordered ? checkboxInputTall : checkboxInputNormal}">
15148
+ <div class="${label}">
15149
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15150
+ <span class="text-(--axebow-gray)"> ${this.label}</span>
15151
+ </div>
15152
+ <div class="flex flex-row gap-4 w-full pl-4 pr-3 ${this.bordered && this.password ? "pb-1" : ""}">
15153
+ ${this.options.map((option) => html`
15154
+ <sl-checkbox
15155
+ size="medium"
15156
+ ?disabled=${this.disabled}
15157
+ ?checked=${option === this.value}
15158
+ @sl-change=${this.handleCheckboxChange}
15159
+ class="${this.disabled ? "cursor-not-allowed" : ""}"
15160
+ >${option}</sl-checkbox
15161
+ >
15162
+ `)}
15163
+ </div>
15164
+ </div>
15165
+ `;
15166
+ case "select":
15167
+ if (this.compact) return html`
15168
+ <div class="flex flex-col mx-3 my-2 compact-mode ${disabledStyles}">
15169
+ <div class="flex flex-row gap-2 mb-1 pl-1">
15170
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15171
+ <span class="text-(--axebow-gray)">${this.label}</span>
15172
+ </div>
15173
+ <div class="w-full mx-auto">
15174
+ <sl-select
15175
+ value=${this.value}
15176
+ @sl-change=${this.handleSelectChange}
15177
+ ?clearable=${this.clearable}
15178
+ ?disabled=${this.disabled}
15179
+ class="${this.disabled ? "cursor-not-allowed" : ""}"
15180
+ >
15181
+ ${this._showCopyAction && this.value ? html`
15182
+ <div
15183
+ slot="suffix"
15184
+ class="flex items-center justify-center p-1 cursor-pointer transition-transform duration-200 ease-in-out hover:scale-110 active:scale-95"
15185
+ @click=${(e) => e.stopPropagation()}
15186
+ @mousedown=${(e) => e.stopPropagation()}
15187
+ @pointerdown=${(e) => e.stopPropagation()}
15188
+ >
15189
+ <slot name="copy-action"></slot>
15190
+ </div>
15191
+ ` : ""}
15192
+ ${this.options.map((option) => html`<sl-option value=${option}>${option}</sl-option>`)}
15193
+ </sl-select>
15194
+ </div>
15195
+ </div>
15196
+ `;
15197
+ if (this.bordered) return html`
15198
+ <div
15199
+ class="flex flex-col rounded-lg mx-2 mb-4 items-start justify-center px-4 py-1 ${borderClass} transition-all${disabledStyles}"
15200
+ >
15201
+ <div class="flex flex-row gap-2 mt-1">
15202
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15203
+ <span class="text-(--axebow-gray)">${this.label}</span>
15204
+ </div>
15205
+ <sl-select
15206
+ value=${this.value}
15207
+ @sl-change=${this.handleSelectChange}
15208
+ ?clearable=${this.clearable}
15209
+ ?disabled=${this.disabled}
15210
+ class="w-full mb-1 ${this.disabled ? "cursor-not-allowed" : ""}"
15211
+ >
15212
+ ${this._showCopyAction && this.value ? html`
15213
+ <div
15214
+ slot="suffix"
15215
+ class="flex items-center justify-center p-1 cursor-pointer transition-transform duration-200 ease-in-out hover:scale-110 active:scale-95"
15216
+ @click=${(e) => e.stopPropagation()}
15217
+ @mousedown=${(e) => e.stopPropagation()}
15218
+ @pointerdown=${(e) => e.stopPropagation()}
15219
+ >
15220
+ <slot name="copy-action"></slot>
15221
+ </div>
15222
+ ` : ""}
15223
+ ${this.options.map((option) => html`<sl-option value=${option}>${option}</sl-option>`)}
15224
+ </sl-select>
15225
+ </div>
15226
+ `;
15227
+ return html`
15228
+ <div
15229
+ class="flex flex-col rounded-lg border border-(--axebow-light-gray) mx-2 mb-4 h-16 items-start justify-between transition-all ${disabledStyles}"
15230
+ >
15231
+ <div class="${label}">
15232
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15233
+ <span class="text-(--axebow-gray)"> ${this.label}</span>
15234
+ </div>
15235
+ <div class="mb-2 w-full px-4">
15236
+ <sl-select
15237
+ value=${this.value}
15238
+ @sl-change=${this.handleSelectChange}
15239
+ filled
15240
+ ?clearable=${this.clearable}
15241
+ ?disabled=${this.disabled}
15242
+ class="${this.disabled ? "cursor-not-allowed" : ""}"
15243
+ >
15244
+ ${this.options.map((option) => html`<sl-option value=${option}>${option}</sl-option>`)}
15245
+ </sl-select>
15246
+ </div>
15247
+ </div>
15248
+ `;
15249
+ case "cert": {
15250
+ const certActions = [html`<axebow-icon iconName="close" iconColor="black" class="cursor-pointer"></axebow-icon>`, html`<axebow-icon iconName="cloud" iconColor="var(--axebow-tertiary)" class="cursor-pointer"></axebow-icon>`];
15251
+ if (this._showCopyAction) certActions.push(html`
15252
+ <slot
15253
+ name="copy-action"
15254
+ @click=${(e) => e.preventDefault()}
15255
+ @mousedown=${(e) => e.preventDefault()}
15256
+ ></slot>
15257
+ `);
15258
+ return html`
15259
+ <div class="${checkboxInputNormal}">
15260
+ <div class="${label}">
15261
+ ${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
15262
+ <span class="text-(--axebow-gray)"> ${this.label}</span>
15263
+ </div>
15264
+ <div class="flex flex-row items-center w-full pl-4">
15265
+ <p class="flex-1 truncate">${this.value}</p>
15266
+ ${this.renderActions(certActions)}
15267
+ </div>
15268
+ </div>
15269
+ `;
15270
+ }
15271
+ default: return html`<p>${this.noTypeSelectedText}</p>`;
15272
+ }
15273
+ }
15274
+ handleCheckboxChange(e) {
15275
+ if (this.disabled) return;
15276
+ const selectedValue = e.target.textContent?.trim() ?? "";
15277
+ this.value = selectedValue;
15278
+ if (this.onChange) this.onChange(selectedValue);
15279
+ }
15280
+ handleSelectChange(e) {
15281
+ if (this.disabled) return;
15282
+ const selectedValue = e.target.value;
15283
+ this.value = selectedValue;
15284
+ if (this.onChange) this.onChange(selectedValue);
15285
+ }
15286
+ handleInputChange(e) {
15287
+ if (this.disabled) return;
15288
+ const newValue = e.target.value;
15289
+ this.value = newValue;
15290
+ if (this.onChange) this.onChange(newValue);
15291
+ }
15292
+ handleTextareaChange(e) {
15293
+ if (this.disabled) return;
15294
+ const target = e.target;
15295
+ const newValue = target.value;
15296
+ const maxHeight = 120;
15297
+ target.style.height = "auto";
15298
+ const newHeight = Math.min(target.scrollHeight, maxHeight);
15299
+ target.style.height = `${newHeight}px`;
15300
+ this.value = newValue;
15301
+ if (this.onChange) this.onChange(newValue);
15302
+ }
15303
+ };
15304
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "required", void 0);
15305
+ __decorate([property({ type: String })], AxebowBoxedInput.prototype, "label", void 0);
15306
+ __decorate([property({ type: String })], AxebowBoxedInput.prototype, "type", void 0);
15307
+ __decorate([property({ attribute: false })], AxebowBoxedInput.prototype, "options", void 0);
15308
+ __decorate([property({ type: String })], AxebowBoxedInput.prototype, "value", void 0);
15309
+ __decorate([property({ type: Number })], AxebowBoxedInput.prototype, "maxlength", void 0);
15310
+ __decorate([property({ attribute: false })], AxebowBoxedInput.prototype, "onChange", void 0);
15311
+ __decorate([property({ attribute: false })], AxebowBoxedInput.prototype, "onCopy", void 0);
15312
+ __decorate([property({
15313
+ type: Boolean,
15314
+ attribute: false
15315
+ })], AxebowBoxedInput.prototype, "disabled", void 0);
15316
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "clearable", void 0);
15317
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "compact", void 0);
15318
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "password", void 0);
15319
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "showPlaceholder", void 0);
15320
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "bordered", void 0);
15321
+ __decorate([property({ type: Boolean })], AxebowBoxedInput.prototype, "copyable", void 0);
15322
+ __decorate([property({ type: String })], AxebowBoxedInput.prototype, "noTypeSelectedText", void 0);
15323
+ __decorate([state()], AxebowBoxedInput.prototype, "showPassword", void 0);
15324
+ AxebowBoxedInput = __decorate([customElement("axebow-boxed-input")], AxebowBoxedInput);
15325
+ //#endregion
15326
+ //#region src/components/axebow-pem-dialog/axebow-pem-dialog.ts
15327
+ var AxebowPemDialog = class AxebowPemDialog extends LitElement {
15328
+ constructor(..._args) {
15329
+ super(..._args);
15330
+ this.open = false;
15331
+ this.title = "";
15332
+ this.placeholder = "-----BEGIN CERTIFICATE-----\n...\n-----END CERTIFICATE-----";
15333
+ this.value = "";
15334
+ this.fileName = "";
15335
+ this.noteText = "";
15336
+ this.fileContentLabel = "";
15337
+ this.downloadTooltip = "";
15338
+ this.copyLabel = "";
15339
+ this.copyTooltip = "";
15340
+ this.copiedText = "";
15341
+ this.orUploadText = "";
15342
+ this.acceptedFormatText = "";
15343
+ this.saveLabel = "";
15344
+ this.goBackLabel = "";
15345
+ this._internalValue = "";
15346
+ this._internalFileName = "";
15347
+ }
15348
+ static {
15349
+ this.styles = [unsafeCSS(tailwind_default), axebowTheme];
15350
+ }
15351
+ willUpdate(changed) {
15352
+ const dialogJustOpened = changed.has("open") && this.open;
15353
+ if (changed.has("value") || dialogJustOpened) this._internalValue = this.value;
15354
+ if (changed.has("fileName") || dialogJustOpened) this._internalFileName = this.fileName;
15355
+ }
15356
+ get _hasContent() {
15357
+ return !!this._internalValue;
15358
+ }
15359
+ _handleConfirm() {
15360
+ this.dispatchEvent(new CustomEvent("pem-confirm", {
15361
+ detail: {
15362
+ value: this._internalValue,
15363
+ fileName: this._internalFileName
15364
+ },
15365
+ bubbles: true,
15366
+ composed: true
15367
+ }));
15368
+ }
15369
+ _handleClose() {
15370
+ this.dispatchEvent(new CustomEvent("pem-close", {
15371
+ bubbles: true,
15372
+ composed: true
15373
+ }));
15374
+ }
15375
+ _handleDownload() {
15376
+ const blob = new Blob([this._internalValue], { type: "text/plain" });
15377
+ const url = URL.createObjectURL(blob);
15378
+ const a = document.createElement("a");
15379
+ a.href = url;
15380
+ a.download = this._internalFileName || "certificate.pem";
15381
+ a.click();
15382
+ URL.revokeObjectURL(url);
15383
+ }
15384
+ async _handleFileUpload(e) {
15385
+ const input = e.target;
15386
+ const file = input.files?.[0];
15387
+ if (!file) return;
15388
+ this._internalFileName = file.name;
15389
+ this._internalValue = (await file.text()).trim();
15390
+ input.value = "";
15391
+ this.requestUpdate();
15392
+ }
15393
+ render() {
15394
+ return html`
15395
+ <axebow-dialog
15396
+ .open=${this.open}
15397
+ dialogTitle=${this.title}
15398
+ type="custom"
15399
+ canClose
15400
+ .onClose=${() => this._handleClose()}
15401
+ >
15402
+ <div slot="body" class="flex flex-col gap-4" style="min-width: 420px;">
15403
+ <p class="text-sm m-0">${this.noteText}</p>
15404
+ <div class="flex flex-col gap-1">
15405
+ <div class="flex flex-row justify-between items-center">
15406
+ <div class="flex items-center gap-1">
15407
+ <span class="text-[var(--axebow-error)] text-sm">*</span>
15408
+ <span class="text-sm font-bold">${this.fileContentLabel}</span>
15409
+ </div>
15410
+ ${this._hasContent ? html`
15411
+ <div class="flex items-center gap-2">
15412
+ <div
15413
+ class="cursor-pointer flex items-center gap-1"
15414
+ title="${this.downloadTooltip}"
15415
+ @click=${this._handleDownload}
15416
+ >
15417
+ <axebow-icon
15418
+ iconName="download_for_offline"
15419
+ iconColor="var(--axebow-tertiary)"
15420
+ size="md"
15421
+ ></axebow-icon>
15422
+ </div>
15423
+ <axebow-copy-icon
15424
+ .value=${this._internalValue}
15425
+ label="${this.copyLabel}"
15426
+ copyTooltip="${this.copyTooltip}"
15427
+ copiedText="${this.copiedText}"
15428
+ ></axebow-copy-icon>
15429
+ </div>
15430
+ ` : ""}
15431
+ </div>
15432
+ <textarea
15433
+ .value=${live(this._internalValue)}
15434
+ @input=${(e) => {
15435
+ this._internalValue = e.target.value;
15436
+ }}
15437
+ rows="8"
15438
+ placeholder=${this.placeholder}
15439
+ style="font-family: monospace; font-size: 0.75rem; border: 1px solid var(--axebow-border-gray); border-radius: 0.375rem; padding: 8px; resize: vertical; outline: none; width: 100%; box-sizing: border-box; transition: border-color 0.15s; background-color: white; color: black;"
15440
+ @focus=${(e) => {
15441
+ e.target.style.borderColor = "black";
15442
+ }}
15443
+ @blur=${(e) => {
15444
+ e.target.style.borderColor = "var(--axebow-border-gray)";
15445
+ }}
15446
+ ></textarea>
15447
+ </div>
15448
+ <span class="text-sm font-bold">${this.orUploadText}</span>
15449
+
15450
+ <div class="flex items-center justify-between gap-3">
15451
+ <label
15452
+ class="flex items-center gap-2 cursor-pointer px-3 py-1.5 rounded-lg transition-colors"
15453
+ style="border: 1px solid var(--axebow-border-gray); background: white;"
15454
+ @mouseenter=${(e) => {
15455
+ e.currentTarget.style.borderColor = "black";
15456
+ }}
15457
+ @mouseleave=${(e) => {
15458
+ e.currentTarget.style.borderColor = "var(--axebow-border-gray)";
15459
+ }}
15460
+ >
15461
+ <axebow-icon iconName="cloud_upload" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
15462
+ <span
15463
+ class="text-sm ${this._internalFileName ? "text-black" : "text-[var(--axebow-gray)]"}"
15464
+ style="white-space: nowrap;"
15465
+ >
15466
+ ${this._internalFileName ? this._internalFileName : this.acceptedFormatText}
15467
+ </span>
15468
+ <input
15469
+ type="file"
15470
+ accept=".pem,.crt,.key,.cer"
15471
+ style="display: none;"
15472
+ @change=${this._handleFileUpload}
15473
+ />
15474
+ </label>
15475
+
15476
+ <div class="flex items-center gap-2">
15477
+ <axebow-button
15478
+ variant="primary"
15479
+ size="medium"
15480
+ ?disabled=${!this._hasContent}
15481
+ @click=${this._handleConfirm}
15482
+ >
15483
+ ${this.saveLabel}
15484
+ </axebow-button>
15485
+ <axebow-button variant="primary" outline size="medium" @click=${this._handleClose}
15486
+ >${this.goBackLabel}</axebow-button
15487
+ >
15488
+ </div>
15489
+ </div>
15490
+ </div>
15491
+ </axebow-dialog>
15492
+ `;
15493
+ }
15494
+ };
15495
+ __decorate([property({ type: Boolean })], AxebowPemDialog.prototype, "open", void 0);
15496
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "title", void 0);
15497
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "placeholder", void 0);
15498
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "value", void 0);
15499
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "fileName", void 0);
15500
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "noteText", void 0);
15501
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "fileContentLabel", void 0);
15502
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "downloadTooltip", void 0);
15503
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "copyLabel", void 0);
15504
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "copyTooltip", void 0);
15505
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "copiedText", void 0);
15506
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "orUploadText", void 0);
15507
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "acceptedFormatText", void 0);
15508
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "saveLabel", void 0);
15509
+ __decorate([property({ type: String })], AxebowPemDialog.prototype, "goBackLabel", void 0);
15510
+ __decorate([state()], AxebowPemDialog.prototype, "_internalValue", void 0);
15511
+ __decorate([state()], AxebowPemDialog.prototype, "_internalFileName", void 0);
15512
+ AxebowPemDialog = __decorate([customElement("axebow-pem-dialog")], AxebowPemDialog);
15513
+ //#endregion
15514
+ //#region src/components/axebow-plan-providers-modal/axebow-plan-providers-modal.ts
15515
+ var AxebowPlanProvidersModal = class AxebowPlanProvidersModal extends LitElement {
15516
+ constructor(..._args) {
15517
+ super(..._args);
15518
+ this.plansProviders = [];
15519
+ this.open = false;
15520
+ this.title = "";
15521
+ this.description = "";
15522
+ this.createPlanLabel = "";
15523
+ this.selectedPlanProvider = null;
15524
+ }
15525
+ static {
15526
+ this.styles = [unsafeCSS(tailwind_default), axebowTheme];
15527
+ }
15528
+ _handleSelect(providerName) {
15529
+ this.selectedPlanProvider = providerName;
15530
+ }
15531
+ _handleClose() {
15532
+ this.open = false;
15533
+ this.selectedPlanProvider = null;
15534
+ this.dispatchEvent(new CustomEvent("close"));
15535
+ }
15536
+ _handleConfirm() {
15537
+ if (!this.selectedPlanProvider) return;
15538
+ this.dispatchEvent(new CustomEvent("confirm", { detail: { providerName: this.selectedPlanProvider } }));
15539
+ this._handleClose();
15540
+ }
15541
+ render() {
15542
+ return html`
15543
+ <axebow-modals-confirmation
15544
+ .open=${this.open}
15545
+ severity="Neutral"
15546
+ intent="Decisional"
15547
+ popUpTittle="${this.title}"
15548
+ .showIconOnTitle=${false}
15549
+ .showForm=${true}
15550
+ .showFooter=${true}
15551
+ .showSecondaryCTA=${false}
15552
+ .showPrimaryCTA=${true}
15553
+ primaryButtonText="${this.createPlanLabel}"
15554
+ .primaryButtonDisabled=${!this.selectedPlanProvider}
15555
+ .canClose=${true}
15556
+ @axebow-close=${() => this._handleClose()}
15557
+ @axebow-confirm=${() => this._handleConfirm()}
15558
+ >
15559
+ <div slot="form" class="flex flex-col gap-4">
15560
+ <p class="m-0 text-black">${unsafeHTML(this.description)}</p>
15561
+ <div class="flex flex-col gap-3">
15562
+ ${this.plansProviders.map((provider) => html`
15563
+ <label class="flex items-center gap-2 cursor-pointer">
15564
+ <input
15565
+ type="radio"
15566
+ name="planProvider"
15567
+ value="${provider.name}"
15568
+ .checked=${this.selectedPlanProvider === provider.name}
15569
+ @change=${() => this._handleSelect(provider.name)}
15570
+ class="accent-(--axebow-tertiary) w-4 h-4"
15571
+ />
15572
+ <span class="font-semibold">${provider.name}</span>
15573
+ </label>
15574
+ `)}
15575
+ </div>
15576
+ </div>
15577
+ </axebow-modals-confirmation>
15578
+ `;
15579
+ }
15580
+ };
15581
+ __decorate([property({ type: Array })], AxebowPlanProvidersModal.prototype, "plansProviders", void 0);
15582
+ __decorate([property({
15583
+ type: Boolean,
15584
+ reflect: true
15585
+ })], AxebowPlanProvidersModal.prototype, "open", void 0);
15586
+ __decorate([property({ type: String })], AxebowPlanProvidersModal.prototype, "title", void 0);
15587
+ __decorate([property({ type: String })], AxebowPlanProvidersModal.prototype, "description", void 0);
15588
+ __decorate([property({ type: String })], AxebowPlanProvidersModal.prototype, "createPlanLabel", void 0);
15589
+ __decorate([state()], AxebowPlanProvidersModal.prototype, "selectedPlanProvider", void 0);
15590
+ AxebowPlanProvidersModal = __decorate([customElement("axebow-plan-providers-modal")], AxebowPlanProvidersModal);
15591
+ //#endregion
15592
+ //#region src/components/axebow-delete-data-popup/axebow-delete-data-popup.ts
15593
+ var AxebowDeleteDataPopup = class AxebowDeleteDataPopup extends LitElement {
15594
+ constructor(..._args) {
15595
+ super(..._args);
15596
+ this.open = false;
15597
+ this.title = "";
15598
+ this.description = "";
15599
+ this.icon = "";
15600
+ this.iconColor = "danger";
15601
+ this.validationPlaceholder = "";
15602
+ this.validationLabel = "";
15603
+ this.validationHelpText = "";
15604
+ this.buttonVariant = "danger";
15605
+ this.buttonLabel = "";
15606
+ this.canCancel = true;
15607
+ this.cancelLabel = "";
15608
+ this.typePrefixText = "";
15609
+ this.typeSuffixText = "";
15610
+ this._inputValue = "";
15611
+ }
15612
+ static {
15613
+ this.styles = [
15614
+ unsafeCSS(tailwind_default),
15615
+ axebowTheme,
15616
+ css`
15617
+ :host {
15618
+ display: block;
15619
+ }
15620
+ axebow-input {
15621
+ width: 100%;
15622
+ }
15623
+ `
15624
+ ];
15625
+ }
15626
+ _handleInput(e) {
15627
+ const target = e.target;
15628
+ this._inputValue = target?.value ?? "";
15629
+ }
15630
+ get _isDeleteEnabled() {
15631
+ if (!this.validationValue) return true;
15632
+ return this._inputValue === this.validationValue;
15633
+ }
15634
+ _handleClose() {
15635
+ this._inputValue = "";
15636
+ this.onClose?.();
15637
+ this.dispatchEvent(new CustomEvent("close", {
15638
+ bubbles: true,
15639
+ composed: true
15640
+ }));
15641
+ }
15642
+ _handleConfirm() {
15643
+ this.onDelete?.();
15644
+ this._handleClose();
15645
+ }
15646
+ get _iconColorVar() {
15647
+ switch (this.iconColor) {
15648
+ case "warning": return "var(--axebow-warning)";
15649
+ case "primary": return "var(--axebow-tertiary)";
15650
+ case "success": return "var(--axebow-success)";
15651
+ case "danger": return "var(--axebow-error)";
15652
+ default: return "var(--axebow-primary)";
15653
+ }
15654
+ }
15655
+ render() {
15656
+ const isDestructive = this.buttonVariant === "danger";
15657
+ const severity = isDestructive ? "Destructive" : "Neutral";
15658
+ const confirmIcon = this.icon || (isDestructive ? "error" : "info");
15659
+ return html`
15660
+ <axebow-modals-confirmation
15661
+ .open=${this.open}
15662
+ severity=${severity}
15663
+ intent="Decisional"
15664
+ .popUpTittle=${this.title}
15665
+ textBody=""
15666
+ iconName=${confirmIcon}
15667
+ iconColor=${this._iconColorVar}
15668
+ .showForm=${false}
15669
+ .showFooter=${true}
15670
+ .showSecondaryCTA=${this.canCancel}
15671
+ .showPrimaryCTA=${true}
15672
+ .secondaryButtonText=${this.cancelLabel}
15673
+ .primaryButtonText=${this.buttonLabel}
15674
+ .primaryButtonDisabled=${!this._isDeleteEnabled}
15675
+ .canClose=${true}
15676
+ .entityName=${this.validationValue || "item"}
15677
+ @axebow-close=${() => this._handleClose()}
15678
+ @axebow-cancel=${() => this._handleClose()}
15679
+ @axebow-confirm=${() => this._handleConfirm()}
15680
+ >
15681
+ <div slot="body" class="flex flex-col gap-4">
15682
+ <slot>
15683
+ ${this.description ? html`<p class="m-0 text-black font-normal leading-relaxed">${this.description}</p>` : ""}
15684
+ </slot>
15685
+ ${this.validationValue ? html`
15686
+ <div class="flex flex-col gap-2">
15687
+ <label class="font-semibold text-black m-0 flex items-center gap-1">
15688
+ <span class="text-[#E93A3A] font-bold">*</span>
15689
+ <p>
15690
+ ${this.typePrefixText}<span class="text-[#344966] font-bold">${this.validationValue}</span
15691
+ >${this.typeSuffixText}
15692
+ </p>
15693
+ </label>
15694
+ <axebow-input
15695
+ controlType="input"
15696
+ ?compact=${true}
15697
+ .placeholder=${this.validationPlaceholder || this.validationValue}
15698
+ .value=${this._inputValue}
15699
+ .callback=${(e) => this._handleInput(e)}
15700
+ @keydown=${(e) => {
15701
+ if (e.key === "Enter" && this._isDeleteEnabled) this._handleConfirm();
15702
+ }}
15703
+ ></axebow-input>
15704
+ </div>
15705
+ ` : ""}
15706
+ </div>
15707
+ </axebow-modals-confirmation>
15708
+ `;
15709
+ }
15710
+ };
15711
+ __decorate([property({ type: Boolean })], AxebowDeleteDataPopup.prototype, "open", void 0);
15712
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "title", void 0);
15713
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "description", void 0);
15714
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "icon", void 0);
15715
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "iconColor", void 0);
15716
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "validationValue", void 0);
15717
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "validationPlaceholder", void 0);
15718
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "validationLabel", void 0);
15719
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "validationHelpText", void 0);
15720
+ __decorate([property({ type: Function })], AxebowDeleteDataPopup.prototype, "onDelete", void 0);
15721
+ __decorate([property({ type: Function })], AxebowDeleteDataPopup.prototype, "onClose", void 0);
15722
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "buttonVariant", void 0);
15723
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "buttonLabel", void 0);
15724
+ __decorate([property({ type: Boolean })], AxebowDeleteDataPopup.prototype, "canCancel", void 0);
15725
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "cancelLabel", void 0);
15726
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "typePrefixText", void 0);
15727
+ __decorate([property({ type: String })], AxebowDeleteDataPopup.prototype, "typeSuffixText", void 0);
15728
+ __decorate([state()], AxebowDeleteDataPopup.prototype, "_inputValue", void 0);
15729
+ AxebowDeleteDataPopup = __decorate([customElement("axebow-delete-data-popup")], AxebowDeleteDataPopup);
15730
+ //#endregion
15731
+ //#region src/components/axebow-learning-center/axebow-learning-center.ts
15732
+ var AxebowLearningCenter = class AxebowLearningCenter extends LitElement {
15733
+ static {
15734
+ this.styles = [unsafeCSS(tailwind_default), css`
15735
+ sl-carousel {
15736
+ --slide-gap: 4px;
15737
+ }
15738
+ marketplace-card {
15739
+ transition: transform 0.3s ease;
15740
+ }
15741
+ .marketplace-carousel::part(base) {
15742
+ min-height: 320px;
15743
+ gap: 0 4px;
15744
+ }
15745
+
15746
+ @media (max-width: 767px) {
15747
+ sl-carousel {
15748
+ --slide-gap: 8px;
15749
+ }
15750
+ sl-card::part(body) {
15751
+ padding: 0;
15752
+ }
15753
+ }
15754
+ `];
15755
+ }
15756
+ constructor() {
15757
+ super();
15758
+ this.items = [];
15759
+ this.highlightedComponentsLabel = "";
15760
+ this.marketplaceLabel = "";
15761
+ this.expanded = false;
15762
+ this.slidesPerPage = 3.2;
15763
+ this.resizeHandler = () => {
15764
+ this.updateCarouselSettings();
15765
+ };
15766
+ }
15767
+ connectedCallback() {
15768
+ super.connectedCallback();
15769
+ this.updateCarouselSettings();
15770
+ window.addEventListener("resize", this.resizeHandler);
15771
+ }
15772
+ disconnectedCallback() {
15773
+ super.disconnectedCallback();
15774
+ window.removeEventListener("resize", this.resizeHandler);
15775
+ }
15776
+ updateCarouselSettings() {
15777
+ const width = window.innerWidth;
15778
+ let newSlidesPerPage;
15779
+ if (width >= 1536) newSlidesPerPage = 3.2;
15780
+ else if (width >= 1280) newSlidesPerPage = 2.7;
15781
+ else if (width >= 1024) newSlidesPerPage = 2.2;
15782
+ else if (width >= 768) newSlidesPerPage = 1.8;
15783
+ else if (width >= 640) newSlidesPerPage = 1.3;
15784
+ else newSlidesPerPage = 1.1;
15785
+ if (this.slidesPerPage !== newSlidesPerPage) this.slidesPerPage = newSlidesPerPage;
15786
+ }
15787
+ render() {
15788
+ return html`
15789
+ <sl-card class="w-full mb-4 rounded-sm flex flex-col gap-2">
15790
+ <div class="flex items-center gap-4 max-[46.875rem]:gap-2 p-4 ${this.expanded ? "pb-0" : ""}">
15791
+ <axebow-icon
15792
+ class="rounded-sm cursor-pointer flex-shrink-0"
15793
+ iconName="expand_all"
15794
+ iconColor="var(--axebow-tertiary)"
15795
+ @click="${() => this.expanded = !this.expanded}"
15796
+ ></axebow-icon>
15797
+ <p
15798
+ class="text-[var(--axebow-primary)] font-bold text-base sm:text-lg lg:text-xl max-[46.875rem]:text-sm leading-tight"
15799
+ >
15800
+ ${this.highlightedComponentsLabel}
15801
+ <span class="text-[var(--axebow-clickable-blue)] font-medium">@</span>
15802
+ ${this.marketplaceLabel}
15803
+ </p>
15804
+ <axebow-icon iconName="deployed_code" class="ml-auto flex-shrink-0" size="xl"></axebow-icon>
15805
+ </div>
15806
+ ${this.expanded ? html`
15807
+ <sl-carousel
15808
+ class="marketplace-carousel w-full"
15809
+ navigation
15810
+ slides-per-page="${this.slidesPerPage}"
15811
+ slides-per-move="1"
15812
+ >
15813
+ ${this.items.map((item) => html`
15814
+ <sl-carousel-item class="flex justify-center items-center px-0.5 sm:px-1">
15815
+ <marketplace-card .item=${item} class="block w-full origin-center"></marketplace-card>
15816
+ </sl-carousel-item>
15817
+ `)}
15818
+ </sl-carousel>
15819
+ ` : html``}
15820
+ </sl-card>
15821
+ `;
15822
+ }
15823
+ };
15824
+ __decorate([property({ attribute: false })], AxebowLearningCenter.prototype, "items", void 0);
15825
+ __decorate([property({ type: String })], AxebowLearningCenter.prototype, "highlightedComponentsLabel", void 0);
15826
+ __decorate([property({ type: String })], AxebowLearningCenter.prototype, "marketplaceLabel", void 0);
15827
+ __decorate([state()], AxebowLearningCenter.prototype, "expanded", void 0);
15828
+ __decorate([state()], AxebowLearningCenter.prototype, "slidesPerPage", void 0);
15829
+ AxebowLearningCenter = __decorate([customElement("axebow-learning-center")], AxebowLearningCenter);
15830
+ //#endregion
15831
+ //#region src/components/axebow-paginated-table/axebow-paginated-table.ts
15832
+ var AxebowPaginatedTable = class AxebowPaginatedTable extends LitElement {
15833
+ constructor(..._args) {
15834
+ super(..._args);
15835
+ this.data = [];
15836
+ this.rowsPerPage = 10;
15837
+ this.invoiceLabel = "";
15838
+ this.downloadLabel = "";
15839
+ this.currentPage = 1;
15840
+ }
15841
+ static {
15842
+ this.styles = css`
15843
+ table {
15844
+ width: 100%;
15845
+ border-collapse: collapse;
15846
+ margin-bottom: 20px;
15847
+ }
15848
+
15849
+ th,
15850
+ td {
15851
+ padding: 8px;
15852
+ text-align: center;
15853
+ }
15854
+
15855
+ th {
15856
+ background-color: #f4f4f4;
15857
+ }
15858
+
15859
+ .pagination {
15860
+ display: flex;
15861
+ justify-content: center;
15862
+ list-style-type: none;
15863
+ padding: 0;
15864
+ }
15865
+
15866
+ .pagination li {
15867
+ margin: 0 5px;
15868
+ }
15869
+
15870
+ .pagination button {
15871
+ padding: 8px 12px;
15872
+ border: 1px solid #ddd;
15873
+ background-color: #fff;
15874
+ cursor: pointer;
15875
+ }
15876
+
15877
+ .pagination button.active {
15878
+ background-color: #007bff;
15879
+ color: #fff;
15880
+ border-color: #007bff;
15881
+ }
15882
+
15883
+ .pagination button:hover:not(.active) {
15884
+ background-color: #ddd;
15885
+ }
15886
+ .invoice-container {
15887
+ width: 100%;
15888
+ display: flex;
15889
+ gap: 32px;
15890
+ align-items: center;
15891
+ }
15892
+ .invoice-card {
15893
+ width: 100%;
15894
+ }
15895
+ .axebow-secondary-blue {
15896
+ color: var(--axebow-tertiary);
15897
+ }
15898
+ .invoice-info-header {
15899
+ display: flex;
15900
+ flex-direction: row;
15901
+ gap: 4px;
15902
+ flex-grow: 1;
15903
+ color: var(--axebow-black);
15904
+ }
15905
+ .download-button {
15906
+ margin-left: auto;
15907
+ }
15908
+ .invoice-info {
15909
+ display: flex;
15910
+ flex-direction: column;
15911
+ gap: 8px;
15912
+ color: var(--axebow-secondary);
15913
+ }
15914
+ `;
15915
+ }
15916
+ get paginatedData() {
15917
+ const start = (this.currentPage - 1) * this.rowsPerPage;
15918
+ const end = start + this.rowsPerPage;
15919
+ return this.data.slice(start, end);
15920
+ }
15921
+ get totalPages() {
15922
+ return Math.ceil(this.data.length / this.rowsPerPage);
15923
+ }
15924
+ goToPage(page) {
15925
+ if (page >= 1 && page <= this.totalPages) {
15926
+ this.currentPage = page;
15927
+ this.requestUpdate();
15928
+ }
15929
+ }
15930
+ render() {
15931
+ return html`
15932
+ <table>
15933
+ <thead></thead>
15934
+ <tbody>
15935
+ ${this.paginatedData.map((item) => html`
15936
+ <tr>
15937
+ <sl-card class="invoice-card">
15938
+ <div class="invoice-container">
15939
+ <sl-icon-button name="gear" class="axebow-secondary-blue"></sl-icon-button>
15940
+ <div class="invoice-info">
15941
+ <div class="invoice-info-header">
15942
+ <span><span class="font-semibold">${item.customerName}</span></span>
15943
+ <span>|</span>
15944
+ <span><span class="font-semibold">CIF: ${item.customerCif}</span></span>
15945
+ <span>|</span>
15946
+ <span class="axebow-secondary-blue">${this.invoiceLabel} ${item.invoiceNumber}</span>
15947
+ <span><span class="font-semibold">(${item.invoiceAmount} €)</span></span>
15948
+ </div>
15949
+ <span>${item.invoiceDocument}</span>
15950
+ <span>${item.invoiceDate}</span>
15951
+ </div>
15952
+ <axebow-button variant="primary" outline class="download-button"
15953
+ >${this.downloadLabel}</axebow-button
15954
+ >
15955
+ </div>
15956
+ </sl-card>
15957
+ </tr>
15958
+ `)}
15959
+ </tbody>
15960
+ </table>
15961
+ <ul class="pagination">
15962
+ ${Array.from({ length: this.totalPages }, (_, i) => i + 1).map((page) => html`
15963
+ <li>
15964
+ <button class=${page === this.currentPage ? "active" : ""} @click=${() => this.goToPage(page)}>
15965
+ ${page}
15966
+ </button>
15967
+ </li>
15968
+ `)}
15969
+ </ul>
15970
+ `;
15971
+ }
15972
+ };
15973
+ __decorate([property({ type: Array })], AxebowPaginatedTable.prototype, "data", void 0);
15974
+ __decorate([property({ type: Number })], AxebowPaginatedTable.prototype, "rowsPerPage", void 0);
15975
+ __decorate([property({ type: String })], AxebowPaginatedTable.prototype, "invoiceLabel", void 0);
15976
+ __decorate([property({ type: String })], AxebowPaginatedTable.prototype, "downloadLabel", void 0);
15977
+ __decorate([state()], AxebowPaginatedTable.prototype, "currentPage", void 0);
15978
+ AxebowPaginatedTable = __decorate([customElement("axebow-paginated-table")], AxebowPaginatedTable);
15979
+ //#endregion
15980
+ //#region src/components/axebow-carousel/axebow-carousel.ts
15981
+ var AxebowCarousel = class AxebowCarousel extends LitElement {
15982
+ constructor(..._args) {
15983
+ super(..._args);
15984
+ this.data = [
15985
+ {
15986
+ title: "Slide 1",
15987
+ content: "Slide 1 content",
15988
+ logo: "logo1"
15989
+ },
15990
+ {
15991
+ title: "Slide 2",
15992
+ content: "Slide 2 content",
15993
+ logo: "logo2"
15994
+ },
15995
+ {
15996
+ title: "Slide 3",
15997
+ content: "Slide 3 content",
15998
+ logo: "logo3"
15999
+ }
16000
+ ];
16001
+ this.type = "basic";
16002
+ this.numSlides = 3;
16003
+ this.title = "";
16004
+ this.deployLabel = "";
16005
+ this.learnMoreLabel = "";
16006
+ }
16007
+ static {
16008
+ this.styles = [axebowTheme, css`
16009
+ :host {
16010
+ display: block;
16011
+ }
16012
+
16013
+ sl-carousel {
16014
+ --slide-spacing: 8px;
16015
+ --pagination-spacing: 8px;
16016
+ }
16017
+
16018
+ @media (max-width: 1200px) {
16019
+ sl-carousel {
16020
+ --slide-spacing: 6px;
16021
+ --pagination-spacing: 6px;
16022
+ }
16023
+ }
16024
+
16025
+ @media (max-width: 480px) {
16026
+ sl-carousel {
16027
+ --slide-spacing: 4px;
16028
+ --pagination-spacing: 4px;
16029
+ }
16030
+ }
16031
+ `];
16032
+ }
16033
+ render() {
16034
+ return html`
16035
+ <div>
16036
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
16037
+ <sl-carousel navigation slides-per-page="${this.numSlides}" slides-per-move="1">
16038
+ ${this.data.map((item) => html`
16039
+ <sl-carousel-item class="py-2">
16040
+ <sl-card
16041
+ class="w-full h-auto flex flex-col justify-between bg-(--axebow-white) rounded-lg overflow-hidden transition-transform hover:-translate-y-1 max-h-750 md:max-h-75 sm:max-h-56"
16042
+ >
16043
+ <div class="flex items-center mb-4">
16044
+ <img
16045
+ src="${item.logo}"
16046
+ class="max-h-12 max-w-12 mr-3 rounded"
16047
+ alt="${item.title} logo"
16048
+ />
16049
+ <div class="flex flex-col justify-between w-full">
16050
+ <h3 class="font-bold text-(--axebow-black)">${item.title}</h3>
16051
+ ${this.type === "extra" ? html` <div
16052
+ class="flex justify-between items-center text-sm text-(--axebow-secondary) mt-1 w-full"
16053
+ >
16054
+ <div class="flex items-center">
16055
+ <axebow-icon
16056
+ iconName="memory"
16057
+ iconColor="var(--axebow-secondary)"
16058
+ size="md"
16059
+ class="mr-1"
16060
+ ></axebow-icon>
16061
+ <span class="mr-2">${item.cpu || "N/A"} |</span>
16062
+ <axebow-icon
16063
+ iconName="memory_alt"
16064
+ rotate="90"
16065
+ iconColor="var(--axebow-secondary)"
16066
+ size="md"
16067
+ class="mr-1"
16068
+ ></axebow-icon>
16069
+ <span class="mr-2">${item.storage || "N/A"}</span>
16070
+ </div>
16071
+ <span
16072
+ class="bg-(--axebow-base) rounded px-2 py-0.5 text-sm text-(--axebow-secondary) border border-(--axebow-white) ml-auto"
16073
+ >${item.version || "v0.0.0"}</span
16074
+ >
16075
+ </div>` : ""}
16076
+ </div>
16077
+ </div>
16078
+
16079
+ <div
16080
+ class="text-sm text-(--axebow-secondary) mb-4 text-left min-h-12 overflow-hidden text-ellipsis line-clamp-3 grow"
16081
+ >
16082
+ ${item.content}
16083
+ </div>
16084
+ <div class="flex justify-between items-center">
16085
+ <axebow-button
16086
+ variant="text"
16087
+ class="flex items-center text-(--axebow-secondary) text-base bg-transparent border-none p-0 mt-auto"
16088
+ @click=${() => this.dispatchEvent(new CustomEvent("deploy", {
16089
+ detail: { name: item.title },
16090
+ bubbles: true,
16091
+ composed: true
16092
+ }))}
16093
+ >
16094
+ <axebow-icon
16095
+ iconName="sound_sampler"
16096
+ slot="prefix"
16097
+ iconColor="var(--axebow-tertiary)"
16098
+ size="md"
16099
+ class="mr-2 text-xl align-middle shrink-0"
16100
+ ></axebow-icon>
16101
+ ${this.deployLabel}
16102
+ </axebow-button>
16103
+ <a href="#" class="text-(--axebow-tertiary) no-underline hover:underline"
16104
+ >${this.learnMoreLabel}</a
16105
+ >
16106
+ </div>
16107
+ </sl-card>
16108
+ </sl-carousel-item>
16109
+ `)}
16110
+ </sl-carousel>
16111
+ </div>
16112
+ </div>
16113
+ `;
16114
+ }
16115
+ };
16116
+ __decorate([property({ type: Array })], AxebowCarousel.prototype, "data", void 0);
16117
+ __decorate([property({ type: String })], AxebowCarousel.prototype, "type", void 0);
16118
+ __decorate([property({ type: Number })], AxebowCarousel.prototype, "numSlides", void 0);
16119
+ __decorate([property({ type: String })], AxebowCarousel.prototype, "title", void 0);
16120
+ __decorate([property({ type: String })], AxebowCarousel.prototype, "deployLabel", void 0);
16121
+ __decorate([property({ type: String })], AxebowCarousel.prototype, "learnMoreLabel", void 0);
16122
+ AxebowCarousel = __decorate([customElement("axebow-carousel")], AxebowCarousel);
16123
+ //#endregion
16124
+ //#region src/components/wizard-page-layout/wizard-page-layout.ts
16125
+ var zoomLayoutStyles = css`
16126
+ .zoom-page-container {
16127
+ box-sizing: border-box;
16128
+ width: 100%;
16129
+ padding-inline-start: calc(max(0.938rem, (100% - 73.5rem * var(--zoom, 1)) * 0.5 - 2.5rem));
16130
+ padding-inline-end: calc(max(6rem, (100% - 73.5rem * var(--zoom, 1)) * 0.5 + 2.5rem));
16131
+ }
16132
+
16133
+ .zoom-page-container.no-sidebar {
16134
+ padding-inline-start: calc(max(6rem, (100% - 73.5rem * var(--zoom, 1)) * 0.5));
16135
+ padding-inline-end: calc(max(6rem, (100% - 73.5rem * var(--zoom, 1)) * 0.5));
16136
+ }
16137
+
16138
+ .zoom-container {
16139
+ width: 73.5rem;
16140
+ zoom: var(--zoom, 1);
16141
+ }
16142
+ `;
16143
+ var WizardPageLayout = class WizardPageLayout extends LitElement {
16144
+ constructor(..._args) {
16145
+ super(..._args);
16146
+ this.mainPage = "";
16147
+ this.secondaryPages = [];
16148
+ this.showRequiredField = true;
16149
+ this.requiredFieldLabel = "";
16150
+ this.minHeight = "100%";
16151
+ this.zoomLevel = 1;
16152
+ this.hasSummary = true;
16153
+ this.showDivider = true;
16154
+ this.gapClass = "gap-[4%] lg:gap-7.75";
16155
+ this.contentColumnClass = "lg:w-194.5";
16156
+ this.errorMessage = "";
16157
+ }
16158
+ static {
16159
+ this.styles = [
16160
+ unsafeCSS(tailwind_default),
16161
+ axebowTheme,
16162
+ zoomLayoutStyles,
16163
+ css`
16164
+ :host {
16165
+ display: block;
16166
+ width: 100%;
16167
+ }
16168
+ `
16169
+ ];
16170
+ }
16171
+ render() {
16172
+ return html`
16173
+ <div class="zoom-page-container no-sidebar" style="--zoom: ${this.zoomLevel};">
16174
+ <div class="zoom-container flex flex-col" style="min-height: ${this.minHeight};">
16175
+ ${this.hasSummary ? html`
16176
+ <div class="flex w-full ${this.gapClass} lg:flex-row flex-col-reverse relative flex-1">
16177
+ <div
16178
+ class="w-full ${this.hasSummary ? this.contentColumnClass : ""} transition-all duration-300 flex flex-col flex-1 justify-between"
16179
+ >
16180
+ <div>
16181
+ <axebow-breadcrumb-header
16182
+ ?showSecondaryPages=${this.secondaryPages.length > 0}
16183
+ .secondaryPages=${this.secondaryPages}
16184
+ mainPage=${this.mainPage}
16185
+ ?showRequiredField=${this.showRequiredField}
16186
+ requiredFieldLabel=${this.requiredFieldLabel}
16187
+ paddingBottom="1rem"
16188
+ .onHomeClick=${this.onHomeClick}
16189
+ ></axebow-breadcrumb-header>
16190
+
16191
+ ${this.showDivider ? html`<axebow-divider margin="0"></axebow-divider>` : ""}
16192
+ ${this.errorMessage ? html`
16193
+ <div
16194
+ class="flex items-center gap-2 p-3 rounded-md bg-(--axebow-error-light) text-(--axebow-error)"
16195
+ >
16196
+ <sl-icon name="exclamation-circle"></sl-icon>
16197
+ <span>${this.errorMessage}</span>
16198
+ </div>
16199
+ ` : ""}
16200
+
16201
+ <div class="flex-1">
16202
+ <slot name="content"></slot>
16203
+ </div>
16204
+ </div>
16205
+
16206
+ <slot name="footer"></slot>
16207
+ </div>
16208
+
16209
+ <div class="w-full lg:w-auto flex flex-col flex-1 h-full pt-11.75">
16210
+ <slot name="summary"></slot>
16211
+ </div>
16212
+ </div>
16213
+ ` : html`
16214
+ <div class="flex flex-col flex-1 pb-0 justify-between">
16215
+ <div>
16216
+ <axebow-breadcrumb-header
16217
+ ?showSecondaryPages=${this.secondaryPages.length > 0}
16218
+ .secondaryPages=${this.secondaryPages}
16219
+ mainPage=${this.mainPage}
16220
+ ?showRequiredField=${this.showRequiredField}
16221
+ requiredFieldLabel=${this.requiredFieldLabel}
16222
+ paddingBottom="1rem"
16223
+ .onHomeClick=${this.onHomeClick}
16224
+ ></axebow-breadcrumb-header>
16225
+
16226
+ ${this.showDivider ? html`<axebow-divider margin="0"></axebow-divider>` : ""}
16227
+ ${this.errorMessage ? html`
16228
+ <div
16229
+ class="flex items-center gap-2 p-3 rounded-md bg-(--axebow-error-light) text-(--axebow-error)"
16230
+ >
16231
+ <sl-icon name="exclamation-circle"></sl-icon>
16232
+ <span>${this.errorMessage}</span>
16233
+ </div>
16234
+ ` : ""}
16235
+
16236
+ <div class="flex-1">
16237
+ <slot name="content"></slot>
16238
+ </div>
16239
+ </div>
16240
+
16241
+ <slot name="footer"></slot>
16242
+ </div>
16243
+ `}
16244
+ </div>
16245
+
16246
+ <slot name="dialogs"></slot>
16247
+ </div>
16248
+ `;
16249
+ }
16250
+ };
16251
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "mainPage", void 0);
16252
+ __decorate([property({ type: Array })], WizardPageLayout.prototype, "secondaryPages", void 0);
16253
+ __decorate([property({ type: Boolean })], WizardPageLayout.prototype, "showRequiredField", void 0);
16254
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "requiredFieldLabel", void 0);
16255
+ __decorate([property({ attribute: false })], WizardPageLayout.prototype, "onHomeClick", void 0);
16256
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "minHeight", void 0);
16257
+ __decorate([property({ type: Number })], WizardPageLayout.prototype, "zoomLevel", void 0);
16258
+ __decorate([property({ type: Boolean })], WizardPageLayout.prototype, "hasSummary", void 0);
16259
+ __decorate([property({ type: Boolean })], WizardPageLayout.prototype, "showDivider", void 0);
16260
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "gapClass", void 0);
16261
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "contentColumnClass", void 0);
16262
+ __decorate([property({ type: String })], WizardPageLayout.prototype, "errorMessage", void 0);
16263
+ WizardPageLayout = __decorate([customElement("wizard-page-layout")], WizardPageLayout);
16264
+ //#endregion
16265
+ //#region src/components/axebow-premium-plan-popup/axebow-premium-plan-popup.ts
16266
+ var AxebowPremiumPlanPopup = class AxebowPremiumPlanPopup extends LitElement {
16267
+ constructor(..._args) {
16268
+ super(..._args);
16269
+ this.open = false;
16270
+ this.price = 6;
16271
+ this.greatChoiceLabel = "";
16272
+ this.premiumPlanLabel = "";
16273
+ this.whatBestSuitsLabel = "";
16274
+ this.perVcpuMonthLabel = "";
16275
+ this.basedOnUsageLabel = "";
16276
+ this.allPremiumFeaturesLabel = "";
16277
+ this.credentialsWithLabel = "";
16278
+ this.noVcpuLimitsLabel = "";
16279
+ this.deployInLabel = "";
16280
+ this.ownEnvironmentsLabel = "";
16281
+ this.unlimitedLabel = "";
16282
+ this.privateContainersLabel = "";
16283
+ this.iaasBudgetLabel = "";
16284
+ this.featureLabel = "";
16285
+ this.draftsLabel = "";
16286
+ this.support247Label = "";
16287
+ this.withSlaLabel = "";
16288
+ this.continueLabel = "";
16289
+ this.anotherTimeLabel = "";
16290
+ }
16291
+ static {
16292
+ this.styles = css`
16293
+ sl-dialog::part(panel) {
16294
+ border-radius: 0.375rem;
16295
+ background-color: var(--axebow-success);
16296
+ height: 80vh;
16297
+ min-width: 300px;
16298
+ max-width: 90%;
16299
+ overflow: hidden;
16300
+ padding: 0 1rem;
16301
+ margin: 0;
16302
+ }
16303
+
16304
+ sl-dialog::part(header) {
16305
+ text-align: center;
16306
+ color: white;
16307
+ padding: 0.15rem 1rem;
16308
+ margin: 0;
16309
+ }
16310
+
16311
+ sl-dialog::part(body) {
16312
+ padding: 0;
16313
+ margin: 0;
16314
+ }
16315
+
16316
+ sl-dialog::part(footer) {
16317
+ display: flex;
16318
+ flex-direction: column;
16319
+ gap: 0.25rem;
16320
+ padding: 1rem;
16321
+ }
16322
+
16323
+ .plan-summary {
16324
+ width: 100%;
16325
+ height: 100%;
16326
+ margin: 0;
16327
+ padding: 0;
16328
+ }
16329
+
16330
+ .plan-summary h2 {
16331
+ font-size: 1.25rem;
16332
+ margin: 0;
16333
+ }
16334
+
16335
+ .price-container {
16336
+ display: flex;
16337
+ align-items: baseline;
16338
+ margin: 0.5rem 0;
16339
+ }
16340
+
16341
+ .price-container h1 {
16342
+ margin: 0;
16343
+ font-size: 2.5rem;
16344
+ margin-right: 0.5rem;
16345
+ }
16346
+
16347
+ .price-info h3 {
16348
+ margin: 0;
16349
+ }
16350
+
16351
+ .text-with-icon {
16352
+ display: flex;
16353
+ align-items: center;
16354
+ margin: 0.5rem 0;
16355
+ }
16356
+
16357
+ .text-with-icon p {
16358
+ margin-top: 0;
16359
+ margin-bottom: 0;
16360
+ }
16361
+
16362
+ .text-with-icon axebow-icon {
16363
+ margin-right: 0.5rem;
16364
+ }
16365
+
16366
+ .popup-button {
16367
+ width: 50%;
16368
+ }
16369
+
16370
+ .popup-buttons {
16371
+ display: flex;
16372
+ flex-direction: column;
16373
+ gap: 1rem;
16374
+ align-items: center;
16375
+ }
16376
+ `;
16377
+ }
16378
+ render() {
16379
+ return html`
16380
+ <sl-dialog
16381
+ label="${this.greatChoiceLabel}"
16382
+ ?open=${this.open}
16383
+ @sl-after-hide=${this._onDialogClosed}
16384
+ @sl-request-close=${this._onRequestClose}
16385
+ class="summary"
16386
+ >
16387
+ <sl-card class="plan-summary">
16388
+ <h2>${this.premiumPlanLabel}</h2>
16389
+ <p>${this.whatBestSuitsLabel}</p>
16390
+
16391
+ <div class="price-container">
16392
+ <h1>${this.price},00</h1>
16393
+ <div class="price-info">
16394
+ <h3>${this.perVcpuMonthLabel}</h3>
16395
+ <p>${this.basedOnUsageLabel}</p>
16396
+ </div>
16397
+ </div>
16398
+
16399
+ <div class="text-with-icon">
16400
+ <axebow-icon iconName="verified" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
16401
+ <h3>${this.allPremiumFeaturesLabel}</h3>
16402
+ </div>
16403
+
16404
+ <div class="text-with-icon">
16405
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16406
+ <p>
16407
+ ${this.credentialsWithLabel}
16408
+ <span class="font-semibold">${this.noVcpuLimitsLabel}</span>
16409
+ </p>
16410
+ </div>
16411
+
16412
+ <div class="text-with-icon">
16413
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16414
+ <p>
16415
+ ${this.deployInLabel}
16416
+ <span class="font-semibold">${this.ownEnvironmentsLabel}</span>.
16417
+ </p>
16418
+ </div>
16419
+
16420
+ <div class="text-with-icon">
16421
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16422
+ <p>
16423
+ <span class="font-semibold">${this.unlimitedLabel}</span> ${this.privateContainersLabel}
16424
+ </p>
16425
+ </div>
16426
+
16427
+ <div class="text-with-icon">
16428
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16429
+ <p><span class="font-semibold">${this.iaasBudgetLabel}</span> ${this.featureLabel}</p>
16430
+ </div>
16431
+
16432
+ <div class="text-with-icon">
16433
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16434
+ <p><span class="font-semibold">${this.unlimitedLabel}</span> ${this.draftsLabel}</p>
16435
+ </div>
16436
+
16437
+ <div class="text-with-icon">
16438
+ <axebow-icon iconName="verified" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
16439
+ <p><span class="font-semibold">${this.support247Label}</span> ${this.withSlaLabel}</p>
16440
+ </div>
16441
+ <div class="popup-buttons">
16442
+ <axebow-button class="popup-button" variant="primary" @click=${this._closeDialog}>
16443
+ ${this.continueLabel}
16444
+ </axebow-button>
16445
+ <axebow-button class="popup-button" variant="default" @click=${this._closeDialog}>
16446
+ ${this.anotherTimeLabel}
16447
+ </axebow-button>
16448
+ </div>
16449
+ </sl-card>
16450
+ </sl-dialog>
16451
+ `;
16452
+ }
16453
+ _onRequestClose() {
16454
+ this._closeDialog();
16455
+ }
16456
+ _closeDialog() {
16457
+ this.open = false;
16458
+ this.dispatchEvent(new CustomEvent("dialog-closed", {
16459
+ detail: { open: this.open },
16460
+ bubbles: true,
16461
+ composed: true
16462
+ }));
16463
+ }
16464
+ _onDialogClosed() {}
16465
+ };
16466
+ __decorate([property({
16467
+ type: Boolean,
16468
+ reflect: true
16469
+ })], AxebowPremiumPlanPopup.prototype, "open", void 0);
16470
+ __decorate([property({ type: Number })], AxebowPremiumPlanPopup.prototype, "price", void 0);
16471
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "greatChoiceLabel", void 0);
16472
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "premiumPlanLabel", void 0);
16473
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "whatBestSuitsLabel", void 0);
16474
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "perVcpuMonthLabel", void 0);
16475
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "basedOnUsageLabel", void 0);
16476
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "allPremiumFeaturesLabel", void 0);
16477
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "credentialsWithLabel", void 0);
16478
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "noVcpuLimitsLabel", void 0);
16479
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "deployInLabel", void 0);
16480
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "ownEnvironmentsLabel", void 0);
16481
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "unlimitedLabel", void 0);
16482
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "privateContainersLabel", void 0);
16483
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "iaasBudgetLabel", void 0);
16484
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "featureLabel", void 0);
16485
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "draftsLabel", void 0);
16486
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "support247Label", void 0);
16487
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "withSlaLabel", void 0);
16488
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "continueLabel", void 0);
16489
+ __decorate([property({ type: String })], AxebowPremiumPlanPopup.prototype, "anotherTimeLabel", void 0);
16490
+ AxebowPremiumPlanPopup = __decorate([customElement("axebow-premium-plan-popup")], AxebowPremiumPlanPopup);
16491
+ //#endregion
16492
+ //#region src/components/usage-chart/usage-chart.ts
16493
+ var COLOR_PALETTE = [
16494
+ {
16495
+ borderColor: "#4F46E5",
16496
+ backgroundColor: "rgba(79, 70, 229, 0.1)"
16497
+ },
16498
+ {
16499
+ borderColor: "#F97316",
16500
+ backgroundColor: "rgba(249, 115, 22, 0.1)"
16501
+ },
16502
+ {
16503
+ borderColor: "#10B981",
16504
+ backgroundColor: "rgba(16, 185, 129, 0.1)"
16505
+ },
16506
+ {
16507
+ borderColor: "#8B5CF6",
16508
+ backgroundColor: "rgba(139, 92, 246, 0.1)"
16509
+ },
16510
+ {
16511
+ borderColor: "#EF4444",
16512
+ backgroundColor: "rgba(239, 68, 68, 0.1)"
16513
+ }
16514
+ ];
16515
+ function generateHslColor(index) {
16516
+ const hue = index * 137.508 % 360;
16517
+ const saturation = 70 + index % 3 * 10;
16518
+ const lightness = 45 + index % 2 * 10;
16519
+ return {
16520
+ borderColor: `hsl(${hue}, ${saturation}%, ${lightness}%)`,
16521
+ backgroundColor: `hsla(${hue}, ${saturation}%, ${lightness}%, 0.1)`
16522
+ };
16523
+ }
16524
+ function getColorForDataset(index) {
16525
+ return index < COLOR_PALETTE.length ? COLOR_PALETTE[index] : generateHslColor(index);
16526
+ }
16527
+ function buildDatasets(data, detailChart) {
16528
+ return Object.entries(data).map(([key, dataArray], index) => {
16529
+ const colors = getColorForDataset(index);
16530
+ return {
16531
+ label: key,
16532
+ data: dataArray,
16533
+ borderColor: colors.borderColor,
16534
+ backgroundColor: colors.backgroundColor,
16535
+ fill: true,
16536
+ tension: .3,
16537
+ borderWidth: 2,
16538
+ pointRadius: detailChart ? 3 : 0,
16539
+ pointHoverRadius: detailChart ? 6 : 0,
16540
+ pointBackgroundColor: colors.borderColor,
16541
+ pointBorderColor: "#ffffff",
16542
+ pointBorderWidth: 2
16543
+ };
16544
+ });
16545
+ }
16546
+ function computeYMax(data, detailChart, yAxisMax) {
16547
+ if (yAxisMax !== null && yAxisMax > 0) return detailChart ? yAxisMax * 1.15 : yAxisMax;
16548
+ const allValues = Object.values(data).flat();
16549
+ const maxDataValue = Math.max(...allValues, 0);
16550
+ return detailChart ? void 0 : maxDataValue * 3;
16551
+ }
16552
+ function formatBandwidth(value) {
16553
+ if (value === 0) return "0 bps";
16554
+ if (value < 1e3) return `${value.toFixed(2)} bps`;
16555
+ if (value < 1e6) return `${(value / 1e3).toFixed(2)} Kbps`;
16556
+ if (value < 1e9) return `${(value / 1e6).toFixed(2)} Mbps`;
16557
+ return `${(value / 1e9).toFixed(2)} Gbps`;
16558
+ }
16559
+ function formatMemory(value) {
16560
+ if (value === 0) return "0 MB";
16561
+ if (value < 1024) return `${value.toFixed(2)} MB`;
16562
+ return `${(value / 1024).toFixed(2)} GB`;
16563
+ }
16564
+ function formatCpu(value) {
16565
+ if (value === 0) return "0";
16566
+ if (value < 1e-4) return value.toExponential(2);
16567
+ if (value < .01) return value.toFixed(6);
16568
+ if (value < 1) return value.toFixed(4);
16569
+ return value.toFixed(2);
16570
+ }
16571
+ function formatByChartId(value, chartId) {
16572
+ if (chartId.includes("RX") || chartId.includes("TX")) return formatBandwidth(value);
16573
+ if (chartId.includes("Memory")) return formatMemory(value);
16574
+ if (chartId.includes("CPU")) return formatCpu(value);
16575
+ return value.toString();
16576
+ }
16577
+ function formatByLabel(value, label, chartId) {
16578
+ const lowerLabel = label?.toLowerCase();
16579
+ if (lowerLabel?.includes("cpu")) return formatCpu(value);
16580
+ if (lowerLabel?.includes("memory")) return formatMemory(value);
16581
+ if (lowerLabel?.includes("bandwidth") || chartId.includes("RX") || chartId.includes("TX")) return formatBandwidth(value);
16582
+ return `${value}`;
16583
+ }
16584
+ function buildChartOptions(detailChart, chartId, yMax) {
16585
+ return {
16586
+ responsive: true,
16587
+ maintainAspectRatio: false,
16588
+ animation: false,
16589
+ animations: {
16590
+ colors: false,
16591
+ x: false
16592
+ },
16593
+ transitions: { active: { animation: { duration: 0 } } },
16594
+ interaction: {
16595
+ intersect: false,
16596
+ mode: "index"
16597
+ },
16598
+ plugins: {
16599
+ legend: {
16600
+ display: detailChart,
16601
+ position: "bottom",
16602
+ labels: {
16603
+ usePointStyle: true,
16604
+ padding: 15,
16605
+ font: { size: 12 }
16606
+ }
16607
+ },
16608
+ tooltip: {
16609
+ enabled: detailChart,
16610
+ backgroundColor: "rgba(0, 0, 0, 0.8)",
16611
+ titleColor: "#ffffff",
16612
+ bodyColor: "#ffffff",
16613
+ borderColor: "#374151",
16614
+ borderWidth: 1,
16615
+ cornerRadius: 8,
16616
+ displayColors: true,
16617
+ callbacks: { label: (context) => {
16618
+ const value = context.parsed.y ?? 0;
16619
+ const label = context.dataset.label;
16620
+ return `${label}: ${formatByLabel(value, label, chartId)}`;
16621
+ } }
16622
+ }
16623
+ },
16624
+ scales: {
16625
+ x: {
16626
+ display: detailChart,
16627
+ grid: {
16628
+ display: detailChart,
16629
+ color: "rgba(0, 0, 0, 0.1)"
16630
+ },
16631
+ ticks: {
16632
+ maxTicksLimit: 8,
16633
+ font: { size: 11 },
16634
+ color: "#6B7280"
16635
+ }
16636
+ },
16637
+ y: {
16638
+ display: detailChart,
16639
+ beginAtZero: true,
16640
+ max: yMax,
16641
+ suggestedMax: yMax,
16642
+ grid: {
16643
+ display: detailChart,
16644
+ color: "rgba(0, 0, 0, 0.1)"
16645
+ },
16646
+ ticks: {
16647
+ maxTicksLimit: 5,
16648
+ font: { size: 11 },
16649
+ color: "#6B7280",
16650
+ callback: (value) => formatByChartId(Number(value), chartId)
16651
+ }
16652
+ }
16653
+ }
16654
+ };
16655
+ }
16656
+ var UsageChart = class UsageChart extends LitElement {
16657
+ constructor(..._args) {
16658
+ super(..._args);
16659
+ this.chartType = "line";
16660
+ this.labels = [];
16661
+ this.data = {};
16662
+ this.chartId = "";
16663
+ this.detailChart = false;
16664
+ this.isFullScreen = false;
16665
+ this.yAxisMax = null;
16666
+ }
16667
+ get _resolvedHeight() {
16668
+ if (this.isFullScreen) return "90%";
16669
+ if (this.detailChart) return "12rem";
16670
+ return this.height ?? "4rem";
16671
+ }
16672
+ render() {
16673
+ const datasets = buildDatasets(this.data, this.detailChart);
16674
+ const yMax = computeYMax(this.data, this.detailChart, this.yAxisMax);
16675
+ const options = buildChartOptions(this.detailChart, this.chartId, yMax);
16676
+ return html`
16677
+ <table-chart
16678
+ chartType=${this.chartType}
16679
+ chartId=${this.chartId}
16680
+ .chartLabels=${this.labels}
16681
+ .chartDatasets=${datasets}
16682
+ .chartOptions=${options}
16683
+ height=${this._resolvedHeight}
16684
+ ></table-chart>
16685
+ `;
16686
+ }
16687
+ };
16688
+ __decorate([property({ type: String })], UsageChart.prototype, "chartType", void 0);
16689
+ __decorate([property({ type: Array })], UsageChart.prototype, "labels", void 0);
16690
+ __decorate([property({ type: Object })], UsageChart.prototype, "data", void 0);
16691
+ __decorate([property({ type: String })], UsageChart.prototype, "chartId", void 0);
16692
+ __decorate([property({ type: Boolean })], UsageChart.prototype, "detailChart", void 0);
16693
+ __decorate([property({ type: Boolean })], UsageChart.prototype, "isFullScreen", void 0);
16694
+ __decorate([property({ type: Number })], UsageChart.prototype, "yAxisMax", void 0);
16695
+ __decorate([property({ type: String })], UsageChart.prototype, "height", void 0);
16696
+ UsageChart = __decorate([customElement("usage-chart")], UsageChart);
16697
+ //#endregion
16698
+ //#region src/components/axebow-white-container/axebow-white-container.ts
16699
+ var AxebowWhiteContainer = class AxebowWhiteContainer extends LitElement {
16700
+ constructor(..._args) {
16701
+ super(..._args);
16702
+ this.padding = "p-8";
16703
+ this.extraClasses = "";
16704
+ this.fullWidth = false;
16705
+ }
16706
+ static {
16707
+ this.styles = [unsafeCSS(tailwind_default), css`
16708
+ :host {
16709
+ display: block;
16710
+ }
16711
+ `];
16712
+ }
16713
+ render() {
16714
+ const widthClass = this.fullWidth ? "w-full" : "";
16715
+ return html`
16716
+ <div class="rounded-lg bg-white ${this.padding} shadow-sm ${widthClass} ${this.extraClasses}">
16717
+ <slot></slot>
16718
+ </div>
16719
+ `;
16720
+ }
16721
+ };
16722
+ __decorate([property({ type: String })], AxebowWhiteContainer.prototype, "padding", void 0);
16723
+ __decorate([property({ type: String })], AxebowWhiteContainer.prototype, "extraClasses", void 0);
16724
+ __decorate([property({ type: Boolean })], AxebowWhiteContainer.prototype, "fullWidth", void 0);
16725
+ AxebowWhiteContainer = __decorate([customElement("axebow-white-container")], AxebowWhiteContainer);
16726
+ //#endregion
16727
+ export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBadge, AxebowBanner, AxebowBaseCard, AxebowBorderContainer, AxebowBoxSection, AxebowBoxedInput, AxebowBreadcrumbHeader, AxebowButton, AxebowCallToActionFeature, AxebowCallToActionRow, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarousel, AxebowCarouselInput, AxebowCarouselSelectorItem, AxebowCarouselSelectorTenant, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowCopyBox, AxebowCopyIcon, AxebowCtaDialog, AxebowDeleteDataPopup, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDivider, AxebowDragDropUploadFile, AxebowDraggableService, AxebowEmptyState, AxebowExpandableCard, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowGraph, AxebowHeader, AxebowHelpBubble, AxebowHyperlinkSwitch, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowInstancesTable, AxebowLearningCenter, AxebowLimitsCounter, AxebowManageHyperlinks, AxebowMarketplaceCard, AxebowMobileWarningBanner, AxebowModal, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowObservabilityContainer, AxebowPageActions, AxebowPaginatedTable, AxebowPemDialog, AxebowPill, AxebowPlanProvidersModal, AxebowPlanSelectField, AxebowPremiumPlanPopup, AxebowProgressBar, AxebowPromotionDropdown, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowRefreshPeriodPanel, AxebowRegistrySelector, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourceLimitInput, AxebowResourceLimitsPanel, AxebowResourcesCounter, AxebowRoleCard, AxebowRoleContainerDropdown, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSearchBarFilters, AxebowSelectInput, AxebowSelectInputWithDivider, AxebowSelectorCard, AxebowSelectorSlider, AxebowServiceDetailHeader, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryFlavors, AxebowSummaryKeyValue, AxebowSummaryLimits, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowSwitchInput, AxebowTabSelector, AxebowTabsSubmenu, AxebowTagsInput, AxebowTenantCard, AxebowTenantResourceTable, AxebowTenantsTable, AxebowTextInput, AxebowTimeRangePanel, AxebowTooltip, AxebowUl, AxebowUndeployCard, AxebowUnderlineTabSelector, AxebowUsageTooltip, AxebowWhiteContainer, CRITICALITY_STYLES, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DEFAULT_LOW_NOTE_TEXT, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, TableChart, UsageChart, WizardPageLayout, axebowTheme, buildAddButton, buildCtaButtons, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon, getCtaBadgeLabel, getCtaDescription, getCtaHeading, getHighestCriticality, groupCallToActionNotifications };
14272
16728
 
14273
16729
  //# sourceMappingURL=index.js.map