npm - @vtx-ui/react - Versions diffs - 0.0.1-beta.3 → 0.0.1-beta.4 - Mend

@vtx-ui/react 0.0.1-beta.3 → 0.0.1-beta.4

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 (93) hide show

package/dist/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react/jsx-runtime"),r=require("react"),t=require("react-dom");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}function o(n){if(n&&n.__esModule)return n;var r=Object.create(null);return n&&Object.keys(n).forEach(function(t){if("default"!==t){var e=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(r,t,e.get?e:{enumerable:!0,get:function(){return n[t]}})}}),r.default=n,Object.freeze(r)}var a=e(r),i=o(r);const l=[50,100,200,300,400,500,600,700,800,900];function c(n){const r={};for(const[t,e]of Object.entries(n))"string"==typeof e?(r[t]={},l.forEach(n=>{r[t][n]=e})):"object"==typeof e&&null!==e&&(r[t]=e);return r}const s={colors:{primary:{50:"#eff6ff",100:"#dbeafe",200:"#bfdbfe",300:"#93c5fd",400:"#60a5fa",500:"#3b82f6",600:"#2563eb",700:"#1d4ed8",800:"#1e40af",900:"#1e3a8a"},secondary:{50:"#f5f3ff",100:"#ede9fe",200:"#ddd6fe",300:"#c4b5fd",400:"#a78bfa",500:"#8b5cf6",600:"#7c3aed",700:"#6d28d9",800:"#5b21b6",900:"#4c1d95"},neutral:{50:"#fafafa",100:"#f5f5f5",200:"#e5e5e5",300:"#d4d4d4",400:"#a3a3a3",500:"#737373",600:"#525252",700:"#404040",800:"#262626",900:"#171717"},success:{50:"#f0fdf4",500:"#22c55e",600:"#16a34a",700:"#15803d"},warning:{50:"#fffbeb",500:"#f59e0b",600:"#d97706",700:"#b45309"},error:{50:"#fef2f2",500:"#ef4444",600:"#dc2626",700:"#b91c1c"},info:{50:"#eff6ff",500:"#3b82f6",600:"#2563eb",700:"#1d4ed8"}},spacing:{0:"0",1:"0.25rem",2:"0.5rem",3:"0.75rem",4:"1rem",5:"1.25rem",6:"1.5rem",8:"2rem",10:"2.5rem",12:"3rem",16:"4rem",20:"5rem",24:"6rem"},typography:{fontFamily:{sans:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',mono:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace'},fontSize:{xs:"0.75rem",sm:"0.875rem",base:"1rem",lg:"1.125rem",xl:"1.25rem","2xl":"1.5rem","3xl":"1.875rem","4xl":"2.25rem","5xl":"3rem","6xl":"3.75rem","7xl":"4.5rem","8xl":"6rem","9xl":"8rem"},fontWeight:{thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},lineHeight:{none:"1",tight:"1.25",snug:"1.375",normal:"1.5",relaxed:"1.625",loose:"2"},letterSpacing:{tighter:"-0.05em",tight:"-0.025em",normal:"0",wide:"0.025em",wider:"0.05em",widest:"0.1em"},textVariants:{h1:{fontSize:"3.75rem",fontWeight:"700",lineHeight:"1.2",letterSpacing:"-0.025em"},h2:{fontSize:"3rem",fontWeight:"700",lineHeight:"1.25",letterSpacing:"-0.025em"},h3:{fontSize:"2.25rem",fontWeight:"600",lineHeight:"1.3",letterSpacing:"-0.025em"},h4:{fontSize:"1.875rem",fontWeight:"600",lineHeight:"1.35",letterSpacing:"0"},h5:{fontSize:"1.5rem",fontWeight:"600",lineHeight:"1.4",letterSpacing:"0"},h6:{fontSize:"1.25rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0"},body1:{fontSize:"1rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0"},body2:{fontSize:"0.875rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0"},subtitle1:{fontSize:"1.125rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"},subtitle2:{fontSize:"1rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"},caption:{fontSize:"0.75rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0.025em"},overline:{fontSize:"0.75rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0.1em",textTransform:"uppercase"},button:{fontSize:"0.875rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0.025em"},label:{fontSize:"0.875rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"}}},borderRadius:{none:"0",sm:"0.125rem",base:"0.25rem",md:"0.375rem",lg:"0.5rem",xl:"0.75rem","2xl":"1rem",full:"9999px"},shadows:{sm:"0 1px 2px 0 rgb(0 0 0 / 0.05)",base:"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",md:"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",lg:"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",xl:"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",none:"none"},transitions:{fast:"150ms cubic-bezier(0.4, 0, 0.2, 1)",base:"200ms cubic-bezier(0.4, 0, 0.2, 1)",slow:"300ms cubic-bezier(0.4, 0, 0.2, 1)"},zIndex:{dropdown:1e3,sticky:1100,modal:1200,tooltip:1300,notification:1400}};function v(){const n=[];return Object.entries(s.colors).forEach(([r,t])=>{"object"==typeof t?Object.entries(t).forEach(([t,e])=>{n.push(`  --vtx-color-${r}-${t}: ${e};`)}):n.push(`  --vtx-color-${r}: ${t};`)}),Object.entries(s.spacing).forEach(([r,t])=>{n.push(`  --vtx-spacing-${r}: ${t};`)}),Object.entries(s.typography.fontFamily).forEach(([r,t])=>{n.push(`  --vtx-font-family-${r}: ${t};`)}),Object.entries(s.typography.fontSize).forEach(([r,t])=>{n.push(`  --vtx-font-size-${r}: ${t};`)}),Object.entries(s.typography.fontWeight).forEach(([r,t])=>{n.push(`  --vtx-font-weight-${r}: ${t};`)}),Object.entries(s.typography.lineHeight).forEach(([r,t])=>{n.push(`  --vtx-line-height-${r}: ${t};`)}),Object.entries(s.typography.letterSpacing).forEach(([r,t])=>{n.push(`  --vtx-letter-spacing-${r}: ${t};`)}),Object.entries(s.typography.textVariants).forEach(([r,t])=>{Object.entries(t).forEach(([t,e])=>{const o=t.replace(/([A-Z])/g,"-$1").toLowerCase();n.push(`  --vtx-text-${r}-${o}: ${e};`)})}),Object.entries(s.borderRadius).forEach(([r,t])=>{n.push(`  --vtx-radius-${r}: ${t};`)}),Object.entries(s.shadows).forEach(([r,t])=>{n.push(`  --vtx-shadow-${r}: ${t};`)}),Object.entries(s.transitions).forEach(([r,t])=>{n.push(`  --vtx-transition-${r}: ${t};`)}),Object.entries(s.zIndex).forEach(([r,t])=>{n.push(`  --vtx-z-${r}: ${t};`)}),n.join("\n")}function d(){if("undefined"==typeof document)return;const n="vtx-ui-variables";let r=document.getElementById(n);r||(r=document.createElement("style"),r.id=n,document.head.appendChild(r));const t=v();r.textContent=`:root {\n${t}\n}`}const x=a.default.createContext(void 0),p=a.default.forwardRef(({children:r,initialMode:t="light",customTokens:e,defaultSize:o="md",...i},l)=>{const[v,p]=a.default.useState(t),[m,u]=a.default.useState(o),h=a.default.useMemo(()=>{if(!e)return{tokens:s,mode:v,defaultSize:m};let n={...s,...e};return e.colors&&(n.colors={...s.colors,...c(e.colors)}),{tokens:n,mode:v,defaultSize:m}},[e,v,m]);a.default.useEffect(()=>{document.documentElement.setAttribute("data-theme",v),e&&d()},[v,e]);const g=a.default.useMemo(()=>({theme:h,setMode:p,setDefaultSize:u}),[h]);return n.jsx(x.Provider,{value:g,children:n.jsx("div",{ref:l,...i,children:r})})});p.displayName="ThemeProvider";const m=()=>{const n=a.default.useContext(x);if(!n)throw new Error("useThemeContext must be used within a ThemeProvider");return n};function u(n,r){void 0===r&&(r={});var t=r.insertAt;if(n&&"undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===t&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}u(".vtx-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: var(--vtx-spacing-2);\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  border: 1px solid transparent;\r\n  border-radius: var(--vtx-radius-md);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-base);\r\n  white-space: nowrap;\r\n  user-select: none;\r\n  text-decoration: none;\r\n  position: relative;\r\n}\r\n\r\n.vtx-button:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-button:disabled,\r\n.vtx-button[aria-disabled='true'] {\r\n  cursor: not-allowed;\r\n  opacity: 0.6;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-button--sm {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-sm);\r\n  min-height: 32px;\r\n}\r\n\r\n.vtx-button--md {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-base);\r\n  min-height: 40px;\r\n}\r\n\r\n.vtx-button--lg {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-lg);\r\n  min-height: 48px;\r\n}\r\n\r\n/* Variants */\r\n.vtx-button--primary {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--primary:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-button--primary:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-primary-800);\r\n}\r\n\r\n.vtx-button--secondary {\r\n  background-color: var(--vtx-color-secondary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-secondary-700);\r\n}\r\n\r\n.vtx-button--secondary:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-secondary-800);\r\n}\r\n\r\n.vtx-button--outline {\r\n  background-color: transparent;\r\n  border-color: var(--vtx-color-neutral-300);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-neutral-50);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-button--ghost {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-button--danger {\r\n  background-color: var(--vtx-color-error-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--danger:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-error-700);\r\n}\r\n\r\n.vtx-button--success {\r\n  background-color: var(--vtx-color-success-600, #16a34a);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--success:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-success-700, #15803d);\r\n}\r\n\r\n.vtx-button--success:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-success-800, #166534);\r\n}\r\n\r\n.vtx-button--warning {\r\n  background-color: var(--vtx-color-warning-500, #f59e42);\r\n  color: var(--vtx-color-warning-contrast, #1a1a1a);\r\n}\r\n\r\n.vtx-button--warning:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-warning-600, #d97706);\r\n}\r\n\r\n.vtx-button--warning:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-warning-700, #b45309);\r\n}\r\n\r\n/* Full width */\r\n.vtx-button--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Loading state */\r\n.vtx-button--loading .vtx-button__content {\r\n  visibility: hidden;\r\n}\r\n\r\n.vtx-button__spinner {\r\n  position: absolute;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-button__spinner-icon {\r\n  width: 1em;\r\n  height: 1em;\r\n  animation: vtx-spin 0.6s linear infinite;\r\n}\r\n\r\n.vtx-button__spinner-circle {\r\n  stroke: currentColor;\r\n  stroke-linecap: round;\r\n  stroke-dasharray: 50;\r\n  stroke-dashoffset: 25;\r\n}\r\n\r\n@keyframes vtx-spin {\r\n  from {\r\n    transform: rotate(0deg);\r\n  }\r\n  to {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n/* Icons */\r\n.vtx-button__icon-left,\r\n.vtx-button__icon-right {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-button__icon-left {\r\n  margin-left: calc(var(--vtx-spacing-1) * -1);\r\n}\r\n\r\n.vtx-button__icon-right {\r\n  margin-right: calc(var(--vtx-spacing-1) * -1);\r\n}\r\n\r\n/* Dark/Light text override */\r\n.vtx-button--dark-text {\r\n  color: var(--vtx-color-dark-text, var(--vtx-color-neutral-900)) !important;\r\n}\r\n.vtx-button--light-text {\r\n  color: var(--vtx-color-light-text, var(--vtx-color-white)) !important;\r\n}\r\n");const h=a.default.forwardRef(({children:r,variant:t="primary",size:e,fullWidth:o=!1,loading:a=!1,disabled:i=!1,leftIcon:l,rightIcon:c,iconOnly:s=!1,loadingText:v,asLink:d=!1,href:x,target:p,rel:u,className:h="",type:g="button",...f},b)=>{const{theme:w}=m(),y=["vtx-button",`vtx-button--${t}`,`vtx-button--${e||w.defaultSize||"md"}`,o&&"vtx-button--full-width",a&&"vtx-button--loading",s&&"vtx-button--icon-only",!0===f.darkText&&"vtx-button--dark-text",!1===f.darkText&&"vtx-button--light-text",h].filter(Boolean).join(" "),k=f.style?{...f.style}:{};f.textColor&&(k.color=f.textColor);const j=n.jsxs(n.Fragment,{children:[a&&n.jsx("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:n.jsx("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:n.jsx("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!a&&l&&n.jsx("span",{className:"vtx-button__icon-left",children:l}),!s&&n.jsx("span",{className:"vtx-button__content",children:a&&v?v:r}),s&&!a&&r,!a&&c&&n.jsx("span",{className:"vtx-button__icon-right",children:c})]});return d&&x?n.jsx("a",{ref:b,href:x,target:p,rel:"_blank"===p?"noopener noreferrer":u,className:y,"aria-disabled":i||a,style:k,...f,children:j}):n.jsx("button",{ref:b,type:g,className:y,disabled:i||a,"aria-busy":a,"aria-disabled":i||a,style:k,...f,children:j})});h.displayName="Button";u("/* Checkbox Base Styles */\r\n.vtx-checkbox {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n/* Label Container */\r\n.vtx-checkbox-label {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2);\r\n  cursor: pointer;\r\n  user-select: none;\r\n  position: relative;\r\n}\r\n\r\n/* Wrapper for input and visual checkbox */\r\n.vtx-checkbox-wrapper {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Hidden input */\r\n.vtx-checkbox-input {\r\n  position: absolute;\r\n  opacity: 0;\r\n  width: 0;\r\n  height: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Visual checkbox box */\r\n.vtx-checkbox-box {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: var(--vtx-checkbox-size, 20px);\r\n  height: var(--vtx-checkbox-size, 20px);\r\n  border: var(--vtx-checkbox-border-width, 2px) solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-checkbox-border-radius, 4px);\r\n  background-color: white;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Icons */\r\n.vtx-checkbox-icon {\r\n  position: absolute;\r\n  width: 100%;\r\n  height: 100%;\r\n  color: white;\r\n  opacity: 0;\r\n  transform: scale(0.5);\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n/* Checked state */\r\n.vtx-checkbox-input:checked + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-input:checked + .vtx-checkbox-box .vtx-checkbox-icon--check {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Indeterminate state */\r\n.vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-input:indeterminate + .vtx-checkbox-box .vtx-checkbox-icon--indeterminate {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Hover state */\r\n.vtx-checkbox-label:hover .vtx-checkbox-box {\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-label:hover .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox-label:hover .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-hover-color, var(--vtx-color-primary-700));\r\n  border-color: var(--vtx-checkbox-hover-color, var(--vtx-color-primary-700));\r\n}\r\n\r\n/* Focus state */\r\n.vtx-checkbox-input:focus-visible + .vtx-checkbox-box {\r\n  outline: 2px solid var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Disabled state */\r\n.vtx-checkbox--disabled .vtx-checkbox-label {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--disabled .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-neutral-300);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-label:hover .vtx-checkbox-box {\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n/* Error state */\r\n.vtx-checkbox--error .vtx-checkbox-box {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--error .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-label:hover .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--error\r\n  .vtx-checkbox-label:hover\r\n  .vtx-checkbox-input:indeterminate\r\n  + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-error-700);\r\n  border-color: var(--vtx-color-error-700);\r\n}\r\n\r\n/* Label text */\r\n.vtx-checkbox-label-text {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-label-text {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Helper text */\r\n.vtx-checkbox-helper-text {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-600);\r\n  margin-left: calc(var(--vtx-checkbox-size, 20px) + var(--vtx-spacing-2));\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-helper-text {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Size variants */\r\n.vtx-checkbox--sm {\r\n  --vtx-checkbox-size: 16px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--sm .vtx-checkbox-label-text {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-checkbox--sm .vtx-checkbox-helper-text {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.vtx-checkbox--md {\r\n  --vtx-checkbox-size: 20px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--lg {\r\n  --vtx-checkbox-size: 24px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--lg .vtx-checkbox-label-text {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Variants */\r\n.vtx-checkbox--primary {\r\n  --vtx-checkbox-color: var(--vtx-color-primary-600);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-checkbox--secondary {\r\n  --vtx-checkbox-color: var(--vtx-color-secondary-600, var(--vtx-color-neutral-600));\r\n  --vtx-checkbox-hover-color: var(--vtx-color-secondary-700, var(--vtx-color-neutral-700));\r\n}\r\n\r\n.vtx-checkbox--success {\r\n  --vtx-checkbox-color: var(--vtx-color-success-600, #16a34a);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-success-700, #15803d);\r\n}\r\n\r\n.vtx-checkbox--error {\r\n  --vtx-checkbox-color: var(--vtx-color-error-600, #dc2626);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-error-700, #b91c1c);\r\n}\r\n\r\n.vtx-checkbox--warning {\r\n  --vtx-checkbox-color: var(--vtx-color-warning-600, #d97706);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-warning-700, #b45309);\r\n}\r\n\r\n.vtx-checkbox--info {\r\n  --vtx-checkbox-color: var(--vtx-color-info-600, #2563eb);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-info-700, #1d4ed8);\r\n}\r\n");const g=a.default.forwardRef(({checked:t,indeterminate:e=!1,disabled:o=!1,label:a,size:i,variant:l="primary",error:c=!1,helperText:s,onChange:v,className:d="",inputClassName:x="",id:p,...u},h)=>{const{theme:g}=m(),f=i||g.defaultSize||"md",b=r.useId(),w=p||b,y=["vtx-checkbox",`vtx-checkbox--${f}`,`vtx-checkbox--${l}`,o&&"vtx-checkbox--disabled",c&&"vtx-checkbox--error",d].filter(Boolean).join(" "),k=["vtx-checkbox-input",x].filter(Boolean).join(" "),j=r.useRef(null);return r.useImperativeHandle(h,()=>j.current),r.useEffect(()=>{j.current&&(j.current.indeterminate=e)},[e]),n.jsxs("div",{className:y,children:[n.jsxs("label",{className:"vtx-checkbox-label",htmlFor:w,children:[n.jsxs("span",{className:"vtx-checkbox-wrapper",children:[n.jsx("input",{ref:j,type:"checkbox",id:w,className:k,checked:t,disabled:o,onChange:v,...u}),n.jsxs("span",{className:"vtx-checkbox-box",children:[n.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),n.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),a&&n.jsx("span",{className:"vtx-checkbox-label-text",children:a})]}),s&&n.jsx("div",{className:"vtx-checkbox-helper-text",children:s})]})});g.displayName="Checkbox";u("/* CheckboxGroup Base Styles */\n.vtx-checkbox-group {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n}\n\n/* Group Label */\n.vtx-checkbox-group-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-checkbox-group--disabled .vtx-checkbox-group-label {\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-checkbox-group--error .vtx-checkbox-group-label {\n  color: var(--vtx-color-error-600);\n}\n\n/* Options Container */\n.vtx-checkbox-group-options {\n  display: flex;\n  gap: var(--vtx-spacing-3);\n}\n\n.vtx-checkbox-group--vertical .vtx-checkbox-group-options {\n  flex-direction: column;\n}\n\n.vtx-checkbox-group--horizontal .vtx-checkbox-group-options {\n  flex-direction: row;\n  flex-wrap: wrap;\n}\n\n/* Helper Text */\n.vtx-checkbox-group-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-checkbox-group--error .vtx-checkbox-group-helper-text {\n  color: var(--vtx-color-error-600);\n}\n");const f=a.default.forwardRef(({label:t,options:e,value:o,defaultValue:a,onChange:i,disabled:l=!1,error:c=!1,helperText:s,orientation:v="vertical",size:d,className:x="",...p},u)=>{const{theme:h}=m(),f=d||h.defaultSize||"md",[b,w]=r.useState(a||[]),y=void 0!==o,k=y?o:b,j=["vtx-checkbox-group",`vtx-checkbox-group--${v}`,c&&"vtx-checkbox-group--error",l&&"vtx-checkbox-group--disabled",x].filter(Boolean).join(" ");return n.jsxs("div",{ref:u,className:j,...p,children:[t&&n.jsx("div",{className:"vtx-checkbox-group-label",children:t}),n.jsx("div",{className:"vtx-checkbox-group-options",children:e.map(r=>{const t=k.includes(r.value),e=l||r.disabled;return n.jsx(g,{label:r.label,checked:t,disabled:e,error:c,size:f,onChange:n=>((n,r)=>{const t=r?[...k,n]:k.filter(r=>r!==n);y||w(t),null==i||i(t)})(r.value,n.target.checked)},r.value)})}),s&&n.jsx("div",{className:"vtx-checkbox-group-helper-text",children:s})]})});f.displayName="CheckboxGroup";const b=(n,t)=>{r.useEffect(()=>{if(!t)return;const r=n.current;if(!r)return;const e=r.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(0===e.length)return;const o=e[0],a=e[e.length-1],i=n=>{"Tab"===n.key&&(n.shiftKey?document.activeElement===o&&(null==a||a.focus(),n.preventDefault()):document.activeElement===a&&(null==o||o.focus(),n.preventDefault()))};return null==o||o.focus(),r.addEventListener("keydown",i),()=>{r.removeEventListener("keydown",i)}},[n,t])},w=n=>{r.useEffect(()=>{const r=r=>{"Escape"===r.key&&n()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[n])},y=n=>{r.useEffect(()=>{if(!n)return;const r=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=r}},[n])};let k=0;const j=(n="vtx")=>{const[t]=r.useState(()=>`${n}-${++k}`);return t};u(".vtx-input-wrapper {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n.vtx-input-wrapper--full-width {\n  width: 100%;\n}\n\n.vtx-input-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  color: var(--vtx-color-neutral-700);\n  line-height: var(--vtx-line-height-tight);\n}\n\n.vtx-input-label__required {\n  color: var(--vtx-color-error-600);\n  margin-left: var(--vtx-spacing-1);\n}\n\n.vtx-input-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  background-color: white;\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  transition: all var(--vtx-transition-base);\n}\n\n.vtx-input-container:focus-within {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 0;\n  border-color: var(--vtx-color-primary-500);\n}\n\n.vtx-input-container--error {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-input-container--error:focus-within {\n  outline-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-input-container--disabled {\n  background-color: var(--vtx-color-neutral-100);\n  cursor: not-allowed;\n}\n\n/* Sizes */\n.vtx-input-container--small {\n  min-height: 32px;\n}\n\n.vtx-input-container--medium {\n  min-height: 40px;\n}\n\n.vtx-input-container--large {\n  min-height: 48px;\n}\n\n.vtx-input {\n  flex: 1;\n  width: 100%;\n  min-width: 0;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n  background: transparent;\n  border: none;\n  outline: none;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n}\n\n.vtx-input::placeholder {\n  color: var(--vtx-color-neutral-400);\n}\n\n.vtx-input:disabled {\n  cursor: not-allowed;\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-input-container--small .vtx-input {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-input-container--large .vtx-input {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Icons */\n.vtx-input-icon {\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n  color: var(--vtx-color-neutral-500);\n  pointer-events: none;\n}\n\n.vtx-input-icon--left {\n  padding-left: var(--vtx-spacing-3);\n}\n\n.vtx-input-icon--right {\n  padding-right: var(--vtx-spacing-3);\n}\n\n.vtx-input-container--with-left-icon .vtx-input {\n  padding-left: var(--vtx-spacing-1);\n}\n\n.vtx-input-container--with-right-icon .vtx-input {\n  padding-right: var(--vtx-spacing-1);\n}\n\n/* Helper and error text */\n.vtx-input-helper,\n.vtx-input-error {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  margin: 0;\n}\n\n.vtx-input-helper {\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-input-error {\n  color: var(--vtx-color-error-600);\n}\n");const z=a.default.forwardRef(({label:r,helperText:t,error:e,success:o,size:a="medium",fullWidth:i=!1,leftIcon:l,rightIcon:c,clearable:s=!1,onClear:v,showCount:d=!1,className:x="",wrapperClassName:p="",labelClassName:m="",inputClassName:u="",prefix:h,suffix:g,id:f,disabled:b=!1,required:w=!1,value:y,maxLength:k,...z},N)=>{const S=j("input"),C=f||S,_=`${C}-helper`,T=`${C}-error`,$=`${C}-success`,L=Boolean(e),M=Boolean(o)&&!L,B=s&&y&&String(y).length>0&&!b,E=[t&&!e&&!o&&_,e&&T,o&&$].filter(Boolean).join(" "),I=["vtx-input-wrapper",i&&"vtx-input-wrapper--full-width",p].filter(Boolean).join(" "),A=["vtx-input-container",`vtx-input-container--${a}`,L&&"vtx-input-container--error",M&&"vtx-input-container--success",b&&"vtx-input-container--disabled",(l||h)&&"vtx-input-container--with-left-element",(c||g||B)&&"vtx-input-container--with-right-element",x].filter(Boolean).join(" "),D=y?String(y).length:0,R=d&&k;return n.jsxs("div",{className:I,children:[r&&n.jsxs("label",{htmlFor:C,className:`vtx-input-label ${m}`.trim(),children:[r,w&&n.jsxs("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{className:A,children:[l&&n.jsx("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:l}),h&&n.jsx("span",{className:"vtx-input-prefix","aria-hidden":"true",children:h}),n.jsx("input",{ref:N,id:C,className:`vtx-input ${u}`.trim(),disabled:b,required:w,value:y,maxLength:k,"aria-invalid":L,"aria-describedby":E||void 0,...z}),g&&n.jsx("span",{className:"vtx-input-suffix","aria-hidden":"true",children:g}),B&&n.jsx("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==v||v()},"aria-label":"Clear input",tabIndex:-1,children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M12 4L4 12M4 4L12 12",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),c&&!B&&n.jsx("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:c})]}),t&&!e&&!o&&n.jsx("p",{id:_,className:"vtx-input-helper",children:t}),e&&n.jsx("p",{id:T,className:"vtx-input-error",role:"alert",children:e}),o&&n.jsx("p",{id:$,className:"vtx-input-success",role:"status",children:o}),R&&n.jsxs("p",{className:"vtx-input-counter","aria-live":"polite",children:[D," / ",k]})]})});z.displayName="Input";u("/* Chip Component Styles */\r\n\r\n.vtx-chip {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 0.375rem;\r\n  padding: 0.25rem 0.75rem;\r\n  border-radius: 16px;\r\n  font-family: var(--vtx-font-family);\r\n  font-size: 0.875rem;\r\n  line-height: 1.25rem;\r\n  font-weight: 500;\r\n  border: 1px solid transparent;\r\n  transition: all 0.2s ease;\r\n  cursor: default;\r\n  white-space: nowrap;\r\n  max-width: 100%;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-chip--sm {\r\n  padding: 0.125rem 0.5rem;\r\n  font-size: 0.75rem;\r\n  line-height: 1rem;\r\n  gap: 0.25rem;\r\n  border-radius: 12px;\r\n}\r\n\r\n.vtx-chip--md {\r\n  padding: 0.25rem 0.75rem;\r\n  font-size: 0.875rem;\r\n  line-height: 1.25rem;\r\n  gap: 0.375rem;\r\n  border-radius: 16px;\r\n}\r\n\r\n.vtx-chip--lg {\r\n  padding: 0.375rem 1rem;\r\n  font-size: 1rem;\r\n  line-height: 1.5rem;\r\n  gap: 0.5rem;\r\n  border-radius: 20px;\r\n}\r\n\r\n/* Variants */\r\n.vtx-chip--filled {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-border);\r\n}\r\n\r\n.vtx-chip--light {\r\n  background-color: var(--vtx-color-primary-light, rgba(59, 130, 246, 0.1));\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: transparent;\r\n}\r\n\r\n/* Color Variants */\r\n.vtx-chip--primary.vtx-chip--filled {\r\n  background-color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--primary.vtx-chip--outlined {\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--primary.vtx-chip--light {\r\n  background-color: var(--vtx-color-primary-light, rgba(59, 130, 246, 0.1));\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--filled {\r\n  background-color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--outlined {\r\n  color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--light {\r\n  background-color: var(--vtx-color-success-light, rgba(34, 197, 94, 0.1));\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--filled {\r\n  background-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--outlined {\r\n  color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--light {\r\n  background-color: var(--vtx-color-error-light, rgba(239, 68, 68, 0.1));\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--filled {\r\n  background-color: var(--vtx-color-warning-600);\r\n  border-color: var(--vtx-color-warning-600);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--outlined {\r\n  color: var(--vtx-color-warning-600);\r\n  border-color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--light {\r\n  background-color: var(--vtx-color-warning-light, rgba(251, 191, 36, 0.1));\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--filled {\r\n  background-color: var(--vtx-color-info-600);\r\n  border-color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--outlined {\r\n  color: var(--vtx-color-info-600);\r\n  border-color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--light {\r\n  background-color: var(--vtx-color-info-light, rgba(6, 182, 212, 0.1));\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--filled {\r\n  background-color: var(--vtx-color-neutral-600);\r\n  border-color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--outlined {\r\n  color: var(--vtx-color-neutral-900);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--light {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* Label */\r\n.vtx-chip__label {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n/* Avatar */\r\n.vtx-chip__avatar {\r\n  width: 1.5rem;\r\n  height: 1.5rem;\r\n  border-radius: 50%;\r\n  object-fit: cover;\r\n  flex-shrink: 0;\r\n  margin-left: -0.25rem;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__avatar {\r\n  width: 1rem;\r\n  height: 1rem;\r\n  margin-left: -0.125rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__avatar {\r\n  width: 2rem;\r\n  height: 2rem;\r\n  margin-left: -0.375rem;\r\n}\r\n\r\n/* Icon */\r\n.vtx-chip__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__icon svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--medium .vtx-chip__icon svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__icon svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n}\r\n\r\n/* Delete Button */\r\n.vtx-chip__delete {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0;\r\n  margin: 0;\r\n  margin-right: -0.25rem;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  color: inherit;\r\n  opacity: 0.6;\r\n  transition:\r\n    opacity 0.2s ease,\r\n    transform 0.15s ease;\r\n  border-radius: 50%;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__delete {\r\n  margin-right: -0.125rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__delete {\r\n  margin-right: -0.375rem;\r\n}\r\n\r\n.vtx-chip__delete:hover {\r\n  opacity: 1;\r\n  transform: scale(1.1);\r\n}\r\n\r\n.vtx-chip__delete:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.vtx-chip__delete:focus-visible {\r\n  outline: 2px solid currentColor;\r\n  outline-offset: 2px;\r\n  opacity: 1;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__delete svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--medium .vtx-chip__delete svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__delete svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n}\r\n\r\n/* Clickable */\r\n.vtx-chip--clickable {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-chip--clickable:hover {\r\n  opacity: 0.85;\r\n  transform: translateY(-1px);\r\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-chip--clickable:active {\r\n  transform: translateY(0);\r\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-chip--clickable:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-600);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Disabled */\r\n.vtx-chip--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Dark mode support */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-chip--outlined {\r\n    border-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .vtx-chip--default.vtx-chip--light {\r\n    background-color: var(--vtx-color-neutral-700);\r\n    color: var(--vtx-color-neutral-50);\r\n  }\r\n}\r\n");const N=a.default.forwardRef(({label:r,size:t="md",variant:e="filled",color:o="default",icon:a,avatar:i,onDelete:l,onClick:c,disabled:s=!1,className:v="","aria-label":d,"data-testid":x},p)=>{const m=["vtx-chip",`vtx-chip--${t}`,`vtx-chip--${e}`,`vtx-chip--${o}`,c&&!s&&"vtx-chip--clickable",s&&"vtx-chip--disabled",v].filter(Boolean).join(" ");return n.jsxs("div",{ref:p,className:m,onClick:n=>{!s&&c&&c(n)},onKeyDown:n=>{s||!c||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),c(n))},role:c?"button":void 0,tabIndex:c&&!s?0:void 0,"aria-label":d||r,"aria-disabled":s,"data-testid":x,children:[i&&n.jsx("img",{src:i,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),a&&!i&&n.jsx("span",{className:"vtx-chip__icon","aria-hidden":"true",children:a}),n.jsx("span",{className:"vtx-chip__label",children:r}),l&&n.jsx("button",{type:"button",className:"vtx-chip__delete",onClick:n=>{n.stopPropagation(),!s&&l&&l(n)},onKeyDown:n=>{"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),n.stopPropagation(),!s&&l&&l(n))},disabled:s,"aria-label":`Remove ${r}`,tabIndex:-1,children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M12 4L4 12M4 4L12 12",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})});N.displayName="Chip";u("/* MultiSelect Component Styles */\r\n\r\n.vtx-multiselect-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.375rem;\r\n  font-family: var(--vtx-font-family);\r\n}\r\n\r\n.vtx-multiselect-wrapper--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Label */\r\n.vtx-multiselect-label {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  color: var(--vtx-color-neutral-700);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-multiselect-label__required {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Container */\r\n.vtx-multiselect-container {\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  background-color: white;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-container:focus-within {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 0;\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Sizes */\r\n.vtx-multiselect-container--sm {\r\n  min-height: 2rem;\r\n}\r\n\r\n.vtx-multiselect-container--md {\r\n  min-height: 2.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg {\r\n  min-height: 3rem;\r\n}\r\n\r\n/* States */\r\n.vtx-multiselect-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-multiselect-container--error:focus-within {\r\n  outline-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-multiselect-container--success {\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-multiselect-container--success:focus-within {\r\n  outline-color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-multiselect-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-multiselect-container--open {\r\n  border-bottom-left-radius: 0;\r\n  border-bottom-right-radius: 0;\r\n}\r\n\r\n/* Input Area */\r\n.vtx-multiselect-input-area {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-wrap: wrap;\r\n  gap: 0.375rem;\r\n  padding: 0.5rem 2.5rem 0.5rem 0.75rem;\r\n  min-height: inherit;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-input-area {\r\n  padding: 0.25rem 2rem 0.25rem 0.5rem;\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-input-area {\r\n  padding: 0.625rem 3rem 0.625rem 1rem;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--disabled .vtx-multiselect-input-area {\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Chips Container */\r\n.vtx-multiselect-chips {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 0.375rem;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-chips {\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-chips {\r\n  gap: 0.5rem;\r\n}\r\n\r\n/* Placeholder */\r\n.vtx-multiselect-placeholder {\r\n  color: var(--vtx-color-neutral-500);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-placeholder {\r\n  font-size: 0.8125rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-placeholder {\r\n  font-size: 1rem;\r\n}\r\n\r\n/* Icon */\r\n.vtx-multiselect-icon {\r\n  position: absolute;\r\n  right: var(--vtx-spacing-3);\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  pointer-events: none;\r\n  color: var(--vtx-color-neutral-500);\r\n  transition: transform var(--vtx-transition-base);\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-icon {\r\n  right: 0.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-icon {\r\n  right: 1rem;\r\n}\r\n\r\n.vtx-multiselect-container--open .vtx-multiselect-icon {\r\n  transform: translateY(-50%) rotate(180deg);\r\n}\r\n\r\n/* Dropdown */\r\n.vtx-multiselect-dropdown {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: -1px;\r\n  right: -1px;\r\n  max-height: 18rem;\r\n  overflow-y: auto;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-primary-500);\r\n  border-top: none;\r\n  border-bottom-left-radius: var(--vtx-radius-md);\r\n  border-bottom-right-radius: var(--vtx-radius-md);\r\n  box-shadow: var(--vtx-shadow-md);\r\n  z-index: var(--vtx-z-index-dropdown);\r\n}\r\n\r\n/* Search Input */\r\n.vtx-multiselect-search {\r\n  position: sticky;\r\n  top: 0;\r\n  padding: var(--vtx-spacing-3);\r\n  background-color: white;\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  z-index: 1;\r\n}\r\n\r\n.vtx-multiselect-search input {\r\n  width: 100%;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-family: var(--vtx-font-family-sans);\r\n  outline: none;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-search input:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 0;\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Options List */\r\n.vtx-multiselect-options {\r\n  padding: 0.25rem;\r\n}\r\n\r\n/* Option Group */\r\n.vtx-multiselect-optgroup {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  color: var(--vtx-color-neutral-600);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-top: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-multiselect-optgroup:first-child {\r\n  margin-top: 0;\r\n}\r\n\r\n/* Option Item */\r\n.vtx-multiselect-option {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-fast);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-multiselect-option:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-multiselect-option:active {\r\n  background-color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-multiselect-option--selected {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-700);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n.vtx-multiselect-option--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Checkbox Style (Style 1) */\r\n.vtx-multiselect-checkbox {\r\n  width: 1.125rem;\r\n  height: 1.125rem;\r\n  border: 2px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-base);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  transition: all var(--vtx-transition-fast);\r\n  background-color: white;\r\n}\r\n\r\n.vtx-multiselect-option:hover .vtx-multiselect-checkbox {\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-multiselect-checkbox--checked {\r\n  background-color: var(--vtx-color-primary-500);\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-multiselect-checkbox svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n  color: white;\r\n  opacity: 0;\r\n  transform: scale(0.8);\r\n  transition: all var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-multiselect-checkbox--checked svg {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Checkmark Style (Style 2) */\r\n.vtx-multiselect-checkmark {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  margin-left: auto;\r\n}\r\n\r\n.vtx-multiselect-checkmark svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n  color: var(--vtx-color-primary-600);\r\n  opacity: 0;\r\n  transform: scale(0.5);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-option--selected .vtx-multiselect-checkmark svg {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Option Label */\r\n.vtx-multiselect-option-label {\r\n  flex: 1;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Select All / Clear All */\r\n.vtx-multiselect-actions {\r\n  display: flex;\r\n  gap: var(--vtx-spacing-2);\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n\r\n.vtx-multiselect-action-button {\r\n  font-size: var(--vtx-font-size-xs);\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  border: none;\r\n  background: none;\r\n  color: var(--vtx-color-primary-600);\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-radius-base);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  transition: all var(--vtx-transition-fast);\r\n  font-family: var(--vtx-font-family-sans);\r\n}\r\n\r\n.vtx-multiselect-action-button:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n}\r\n\r\n.vtx-multiselect-action-button:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n/* Empty State */\r\n.vtx-multiselect-empty {\r\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\r\n  text-align: center;\r\n  color: var(--vtx-color-neutral-500);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n/* Loading Spinner in Icon Area */\r\n.vtx-multiselect-icon-spinner {\r\n  color: var(--vtx-multiselect-loader-color, var(--vtx-color-primary-500));\r\n  animation: vtx-multiselect-spin var(--vtx-multiselect-loader-speed, 0.8s) linear infinite;\r\n}\r\n\r\n.vtx-multiselect-icon-spinner-track {\r\n  opacity: var(--vtx-multiselect-loader-track-opacity, 0.25);\r\n}\r\n\r\n.vtx-multiselect-icon-spinner-path {\r\n  opacity: var(--vtx-multiselect-loader-path-opacity, 1);\r\n}\r\n\r\n@keyframes vtx-multiselect-spin {\r\n  from {\r\n    transform: rotate(0deg);\r\n  }\r\n  to {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n/* Helper / Error / Success Text */\r\n.vtx-multiselect-helper {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-neutral-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-multiselect-error {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-error-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-multiselect-success {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-success-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n/* Hidden Native Select for Form Integration */\r\n.vtx-multiselect-hidden-select {\r\n  position: absolute;\r\n  opacity: 0;\r\n  pointer-events: none;\r\n  width: 0;\r\n  height: 0;\r\n}\r\n\r\n/* Scrollbar Styling */\r\n.vtx-multiselect-dropdown::-webkit-scrollbar {\r\n  width: 8px;\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-base);\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-thumb:hover {\r\n  background: var(--vtx-color-neutral-400);\r\n}\r\n");const S=a.default.forwardRef(({label:t,helperText:e,error:o,success:a,size:i,fullWidth:l=!1,options:c,value:s,defaultValue:v=[],placeholder:d="Select...",className:x="",grouped:p=!1,getOptionLabel:u="label",getOptionValue:h="value",getOptionDisabled:g="disabled",getOptionGroup:f="group",onChange:b,disabled:w=!1,required:y=!1,id:k,name:z,selectionStyle:S="checkbox",searchable:C=!1,showSelectAll:_=!1,maxChipsDisplay:T,chipColor:$="primary",chipVariant:L="light",loading:M=!1},B)=>{const{theme:E}=m(),I=j("multiselect"),A=k||I,D=`${A}-helper`,R=`${A}-error`,O=`${A}-success`,[W,H]=r.useState(!1),[F,V]=r.useState(""),[Y,P]=r.useState(v),X=r.useRef(null),q=r.useRef(null),G=void 0!==s?s:Y,K=(n,r)=>"function"==typeof r?r(n):"object"==typeof n?n[r]:n,U=Boolean(o),Z=Boolean(a)&&!U,J=[e&&!o&&!a&&D,o&&R,a&&O].filter(Boolean).join(" ");r.useEffect(()=>{const n=n=>{X.current&&!X.current.contains(n.target)&&q.current&&!q.current.contains(n.target)&&(H(!1),V(""))};if(W)return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[W]);const Q=n=>{if(w)return;const r=G.includes(n)?G.filter(r=>r!==n):[...G,n];if(void 0===s&&P(r),b){const n=c.filter(n=>r.includes(K(n,h)));b(r,n)}},nn=F?c.filter(n=>K(n,u).toLowerCase().includes(F.toLowerCase())):c,rn=p?nn.reduce((n,r)=>{const t=K(r,f)||"Other";return n[t]||(n[t]=[]),n[t].push(r),n},{}):{"":nn},tn=c.filter(n=>G.includes(K(n,h))),en=T?tn.slice(0,T):tn,on=T?tn.length-T:0,an=["vtx-multiselect-wrapper",l&&"vtx-multiselect-wrapper--full-width",x].filter(Boolean).join(" "),ln=i||(null==E?void 0:E.defaultSize)||"md",cn=["vtx-multiselect-container",`vtx-multiselect-container--${ln}`,U&&"vtx-multiselect-container--error",Z&&"vtx-multiselect-container--success",w&&"vtx-multiselect-container--disabled",W&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),sn=ln;return n.jsxs("div",{className:an,ref:B,children:[t&&n.jsxs("label",{htmlFor:A,className:"vtx-multiselect-label",children:[t,y&&n.jsxs("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{ref:X,className:cn,"aria-expanded":W,"aria-haspopup":"listbox","aria-labelledby":t?`${A}-label`:void 0,"aria-describedby":J||void 0,"aria-disabled":w,children:[n.jsx("div",{className:"vtx-multiselect-input-area",onClick:()=>!w&&H(!W),role:"button",tabIndex:w?-1:0,onKeyDown:n=>{w||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),H(!W))},children:0===tn.length?n.jsx("span",{className:"vtx-multiselect-placeholder",children:d}):n.jsxs("div",{className:"vtx-multiselect-chips",children:[en.map(r=>{const t=K(r,h),e=K(r,u);return n.jsx(N,{label:e,size:sn,color:$,variant:L,onDelete:n=>{n.stopPropagation(),(n=>{if(w)return;const r=G.filter(r=>r!==n);if(void 0===s&&P(r),b){const n=c.filter(n=>r.includes(K(n,h)));b(r,n)}})(t)}},t)}),on>0&&n.jsx(N,{label:`+${on} more`,size:sn,color:"default",variant:"outlined"})]})}),n.jsx("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:M?n.jsxs("svg",{className:"vtx-multiselect-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[n.jsx("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),n.jsx("path",{className:"vtx-multiselect-icon-spinner-path",fill:"currentColor",d:"M8 2C4.686 2 2 4.686 2 8h2c0-2.21 1.79-4 4-4V2z"})]}):n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),W&&n.jsxs("div",{ref:q,className:"vtx-multiselect-dropdown",role:"listbox",children:[C&&n.jsx("div",{className:"vtx-multiselect-search",children:n.jsx("input",{type:"text",placeholder:"Search...",value:F,onChange:n=>V(n.target.value),onClick:n=>n.stopPropagation()})}),_&&n.jsxs("div",{className:"vtx-multiselect-actions",children:[n.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:n=>{n.stopPropagation(),(()=>{const n=c.filter(n=>!K(n,g)).map(n=>K(n,h));void 0===s&&P(n),b&&b(n,c.filter(n=>!K(n,g)))})()},children:"Select All"}),n.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:n=>{n.stopPropagation(),void 0===s&&P([]),b&&b([],[])},children:"Clear All"})]}),n.jsx("div",{className:"vtx-multiselect-options",children:0===nn.length?n.jsx("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(rn).map(([r,t])=>n.jsxs("div",{children:[p&&r&&n.jsx("div",{className:"vtx-multiselect-optgroup",children:r}),t.map(r=>{const t=K(r,h),e=K(r,u),o=K(r,g),a=G.includes(t),i=["vtx-multiselect-option",a&&"vtx-multiselect-option--selected",o&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return n.jsxs("div",{className:i,onClick:()=>!o&&Q(t),role:"option","aria-selected":a,"aria-disabled":o,tabIndex:o?-1:0,onKeyDown:n=>{o||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),Q(t))},children:["checkbox"===S&&n.jsx("div",{className:"vtx-multiselect-checkbox "+(a?"vtx-multiselect-checkbox--checked":""),children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M3 8L6.5 11.5L13 5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),n.jsx("span",{className:"vtx-multiselect-option-label",children:e}),"checkmark"===S&&n.jsx("div",{className:"vtx-multiselect-checkmark",children:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:n.jsx("path",{d:"M4 10L8 14L16 6",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]},t)})]},r))})]})]}),z&&n.jsx("select",{multiple:!0,name:z,value:G.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:y,disabled:w,tabIndex:-1,"aria-hidden":"true",children:c.map(r=>{const t=K(r,h);return n.jsx("option",{value:String(t),children:K(r,u)},t)})}),e&&!o&&!a&&n.jsx("p",{id:D,className:"vtx-multiselect-helper",children:e}),o&&n.jsx("p",{id:R,className:"vtx-multiselect-error",role:"alert",children:o}),a&&n.jsx("p",{id:O,className:"vtx-multiselect-success",role:"status",children:a})]})});S.displayName="MultiSelect";u("/* Radio Base Styles */\n.vtx-radio {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n/* Label Container */\n.vtx-radio-label {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  cursor: pointer;\n  user-select: none;\n  position: relative;\n}\n\n/* Wrapper for input and visual radio */\n.vtx-radio-wrapper {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* Hidden input */\n.vtx-radio-input {\n  position: absolute;\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n  padding: 0;\n  pointer-events: none;\n}\n\n/* Visual radio circle */\n.vtx-radio-circle {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--vtx-radio-size, 20px);\n  height: var(--vtx-radio-size, 20px);\n  border: var(--vtx-radio-border-width, 2px) solid var(--vtx-color-neutral-300);\n  border-radius: 50%;\n  background-color: white;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  box-sizing: border-box;\n}\n\n/* Inner dot */\n.vtx-radio-dot {\n  width: 50%;\n  height: 50%;\n  border-radius: 50%;\n  background-color: white;\n  opacity: 0;\n  transform: scale(0);\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* Checked state */\n.vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\n  border-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\n}\n\n.vtx-radio-input:checked + .vtx-radio-circle .vtx-radio-dot {\n  opacity: 1;\n  transform: scale(1);\n}\n\n/* Hover state */\n.vtx-radio-label:hover .vtx-radio-circle {\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\n  border-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\n}\n\n/* Focus state */\n.vtx-radio-input:focus-visible + .vtx-radio-circle {\n  outline: 2px solid var(--vtx-radio-color, var(--vtx-color-primary-600));\n  outline-offset: 2px;\n}\n\n/* Label text */\n.vtx-radio-label-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Disabled state */\n.vtx-radio--disabled .vtx-radio-label {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.vtx-radio--disabled .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-100);\n  border-color: var(--vtx-color-neutral-300);\n}\n\n.vtx-radio--disabled .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-400);\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-circle,\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-100);\n  border-color: var(--vtx-color-neutral-300);\n}\n\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-400);\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio--disabled .vtx-radio-label-text {\n  color: var(--vtx-color-neutral-500);\n}\n\n/* Error state */\n.vtx-radio--error .vtx-radio-circle {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-radio--error .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-radio--error .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-error-700);\n  border-color: var(--vtx-color-error-700);\n}\n\n/* Helper text */\n.vtx-radio-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-left: calc(var(--vtx-radio-size, 20px) + var(--vtx-spacing-2));\n}\n\n.vtx-radio--error .vtx-radio-helper-text {\n  color: var(--vtx-color-error-600);\n}\n\n/* Size variants */\n.vtx-radio--small {\n  --vtx-radio-size: 16px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--small .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-radio--medium {\n  --vtx-radio-size: 20px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--large {\n  --vtx-radio-size: 24px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--large .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Variants */\n.vtx-radio--primary {\n  --vtx-radio-color: var(--vtx-color-primary-600);\n  --vtx-radio-hover-color: var(--vtx-color-primary-700);\n}\n\n.vtx-radio--secondary {\n  --vtx-radio-color: var(--vtx-color-neutral-600);\n  --vtx-radio-hover-color: var(--vtx-color-neutral-700);\n}\n\n.vtx-radio--success {\n  --vtx-radio-color: var(--vtx-color-success-600);\n  --vtx-radio-hover-color: var(--vtx-color-success-700);\n}\n\n.vtx-radio--error {\n  --vtx-radio-color: var(--vtx-color-error-600);\n  --vtx-radio-hover-color: var(--vtx-color-error-700);\n}\n\n.vtx-radio--warning {\n  --vtx-radio-color: var(--vtx-color-warning-600);\n  --vtx-radio-hover-color: var(--vtx-color-warning-700);\n}\n\n.vtx-radio--info {\n  --vtx-radio-color: var(--vtx-color-info-600);\n  --vtx-radio-hover-color: var(--vtx-color-info-700);\n}\n");const C=a.default.forwardRef(({checked:t,disabled:e=!1,label:o,size:a="medium",variant:i="primary",error:l=!1,helperText:c,onChange:s,className:v="",inputClassName:d="",id:x,...p},m)=>{const u=r.useId(),h=x||u,g=c?`${h}-helper-text`:void 0,f=["vtx-radio",`vtx-radio--${a}`,`vtx-radio--${i}`,e&&"vtx-radio--disabled",l&&"vtx-radio--error",v].filter(Boolean).join(" "),b=["vtx-radio-input",d].filter(Boolean).join(" "),w=n.jsxs("div",{className:"vtx-radio-wrapper",children:[n.jsx("input",{ref:m,type:"radio",id:h,className:b,checked:t,disabled:e,onChange:s,"aria-describedby":g,...p}),n.jsx("span",{className:"vtx-radio-circle",children:n.jsx("span",{className:"vtx-radio-dot"})})]});return o?n.jsxs("div",{className:f,children:[n.jsxs("label",{htmlFor:h,className:"vtx-radio-label",children:[w,n.jsx("span",{className:"vtx-radio-label-text",children:o})]}),c&&n.jsx("span",{id:g,className:"vtx-radio-helper-text",children:c})]}):n.jsxs("div",{className:f,children:[w,c&&n.jsx("span",{id:g,className:"vtx-radio-helper-text",children:c})]})});C.displayName="Radio";u("/* RadioGroup Base Styles */\n.vtx-radio-group {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n}\n\n/* Group Label */\n.vtx-radio-group-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-radio-group--disabled .vtx-radio-group-label {\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-radio-group--error .vtx-radio-group-label {\n  color: var(--vtx-color-error-600);\n}\n\n/* Options Container */\n.vtx-radio-group-options {\n  display: flex;\n  gap: var(--vtx-spacing-3);\n}\n\n.vtx-radio-group--vertical .vtx-radio-group-options {\n  flex-direction: column;\n}\n\n.vtx-radio-group--horizontal .vtx-radio-group-options {\n  flex-direction: row;\n  flex-wrap: wrap;\n}\n\n/* Helper Text */\n.vtx-radio-group-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-radio-group--error .vtx-radio-group-helper-text {\n  color: var(--vtx-color-error-600);\n}\n");const _=a.default.forwardRef(({name:t,label:e,options:o,value:a,defaultValue:i,onChange:l,disabled:c=!1,error:s=!1,helperText:v,orientation:d="vertical",size:x="medium",variant:p="primary",className:m="",...u},h)=>{const[g,f]=r.useState(i),b=void 0!==a,w=b?a:g,y=["vtx-radio-group",`vtx-radio-group--${d}`,s&&"vtx-radio-group--error",c&&"vtx-radio-group--disabled",m].filter(Boolean).join(" ");return n.jsxs("div",{ref:h,className:y,role:"radiogroup","aria-label":"string"==typeof e?e:void 0,...u,children:[e&&n.jsx("div",{className:"vtx-radio-group-label",children:e}),n.jsx("div",{className:"vtx-radio-group-options",children:o.map(r=>{const e=w===r.value,o=c||r.disabled;return n.jsx(C,{name:t,value:r.value,label:r.label,checked:e,disabled:o,error:s,size:x,variant:p,onChange:()=>{return n=r.value,b||f(n),void(null==l||l(n));var n}},r.value)})}),v&&n.jsx("div",{className:"vtx-radio-group-helper-text",children:v})]})});_.displayName="RadioGroup";u(".vtx-select-wrapper {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n.vtx-select-wrapper--full-width {\n  width: 100%;\n}\n\n.vtx-select-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  color: var(--vtx-color-neutral-700);\n  line-height: var(--vtx-line-height-tight);\n}\n\n.vtx-select-label__required {\n  color: var(--vtx-color-error-600);\n  margin-left: var(--vtx-spacing-1);\n}\n\n.vtx-select-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  background-color: white;\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  transition: all var(--vtx-transition-base);\n}\n\n.vtx-select-container:focus-within {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 0;\n  border-color: var(--vtx-color-primary-500);\n}\n\n.vtx-select-container--error {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-select-container--error:focus-within {\n  outline-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-select-container--disabled {\n  background-color: var(--vtx-color-neutral-100);\n  cursor: not-allowed;\n}\n\n/* Sizes */\n.vtx-select-container--small {\n  min-height: 32px;\n}\n\n.vtx-select-container--medium {\n  min-height: 40px;\n}\n\n.vtx-select-container--large {\n  min-height: 48px;\n}\n\n.vtx-select {\n  flex: 1;\n  width: 100%;\n  min-width: 0;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n  background: transparent;\n  border: none;\n  outline: none;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  padding-right: var(--vtx-spacing-8);\n  cursor: pointer;\n  appearance: none;\n}\n\n.vtx-select:disabled {\n  cursor: not-allowed;\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-select-container--small .vtx-select {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  padding-right: var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-select-container--large .vtx-select {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  padding-right: var(--vtx-spacing-10);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Dropdown icon */\n.vtx-select-icon {\n  position: absolute;\n  right: var(--vtx-spacing-3);\n  display: inline-flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-500);\n  pointer-events: none;\n}\n\n.vtx-select-container--disabled .vtx-select-icon {\n  color: var(--vtx-color-neutral-400);\n}\n\n/* Loading Spinner in Icon Area */\n.vtx-select-icon-spinner {\n  color: var(--vtx-select-loader-color, var(--vtx-color-primary-500));\n  animation: vtx-select-spin var(--vtx-select-loader-speed, 0.8s) linear infinite;\n}\n\n.vtx-select-icon-spinner-track {\n  opacity: var(--vtx-select-loader-track-opacity, 0.25);\n}\n\n.vtx-select-icon-spinner-path {\n  opacity: var(--vtx-select-loader-path-opacity, 1);\n}\n\n@keyframes vtx-select-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Helper and error text */\n.vtx-select-helper,\n.vtx-select-error {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  margin: 0;\n}\n\n.vtx-select-helper {\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-select-error {\n  color: var(--vtx-color-error-600);\n}\n");const T=a.default.forwardRef(({label:r,helperText:t,error:e,success:o,size:a="medium",fullWidth:i=!1,options:l,placeholder:c,className:s="",wrapperClassName:v="",id:d,disabled:x=!1,required:p=!1,grouped:m=!1,getOptionLabel:u="label",getOptionValue:h="value",getOptionDisabled:g="disabled",getOptionGroup:f="group",onSelectChange:b,onChange:w,loading:y=!1,...k},z)=>{const N=j("select"),S=d||N,C=`${S}-helper`,_=`${S}-error`,T=`${S}-success`,$=(n,r)=>"function"==typeof r?r(n):"object"==typeof n?n[r]:n,L=Boolean(e),M=Boolean(o)&&!L,B=[t&&!e&&!o&&C,e&&_,o&&T].filter(Boolean).join(" "),E=["vtx-select-wrapper",i&&"vtx-select-wrapper--full-width",v].filter(Boolean).join(" "),I=["vtx-select-container",`vtx-select-container--${a}`,L&&"vtx-select-container--error",M&&"vtx-select-container--success",x&&"vtx-select-container--disabled",s].filter(Boolean).join(" ");return n.jsxs("div",{className:E,children:[r&&n.jsxs("label",{htmlFor:S,className:"vtx-select-label",children:[r,p&&n.jsxs("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{className:I,children:[n.jsxs("select",{ref:z,id:S,className:"vtx-select",disabled:x,required:p,"aria-invalid":L,"aria-describedby":B||void 0,onChange:n=>{if(null==w||w(n),b){const r=l.find(r=>String($(r,h))===n.target.value);b(n.target.value,r)}},...k,children:[c&&n.jsx("option",{value:"",disabled:!0,children:c}),(()=>{if(!m)return l.map((r,t)=>{const e=$(r,h),o=$(r,u),a=$(r,g);return n.jsx("option",{value:e,disabled:a,children:o},e||t)});const r=l.reduce((n,r)=>{const t=$(r,f)||"Other";return n[t]||(n[t]=[]),n[t].push(r),n},{});return Object.entries(r).map(([r,t])=>n.jsx("optgroup",{label:r,children:t.map((r,t)=>{const e=$(r,h),o=$(r,u),a=$(r,g);return n.jsx("option",{value:e,disabled:a,children:o},e||t)})},r))})()]}),n.jsx("span",{className:"vtx-select-icon","aria-hidden":"true",children:y?n.jsxs("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[n.jsx("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),n.jsx("path",{className:"vtx-select-icon-spinner-path",fill:"currentColor",d:"M8 2C4.686 2 2 4.686 2 8h2c0-2.21 1.79-4 4-4V2z"})]}):n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),t&&!e&&!o&&n.jsx("p",{id:C,className:"vtx-select-helper",children:t}),e&&n.jsx("p",{id:_,className:"vtx-select-error",role:"alert",children:e}),o&&n.jsx("p",{id:T,className:"vtx-select-success",role:"status",children:o})]})});T.displayName="Select";const $=a.default.forwardRef(({item:t,isOpen:e,onToggle:o,variant:a="default",size:i="md",showChevron:l=!0,chevronPosition:c="right",expandedIcon:s,collapsedIcon:v,iconType:d="chevron",loading:x=!1,disabled:p=!1,disableAnimations:m=!1},u)=>{const h=r.useRef(null),{id:g,header:f,children:b,disabled:w,className:y,loading:k,status:j="default",icon:z,dataTestId:N}=t,S=p||w,C=x||k,_=()=>{S||C||o()},T=()=>z?n.jsx("div",{className:"accordion-item-chevron "+(e?"open":""),"data-testid":`${N||g}-custom-icon`,children:e?z.expanded:z.collapsed}):"custom"===d&&s&&v?n.jsx("div",{className:"accordion-item-chevron "+(e?"open":""),"data-testid":`${N||g}-custom-icon`,children:e?s:v}):"plus-minus"===d?n.jsx("div",{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(e?"open":""),"data-testid":`${N||g}-plus-minus-icon`,children:e?n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M4 8H12",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})}):n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M8 4V12M4 8H12",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})})}):n.jsx("div",{className:"accordion-item-chevron "+(e?"open":""),"data-testid":`${N||g}-chevron-icon`,children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})});return n.jsxs("div",{ref:u,className:`\n          accordion-item\n          accordion-item--${a}\n          accordion-item--${i}\n          ${e?"accordion-item--open":""}\n          ${S?"accordion-item--disabled":""}\n          ${C?"accordion-item--loading":""}\n          ${"default"!==j?`accordion-item--${j}`:""}\n          ${y||""}\n        `.trim(),"data-testid":N,"aria-expanded":e,"aria-disabled":S,"aria-busy":C,children:[n.jsxs("div",{className:"accordion-item-header",role:"button",tabIndex:S||C?-1:0,"aria-expanded":e,"aria-controls":`accordion-content-${g}`,"aria-disabled":S,"aria-busy":C,"aria-describedby":"default"!==j?`accordion-status-${g}`:void 0,onClick:_,onKeyDown:n=>{"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),_())},"data-testid":`${N||g}-header`,children:["left"===c&&l&&T(),n.jsx("div",{className:"accordion-item-header-content",children:f}),"right"===c&&l&&T()]}),n.jsx("div",{id:`accordion-content-${g}`,className:"accordion-item-content "+(e?"accordion-item-content--open":""),role:"region","aria-labelledby":`accordion-header-${g}`,ref:h,style:{maxHeight:m?e?"none":"0":e?"500px":"0",transition:m?"none":void 0},"data-testid":`${N||g}-content`,children:n.jsxs("div",{className:"accordion-item-body",children:["default"!==j&&n.jsx("div",{id:`accordion-status-${g}`,className:`accordion-status accordion-status--${j}`,"aria-live":"polite",children:n.jsxs("span",{className:"visually-hidden",children:["Status: ",j]})}),b]})})]})});$.displayName="AccordionItem";u("/* =============================================================================\r\n * ACCORDION COMPONENT - VTX DESIGN SYSTEM\r\n * =============================================================================\r\n * \r\n * A modern, accessible accordion component that fully utilizes the VTX design \r\n * system tokens for consistent theming and beautiful visual states.\r\n * \r\n * Features:\r\n * - Complete VTX token integration\r\n * - Multiple visual variants (default, bordered, separated, flush)\r\n * - Responsive size variants (sm, md, lg)\r\n * - Enhanced hover, focus, and active states\r\n * - Dark mode support\r\n * - Accessibility features\r\n * - Smooth animations\r\n * ============================================================================= */\r\n\r\n.accordion {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* =============================================================================\r\n * VARIANT STYLES\r\n * ============================================================================= */\r\n\r\n/* Default Variant - Clean card-like appearance */\r\n.accordion--default {\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: var(--vtx-radius-xl);\r\n  overflow: hidden;\r\n  box-shadow: var(--vtx-shadow-base);\r\n  transition: box-shadow var(--vtx-transition-base);\r\n}\r\n\r\n.accordion--default:hover {\r\n  box-shadow: var(--vtx-shadow-md);\r\n}\r\n\r\n.accordion--default.accordion--divider .accordion-item:not(:last-child) {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n/* Bordered Variant - Individual cards with spacing */\r\n.accordion--bordered .accordion-item {\r\n  background: white;\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: var(--vtx-radius-lg);\r\n  box-shadow: var(--vtx-shadow-sm);\r\n  transition: \r\n    box-shadow var(--vtx-transition-base),\r\n    border-color var(--vtx-transition-base),\r\n    transform var(--vtx-transition-fast);\r\n}\r\n\r\n.accordion--bordered .accordion-item:hover {\r\n  border-color: var(--vtx-color-primary-300);\r\n  box-shadow: var(--vtx-shadow-md);\r\n  transform: translateY(-1px);\r\n}\r\n\r\n.accordion--bordered .accordion-item + .accordion-item {\r\n  margin-top: var(--vtx-spacing-4);\r\n}\r\n\r\n/* Separated Variant - Floating cards with enhanced shadows */\r\n.accordion--separated .accordion-item {\r\n  background: white;\r\n  border: 1px solid var(--vtx-color-neutral-100);\r\n  border-radius: var(--vtx-radius-xl);\r\n  box-shadow: \r\n    var(--vtx-shadow-base),\r\n    0 0 0 1px rgba(255, 255, 255, 0.8);\r\n  transition: \r\n    box-shadow var(--vtx-transition-base),\r\n    transform var(--vtx-transition-base);\r\n  backdrop-filter: blur(10px);\r\n}\r\n\r\n.accordion--separated .accordion-item:hover {\r\n  box-shadow: \r\n    var(--vtx-shadow-xl),\r\n    0 0 0 1px var(--vtx-color-primary-100);\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.accordion--separated .accordion-item + .accordion-item {\r\n  margin-top: var(--vtx-spacing-6);\r\n}\r\n\r\n/* Flush Variant - Minimal design without borders */\r\n.accordion--flush {\r\n  border: none;\r\n  box-shadow: none;\r\n  background: transparent;\r\n}\r\n\r\n.accordion--flush .accordion-item {\r\n  background: transparent;\r\n  border: none;\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: 0;\r\n  box-shadow: none;\r\n}\r\n\r\n.accordion--flush .accordion-item:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.accordion--flush .accordion-item:hover {\r\n  background: var(--vtx-color-neutral-50);\r\n}\r\n\r\n/* Dividers for bordered variant */\r\n.accordion--bordered.accordion--divider .accordion-item:not(:last-child) {\r\n  position: relative;\r\n  margin-bottom: var(--accordion-divider-spacing, 12px);\r\n}\r\n\r\n.accordion--bordered.accordion--divider .accordion-item:not(:last-child)::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -10px;\r\n  left: 0;\r\n  right: 0;\r\n  height: 1px;\r\n  background: var(--accordion-divider, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion--separated .accordion-item {\r\n  background: var(--accordion-bg, var(--color-background, #ffffff));\r\n  border-radius: var(--accordion-item-radius-lg, var(--radius-lg, 10px));\r\n  box-shadow: var(\r\n    --accordion-separated-shadow,\r\n    var(--shadow-md, 0 4px 6px rgba(0, 0, 0, 0.07), 0 1px 3px rgba(0, 0, 0, 0.06))\r\n  );\r\n  border: 1px solid var(--accordion-separated-border, var(--color-border-light, #f3f4f6));\r\n  transition:\r\n    transform var(--transition-duration, 0.2s) var(--transition-timing, ease),\r\n    box-shadow var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n}\r\n\r\n.accordion--separated .accordion-item:hover {\r\n  transform: translateY(-2px);\r\n  box-shadow: var(\r\n    --accordion-separated-shadow-hover,\r\n    var(--shadow-lg, 0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05))\r\n  );\r\n}\r\n\r\n.accordion--separated .accordion-item + .accordion-item {\r\n  margin-top: var(--accordion-spacing-lg, var(--spacing-4, 16px));\r\n}\r\n\r\n/* Dividers for separated variant */\r\n.accordion--separated.accordion--divider .accordion-item {\r\n  position: relative;\r\n}\r\n\r\n.accordion--separated.accordion--divider .accordion-item:not(:last-child)::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -8px;\r\n  left: 10%;\r\n  right: 10%;\r\n  height: 1px;\r\n  background: var(\r\n    --accordion-divider-gradient,\r\n    linear-gradient(\r\n      to right,\r\n      transparent,\r\n      var(--color-border-hover, #d1d5db) 20%,\r\n      var(--color-border-hover, #d1d5db) 80%,\r\n      transparent\r\n    )\r\n  );\r\n  z-index: 1;\r\n}\r\n\r\n.accordion--flush {\r\n  border: none;\r\n  background: transparent;\r\n}\r\n\r\n.accordion--flush .accordion-item {\r\n  border: none;\r\n  border-radius: 0;\r\n  background: transparent;\r\n  border-bottom: 1px solid var(--accordion-divider, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion--flush .accordion-item:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n/* Accordion Item */\r\n.accordion-item {\r\n  position: relative;\r\n  background: inherit;\r\n  transition: all var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n  overflow: hidden;\r\n}\r\n\r\n.accordion-item--disabled {\r\n  opacity: var(--accordion-disabled-opacity, 0.5);\r\n  pointer-events: none;\r\n}\r\n\r\n.accordion-item--disabled .accordion-item-header {\r\n  cursor: not-allowed;\r\n  color: var(--accordion-disabled-color, var(--color-text-disabled, #9ca3af));\r\n}\r\n\r\n/* Accordion Item Header */\r\n.accordion-item-header {\r\n  display: flex;\r\n  align-items: center;\r\n  width: 100%;\r\n  cursor: pointer;\r\n  outline: none;\r\n  transition: all var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n  user-select: none;\r\n  position: relative;\r\n  border: none;\r\n  background: transparent;\r\n  text-align: left;\r\n}\r\n\r\n.accordion-item-header:hover:not(:disabled) {\r\n  background: var(\r\n    --accordion-header-hover-bg,\r\n    var(--color-background-hover, linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%))\r\n  );\r\n}\r\n\r\n.accordion-item-header:active {\r\n  transform: translateY(1px);\r\n}\r\n\r\n.accordion-item-header:focus {\r\n  outline: 2px solid var(--accordion-focus-color, var(--vtx-color-primary-500));\r\n  outline-offset: -2px;\r\n  border-radius: var(--accordion-focus-radius, var(--radius-sm, 4px));\r\n}\r\n\r\n.accordion-item-header:focus:not(:focus-visible) {\r\n  outline: none;\r\n}\r\n\r\n.accordion-item-header-content {\r\n  flex: 1;\r\n  text-align: left;\r\n  font-weight: var(--accordion-header-font-weight, var(--font-weight-semibold, 600));\r\n  color: var(--accordion-header-color, var(--color-text-primary, #1f2937));\r\n  line-height: var(--accordion-header-line-height, var(--line-height-normal, 1.5));\r\n}\r\n\r\n/* Chevron Icon */\r\n.accordion-item-chevron {\r\n  transition: transform var(--accordion-icon-transition, var(--transition-duration-slow, 0.3s))\r\n    var(--transition-timing-smooth, cubic-bezier(0.4, 0, 0.2, 1));\r\n  color: var(--accordion-icon-color, var(--color-text-secondary, #6b7280));\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: var(--accordion-icon-size, 24px);\r\n  height: var(--accordion-icon-size, 24px);\r\n  border-radius: var(--accordion-icon-radius, 50%);\r\n  background: var(--accordion-icon-bg, rgba(59, 130, 246, 0.1));\r\n}\r\n\r\n.accordion-item-chevron.open {\r\n  transform: rotate(180deg);\r\n  background: var(--accordion-icon-bg-open, rgba(59, 130, 246, 0.2));\r\n  color: var(--accordion-icon-color-open, var(--vtx-color-primary-500));\r\n}\r\n\r\n.accordion-item-header:hover .accordion-chevron {\r\n  background: var(--accordion-icon-bg-hover, rgba(59, 130, 246, 0.15));\r\n  color: var(--accordion-icon-color-hover, var(--vtx-color-primary-500));\r\n}\r\n\r\n/* Accordion Item Content */\r\n.accordion-item-content {\r\n  overflow: hidden;\r\n  transition: all var(--accordion-content-transition, var(--transition-duration-slow, 0.3s))\r\n    var(--transition-timing-smooth, cubic-bezier(0.4, 0, 0.2, 1));\r\n  max-height: 0;\r\n  background: var(--accordion-content-bg, var(--color-background-alt, #fafbfc));\r\n  border-top: 1px solid transparent;\r\n}\r\n\r\n.accordion-item-content--open {\r\n  max-height: var(--accordion-content-max-height, 500px);\r\n  border-top-color: var(--accordion-content-border, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion-item-body {\r\n  color: var(--accordion-body-color, var(--color-text-secondary, #4b5563));\r\n  line-height: var(--accordion-body-line-height, var(--line-height-relaxed, 1.7));\r\n  font-size: var(--accordion-body-font-size, 0.95em);\r\n}\r\n\r\n/* =============================================================================\r\n * SIZE VARIANTS\r\n * ============================================================================= */\r\n\r\n/* Small Size */\r\n.accordion--sm .accordion-item-header {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-sm);\r\n  min-height: 48px;\r\n}\r\n\r\n.accordion--sm .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.accordion--sm .accordion-item-body {\r\n  padding: var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.accordion--sm .accordion-item-chevron {\r\n  width: var(--vtx-spacing-5);\r\n  height: var(--vtx-spacing-5);\r\n}\r\n\r\n.accordion--sm .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-3);\r\n  height: var(--vtx-spacing-3);\r\n}\r\n\r\n/* Medium Size (Default) */\r\n.accordion--md .accordion-item-header {\r\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-5);\r\n  font-size: var(--vtx-font-size-base);\r\n  min-height: 56px;\r\n}\r\n\r\n.accordion--md .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n.accordion--md .accordion-item-body {\r\n  padding: var(--vtx-spacing-5);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.accordion--md .accordion-item-chevron {\r\n  width: var(--vtx-spacing-6);\r\n  height: var(--vtx-spacing-6);\r\n}\r\n\r\n.accordion--md .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-4);\r\n  height: var(--vtx-spacing-4);\r\n}\r\n\r\n/* Large Size */\r\n.accordion--lg .accordion-item-header {\r\n  padding: var(--vtx-spacing-5) var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-lg);\r\n  min-height: 64px;\r\n}\r\n\r\n.accordion--lg .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n}\r\n\r\n.accordion--lg .accordion-item-body {\r\n  padding: var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n.accordion--lg .accordion-item-chevron {\r\n  width: var(--vtx-spacing-8);\r\n  height: var(--vtx-spacing-8);\r\n}\r\n\r\n.accordion--lg .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-5);\r\n  height: var(--vtx-spacing-5);\r\n}\r\n\r\n/* =============================================================================\r\n * DARK MODE SUPPORT\r\n * ============================================================================= */\r\n\r\n[data-theme=\"dark\"] .accordion,\r\n@media (prefers-color-scheme: dark) {\r\n  .accordion {\r\n    color: var(--vtx-color-neutral-100);\r\n  }\r\n\r\n  /* Dark mode variants */\r\n  .accordion--default {\r\n    background: var(--vtx-color-neutral-800);\r\n    border-color: var(--vtx-color-neutral-700);\r\n    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);\r\n  }\r\n\r\n  .accordion--bordered .accordion-item,\r\n  .accordion--separated .accordion-item {\r\n    background: var(--vtx-color-neutral-900);\r\n    border-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .accordion--flush .accordion-item:hover {\r\n    background: var(--vtx-color-neutral-800);\r\n  }\r\n\r\n  /* Header dark mode */\r\n  .accordion-item-header {\r\n    background: var(--vtx-color-neutral-900);\r\n  }\r\n\r\n  .accordion-item-header:hover {\r\n    background: linear-gradient(135deg, var(--vtx-color-neutral-800) 0%, var(--vtx-color-neutral-700) 100%);\r\n  }\r\n\r\n  .accordion-item-header-content {\r\n    color: var(--vtx-color-neutral-100);\r\n  }\r\n\r\n  .accordion-item-header:hover .accordion-item-header-content {\r\n    color: var(--vtx-color-primary-300);\r\n  }\r\n\r\n  .accordion-item--open .accordion-item-header {\r\n    background: linear-gradient(135deg, var(--vtx-color-neutral-800) 0%, var(--vtx-color-primary-900) 100%);\r\n    border-bottom-color: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .accordion-item--open .accordion-item-header-content {\r\n    color: var(--vtx-color-primary-200);\r\n  }\r\n\r\n  /* Content dark mode */\r\n  .accordion-item-content {\r\n    background: var(--vtx-color-neutral-800);\r\n    border-top-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .accordion-item-content--open {\r\n    border-top-color: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .accordion-item-body {\r\n    color: var(--vtx-color-neutral-300);\r\n  }\r\n\r\n  /* Chevron dark mode */\r\n  .accordion-item-chevron {\r\n    background: var(--vtx-color-primary-900);\r\n    color: var(--vtx-color-primary-300);\r\n  }\r\n\r\n  .accordion-item-chevron.open {\r\n    background: var(--vtx-color-primary-800);\r\n    color: var(--vtx-color-primary-200);\r\n  }\r\n\r\n  .accordion-item-header:hover .accordion-item-chevron {\r\n    background: var(--vtx-color-primary-700);\r\n    color: var(--vtx-color-primary-100);\r\n  }\r\n}\r\n\r\n/* =============================================================================\r\n * ENHANCED STATES AND ANIMATIONS\r\n * ============================================================================= */\r\n\r\n/* Loading state */\r\n.accordion-item--loading {\r\n  opacity: 0.6;\r\n  pointer-events: none;\r\n}\r\n\r\n.accordion-item--loading .accordion-item-chevron {\r\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\r\n}\r\n\r\n/* Enhanced animations */\r\n@keyframes pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.5;\r\n  }\r\n}\r\n\r\n@keyframes slideDown {\r\n  from {\r\n    max-height: 0;\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    max-height: 500px;\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Enhanced visual feedback */\r\n.accordion-item-header:active {\r\n  transform: scale(0.99);\r\n}\r\n\r\n/* Beautiful gradient accents for special states */\r\n.accordion-item--featured .accordion-item-header {\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-50) 0%, var(--vtx-color-secondary-50) 100%);\r\n  border-left: 4px solid var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Status indicators */\r\n.accordion-item--success .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-success-500);\r\n}\r\n\r\n.accordion-item--warning .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-warning-500);\r\n}\r\n\r\n.accordion-item--error .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-error-500);\r\n}\r\n\r\n/* =============================================================================\r\n * ACCESSIBILITY AND MOTION\r\n * ============================================================================= */\r\n\r\n/* High contrast mode */\r\n@media (prefers-contrast: high) {\r\n  .accordion-item {\r\n    border: 2px solid currentColor;\r\n  }\r\n  \r\n  .accordion-item-header:focus-visible {\r\n    outline: 4px solid currentColor;\r\n    outline-offset: 2px;\r\n  }\r\n  \r\n  .accordion-item-header-content {\r\n    font-weight: var(--vtx-font-weight-bold);\r\n  }\r\n}\r\n\r\n/* Reduced motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .accordion-item,\r\n  .accordion-item-header,\r\n  .accordion-item-chevron,\r\n  .accordion-item-content,\r\n  .accordion-item-body {\r\n    transition: none;\r\n    animation: none;\r\n  }\r\n  \r\n  .accordion-item-chevron.open {\r\n    transform: none;\r\n  }\r\n}\r\n\r\n/* Print styles */\r\n@media print {\r\n  .accordion-item {\r\n    page-break-inside: avoid;\r\n  }\r\n  \r\n  .accordion-item-content {\r\n    max-height: none !important;\r\n    overflow: visible !important;\r\n  }\r\n  \r\n  .accordion-item-chevron {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* =============================================================================\r\n * UTILITY CLASSES\r\n * ============================================================================= */\r\n\r\n/* Custom spacing */\r\n.accordion--compact .accordion-item-header {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  min-height: 40px;\r\n}\r\n\r\n.accordion--compact .accordion-item-body {\r\n  padding: var(--vtx-spacing-3);\r\n}\r\n\r\n.accordion--spacious .accordion-item-header {\r\n  padding: var(--vtx-spacing-6) var(--vtx-spacing-8);\r\n  min-height: 72px;\r\n}\r\n\r\n.accordion--spacious .accordion-item-body {\r\n  padding: var(--vtx-spacing-8);\r\n}\r\n\r\n/* No animations */\r\n.accordion--no-animation * {\r\n  transition: none !important;\r\n  animation: none !important;\r\n}\r\n\r\n\r\n");const L=a.default.forwardRef(({items:t,children:e,allowMultiple:o=!1,defaultOpenItems:a=[],openItems:i,onToggle:l,variant:c="default",size:s="md",className:v="",style:d,showChevron:x=!0,chevronPosition:p="right",expandedIcon:m,collapsedIcon:u,iconType:h="chevron",showDivider:g=!0,collapsible:f=!0,loading:b=!1,disabled:w=!1,spacing:y="default",disableAnimations:k=!1,...j},z)=>{const[N,S]=r.useState(a),C=void 0!==i?i:N,_=void 0!==i,T=t||r.Children.toArray(e).filter(n=>r.isValidElement(n)).map((n,t)=>{if(r.isValidElement(n)&&n.props){const r=n;return{id:r.props.id||`accordion-item-${t}`,header:r.props.header||`Item ${t+1}`,children:r.props.children,disabled:r.props.disabled,className:r.props.className}}return{id:`accordion-item-${t}`,header:`Item ${t+1}`,children:n}}),L=r.useCallback(n=>{let r;r=o?C.includes(n)?C.filter(r=>r!==n):[...C,n]:C.includes(n)?f?[]:C:[n],_||S(r),null==l||l(r)},[o,f,C,_,l]);return n.jsx("div",{ref:z,className:`\n          accordion\n          accordion--${c}\n          accordion--${s}\n          ${g?"accordion--divider":""}\n          ${"compact"===y?"accordion--compact":""}\n          ${"spacious"===y?"accordion--spacious":""}\n          ${k?"accordion--no-animation":""}\n          ${b?"accordion--loading":""}\n          ${w?"accordion--disabled":""}\n          ${v}\n        `.trim(),style:d,role:"presentation","aria-busy":b,...j,children:T.map(r=>n.jsx($,{item:r,isOpen:C.includes(r.id),onToggle:()=>L(r.id),variant:c,size:s,showChevron:x,chevronPosition:p,expandedIcon:m,collapsedIcon:u,iconType:h,loading:b,disabled:w,spacing:y,disableAnimations:k},r.id))})});L.displayName="Accordion";u("/* Alert Component Styles */\r\n\r\n.alert {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-4);\r\n  border-radius: var(--vtx-radius-md);\r\n  font-family: var(--vtx-font-family-sans);\r\n  transition: all var(--vtx-transition-base);\r\n  position: relative;\r\n}\r\n\r\n.alert--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Sizes */\r\n.alert--sm {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.alert--sm .alert-icon svg {\r\n  width: 16px;\r\n  height: 16px;\r\n}\r\n\r\n.alert--md {\r\n  padding: var(--vtx-spacing-4);\r\n  gap: var(--vtx-spacing-3);\r\n}\r\n\r\n.alert--md .alert-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n.alert--lg {\r\n  padding: var(--vtx-spacing-5);\r\n  gap: var(--vtx-spacing-4);\r\n}\r\n\r\n.alert--lg .alert-icon svg {\r\n  width: 24px;\r\n  height: 24px;\r\n}\r\n\r\n/* Icon */\r\n.alert-icon {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-top: 0.125rem;\r\n}\r\n\r\n/* Content */\r\n.alert-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.alert-title {\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-tight);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.alert--sm .alert-title {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.alert--lg .alert-title {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n.alert-message {\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  opacity: 0.9;\r\n}\r\n\r\n.alert--sm .alert-message {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.alert--lg .alert-message {\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n/* Only title, no message */\r\n.alert-title:only-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n/* Action */\r\n.alert-action {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  margin-left: auto;\r\n}\r\n\r\n/* Close Button */\r\n.alert-close {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  padding: var(--vtx-spacing-1);\r\n  margin: calc(var(--vtx-spacing-1) * -1);\r\n  border-radius: var(--vtx-radius-base);\r\n  transition: all var(--vtx-transition-fast);\r\n  opacity: 0.6;\r\n}\r\n\r\n.alert-close:hover {\r\n  opacity: 1;\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.alert-close:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.alert-close:focus-visible {\r\n  outline: 2px solid currentColor;\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* ===== VARIANTS: SUCCESS ===== */\r\n\r\n/* Subtle */\r\n.alert--success.alert--subtle {\r\n  background-color: var(--vtx-color-success-50);\r\n  color: var(--vtx-color-success-700);\r\n  border: 1px solid var(--vtx-color-success-200);\r\n}\r\n\r\n.alert--success.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--success.alert--filled {\r\n  background-color: var(--vtx-color-success-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-success-600);\r\n}\r\n\r\n.alert--success.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--success.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--success.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-success-700);\r\n  border: 2px solid var(--vtx-color-success-500);\r\n}\r\n\r\n.alert--success.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--success.alert--left-accent {\r\n  background-color: var(--vtx-color-success-50);\r\n  color: var(--vtx-color-success-700);\r\n  border: 1px solid var(--vtx-color-success-200);\r\n  border-left: 4px solid var(--vtx-color-success-600);\r\n}\r\n\r\n.alert--success.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* ===== VARIANTS: ERROR ===== */\r\n\r\n/* Subtle */\r\n.alert--error.alert--subtle {\r\n  background-color: var(--vtx-color-error-50);\r\n  color: var(--vtx-color-error-700);\r\n  border: 1px solid var(--vtx-color-error-200);\r\n}\r\n\r\n.alert--error.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--error.alert--filled {\r\n  background-color: var(--vtx-color-error-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-error-600);\r\n}\r\n\r\n.alert--error.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--error.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--error.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-error-700);\r\n  border: 2px solid var(--vtx-color-error-500);\r\n}\r\n\r\n.alert--error.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--error.alert--left-accent {\r\n  background-color: var(--vtx-color-error-50);\r\n  color: var(--vtx-color-error-700);\r\n  border: 1px solid var(--vtx-color-error-200);\r\n  border-left: 4px solid var(--vtx-color-error-600);\r\n}\r\n\r\n.alert--error.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* ===== VARIANTS: WARNING ===== */\r\n\r\n/* Subtle */\r\n.alert--warning.alert--subtle {\r\n  background-color: var(--vtx-color-warning-50);\r\n  color: var(--vtx-color-warning-700);\r\n  border: 1px solid var(--vtx-color-warning-200);\r\n}\r\n\r\n.alert--warning.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--warning.alert--filled {\r\n  background-color: var(--vtx-color-warning-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-warning-600);\r\n}\r\n\r\n.alert--warning.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--warning.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--warning.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-warning-700);\r\n  border: 2px solid var(--vtx-color-warning-500);\r\n}\r\n\r\n.alert--warning.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--warning.alert--left-accent {\r\n  background-color: var(--vtx-color-warning-50);\r\n  color: var(--vtx-color-warning-700);\r\n  border: 1px solid var(--vtx-color-warning-200);\r\n  border-left: 4px solid var(--vtx-color-warning-600);\r\n}\r\n\r\n.alert--warning.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* ===== VARIANTS: INFO ===== */\r\n\r\n/* Subtle */\r\n.alert--info.alert--subtle {\r\n  background-color: var(--vtx-color-info-50);\r\n  color: var(--vtx-color-info-700);\r\n  border: 1px solid var(--vtx-color-info-200);\r\n}\r\n\r\n.alert--info.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--info.alert--filled {\r\n  background-color: var(--vtx-color-info-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-info-600);\r\n}\r\n\r\n.alert--info.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--info.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--info.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-info-700);\r\n  border: 2px solid var(--vtx-color-info-500);\r\n}\r\n\r\n.alert--info.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--info.alert--left-accent {\r\n  background-color: var(--vtx-color-info-50);\r\n  color: var(--vtx-color-info-700);\r\n  border: 1px solid var(--vtx-color-info-200);\r\n  border-left: 4px solid var(--vtx-color-info-600);\r\n}\r\n\r\n.alert--info.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* ===== VARIANTS: NEUTRAL ===== */\r\n\r\n/* Subtle */\r\n.alert--neutral.alert--subtle {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n}\r\n\r\n.alert--neutral.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--neutral.alert--filled {\r\n  background-color: var(--vtx-color-neutral-700);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-neutral-700);\r\n}\r\n\r\n.alert--neutral.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--neutral.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--neutral.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 2px solid var(--vtx-color-neutral-500);\r\n}\r\n\r\n.alert--neutral.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--neutral.alert--left-accent {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-left: 4px solid var(--vtx-color-neutral-600);\r\n}\r\n\r\n.alert--neutral.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Warning colors need adjustment for better contrast */\r\n.alert--warning {\r\n  --vtx-color-warning-200: #fde68a;\r\n}\r\n");const M=()=>n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M12 4L4 12M4 4l8 8",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),B={success:n.jsx(()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm-1.293 14.707l-3.414-3.414 1.414-1.414L9 12.172l5.293-5.293 1.414 1.414-6.707 6.707z",fill:"currentColor"})}),{}),error:n.jsx(()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-2h2v2zm0-4H9V5h2v6z",fill:"currentColor"})}),{}),warning:n.jsx(()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:n.jsx("path",{d:"M10 0L0 18h20L10 0zm1 15H9v-2h2v2zm0-4H9V7h2v4z",fill:"currentColor"})}),{}),info:n.jsx(()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9V9h2v6zm0-8H9V5h2v2z",fill:"currentColor"})}),{}),neutral:n.jsx(()=>n.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[n.jsx("circle",{cx:"10",cy:"10",r:"9",stroke:"currentColor",strokeWidth:"2",fill:"none"}),n.jsx("path",{d:"M10 6v5M10 13v1",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]}),{})},E=a.default.forwardRef(({children:t,title:e,description:o,variant:a="info",alertStyle:i="subtle",size:l,icon:c,dismissible:s=!1,onClose:v,action:d,fullWidth:x=!1,className:p="",style:u,role:h="alert",...g},f)=>{const{theme:b}=m(),w=l||(null==b?void 0:b.defaultSize)||"md",[y,k]=r.useState(!0);if(!y)return null;const j=!1!==c,z=void 0===c?B[a]:c,N=t||o;return n.jsxs("div",{ref:f,className:`\n          alert\n          alert--${a}\n          alert--${i}\n          alert--${w}\n          ${x?"alert--full-width":""}\n          ${p}\n        `.trim(),style:u,role:h,...g,children:[j&&n.jsx("div",{className:"alert-icon",children:z}),n.jsxs("div",{className:"alert-content",children:[e&&n.jsx("div",{className:"alert-title",children:e}),N&&n.jsx("div",{className:"alert-message",children:null!=t?t:o})]}),d&&n.jsx("div",{className:"alert-action",children:d}),s&&n.jsx("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==v||v()},"aria-label":"Close alert",children:n.jsx(M,{})})]})});E.displayName="Alert";u("/* Flex Component */\n.vtx-flex {\n  display: flex;\n  gap: var(--vtx-flex-gap, 0);\n  row-gap: var(--vtx-flex-row-gap, var(--vtx-flex-gap, 0));\n  column-gap: var(--vtx-flex-column-gap, var(--vtx-flex-gap, 0));\n}\n\n/* Full width modifier */\n.vtx-flex--full-width {\n  width: 100%;\n}\n\n/* Inline variant */\n.vtx-flex--inline {\n  display: inline-flex;\n}\n\n/* Direction variants */\n.vtx-flex--column {\n  flex-direction: column;\n}\n\n.vtx-flex--row-reverse {\n  flex-direction: row-reverse;\n}\n\n.vtx-flex--column-reverse {\n  flex-direction: column-reverse;\n}\n\n/* Wrap variants */\n.vtx-flex--wrap {\n  flex-wrap: wrap;\n}\n\n.vtx-flex--wrap-reverse {\n  flex-wrap: wrap-reverse;\n}\n\n/* Justify content variants */\n.vtx-flex--justify-start {\n  justify-content: flex-start;\n}\n\n.vtx-flex--justify-end {\n  justify-content: flex-end;\n}\n\n.vtx-flex--justify-center {\n  justify-content: center;\n}\n\n.vtx-flex--justify-between {\n  justify-content: space-between;\n}\n\n.vtx-flex--justify-around {\n  justify-content: space-around;\n}\n\n.vtx-flex--justify-evenly {\n  justify-content: space-evenly;\n}\n\n/* Align items variants */\n.vtx-flex--align-start {\n  align-items: flex-start;\n}\n\n.vtx-flex--align-end {\n  align-items: flex-end;\n}\n\n.vtx-flex--align-center {\n  align-items: center;\n}\n\n.vtx-flex--align-baseline {\n  align-items: baseline;\n}\n\n.vtx-flex--align-stretch {\n  align-items: stretch;\n}\n\n/* Align content variants (for multi-line) */\n.vtx-flex--align-content-start {\n  align-content: flex-start;\n}\n\n.vtx-flex--align-content-end {\n  align-content: flex-end;\n}\n\n.vtx-flex--align-content-center {\n  align-content: center;\n}\n\n.vtx-flex--align-content-between {\n  align-content: space-between;\n}\n\n.vtx-flex--align-content-around {\n  align-content: space-around;\n}\n\n.vtx-flex--align-content-stretch {\n  align-content: stretch;\n}\n");const I=a.default.forwardRef(({children:r,direction:t="row",wrap:e="nowrap",justify:o="start",align:a="stretch",alignContent:i,gap:l,rowGap:c,columnGap:s,inline:v=!1,fullWidth:d=!0,grow:x,shrink:p,basis:m,className:u="",as:h="div",style:g,...f},b)=>{const w=h,y=["vtx-flex",v&&"vtx-flex--inline",d&&"vtx-flex--full-width","row"!==t&&`vtx-flex--${t}`,"nowrap"!==e&&`vtx-flex--${e}`,"start"!==o&&`vtx-flex--justify-${o}`,"stretch"!==a&&`vtx-flex--align-${a}`,i&&`vtx-flex--align-content-${i}`,u].filter(Boolean).join(" "),k={...g};return void 0!==l&&(k["--vtx-flex-gap"]="number"==typeof l?`${l}px`:l),void 0!==c&&(k["--vtx-flex-row-gap"]="number"==typeof c?`${c}px`:c),void 0!==s&&(k["--vtx-flex-column-gap"]="number"==typeof s?`${s}px`:s),void 0!==x&&(k.flexGrow=x),void 0!==p&&(k.flexShrink=p),void 0!==m&&(k.flexBasis="number"==typeof m?`${m}px`:m),n.jsx(w,{ref:b,className:y,style:k,...f,children:r})});I.displayName="Flex";u("/* ===== Text Component Base Styles ===== */\n.vtx-text {\n  margin: 0;\n  padding: 0;\n  font-family: var(--vtx-font-family-sans);\n  color: inherit;\n  transition: color var(--vtx-transition-fast);\n}\n\n/* ===== Text Variants ===== */\n/* Headings */\n.vtx-text--h1 {\n  font-size: var(--vtx-text-h1-font-size, 3.75rem);\n  font-weight: var(--vtx-text-h1-font-weight, 700);\n  line-height: var(--vtx-text-h1-line-height, 1.2);\n  letter-spacing: var(--vtx-text-h1-letter-spacing, -0.025em);\n  margin-bottom: var(--vtx-spacing-6, 1.5rem);\n}\n\n.vtx-text--h2 {\n  font-size: var(--vtx-text-h2-font-size, 3rem);\n  font-weight: var(--vtx-text-h2-font-weight, 700);\n  line-height: var(--vtx-text-h2-line-height, 1.25);\n  letter-spacing: var(--vtx-text-h2-letter-spacing, -0.025em);\n  margin-bottom: var(--vtx-spacing-5, 1.25rem);\n}\n\n.vtx-text--h3 {\n  font-size: var(--vtx-text-h3-font-size, 2.25rem);\n  font-weight: var(--vtx-text-h3-font-weight, 600);\n  line-height: var(--vtx-text-h3-line-height, 1.3);\n  letter-spacing: var(--vtx-text-h3-letter-spacing, -0.025em);\n  margin-bottom: var(--vtx-spacing-4, 1rem);\n}\n\n.vtx-text--h4 {\n  font-size: var(--vtx-text-h4-font-size, 1.875rem);\n  font-weight: var(--vtx-text-h4-font-weight, 600);\n  line-height: var(--vtx-text-h4-line-height, 1.35);\n  letter-spacing: var(--vtx-text-h4-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-4, 1rem);\n}\n\n.vtx-text--h5 {\n  font-size: var(--vtx-text-h5-font-size, 1.5rem);\n  font-weight: var(--vtx-text-h5-font-weight, 600);\n  line-height: var(--vtx-text-h5-line-height, 1.4);\n  letter-spacing: var(--vtx-text-h5-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-3, 0.75rem);\n}\n\n.vtx-text--h6 {\n  font-size: var(--vtx-text-h6-font-size, 1.25rem);\n  font-weight: var(--vtx-text-h6-font-weight, 600);\n  line-height: var(--vtx-text-h6-line-height, 1.5);\n  letter-spacing: var(--vtx-text-h6-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-3, 0.75rem);\n}\n\n/* Body Text */\n.vtx-text--body1 {\n  font-size: var(--vtx-text-body1-font-size, 1rem);\n  font-weight: var(--vtx-text-body1-font-weight, 400);\n  line-height: var(--vtx-text-body1-line-height, 1.5);\n  letter-spacing: var(--vtx-text-body1-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-3, 0.75rem);\n}\n\n.vtx-text--body2 {\n  font-size: var(--vtx-text-body2-font-size, 0.875rem);\n  font-weight: var(--vtx-text-body2-font-weight, 400);\n  line-height: var(--vtx-text-body2-line-height, 1.5);\n  letter-spacing: var(--vtx-text-body2-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-3, 0.75rem);\n}\n\n/* Subtitles */\n.vtx-text--subtitle1 {\n  font-size: var(--vtx-text-subtitle1-font-size, 1.125rem);\n  font-weight: var(--vtx-text-subtitle1-font-weight, 500);\n  line-height: var(--vtx-text-subtitle1-line-height, 1.5);\n  letter-spacing: var(--vtx-text-subtitle1-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-2, 0.5rem);\n}\n\n.vtx-text--subtitle2 {\n  font-size: var(--vtx-text-subtitle2-font-size, 1rem);\n  font-weight: var(--vtx-text-subtitle2-font-weight, 500);\n  line-height: var(--vtx-text-subtitle2-line-height, 1.5);\n  letter-spacing: var(--vtx-text-subtitle2-letter-spacing, 0);\n  margin-bottom: var(--vtx-spacing-2, 0.5rem);\n}\n\n/* Caption */\n.vtx-text--caption {\n  font-size: var(--vtx-text-caption-font-size, 0.75rem);\n  font-weight: var(--vtx-text-caption-font-weight, 400);\n  line-height: var(--vtx-text-caption-line-height, 1.5);\n  letter-spacing: var(--vtx-text-caption-letter-spacing, 0.025em);\n  color: var(--vtx-color-neutral-600);\n}\n\n/* Overline */\n.vtx-text--overline {\n  font-size: var(--vtx-text-overline-font-size, 0.75rem);\n  font-weight: var(--vtx-text-overline-font-weight, 600);\n  line-height: var(--vtx-text-overline-line-height, 1.5);\n  letter-spacing: var(--vtx-text-overline-letter-spacing, 0.1em);\n  text-transform: uppercase;\n  color: var(--vtx-color-neutral-600);\n}\n\n/* Button Text */\n.vtx-text--button {\n  font-size: var(--vtx-text-button-font-size, 0.875rem);\n  font-weight: var(--vtx-text-button-font-weight, 600);\n  line-height: var(--vtx-text-button-line-height, 1.5);\n  letter-spacing: var(--vtx-text-button-letter-spacing, 0.025em);\n}\n\n/* Label */\n.vtx-text--label {\n  font-size: var(--vtx-text-label-font-size, 0.875rem);\n  font-weight: var(--vtx-text-label-font-weight, 500);\n  line-height: var(--vtx-text-label-line-height, 1.5);\n  letter-spacing: var(--vtx-text-label-letter-spacing, 0);\n  display: inline-block;\n  margin-bottom: var(--vtx-spacing-2, 0.5rem);\n}\n\n/* ===== Text Alignment ===== */\n.vtx-text--align-left {\n  text-align: left;\n}\n\n.vtx-text--align-center {\n  text-align: center;\n}\n\n.vtx-text--align-right {\n  text-align: right;\n}\n\n.vtx-text--align-justify {\n  text-align: justify;\n}\n\n/* ===== Font Weights ===== */\n.vtx-text--weight-thin {\n  font-weight: var(--vtx-font-weight-thin, 100);\n}\n\n.vtx-text--weight-extralight {\n  font-weight: var(--vtx-font-weight-extralight, 200);\n}\n\n.vtx-text--weight-light {\n  font-weight: var(--vtx-font-weight-light, 300);\n}\n\n.vtx-text--weight-normal {\n  font-weight: var(--vtx-font-weight-normal, 400);\n}\n\n.vtx-text--weight-medium {\n  font-weight: var(--vtx-font-weight-medium, 500);\n}\n\n.vtx-text--weight-semibold {\n  font-weight: var(--vtx-font-weight-semibold, 600);\n}\n\n.vtx-text--weight-bold {\n  font-weight: var(--vtx-font-weight-bold, 700);\n}\n\n.vtx-text--weight-extrabold {\n  font-weight: var(--vtx-font-weight-extrabold, 800);\n}\n\n.vtx-text--weight-black {\n  font-weight: var(--vtx-font-weight-black, 900);\n}\n\n/* ===== Text Transform ===== */\n.vtx-text--transform-none {\n  text-transform: none;\n}\n\n.vtx-text--transform-uppercase {\n  text-transform: uppercase;\n}\n\n.vtx-text--transform-lowercase {\n  text-transform: lowercase;\n}\n\n.vtx-text--transform-capitalize {\n  text-transform: capitalize;\n}\n\n/* ===== Text Decoration ===== */\n.vtx-text--decoration-none {\n  text-decoration: none;\n}\n\n.vtx-text--decoration-underline {\n  text-decoration: underline;\n}\n\n.vtx-text--decoration-line-through {\n  text-decoration: line-through;\n}\n\n.vtx-text--decoration-overline {\n  text-decoration: overline;\n}\n\n/* ===== Text Utilities ===== */\n/* Truncation */\n.vtx-text--truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Line Clamp */\n.vtx-text--line-clamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* Break Word */\n.vtx-text--break-word {\n  word-break: break-word;\n  overflow-wrap: break-word;\n}\n\n/* Italic */\n.vtx-text--italic {\n  font-style: italic;\n}\n\n/* Underline */\n.vtx-text--underline {\n  text-decoration: underline;\n}\n\n/* Strikethrough */\n.vtx-text--strikethrough {\n  text-decoration: line-through;\n}\n\n/* Gradient Text */\n.vtx-text--gradient {\n  background-clip: text;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-size: 100%;\n}\n\n/* No Select */\n.vtx-text--no-select {\n  user-select: none;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n}\n\n/* ===== Dark Theme Support ===== */\n[data-theme='dark'] .vtx-text--caption,\n[data-theme='dark'] .vtx-text--overline {\n  color: var(--vtx-color-neutral-400);\n}\n\n/* ===== Responsive Typography ===== */\n@media (max-width: 768px) {\n  .vtx-text--h1 {\n    font-size: clamp(2.5rem, 8vw, 3.75rem);\n  }\n\n  .vtx-text--h2 {\n    font-size: clamp(2rem, 6vw, 3rem);\n  }\n\n  .vtx-text--h3 {\n    font-size: clamp(1.75rem, 5vw, 2.25rem);\n  }\n\n  .vtx-text--h4 {\n    font-size: clamp(1.5rem, 4vw, 1.875rem);\n  }\n\n  .vtx-text--h5 {\n    font-size: clamp(1.25rem, 3.5vw, 1.5rem);\n  }\n\n  .vtx-text--h6 {\n    font-size: clamp(1.125rem, 3vw, 1.25rem);\n  }\n}\n\n/* ===== Print Styles ===== */\n@media print {\n  .vtx-text {\n    color: #000;\n  }\n\n  .vtx-text--gradient {\n    -webkit-text-fill-color: initial;\n    background-clip: initial;\n    -webkit-background-clip: initial;\n  }\n}\n\n/* ===== Utility Classes ===== */\n.vtx-text--no-margin {\n  margin: 0 !important;\n}\n\n.vtx-text--no-padding {\n  padding: 0 !important;\n}\n\n/* ===== Accessibility ===== */\n.vtx-text:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n  border-radius: var(--vtx-radius-sm);\n}\n\n/* Reduced motion support */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-text {\n    transition: none;\n  }\n}\n");const A="dynamic-styles";const D=new Set;function R(n){const r=n.match(/^([a-z]+)-\[(.+)\]$/);if(r){const n=r[1],t=r[2],e=`${n}-${t.replace(/[^a-z0-9]/gi,"")}`,o={m:"margin",mt:"margin-top",mr:"margin-right",mb:"margin-bottom",ml:"margin-left",p:"padding",pt:"padding-top",pr:"padding-right",pb:"padding-bottom",pl:"padding-left",w:"width",h:"height",fs:"font-size",lh:"line-height",ls:"letter-spacing"}[n];if(o){const n=`.${e} { ${o}: ${t}; }`;if(!D.has(n)){(function(){let n=document.getElementById(A);return n||(n=document.createElement("style"),n.id=A,document.head.appendChild(n)),n})().appendChild(document.createTextNode(n)),D.add(n)}return e}}return n}const O=i.forwardRef(({variant:n="body1",as:r,align:t,color:e,weight:o,transform:a,decoration:l,truncate:c=!1,lineClamp:s,breakWord:v=!1,italic:d=!1,underline:x=!1,strikethrough:p=!1,gradient:m,noSelect:u=!1,size:h,lineHeight:g,letterSpacing:f,noMargin:b=!1,noPadding:w=!1,className:y="",style:k,children:j,...z},N)=>{const S=r||(n=>({h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",body1:"p",body2:"p",subtitle1:"p",subtitle2:"p",caption:"span",overline:"span",button:"span",label:"label"}[n]))(n),C=["vtx-text",`vtx-text--${n}`,t&&`vtx-text--align-${t}`,o&&"string"==typeof o&&`vtx-text--weight-${o}`,a&&`vtx-text--transform-${a}`,l&&`vtx-text--decoration-${l}`,c&&"vtx-text--truncate",s&&"vtx-text--line-clamp",v&&"vtx-text--break-word",d&&"vtx-text--italic",x&&"vtx-text--underline",p&&"vtx-text--strikethrough",m&&"vtx-text--gradient",u&&"vtx-text--no-select",b&&"vtx-text--no-margin",w&&"vtx-text--no-padding",y].filter(Boolean).join(" "),_={...k};if(e)if(e.includes(".")){const[n,r]=e.split(".");_.color=`var(--vtx-color-${n}-${r})`}else _.color=e;if(o&&"number"==typeof o&&(_.fontWeight=o),s&&(_.WebkitLineClamp=s),m&&m.length>0){const n=1===m.length?m[0]:`linear-gradient(135deg, ${m.join(", ")})`;_.backgroundImage=n}return h&&(_.fontSize="number"==typeof h?`${h}px`:h),g&&(_.lineHeight="number"==typeof g?`${g}`:g),f&&(_.letterSpacing="number"==typeof f?`${f}px`:f),i.createElement(S,{ref:N,className:C,style:_,...z},j)});O.displayName="Text";const W=(H=O,r=>{const t=(r.className||"").split(" ").map(n=>R(n)).join(" ");return n.jsx(H,{...r,className:t})});var H;u("/* Menu Component Styles */\n\n.vtx-menu-container {\n  position: relative;\n}\n\n/* Menu Toggle (Hamburger) */\n.vtx-menu-toggle {\n  display: none;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: var(--vtx-spacing-2);\n  background: transparent;\n  border: none;\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-text-primary);\n  cursor: pointer;\n  transition: all var(--vtx-transition-normal);\n}\n\n.vtx-menu-toggle:hover {\n  background: var(--vtx-background-hover);\n}\n\n.vtx-menu-toggle:active {\n  background: var(--vtx-background-active);\n}\n\n.vtx-menu-toggle:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Menu Container */\n.vtx-menu {\n  display: flex;\n  flex-direction: column;\n  background: var(--vtx-background-primary);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow: var(--vtx-shadow-sm);\n  overflow: hidden;\n}\n\n/* Vertical Menu (Default) */\n.vtx-menu--vertical {\n  flex-direction: column;\n  min-width: 200px;\n  padding: var(--vtx-spacing-2);\n  gap: var(--vtx-spacing-1);\n}\n\n/* Horizontal Menu */\n.vtx-menu--horizontal {\n  flex-direction: row;\n  padding: var(--vtx-spacing-2);\n  gap: var(--vtx-spacing-1);\n  box-shadow: none;\n  border-radius: 0;\n}\n\n/* Menu Item - Professional Sidebar Style */\n.vtx-menu-item {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  margin-bottom: var(--vtx-spacing-1);\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-color-neutral-700);\n  background: transparent;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  user-select: none;\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  border-left: 3px solid transparent;\n}\n\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item:active:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.98);\n}\n\n.vtx-menu-item:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Active Menu Item - Professional Style */\n.vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Disabled Menu Item */\n.vtx-menu-item--disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Danger Variant */\n.vtx-menu-item--danger {\n  color: var(--vtx-color-danger-600);\n}\n\n.vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\n  background: var(--vtx-color-danger-50);\n}\n\n.vtx-menu-item--danger:active:not(.vtx-menu-item--disabled) {\n  background: var(--vtx-color-danger-100);\n}\n\n/* Menu Item Icon */\n.vtx-menu-item-icon,\n.vtx-menu-item-right-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.vtx-menu-item-icon svg,\n.vtx-menu-item-right-icon svg {\n  width: 100%;\n  height: 100%;\n  transition: inherit;\n}\n\n.vtx-menu-item-icon {\n  color: var(--vtx-color-neutral-600);\n  transition: color 0.15s ease-in-out;\n}\n\n.vtx-menu-item:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Shortcut */\n.vtx-menu-item-shortcut {\n  opacity: 0.6;\n  font-size: var(--vtx-font-size-xs);\n  white-space: nowrap;\n}\n\n/* Menu Divider */\n.vtx-menu-divider {\n  height: 1px;\n  margin: var(--vtx-spacing-2) 0;\n  background: var(--vtx-border-color);\n}\n\n.vtx-menu--horizontal .vtx-menu-divider {\n  width: 1px;\n  height: auto;\n  margin: 0 var(--vtx-spacing-2);\n}\n\n/* Submenu Styles - Inline Expansion for Sidebar */\n.vtx-menu-item--has-submenu {\n  position: relative;\n}\n\n.vtx-submenu {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  padding-left: var(--vtx-spacing-5);\n  margin-top: var(--vtx-spacing-2);\n  margin-bottom: var(--vtx-spacing-2);\n  animation: slideDown 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.vtx-submenu .vtx-menu-item {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\n  padding-left: var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-normal);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-submenu .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Nested submenu - additional indentation */\n.vtx-submenu .vtx-submenu {\n  padding-left: var(--vtx-spacing-4);\n}\n\n/* Submenu Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    max-height: 0;\n    transform: translateY(-4px);\n  }\n  to {\n    opacity: 1;\n    max-height: 1000px;\n    transform: translateY(0);\n  }\n}\n\n/* Responsive Styles */\n@media (max-width: 768px) {\n  .vtx-menu--responsive .vtx-menu-toggle {\n    display: flex;\n  }\n\n  .vtx-menu--responsive.vtx-menu {\n    position: absolute;\n    top: 48px;\n    left: 0;\n    right: 0;\n    z-index: 1000;\n    display: none;\n    min-width: 100%;\n    max-height: calc(100vh - 64px);\n    overflow-y: auto;\n    box-shadow: var(--vtx-shadow-lg);\n    animation: slideDown 0.2s ease-out;\n  }\n\n  .vtx-menu--responsive.vtx-menu--mobile-open {\n    display: flex;\n  }\n\n  /* Force vertical layout on mobile */\n  .vtx-menu--responsive.vtx-menu--horizontal {\n    flex-direction: column;\n    padding: var(--vtx-spacing-2);\n    gap: var(--vtx-spacing-1);\n    border-radius: var(--vtx-radius-lg);\n  }\n\n  .vtx-menu--responsive.vtx-menu--horizontal .vtx-menu-divider {\n    width: auto;\n    height: 1px;\n    margin: var(--vtx-spacing-2) 0;\n  }\n}\n\n/* Slide Down Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Dark Mode - Professional Style */\n[data-theme='dark'] .vtx-menu {\n  background: var(--vtx-background-primary);\n  box-shadow: var(--vtx-shadow-lg);\n}\n\n[data-theme='dark'] .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark']\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active)\n  .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-300);\n}\n\n[data-theme='dark'] .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-800);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--danger {\n  color: var(--vtx-color-danger-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\n  background: rgba(var(--vtx-color-danger-rgb), 0.15);\n}\n\n[data-theme='dark']\n  .vtx-submenu\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-800);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n/* Reduced Motion */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-menu-item,\n  .vtx-menu-toggle {\n    transition: none;\n  }\n\n  .vtx-submenu {\n    animation: none;\n  }\n\n  @keyframes slideDown {\n    from,\n    to {\n      opacity: 1;\n      max-height: 1000px;\n      transform: translateY(0);\n    }\n  }\n}\n");const F=({isOpen:r})=>n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",style:{transition:"transform 0.2s ease",transform:r?"rotate(180deg)":"rotate(0deg)"},children:n.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),V=a.default.forwardRef(({label:t,onClick:e,icon:o,rightIcon:a,disabled:i=!1,active:l=!1,variant:c="default",shortcut:s,divider:v=!1,items:d},x)=>{const[p,m]=r.useState(!1),u=r.useRef(null),h=d&&d.length>0,g=a||(h?n.jsx(F,{isOpen:p}):null);return n.jsxs(n.Fragment,{children:[n.jsx("div",{ref:x||u,className:["vtx-menu-item",l&&"vtx-menu-item--active",i&&"vtx-menu-item--disabled","default"!==c&&`vtx-menu-item--${c}`,h&&"vtx-menu-item--has-submenu",p&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{i||(h?m(!p):e&&e())},onKeyDown:n=>{i||("Enter"===n.key||" "===n.key?(n.preventDefault(),h?m(!p):null==e||e()):"ArrowDown"===n.key&&h&&!p?(n.preventDefault(),m(!0)):"ArrowUp"===n.key&&h&&p&&(n.preventDefault(),m(!1)))},role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-haspopup":h?"menu":void 0,"aria-expanded":h?p:void 0,children:n.jsxs(I,{align:"center",gap:8,style:{flex:1},children:[o&&n.jsx("span",{className:"vtx-menu-item-icon",children:o}),n.jsx(W,{variant:"body2",noMargin:!0,style:{flex:1},children:t}),s&&n.jsx(W,{variant:"caption",color:"neutral.500",noMargin:!0,className:"vtx-menu-item-shortcut",children:s}),g&&n.jsx("span",{className:"vtx-menu-item-right-icon",children:g})]})}),h&&p&&n.jsx("div",{className:"vtx-submenu",role:"menu",children:d.map((r,t)=>n.jsx(V,{...r},t))}),v&&n.jsx("div",{className:"vtx-menu-divider",role:"separator"})]})});V.displayName="MenuItem";const Y=a.default.forwardRef(({items:t,children:e,orientation:o="vertical",responsive:a=!0,className:i="",width:l},c)=>{const[s,v]=r.useState(!1),d=r.useRef(null);r.useEffect(()=>{if(!a||!s)return;const n=n=>{d.current&&!d.current.contains(n.target)&&v(!1)};return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[a,s]),r.useEffect(()=>{if(!a||!s)return;const n=n=>{"Escape"===n.key&&v(!1)};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[a,s]);const x=t?t.map((r,t)=>n.jsx(V,{...r},t)):e,p=["vtx-menu",`vtx-menu--${o}`,a&&"vtx-menu--responsive",s&&"vtx-menu--mobile-open",i].filter(Boolean).join(" "),m={width:"vertical"===o&&l?"number"==typeof l?`${l}px`:l:void 0};return n.jsxs("div",{ref:d,className:"vtx-menu-container",children:[a&&n.jsx("button",{className:"vtx-menu-toggle",onClick:()=>v(!s),"aria-label":"Toggle menu","aria-expanded":s,children:n.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:s?n.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"}):n.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 6h16M4 12h16M4 18h16"})})}),n.jsx("div",{ref:c,className:p,role:"menu",style:m,children:x})]})});Y.displayName="Menu";u("/* ===== Modal Component - Professional Design ===== */\r\n\r\n/* Backdrop */\r\n.vtx-modal-backdrop {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  background: var(--vtx-modal-backdrop-bg, rgba(15, 23, 42, 0.75));\r\n  backdrop-filter: var(--vtx-modal-backdrop-blur, blur(4px));\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: var(--vtx-z-modal, 1200);\r\n  padding: var(--vtx-modal-backdrop-padding, var(--vtx-spacing-4));\r\n  animation: vtx-modal-backdrop-fade-in var(--vtx-transition-slow, 300ms)\r\n    cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-modal-backdrop--transparent {\r\n  background: transparent;\r\n  backdrop-filter: none;\r\n}\r\n\r\n@keyframes vtx-modal-backdrop-fade-in {\r\n  from {\r\n    opacity: 0;\r\n    backdrop-filter: blur(0);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    backdrop-filter: blur(4px);\r\n  }\r\n}\r\n\r\n/* Modal Container */\r\n.vtx-modal {\r\n  position: relative;\r\n  background: var(--vtx-modal-bg, var(--vtx-color-neutral-50));\r\n  border-radius: var(--vtx-modal-radius, var(--vtx-radius-xl, 12px));\r\n  box-shadow: var(\r\n    --vtx-modal-shadow,\r\n    0 20px 25px -5px rgba(0, 0, 0, 0.1),\r\n    0 10px 10px -5px rgba(0, 0, 0, 0.04),\r\n    0 0 0 1px rgba(0, 0, 0, 0.05)\r\n  );\r\n  display: flex;\r\n  flex-direction: column;\r\n  max-height: calc(100vh - var(--vtx-modal-max-height-offset, var(--vtx-spacing-8)));\r\n  overflow: hidden;\r\n  animation: vtx-modal-slide-up var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n  transform-origin: center center;\r\n}\r\n\r\n@keyframes vtx-modal-slide-up {\r\n  from {\r\n    transform: translateY(var(--vtx-modal-slide-distance, 32px)) scale(0.96);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0) scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Size Variants */\r\n.vtx-modal--sm {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-sm, 400px);\r\n}\r\n\r\n.vtx-modal--md {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-md, 600px);\r\n}\r\n\r\n.vtx-modal--lg {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-lg, 900px);\r\n}\r\n\r\n.vtx-modal--fullscreen {\r\n  width: 100%;\r\n  height: calc(100vh - var(--vtx-modal-max-height-offset, var(--vtx-spacing-8)));\r\n  max-width: none;\r\n  border-radius: var(--vtx-modal-fullscreen-radius, var(--vtx-radius-lg, 8px));\r\n}\r\n\r\n/* Header - Uses Flex component */\r\n.vtx-modal-header {\r\n  padding: var(--vtx-modal-header-padding, var(--vtx-spacing-3));\r\n  background: var(--vtx-modal-header-bg, transparent);\r\n  border-bottom: var(--vtx-modal-header-border, 1px solid var(--vtx-color-neutral-200));\r\n}\r\n\r\n/* Close button alignment fix */\r\n.vtx-modal-close {\r\n  margin-right: calc(var(--vtx-spacing-1) * -2);\r\n}\r\n\r\n/* Body */\r\n.vtx-modal-body {\r\n  flex: 1;\r\n  overflow-y: auto;\r\n  padding: var(--vtx-modal-body-padding, var(--vtx-spacing-3));\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-modal-body-size, var(--vtx-font-size-base, 1rem));\r\n  color: var(--vtx-modal-body-color, var(--vtx-color-neutral-700));\r\n  line-height: var(--vtx-modal-body-line-height, var(--vtx-line-height-relaxed, 1.625));\r\n\r\n  /* Custom scrollbar */\r\n  scrollbar-width: thin;\r\n  scrollbar-color: var(--vtx-color-neutral-300) transparent;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar {\r\n  width: 8px;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300);\r\n  border-radius: 4px;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-thumb:hover {\r\n  background: var(--vtx-color-neutral-400);\r\n}\r\n\r\n/* Footer - Uses Flex component */\r\n.vtx-modal-footer {\r\n  padding: var(--vtx-modal-footer-padding, var(--vtx-spacing-3));\r\n  background: var(--vtx-modal-footer-bg, var(--vtx-color-neutral-50));\r\n  border-top: var(--vtx-modal-footer-border, 1px solid var(--vtx-color-neutral-200));\r\n}\r\n\r\n/* Scrollable Variant */\r\n.vtx-modal--scrollable .vtx-modal-body {\r\n  max-height: var(--vtx-modal-scrollable-max-height, 60vh);\r\n}\r\n\r\n/* Animation Variants */\r\n.vtx-modal--zoom {\r\n  animation: vtx-modal-zoom var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n}\r\n\r\n@keyframes vtx-modal-zoom {\r\n  from {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--slide-down {\r\n  animation: vtx-modal-slide-down var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n}\r\n\r\n@keyframes vtx-modal-slide-down {\r\n  from {\r\n    transform: translateY(-32px) scale(0.96);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0) scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--fade {\r\n  animation: vtx-modal-fade var(--vtx-transition-slow, 300ms) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n@keyframes vtx-modal-fade {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--none {\r\n  animation: none;\r\n}\r\n\r\n/* Dark Mode */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-modal {\r\n    background: var(--vtx-modal-bg-dark, var(--vtx-color-neutral-800));\r\n    box-shadow: var(\r\n      --vtx-modal-shadow-dark,\r\n      0 20px 25px -5px rgba(0, 0, 0, 0.4),\r\n      0 10px 10px -5px rgba(0, 0, 0, 0.3),\r\n      0 0 0 1px rgba(255, 255, 255, 0.1)\r\n    );\r\n  }\r\n\r\n  .vtx-modal-backdrop {\r\n    background: var(--vtx-modal-backdrop-bg-dark, rgba(0, 0, 0, 0.85));\r\n  }\r\n\r\n  .vtx-modal-header {\r\n    border-bottom-color: var(--vtx-modal-header-border-dark, var(--vtx-color-neutral-700));\r\n  }\r\n\r\n  .vtx-modal-body {\r\n    color: var(--vtx-modal-body-color-dark, var(--vtx-color-neutral-300));\r\n  }\r\n\r\n  .vtx-modal-footer {\r\n    background: var(--vtx-modal-footer-bg-dark, var(--vtx-color-neutral-800));\r\n    border-top-color: var(--vtx-modal-footer-border-dark, var(--vtx-color-neutral-700));\r\n  }\r\n\r\n  .vtx-modal-close {\r\n    color: var(--vtx-modal-close-color-dark, var(--vtx-color-neutral-400));\r\n  }\r\n\r\n  .vtx-modal-close:hover {\r\n    background: var(--vtx-modal-close-hover-bg-dark, var(--vtx-color-neutral-700));\r\n    color: var(--vtx-modal-close-hover-color-dark, var(--vtx-color-neutral-200));\r\n  }\r\n\r\n  .vtx-modal-body::-webkit-scrollbar-thumb {\r\n    background: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .vtx-modal-body::-webkit-scrollbar-thumb:hover {\r\n    background: var(--vtx-color-neutral-500);\r\n  }\r\n}\r\n\r\n/* Responsive Design */\r\n@media (max-width: 640px) {\r\n  .vtx-modal-backdrop {\r\n    padding: 0;\r\n  }\r\n\r\n  .vtx-modal {\r\n    width: 100%;\r\n    max-width: 100%;\r\n    min-height: 100vh;\r\n    max-height: 100vh;\r\n    border-radius: 0;\r\n    animation: vtx-modal-slide-up-mobile var(--vtx-transition-slow, 300ms)\r\n      cubic-bezier(0.16, 1, 0.3, 1);\r\n  }\r\n\r\n  @keyframes vtx-modal-slide-up-mobile {\r\n    from {\r\n      transform: translateY(100%);\r\n    }\r\n    to {\r\n      transform: translateY(0);\r\n    }\r\n  }\r\n\r\n  .vtx-modal--sm,\r\n  .vtx-modal--md,\r\n  .vtx-modal--lg {\r\n    max-width: 100%;\r\n    border-radius: 0;\r\n  }\r\n\r\n  .vtx-modal-header {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .vtx-modal-body {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .vtx-modal-footer {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  /* Stack footer buttons vertically on mobile */\r\n  .vtx-modal-footer.vtx-flex {\r\n    flex-direction: column;\r\n  }\r\n\r\n  .vtx-modal-footer > * {\r\n    width: 100%;\r\n  }\r\n}\r\n\r\n/* High Contrast Mode */\r\n@media (prefers-contrast: high) {\r\n  .vtx-modal {\r\n    border: 2px solid currentColor;\r\n  }\r\n\r\n  .vtx-modal-close:focus-visible {\r\n    outline-width: 3px;\r\n  }\r\n}\r\n\r\n/* Reduced Motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-modal,\r\n  .vtx-modal-backdrop {\r\n    animation-duration: 1ms;\r\n  }\r\n\r\n  .vtx-modal-close:hover {\r\n    transform: none;\r\n  }\r\n}\r\n");const P=a.default.forwardRef(({isOpen:e,onClose:o,title:a,description:i,children:l,header:c,footer:s,footerButtons:v,size:d,closeOnBackdropClick:x=!0,closeOnEscape:p=!0,showCloseButton:u=!0,transparentBackdrop:g=!1,className:f="",backdropClassName:k="",preventScroll:j=!0,animation:z="fade",onAfterOpen:N,onAfterClose:S,scrollable:C=!1,centered:_=!0},T)=>{const $=r.useRef(null),L=r.useRef(null),{theme:M}=m();let B="md";if(d?B=d:(null==M?void 0:M.defaultSize)&&(B=M.defaultSize),b($,e),y(j&&e),w(()=>{p&&e&&o()}),r.useEffect(()=>{e?(L.current=document.activeElement,null==N||N()):L.current&&(L.current.focus(),null==S||S())},[e,N,S]),!e)return null;const E=["vtx-modal-backdrop",g&&"vtx-modal-backdrop--transparent",_&&"vtx-modal-backdrop--centered",`vtx-modal-backdrop--${z}`,k].filter(Boolean).join(" "),A=["vtx-modal",`vtx-modal--${B}`,C&&"vtx-modal--scrollable",`vtx-modal--${z}`,f].filter(Boolean).join(" "),D=n.jsx("div",{className:E,onClick:n=>{x&&n.target===n.currentTarget&&o()},role:"presentation",children:n.jsxs("div",{ref:n=>{$.current=n,"function"==typeof T?T(n):T&&(T.current=n)},className:A,role:"dialog","aria-modal":"true","aria-labelledby":a?"vtx-modal-title":void 0,"aria-describedby":i?"vtx-modal-description":void 0,children:[c?n.jsx("div",{className:"vtx-modal-header",children:c}):a||u?n.jsxs(I,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[a&&n.jsxs(I,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[n.jsx(W,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:a}),i&&n.jsx(W,{variant:"body2",color:"neutral.600",id:"vtx-modal-description",noMargin:!0,children:i})]}),u&&n.jsx(h,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:o,"aria-label":"Close modal",children:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",children:n.jsx("path",{d:"M18 6L6 18M6 6L18 18",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}):null,n.jsx(I,{direction:"column",className:"vtx-modal-body",children:l}),(s||v)&&n.jsx(I,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:v?v.map((r,t)=>n.jsx(h,{variant:r.variant||"secondary",size:r.size||(null==M?void 0:M.defaultSize)||"md",loading:r.loading,disabled:r.disabled,onClick:r.onClick,children:r.label},t)):s})]})});return t.createPortal(D,document.body)});P.displayName="Modal";u("/* ===== Toast Component Styles ===== */\n.vtx-toast {\n  --vtx-toast-animation-duration: 300ms;\n\n  display: flex;\n  flex-direction: column;\n  min-width: 300px;\n  max-width: 500px;\n  padding: 0;\n  margin: 0;\n  background: var(--vtx-color-neutral-50);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow: var(--vtx-shadow-lg);\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  pointer-events: auto;\n  overflow: hidden;\n  position: relative;\n  animation: vtx-toast-enter var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\n    forwards;\n}\n\n.vtx-toast--exiting {\n  animation: vtx-toast-exit var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\n    forwards;\n}\n\n/* ===== Toast Variants ===== */\n.vtx-toast--success {\n  border-left: 4px solid var(--vtx-color-success-500);\n}\n\n.vtx-toast--error {\n  border-left: 4px solid var(--vtx-color-error-500);\n}\n\n.vtx-toast--warning {\n  border-left: 4px solid var(--vtx-color-warning-500);\n}\n\n.vtx-toast--info {\n  border-left: 4px solid var(--vtx-color-info-500);\n}\n\n.vtx-toast--default {\n  border-left: 4px solid var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary {\n  background: var(--vtx-color-neutral-50);\n  color: var(--vtx-color-primary-600);\n  border: 1px solid var(--vtx-color-primary-200);\n  border-left: 4px solid var(--vtx-color-primary-500);\n}\n\n/* ===== Toast Wrapper ===== */\n.vtx-toast__wrapper {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-4);\n  min-height: 64px;\n}\n\n/* ===== Toast Icon ===== */\n.vtx-toast__icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.vtx-toast--success .vtx-toast__icon {\n  color: var(--vtx-color-success-600);\n}\n\n.vtx-toast--error .vtx-toast__icon {\n  color: var(--vtx-color-error-600);\n}\n\n.vtx-toast--warning .vtx-toast__icon {\n  color: var(--vtx-color-warning-600);\n}\n\n.vtx-toast--info .vtx-toast__icon {\n  color: var(--vtx-color-info-600);\n}\n\n.vtx-toast--default .vtx-toast__icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* ===== Toast Content ===== */\n.vtx-toast__content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n  min-width: 0; /* Allow content to shrink */\n}\n\n.vtx-toast__title {\n  font-weight: var(--vtx-font-weight-semibold);\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.4;\n  color: var(--vtx-color-neutral-900);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__title {\n  color: var(--vtx-color-primary-700);\n}\n\n.vtx-toast__description {\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.5;\n  color: var(--vtx-color-neutral-700);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__description {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast__body {\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.5;\n  color: var(--vtx-color-neutral-800);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__body {\n  color: var(--vtx-color-primary-700);\n}\n\n/* ===== Toast Actions ===== */\n.vtx-toast__actions {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-2);\n  flex-shrink: 0;\n}\n\n.vtx-toast__action {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\n  background: transparent;\n  border: 1px solid var(--vtx-color-primary-500);\n  border-radius: var(--vtx-radius-base);\n  color: var(--vtx-color-primary-600);\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: 1;\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n  text-decoration: none;\n  white-space: nowrap;\n}\n\n.vtx-toast__action:hover {\n  background: var(--vtx-color-primary-50);\n  border-color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast__action:focus {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n.vtx-toast--primary .vtx-toast__action {\n  border-color: var(--vtx-color-primary-500);\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__action:hover {\n  background: var(--vtx-color-primary-50);\n  border-color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__action:focus {\n  outline-color: var(--vtx-color-primary-500);\n}\n\n.vtx-toast__close {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  background: transparent;\n  border: none;\n  border-radius: var(--vtx-radius-base);\n  color: var(--vtx-color-neutral-500);\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n  flex-shrink: 0;\n}\n\n.vtx-toast__close:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-700);\n}\n\n.vtx-toast__close:focus {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n.vtx-toast--primary .vtx-toast__close {\n  color: var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary .vtx-toast__close:hover {\n  background: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-700);\n}\n\n.vtx-toast--primary .vtx-toast__close:focus {\n  outline-color: var(--vtx-color-primary-500);\n}\n\n/* ===== Progress Bar ===== */\n.vtx-toast__progress-container {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 4px;\n  background: var(--vtx-color-neutral-200);\n  overflow: hidden;\n}\n\n.vtx-toast__progress {\n  height: 100%;\n  background: currentColor;\n  transform-origin: left;\n  transition: transform 16ms linear;\n}\n\n.vtx-toast--success .vtx-toast__progress {\n  background: var(--vtx-color-success-500);\n}\n\n.vtx-toast--error .vtx-toast__progress {\n  background: var(--vtx-color-error-500);\n}\n\n.vtx-toast--warning .vtx-toast__progress {\n  background: var(--vtx-color-warning-500);\n}\n\n.vtx-toast--info .vtx-toast__progress {\n  background: var(--vtx-color-info-500);\n}\n\n.vtx-toast--default .vtx-toast__progress {\n  background: var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary .vtx-toast__progress {\n  background: var(--vtx-color-primary-500);\n}\n\n/* ===== Toast Animations ===== */\n@keyframes vtx-toast-enter {\n  from {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes vtx-toast-exit {\n  from {\n    opacity: 1;\n    transform: translateX(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateX(100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n/* Position-specific animations */\n.vtx-toast-container--top-left .vtx-toast,\n.vtx-toast-container--bottom-left .vtx-toast {\n  animation-name: vtx-toast-enter-left;\n}\n\n.vtx-toast-container--top-left .vtx-toast--exiting,\n.vtx-toast-container--bottom-left .vtx-toast--exiting {\n  animation-name: vtx-toast-exit-left;\n}\n\n@keyframes vtx-toast-enter-left {\n  from {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes vtx-toast-exit-left {\n  from {\n    opacity: 1;\n    transform: translateX(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateX(-100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n.vtx-toast-container--top-center .vtx-toast,\n.vtx-toast-container--bottom-center .vtx-toast {\n  animation-name: vtx-toast-enter-center;\n}\n\n.vtx-toast-container--top-center .vtx-toast--exiting,\n.vtx-toast-container--bottom-center .vtx-toast--exiting {\n  animation-name: vtx-toast-exit-center;\n}\n\n@keyframes vtx-toast-enter-center {\n  from {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes vtx-toast-exit-center {\n  from {\n    opacity: 1;\n    transform: translateY(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(-100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n/* ===== Dark Theme Support ===== */\n[data-vtx-toast-theme='dark'] .vtx-toast {\n  background: var(--vtx-color-neutral-800);\n  border-color: var(--vtx-color-neutral-700);\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__title {\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__description {\n  color: var(--vtx-color-neutral-300);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__body {\n  color: var(--vtx-color-neutral-200);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__close {\n  color: var(--vtx-color-neutral-400);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__close:hover {\n  background: var(--vtx-color-neutral-700);\n  color: var(--vtx-color-neutral-200);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__progress-container {\n  background: var(--vtx-color-neutral-600);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__action {\n  border-color: var(--vtx-color-primary-400);\n  color: var(--vtx-color-primary-400);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__action:hover {\n  background: var(--vtx-color-primary-900);\n  border-color: var(--vtx-color-primary-300);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary {\n  background: var(--vtx-color-primary-500);\n  color: white;\n  border: 1px solid var(--vtx-color-primary-500);\n  border-left: 4px solid var(--vtx-color-primary-600);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__icon {\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__title {\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__description {\n  color: rgba(255, 255, 255, 0.9);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__body {\n  color: rgba(255, 255, 255, 0.95);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close {\n  color: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:hover {\n  background: rgba(255, 255, 255, 0.1);\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:focus {\n  outline-color: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__progress {\n  background: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action {\n  border-color: rgba(255, 255, 255, 0.6);\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:hover {\n  background: rgba(255, 255, 255, 0.1);\n  border-color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:focus {\n  outline-color: rgba(255, 255, 255, 0.8);\n}\n\n/* ===== Responsive Design ===== */\n@media (max-width: 640px) {\n  .vtx-toast {\n    min-width: 280px;\n    max-width: calc(100vw - 32px);\n    margin: 0;\n  }\n\n  .vtx-toast__wrapper {\n    padding: var(--vtx-spacing-3);\n  }\n\n  .vtx-toast__actions {\n    gap: var(--vtx-spacing-1);\n  }\n\n  .vtx-toast__action {\n    font-size: var(--vtx-font-size-xs);\n    padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  }\n}\n\n/* ===== High Contrast Mode ===== */\n@media (prefers-contrast: high) {\n  .vtx-toast {\n    border-width: 2px;\n  }\n\n  .vtx-toast__close:focus,\n  .vtx-toast__action:focus {\n    outline-width: 3px;\n  }\n}\n\n/* ===== Reduced Motion ===== */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-toast {\n    animation-duration: 1ms;\n  }\n\n  .vtx-toast__progress {\n    transition: none;\n  }\n}\n");const X={success:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm-2 15l-5-5 1.414-1.414L8 12.172l7.586-7.586L17 6l-9 9z",fill:"currentColor"})}),error:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm5 13.59L13.59 15 10 11.41 6.41 15 5 13.59 8.59 10 5 6.41 6.41 5 10 8.59 13.59 5 15 6.41 11.41 10 15 13.59z",fill:"currentColor"})}),warning:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-2h2v2zm0-4H9V5h2v6z",fill:"currentColor"})}),info:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9V9h2v6zm0-8H9V5h2v2z",fill:"currentColor"})}),default:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9V9h2v6zm0-8H9V5h2v2z",fill:"currentColor"})}),primary:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-6h2v6zm0-8H9V5h2v2z",fill:"currentColor"})})},q=n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M12.854 4.854a.5.5 0 0 0-.708-.708L8 8.293 3.854 4.146a.5.5 0 1 0-.708.708L7.293 9l-4.147 4.146a.5.5 0 0 0 .708.708L8 9.707l4.146 4.147a.5.5 0 0 0 .708-.708L8.707 9l4.147-4.146z",fill:"currentColor"})}),G=a.default.forwardRef(({children:t,onDismiss:e,id:o,variant:i="default",autoClose:l=5e3,closeButton:c=!0,progressBar:s=!0,pauseOnHover:v=!0,pauseOnFocusLoss:d=!0,icon:x,action:p,className:m="",style:u,title:h,description:g,animationDuration:f=300,isVisible:b,createdAt:w,onClose:y,onOpen:k,toastId:j,...z},N)=>{const[S,C]=r.useState(!1),[_,T]=r.useState(!1),[$,L]=r.useState(100),M=r.useRef(null),B=r.useRef(Date.now()),E=r.useRef(0),I=a.default.useCallback(()=>{C(!0),setTimeout(()=>{e()},f)},[e,f]);r.useEffect(()=>{if(!1===l||_)return;return M.current=setInterval(()=>{const n=Date.now()-B.current-E.current,r=Math.max(0,l-n);L(r/l*100),r<=0&&I()},16),()=>{M.current&&clearInterval(M.current)}},[l,_,I]);const A=["vtx-toast",`vtx-toast--${i}`,S&&"vtx-toast--exiting",m].filter(Boolean).join(" ");return n.jsxs("div",{ref:N,className:A,style:{...u,"--vtx-toast-animation-duration":`${f}ms`},onMouseEnter:()=>{v&&!_&&(T(!0),E.current=Date.now())},onMouseLeave:()=>{if(v&&_){T(!1);const n=Date.now()-E.current;B.current+=n}},onFocus:()=>{if(d&&_){T(!1);const n=Date.now()-E.current;B.current+=n}},onBlur:()=>{d&&!_&&(T(!0),E.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":o,...z,children:[n.jsxs("div",{className:"vtx-toast__wrapper",children:[!1===x?null:x?n.jsx("div",{className:"vtx-toast__icon",children:x}):n.jsx("div",{className:"vtx-toast__icon",children:X[i]}),h||g?n.jsxs("div",{className:"vtx-toast__content",children:[h&&n.jsx("div",{className:"vtx-toast__title",children:h}),g&&n.jsx("div",{className:"vtx-toast__description",children:g}),t&&n.jsx("div",{className:"vtx-toast__body",children:t})]}):n.jsx("div",{className:"vtx-toast__content",children:t}),n.jsxs("div",{className:"vtx-toast__actions",children:[p&&n.jsx("button",{className:"vtx-toast__action",onClick:p.onClick,type:"button",children:p.label}),c&&n.jsx("button",{className:"vtx-toast__close",onClick:I,type:"button","aria-label":"Close notification",children:q})]})]}),s&&!1!==l&&n.jsx("div",{className:"vtx-toast__progress-container",children:n.jsx("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${$/100})`,animationPlayState:_?"paused":"running"}})})]})});G.displayName="Toast";const K=r.createContext(null),U=()=>{const n=r.useContext(K);if(!n)throw new Error("useToast must be used within a ToastProvider");return n},Z=({children:t})=>{const[e,o]=r.useState([]),a=r.useCallback(n=>{o(r=>{var t;const e=r.find(r=>r.id===n);return e&&(null===(t=e.onClose)||void 0===t||t.call(e)),r.filter(r=>r.id!==n)})},[]),i=r.useCallback((n,r={})=>{var t;const e=r.toastId||Date.now()+Math.random(),i={id:e,content:n,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...r};return o(n=>{const r=n.filter(n=>n.id!==e);return[i,...r]}),!1!==i.autoClose&&setTimeout(()=>{a(e)},i.autoClose),null===(t=r.onOpen)||void 0===t||t.call(r),e},[a]),l=r.useCallback(()=>{o([])},[]),c=r.useCallback((n,r)=>{o(t=>t.map(t=>t.id===n?{...t,...r}:t))},[]),s={toasts:e,addToast:i,removeToast:a,clearAllToasts:l,updateToast:c};return n.jsx(K.Provider,{value:s,children:t})};class J{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return J.instance||(J.instance=new J),J.instance}setMethods(n,r,t,e){this.addToastFn=n,this.removeToastFn=r,this.clearAllToastsFn=t,this.updateToastFn=e}show(n,r){return this.addToastFn?this.addToastFn(n,r):(console.warn("Toast system not initialized. Make sure ToastContainer is mounted."),"")}success(n,r){return this.show(n,{...r,variant:"success"})}error(n,r){return this.show(n,{...r,variant:"error"})}warning(n,r){return this.show(n,{...r,variant:"warning"})}info(n,r){return this.show(n,{...r,variant:"info"})}primary(n,r){return this.show(n,{...r,variant:"primary"})}dismiss(n){this.removeToastFn?this.removeToastFn(n):console.warn("Toast system not initialized.")}dismissAll(){this.clearAllToastsFn?this.clearAllToastsFn():console.warn("Toast system not initialized.")}update(n,r){this.updateToastFn?this.updateToastFn(n,r):console.warn("Toast system not initialized.")}}const Q=J.getInstance();u("/* ===== Toast Container Styles ===== */\n.vtx-toast-container {\n  --vtx-toast-gap: 12px;\n\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  max-width: 100vw;\n  pointer-events: none;\n}\n\n.vtx-toast-container__hidden-count {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  margin-bottom: var(--vtx-toast-gap);\n  background: var(--vtx-color-neutral-100);\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-full);\n  color: var(--vtx-color-neutral-700);\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-medium);\n  pointer-events: auto;\n  backdrop-filter: blur(8px);\n  animation: vtx-toast-fade-in 200ms ease-out;\n}\n\n.vtx-toast-container__list {\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-toast-gap);\n  align-items: stretch;\n}\n\n/* ===== Position Variants ===== */\n.vtx-toast-container--top-left,\n.vtx-toast-container--top-center,\n.vtx-toast-container--top-right {\n  flex-direction: column;\n}\n\n.vtx-toast-container--bottom-left,\n.vtx-toast-container--bottom-center,\n.vtx-toast-container--bottom-right {\n  flex-direction: column-reverse;\n}\n\n.vtx-toast-container--bottom-left .vtx-toast-container__hidden-count,\n.vtx-toast-container--bottom-center .vtx-toast-container__hidden-count,\n.vtx-toast-container--bottom-right .vtx-toast-container__hidden-count {\n  order: -1;\n  margin-bottom: 0;\n  margin-top: var(--vtx-toast-gap);\n}\n\n/* ===== Stacked Layout ===== */\n.vtx-toast-container--stacked .vtx-toast-container__list {\n  position: relative;\n}\n\n.vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n  transform: translateY(-2px) scale(0.98);\n  opacity: 0.9;\n  z-index: -1;\n}\n\n.vtx-toast-container--stacked .vtx-toast:nth-child(3) {\n  transform: translateY(-4px) scale(0.96);\n  opacity: 0.8;\n}\n\n.vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\n  transform: translateY(-6px) scale(0.94);\n  opacity: 0.7;\n}\n\n/* ===== Dark Theme Support ===== */\n[data-vtx-toast-theme='dark'] .vtx-toast-container__hidden-count {\n  background: var(--vtx-color-neutral-800);\n  border-color: var(--vtx-color-neutral-600);\n  color: var(--vtx-color-neutral-300);\n}\n\n/* ===== Responsive Design ===== */\n@media (max-width: 640px) {\n  .vtx-toast-container {\n    left: var(--vtx-spacing-4) !important;\n    right: var(--vtx-spacing-4) !important;\n    transform: none !important;\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n    transform: translateY(-1px) scale(0.99);\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:nth-child(3) {\n    transform: translateY(-2px) scale(0.98);\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\n    transform: translateY(-3px) scale(0.97);\n  }\n}\n\n/* ===== Animations ===== */\n@keyframes vtx-toast-fade-in {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* ===== Accessibility ===== */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n    transform: none;\n    opacity: 1;\n  }\n\n  .vtx-toast-container__hidden-count {\n    animation: none;\n  }\n}\n\n/* ===== Print Styles ===== */\n@media print {\n  .vtx-toast-container {\n    display: none;\n  }\n}\n");const nn=({position:e="top-right",limit:o=5,gap:a=12,margin:i=16,className:l="",style:c,stacked:s=!0,theme:v="auto"})=>{const{toasts:d,removeToast:x,addToast:p,clearAllToasts:m,updateToast:u}=U(),h=r.useRef(null);r.useEffect(()=>{Q.setMethods(p,x,m,u)},[p,x,m,u]),r.useEffect(()=>{if("auto"===v){const n=window.matchMedia("(prefers-color-scheme: dark)"),r=()=>{document.documentElement.setAttribute("data-vtx-toast-theme",n.matches?"dark":"light")};return r(),n.addEventListener("change",r),()=>n.removeEventListener("change",r)}document.documentElement.setAttribute("data-vtx-toast-theme",v)},[v]);const g=d.slice(0,o),f=Math.max(0,d.length-o),b=["vtx-toast-container",`vtx-toast-container--${e}`,s&&"vtx-toast-container--stacked",l].filter(Boolean).join(" ");return 0===g.length?null:t.createPortal(n.jsxs("div",{ref:h,className:b,style:{...(n=>{const r={position:"fixed",zIndex:"var(--vtx-z-notification, 1400)",pointerEvents:"none"};switch(n){case"top-left":return{...r,top:i,left:i};case"top-center":return{...r,top:i,left:"50%",transform:"translateX(-50%)"};case"top-right":default:return{...r,top:i,right:i};case"bottom-left":return{...r,bottom:i,left:i};case"bottom-center":return{...r,bottom:i,left:"50%",transform:"translateX(-50%)"};case"bottom-right":return{...r,bottom:i,right:i}}})(e),"--vtx-toast-gap":`${a}px`,...c},"aria-live":"polite","aria-label":"Notifications",children:[f>0&&n.jsxs("div",{className:"vtx-toast-container__hidden-count",children:["+",f," more"]}),n.jsx("div",{className:"vtx-toast-container__list",children:g.map((r,t)=>n.jsx(G,{id:r.id,isVisible:r.isVisible,onDismiss:()=>x(r.id),variant:r.variant,autoClose:r.autoClose,closeButton:r.closeButton,progressBar:r.progressBar,pauseOnHover:r.pauseOnHover,pauseOnFocusLoss:r.pauseOnFocusLoss,icon:r.icon,action:r.action,className:r.className,style:r.style,title:r.title,description:r.description,animationDuration:r.animationDuration,createdAt:r.createdAt,onClose:r.onClose,onOpen:r.onOpen,"data-toast-index":t,children:r.content},r.id))})]}),document.body)};u(".vtx-tooltip {\n  position: fixed;\n  z-index: var(--vtx-z-tooltip);\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  background-color: var(--vtx-color-neutral-900);\n  color: white;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  border-radius: var(--vtx-radius-md);\n  max-width: 300px;\n  word-wrap: break-word;\n  pointer-events: auto;\n  box-shadow: var(--vtx-shadow-lg);\n  opacity: 0;\n  transition:\n    opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),\n    transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  will-change: transform, opacity;\n}\n\n.vtx-tooltip--visible {\n  opacity: 1;\n}\n\n/* Inner wrapper for content and close button */\n.vtx-tooltip-inner {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-2);\n}\n\n.vtx-tooltip-content {\n  flex: 1;\n  min-width: 0;\n}\n\n/* Close button */\n.vtx-tooltip-close {\n  flex-shrink: 0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  padding: 0;\n  background: transparent;\n  border: none;\n  color: currentColor;\n  cursor: pointer;\n  border-radius: var(--vtx-radius-sm);\n  transition: all var(--vtx-transition-base);\n  opacity: 0.7;\n  margin-top: -2px;\n}\n\n.vtx-tooltip-close:hover {\n  opacity: 1;\n  background: rgba(255, 255, 255, 0.1);\n}\n\n.vtx-tooltip-close:active {\n  transform: scale(0.95);\n}\n\n.vtx-tooltip-close:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n  opacity: 1;\n}\n\n/* Placement-specific transforms with entry animations */\n.vtx-tooltip--top {\n  transform: translate(-50%, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom center;\n}\n\n.vtx-tooltip--top.vtx-tooltip--visible {\n  transform: translate(-50%, -100%) scale(1);\n}\n\n.vtx-tooltip--bottom {\n  transform: translate(-50%, 4px) scale(0.9);\n  transform-origin: top center;\n}\n\n.vtx-tooltip--bottom.vtx-tooltip--visible {\n  transform: translate(-50%, 0) scale(1);\n}\n\n.vtx-tooltip--left {\n  transform: translate(calc(-100% - 4px), -50%) scale(0.9);\n  transform-origin: right center;\n}\n\n.vtx-tooltip--left.vtx-tooltip--visible {\n  transform: translate(-100%, -50%) scale(1);\n}\n\n.vtx-tooltip--right {\n  transform: translate(4px, -50%) scale(0.9);\n  transform-origin: left center;\n}\n\n.vtx-tooltip--right.vtx-tooltip--visible {\n  transform: translate(0, -50%) scale(1);\n}\n\n/* Placement-start and placement-end variants */\n.vtx-tooltip--top-start {\n  transform: translate(0, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom left;\n}\n\n.vtx-tooltip--top-start.vtx-tooltip--visible {\n  transform: translate(0, -100%) scale(1);\n}\n\n.vtx-tooltip--top-end {\n  transform: translate(-100%, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom right;\n}\n\n.vtx-tooltip--top-end.vtx-tooltip--visible {\n  transform: translate(-100%, -100%) scale(1);\n}\n\n.vtx-tooltip--bottom-start {\n  transform: translate(0, 4px) scale(0.9);\n  transform-origin: top left;\n}\n\n.vtx-tooltip--bottom-start.vtx-tooltip--visible {\n  transform: translate(0, 0) scale(1);\n}\n\n.vtx-tooltip--bottom-end {\n  transform: translate(-100%, 4px) scale(0.9);\n  transform-origin: top right;\n}\n\n.vtx-tooltip--bottom-end.vtx-tooltip--visible {\n  transform: translate(-100%, 0) scale(1);\n}\n\n.vtx-tooltip--left-start {\n  transform: translate(calc(-100% - 4px), 0) scale(0.9);\n  transform-origin: right top;\n}\n\n.vtx-tooltip--left-start.vtx-tooltip--visible {\n  transform: translate(-100%, 0) scale(1);\n}\n\n.vtx-tooltip--left-end {\n  transform: translate(calc(-100% - 4px), -100%) scale(0.9);\n  transform-origin: right bottom;\n}\n\n.vtx-tooltip--left-end.vtx-tooltip--visible {\n  transform: translate(-100%, -100%) scale(1);\n}\n\n.vtx-tooltip--right-start {\n  transform: translate(4px, 0) scale(0.9);\n  transform-origin: left top;\n}\n\n.vtx-tooltip--right-start.vtx-tooltip--visible {\n  transform: translate(0, 0) scale(1);\n}\n\n.vtx-tooltip--right-end {\n  transform: translate(4px, -100%) scale(0.9);\n  transform-origin: left bottom;\n}\n\n.vtx-tooltip--right-end.vtx-tooltip--visible {\n  transform: translate(0, -100%) scale(1);\n}\n\n/* Variants */\n.vtx-tooltip--dark {\n  background-color: var(--vtx-color-neutral-900);\n  color: white;\n}\n\n.vtx-tooltip--light {\n  background-color: white;\n  color: var(--vtx-color-neutral-900);\n  border: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-tooltip--light .vtx-tooltip-close:hover {\n  background: var(--vtx-color-neutral-100);\n}\n\n.vtx-tooltip--error {\n  background-color: var(--vtx-color-error-600);\n  color: white;\n}\n\n.vtx-tooltip--warning {\n  background-color: var(--vtx-color-warning-500);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-tooltip--success {\n  background-color: var(--vtx-color-success-600);\n  color: white;\n}\n\n.vtx-tooltip--info {\n  background-color: var(--vtx-color-info-600);\n  color: white;\n}\n\n/* Arrow */\n.vtx-tooltip--with-arrow .vtx-tooltip-arrow {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background-color: inherit;\n  transform: rotate(45deg);\n  border: inherit;\n}\n\n.vtx-tooltip--top .vtx-tooltip-arrow {\n  bottom: -4px;\n  left: 50%;\n  margin-left: -4px;\n}\n\n.vtx-tooltip--bottom .vtx-tooltip-arrow {\n  top: -4px;\n  left: 50%;\n  margin-left: -4px;\n}\n\n.vtx-tooltip--left .vtx-tooltip-arrow {\n  right: -4px;\n  top: 50%;\n  margin-top: -4px;\n}\n\n.vtx-tooltip--right .vtx-tooltip-arrow {\n  left: -4px;\n  top: 50%;\n  margin-top: -4px;\n}\n");const rn=a.default.forwardRef(({content:e,placement:o="top",delay:a=200,hideDelay:i=0,children:l,open:c,disabled:s=!1,arrow:v=!1,maxWidth:d="300px",variant:x="dark",dismissible:p=!1,onShow:m,onHide:u,onDismiss:h,className:g="",...f},b)=>{const[w,y]=r.useState(c||!1),[k,j]=r.useState(!1),[z,N]=r.useState({top:0,left:0}),S=r.useRef(null),C=r.useRef(null),_=r.useRef(null),T=r.useRef(null),$=r.useRef(!1),L=()=>{s||($.current=!0,_.current&&clearTimeout(_.current),T.current&&clearTimeout(T.current),C.current=setTimeout(()=>{if(S.current&&$.current){const n=S.current.getBoundingClientRect(),r=B(n,o);N(r),j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0),null==m||m()})})}},a))},M=()=>{$.current=!1,C.current&&clearTimeout(C.current),_.current=setTimeout(()=>{$.current||(y(!1),null==u||u(),T.current=setTimeout(()=>{j(!1)},150))},i)},B=(n,r)=>{const t=v?12:8;let e=0,o=0;return r.startsWith("top")?(e=n.top-t+window.scrollY,o=n.left+n.width/2+window.scrollX,"top-start"===r&&(o=n.left+window.scrollX),"top-end"===r&&(o=n.right+window.scrollX)):r.startsWith("bottom")?(e=n.bottom+t+window.scrollY,o=n.left+n.width/2+window.scrollX,"bottom-start"===r&&(o=n.left+window.scrollX),"bottom-end"===r&&(o=n.right+window.scrollX)):r.startsWith("left")?(e=n.top+n.height/2+window.scrollY,o=n.left-t+window.scrollX,"left-start"===r&&(e=n.top+window.scrollY),"left-end"===r&&(e=n.bottom+window.scrollY)):r.startsWith("right")&&(e=n.top+n.height/2+window.scrollY,o=n.right+t+window.scrollX,"right-start"===r&&(e=n.top+window.scrollY),"right-end"===r&&(e=n.bottom+window.scrollY)),{top:e,left:o}};r.useEffect(()=>{void 0!==c&&(c?(j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0)})})):(y(!1),T.current=setTimeout(()=>{j(!1)},150)))},[c]),r.useEffect(()=>()=>{C.current&&clearTimeout(C.current),_.current&&clearTimeout(_.current),T.current&&clearTimeout(T.current)},[]);const E=["vtx-tooltip",`vtx-tooltip--${o}`,`vtx-tooltip--${x}`,v&&"vtx-tooltip--with-arrow",w&&"vtx-tooltip--visible",g].filter(Boolean).join(" "),I=void 0!==c&&c||k,A=r.cloneElement(l,{ref:n=>{S.current=n;const r=l.ref;"function"==typeof r?r(n):r&&"object"==typeof r&&"current"in r&&(r.current=n)},onMouseEnter:n=>{var r,t;void 0===c&&L(),null===(t=(r=l.props).onMouseEnter)||void 0===t||t.call(r,n)},onMouseLeave:n=>{var r,t;void 0===c&&M(),null===(t=(r=l.props).onMouseLeave)||void 0===t||t.call(r,n)},onFocus:n=>{var r,t;void 0===c&&L(),null===(t=(r=l.props).onFocus)||void 0===t||t.call(r,n)},onBlur:n=>{var r,t;void 0===c&&M(),null===(t=(r=l.props).onBlur)||void 0===t||t.call(r,n)},"aria-describedby":w?"vtx-tooltip-content":void 0});return n.jsxs(n.Fragment,{children:[A,I&&t.createPortal(n.jsxs("div",{ref:b,id:"vtx-tooltip-content",role:"tooltip",className:E,style:{top:`${z.top}px`,left:`${z.left}px`,maxWidth:d},onMouseEnter:()=>{s||void 0!==c||($.current=!0,_.current&&clearTimeout(_.current))},onMouseLeave:()=>{s||void 0!==c||M()},...f,children:[v&&n.jsx("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),n.jsxs("div",{className:"vtx-tooltip-inner",children:[n.jsx("span",{className:"vtx-tooltip-content",children:e}),p&&n.jsx("button",{type:"button",className:"vtx-tooltip-close",onClick:()=>{$.current=!1,y(!1),null==h||h(),null==u||u(),T.current=setTimeout(()=>{j(!1)},150)},"aria-label":"Dismiss tooltip",children:n.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M11 3L3 11M3 3L11 11",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]}),document.body)]})});rn.displayName="Tooltip";u(".vtx-avatar {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  background-color: var(--vtx-color-neutral-200);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-avatar-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.vtx-avatar-fallback {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  color: var(--vtx-color-neutral-700);\r\n  user-select: none;\r\n}\r\n\r\n/* Sizes */\r\n\r\n.vtx-avatar--sm {\r\n  width: 32px;\r\n  height: 32px;\r\n}\r\n.vtx-avatar--sm .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.vtx-avatar--md {\r\n  width: 40px;\r\n  height: 40px;\r\n}\r\n.vtx-avatar--md .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-avatar--lg {\r\n  width: 56px;\r\n  height: 56px;\r\n}\r\n.vtx-avatar--lg .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Shapes */\r\n.vtx-avatar--circle {\r\n  border-radius: var(--vtx-radius-full);\r\n}\r\n\r\n.vtx-avatar--square {\r\n  border-radius: var(--vtx-radius-md);\r\n}\r\n");const tn=a.default.forwardRef(({src:t,alt:e="",size:o,shape:a="circle",fallback:i="?",onImageError:l,onImageLoad:c,imgProps:s,statusIndicator:v,statusPosition:d="bottom-right",className:x="",...p},u)=>{const{theme:h}=m(),g=o||h.defaultSize||"md",[f,b]=r.useState(!1),w=["vtx-avatar",`vtx-avatar--${g}`,`vtx-avatar--${a}`,v&&"vtx-avatar--with-status",x].filter(Boolean).join(" "),y=t&&!f,k=i.slice(0,2).toUpperCase();return n.jsxs("div",{ref:u,className:w,role:"img","aria-label":e||i||"Avatar",...p,children:[y?n.jsx("img",{src:t,alt:e,className:"vtx-avatar-image",onError:n=>{b(!0),null==l||l(n)},onLoad:n=>{null==c||c(n)},loading:"lazy",...s}):n.jsx("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),v&&n.jsx("span",{className:`vtx-avatar-status vtx-avatar-status--${d}`,"aria-label":"Status indicator",children:v})]})});tn.displayName="Avatar";u(".vtx-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--vtx-spacing-1);\n  font-family: var(--vtx-font-family-sans);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: 1;\n  white-space: nowrap;\n  border-radius: var(--vtx-radius-base);\n  transition: all var(--vtx-transition-base);\n}\n\n/* Sizes */\n.vtx-badge--small {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-xs);\n}\n\n.vtx-badge--medium {\n  padding: calc(var(--vtx-spacing-1) + 1px) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-badge--large {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-base);\n}\n\n/* Variants */\n.vtx-badge--neutral {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-800);\n}\n\n.vtx-badge--primary {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-800);\n}\n\n.vtx-badge--success {\n  background-color: var(--vtx-color-success-50);\n  color: var(--vtx-color-success-700);\n}\n\n.vtx-badge--warning {\n  background-color: var(--vtx-color-warning-50);\n  color: var(--vtx-color-warning-700);\n}\n\n.vtx-badge--error {\n  background-color: var(--vtx-color-error-50);\n  color: var(--vtx-color-error-700);\n}\n\n.vtx-badge--info {\n  background-color: var(--vtx-color-info-50);\n  color: var(--vtx-color-info-700);\n}\n\n/* Pill shape */\n.vtx-badge--pill {\n  border-radius: var(--vtx-radius-full);\n}\n\n/* Dot indicator */\n.vtx-badge-dot {\n  width: 6px;\n  height: 6px;\n  border-radius: var(--vtx-radius-full);\n  flex-shrink: 0;\n}\n\n.vtx-badge--neutral .vtx-badge-dot {\n  background-color: var(--vtx-color-neutral-600);\n}\n\n.vtx-badge--primary .vtx-badge-dot {\n  background-color: var(--vtx-color-primary-600);\n}\n\n.vtx-badge--success .vtx-badge-dot {\n  background-color: var(--vtx-color-success-600);\n}\n\n.vtx-badge--warning .vtx-badge-dot {\n  background-color: var(--vtx-color-warning-600);\n}\n\n.vtx-badge--error .vtx-badge-dot {\n  background-color: var(--vtx-color-error-600);\n}\n\n.vtx-badge--info .vtx-badge-dot {\n  background-color: var(--vtx-color-info-600);\n}\n");const en=a.default.forwardRef(({variant:t="neutral",size:e="medium",pill:o=!1,dot:a=!1,outline:i=!1,maxLength:l,icon:c,children:s,className:v="",onRemove:d,...x},p)=>{const m=["vtx-badge",`vtx-badge--${t}`,`vtx-badge--${e}`,o&&"vtx-badge--pill",a&&"vtx-badge--with-dot",i&&"vtx-badge--outline",d&&"vtx-badge--removable",v].filter(Boolean).join(" "),u=r.useMemo(()=>l&&"string"==typeof s&&s.length>l?`${s.slice(0,l)}...`:s,[s,l]);return n.jsxs("span",{ref:p,className:m,...x,children:[a&&n.jsx("span",{className:"vtx-badge-dot","aria-hidden":"true"}),c&&n.jsx("span",{className:"vtx-badge-icon","aria-hidden":"true",children:c}),n.jsx("span",{className:"vtx-badge-content",children:u}),d&&n.jsx("button",{type:"button",className:"vtx-badge-remove",onClick:d,"aria-label":"Remove badge",children:n.jsx("svg",{width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",children:n.jsx("path",{d:"M9 3L3 9M3 3L9 9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]})});en.displayName="Badge";u(".vtx-card {\r\n  background-color: var(--vtx-color-white);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n  overflow: hidden;\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  font-family: var(--vtx-font-family-sans);\r\n  isolation: isolate; /* Create stacking context for better layering */\r\n  box-sizing: border-box;\r\n  width: 100%;\r\n}\r\n\r\n/* Sizes with refined spacing */\r\n.vtx-card--sm {\r\n  --vtx-card-padding: var(--vtx-spacing-3, 12px);\r\n  border-radius: var(--vtx-radius-md, 8px);\r\n}\r\n\r\n.vtx-card--md {\r\n  --vtx-card-padding: var(--vtx-spacing-4, 16px);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n}\r\n\r\n.vtx-card--lg {\r\n  --vtx-card-padding: var(--vtx-spacing-6, 24px);\r\n  border-radius: var(--vtx-radius-xl, 16px);\r\n}\r\n\r\n/* Variants with enhanced visual design */\r\n.vtx-card--elevated {\r\n  box-shadow: \r\n    0 1px 3px 0 rgba(0, 0, 0, 0.1),\r\n    0 1px 2px -1px rgba(0, 0, 0, 0.1);\r\n  border: 1px solid rgba(0, 0, 0, 0.05);\r\n  background-color: var(--vtx-color-white);\r\n}\r\n\r\n.vtx-card--outlined {\r\n  box-shadow: none;\r\n  border: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-white);\r\n}\r\n\r\n.vtx-card--filled {\r\n  box-shadow: none;\r\n  border: 1px solid var(--vtx-color-neutral-100, #f5f5f5);\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n}\r\n\r\n/* Card Content with improved typography */\r\n.vtx-card-content {\r\n  padding: var(--vtx-card-padding, 16px);\r\n  flex: 1;\r\n  line-height: 1.6;\r\n  color: var(--vtx-color-neutral-900, #1a1a1a);\r\n}\r\n\r\n.vtx-card-content > *:first-child {\r\n  margin-top: 0;\r\n}\r\n\r\n.vtx-card-content > *:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n/* No Padding Modifier */\r\n.vtx-card--no-padding .vtx-card-content {\r\n  padding: 0;\r\n}\r\n\r\n/* Header and Footer with refined styling */\r\n.vtx-card-header,\r\n.vtx-card-footer {\r\n  padding: var(--vtx-card-padding, 16px);\r\n}\r\n\r\n.vtx-card-header {\r\n  color: var(--vtx-color-neutral-900, #1a1a1a);\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-card-footer {\r\n  color: var(--vtx-color-neutral-700, #404040);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-end;\r\n  gap: var(--vtx-spacing-2, 8px);\r\n}\r\n\r\n.vtx-card-header--divider {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-neutral-25, #fcfcfc);\r\n}\r\n\r\n.vtx-card-footer--divider {\r\n  border-top: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-neutral-25, #fcfcfc);\r\n}\r\n\r\n/* Maintain consistent padding when noPadding is set */\r\n.vtx-card--no-padding .vtx-card-header,\r\n.vtx-card--no-padding .vtx-card-footer {\r\n  padding: var(--vtx-card-padding, 16px);\r\n}\r\n\r\n/* Enhanced Interactive States */\r\n.vtx-card--hoverable {\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-card--hoverable:hover {\r\n  transform: translateY(-1px);\r\n}\r\n\r\n.vtx-card--elevated.vtx-card--hoverable:hover {\r\n  box-shadow: \r\n    0 10px 15px -3px rgba(0, 0, 0, 0.1),\r\n    0 4px 6px -4px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--outlined.vtx-card--hoverable:hover {\r\n  border-color: var(--vtx-color-neutral-300, #d4d4d4);\r\n  box-shadow: \r\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\r\n    0 2px 4px -2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--filled.vtx-card--hoverable:hover {\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n  box-shadow: \r\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\r\n    0 2px 4px -2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--clickable {\r\n  cursor: pointer;\r\n  user-select: none;\r\n  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-card--clickable:active {\r\n  transform: translateY(0) scale(0.98);\r\n}\r\n\r\n/* Enhanced Focus State for better accessibility */\r\n.vtx-card:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500, #3b82f6);\r\n  outline-offset: 2px;\r\n  box-shadow: \r\n    0 0 0 4px rgba(59, 130, 246, 0.1),\r\n    0 1px 3px 0 rgba(0, 0, 0, 0.1),\r\n    0 1px 2px -1px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n/* Loading state */\r\n.vtx-card--loading {\r\n  position: relative;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-card--loading::after {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background: rgba(255, 255, 255, 0.8);\r\n  backdrop-filter: blur(2px);\r\n  z-index: 1;\r\n}\r\n\r\n/* Media queries for responsive design */\r\n@media (max-width: 768px) {\r\n  .vtx-card--sm {\r\n    --vtx-card-padding: var(--vtx-spacing-2, 8px);\r\n  }\r\n  \r\n  .vtx-card--md {\r\n    --vtx-card-padding: var(--vtx-spacing-3, 12px);\r\n  }\r\n  \r\n  .vtx-card--lg {\r\n    --vtx-card-padding: var(--vtx-spacing-4, 16px);\r\n  }\r\n  \r\n  .vtx-card-footer {\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n    gap: var(--vtx-spacing-3, 12px);\r\n  }\r\n}\r\n\r\n/* Reduced motion support */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-card,\r\n  .vtx-card--hoverable,\r\n  .vtx-card--clickable {\r\n    transition: none;\r\n  }\r\n  \r\n  .vtx-card--hoverable:hover,\r\n  .vtx-card--clickable:active {\r\n    transform: none;\r\n  }\r\n}\r\n\r\n/* High contrast mode support */\r\n@media (prefers-contrast: high) {\r\n  .vtx-card--outlined {\r\n    border-width: 2px;\r\n    border-color: var(--vtx-color-neutral-900, #000);\r\n  }\r\n  \r\n  .vtx-card-header--divider,\r\n  .vtx-card-footer--divider {\r\n    border-width: 2px;\r\n    border-color: var(--vtx-color-neutral-900, #000);\r\n  }\r\n}\r\n");const on=a.default.forwardRef(({children:r,variant:t="elevated",size:e,noPadding:o=!1,padding:a,hoverable:i=!1,clickable:l=!1,className:c="",header:s,footer:v,divider:d=!1,style:x,onClick:p,tabIndex:u,...h},g)=>{const{theme:f}=m(),b=["vtx-card",`vtx-card--${t}`,`vtx-card--${e||(null==f?void 0:f.defaultSize)||"md"}`,i?"vtx-card--hoverable":"",l?"vtx-card--clickable":"",o&&!a?"vtx-card--no-padding":"",c].filter(Boolean).join(" "),w={...x||{},...a?{"--vtx-card-padding":a}:{}},y=l?"number"==typeof u?u:0:u;return n.jsxs("div",{ref:g,className:b,style:w,onClick:p,tabIndex:y,...h,children:[s&&n.jsx("div",{className:"vtx-card-header"+(d?" vtx-card-header--divider":""),children:s}),n.jsx("div",{className:"vtx-card-content",children:r}),v&&n.jsx("div",{className:"vtx-card-footer"+(d?" vtx-card-footer--divider":""),children:v})]})});on.displayName="Card";u("/* Base divider styles */\n.vtx-divider {\n  margin: 0;\n  flex-shrink: 0;\n  border-width: 0;\n  border-style: solid;\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\n  border-bottom-width: thin;\n}\n\n/* Light variant */\n.vtx-divider--light {\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\n}\n\n/* Horizontal orientation (default) */\n.vtx-divider--horizontal {\n  width: 100%;\n  border-bottom-width: 1px;\n}\n\n/* Vertical orientation */\n.vtx-divider--vertical {\n  height: auto;\n  align-self: stretch;\n  border-bottom-width: 0;\n  border-right-width: 1px;\n}\n\n/* Flex item variant */\n.vtx-divider--flex-item {\n  height: auto;\n  align-self: stretch;\n}\n\n.vtx-divider--flex-item.vtx-divider--horizontal {\n  height: 1px;\n  width: 100%;\n  align-self: auto;\n}\n\n/* Variants */\n.vtx-divider--fullWidth {\n  width: 100%;\n}\n\n.vtx-divider--inset {\n  margin-left: var(--vtx-spacing-9);\n}\n\n.vtx-divider--middle {\n  margin-left: var(--vtx-spacing-3);\n  margin-right: var(--vtx-spacing-3);\n}\n\n.vtx-divider--vertical.vtx-divider--inset {\n  margin-left: 0;\n  margin-top: var(--vtx-spacing-2);\n}\n\n.vtx-divider--vertical.vtx-divider--middle {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: var(--vtx-spacing-2);\n  margin-bottom: var(--vtx-spacing-2);\n}\n\n/* With children */\n.vtx-divider--with-children {\n  display: flex;\n  white-space: nowrap;\n  text-align: center;\n  border: 0;\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-divider-text-size, var(--vtx-font-size-sm));\n  color: var(--vtx-divider-text-color, var(--vtx-color-neutral-600));\n  font-weight: var(--vtx-divider-text-weight, var(--vtx-font-weight-medium));\n}\n\n.vtx-divider--with-children.vtx-divider--light {\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\n  color: var(--vtx-divider-text-color-light, var(--vtx-color-neutral-500));\n}\n\n.vtx-divider--with-children::before,\n.vtx-divider--with-children::after {\n  content: '';\n  align-self: center;\n  border-top: thin solid;\n  border-color: inherit;\n}\n\n/* Text alignment - horizontal only */\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::before {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::after {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::before {\n  width: 5%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::after {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::before {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::after {\n  width: 5%;\n}\n\n/* Wrapper for children content */\n.vtx-divider-wrapper {\n  display: inline-flex;\n  align-items: center;\n  padding-left: var(--vtx-spacing-3);\n  padding-right: var(--vtx-spacing-3);\n}\n\n/* Vertical divider with children (not commonly used but supported) */\n.vtx-divider--with-children.vtx-divider--vertical {\n  flex-direction: column;\n}\n\n.vtx-divider--with-children.vtx-divider--vertical::before,\n.vtx-divider--with-children.vtx-divider--vertical::after {\n  border-top: 0;\n  border-left: thin solid;\n  height: 100%;\n  width: auto;\n}\n\n.vtx-divider--with-children.vtx-divider--vertical .vtx-divider-wrapper {\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: var(--vtx-spacing-2);\n  padding-bottom: var(--vtx-spacing-2);\n}\n");const an=a.default.forwardRef(({textAlign:r="center",orientation:t="horizontal",variant:e="fullWidth",light:o=!1,flexItem:a=!1,children:i,component:l,className:c="",role:s,...v},d)=>{const x=l||(i||"vertical"===t?"div":"hr"),p=s||("hr"!==x?"separator":void 0),m=["vtx-divider",`vtx-divider--${t}`,`vtx-divider--${e}`,o&&"vtx-divider--light",a&&"vtx-divider--flex-item",i&&"vtx-divider--with-children",i&&`vtx-divider--text-${r}`,c].filter(Boolean).join(" "),u="vertical"===t&&"hr"!==x?{"aria-orientation":"vertical"}:{};return n.jsx(x,{ref:d,className:m,role:p,...u,...v,children:i&&n.jsx("span",{className:"vtx-divider-wrapper",children:i})})});an.displayName="Divider";u("/* Header Component Styles */\n\n.vtx-header {\n  display: flex;\n  align-items: center;\n  padding: 0 var(--vtx-spacing-6);\n  background: var(--vtx-background-primary);\n  border-bottom: 1px solid var(--vtx-border-color);\n  height: 64px;\n  gap: var(--vtx-spacing-4);\n  z-index: var(--vtx-z-sticky);\n}\n\n.vtx-header--sticky {\n  position: sticky;\n  top: 0;\n}\n\n/* Toggle Button */\n.vtx-header-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: 0;\n  border: none;\n  border-radius: var(--vtx-radius-md);\n  background: transparent;\n  color: var(--vtx-color-neutral-700);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-toggle:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-header-toggle:active {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.95);\n}\n\n/* Logo */\n.vtx-header-logo {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* Title */\n.vtx-header-title {\n  color: var(--vtx-color-neutral-900);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* Actions */\n.vtx-header-actions {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-3);\n  margin-left: auto;\n  margin-right: var(--vtx-spacing-4);\n}\n\n/* Right Section */\n.vtx-header-right {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  margin-left: auto;\n  padding-left: var(--vtx-spacing-4);\n  border-left: 1px solid var(--vtx-border-color);\n  height: 40px;\n}\n\n/* Icon Button */\n.vtx-header-icon-button {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: 0;\n  border: none;\n  border-radius: var(--vtx-radius-lg);\n  background: transparent;\n  color: var(--vtx-color-neutral-600);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-icon-button:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n  transform: scale(1.05);\n}\n\n.vtx-header-icon-button:active {\n  transform: scale(0.95);\n}\n\n.vtx-header-icon-button--active {\n  background: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n}\n\n/* Notifications */\n.vtx-header-notifications {\n  position: relative;\n}\n\n.vtx-header-notifications-panel {\n  position: absolute;\n  top: calc(100% + 12px);\n  right: 0;\n  width: 380px;\n  max-height: 500px;\n  background: var(--vtx-background-primary);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow:\n    0 4px 20px rgba(0, 0, 0, 0.08),\n    0 0 1px rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n  animation: slideDown 0.2s ease-out;\n  z-index: var(--vtx-z-dropdown);\n}\n\n.vtx-header-notifications-header {\n  padding: var(--vtx-spacing-4);\n  border-bottom: 1px solid var(--vtx-border-color);\n}\n\n.vtx-header-notifications-mark-read {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  border: none;\n  border-radius: var(--vtx-radius-sm);\n  background: transparent;\n  color: var(--vtx-color-primary-600);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-notifications-mark-read:hover {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-notifications-list {\n  max-height: 400px;\n  overflow-y: auto;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar {\n  width: 6px;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar-thumb {\n  background: var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-full);\n}\n\n.vtx-header-notifications-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--vtx-spacing-2);\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\n  color: var(--vtx-color-neutral-400);\n}\n\n.vtx-header-notification-item {\n  position: relative;\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  border-bottom: 1px solid var(--vtx-border-color);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-notification-item:last-child {\n  border-bottom: none;\n}\n\n.vtx-header-notification-item:hover {\n  background: var(--vtx-color-neutral-50);\n}\n\n.vtx-header-notification-item--unread {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-notification-item--unread:hover {\n  background: var(--vtx-color-primary-100);\n}\n\n.vtx-header-notification-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-700);\n  flex-shrink: 0;\n}\n\n.vtx-header-notification-item--info .vtx-header-notification-icon {\n  background: var(--vtx-color-info-50);\n  color: var(--vtx-color-info-600);\n}\n\n.vtx-header-notification-item--success .vtx-header-notification-icon {\n  background: var(--vtx-color-success-50);\n  color: var(--vtx-color-success-600);\n}\n\n.vtx-header-notification-item--warning .vtx-header-notification-icon {\n  background: var(--vtx-color-warning-50);\n  color: var(--vtx-color-warning-600);\n}\n\n.vtx-header-notification-item--error .vtx-header-notification-icon {\n  background: var(--vtx-color-error-50);\n  color: var(--vtx-color-error-600);\n}\n\n.vtx-header-notification-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.vtx-header-notification-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-primary-600);\n  flex-shrink: 0;\n  margin-top: 6px;\n}\n\n/* User Menu */\n.vtx-header-user-menu {\n  position: relative;\n}\n\n.vtx-header-user-button {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\n  border: none;\n  border-radius: var(--vtx-radius-lg);\n  background: transparent;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  height: 40px;\n}\n\n.vtx-header-user-button:hover {\n  background: var(--vtx-color-neutral-100);\n}\n\n.vtx-header-user-button:active {\n  transform: scale(0.98);\n}\n\n.vtx-header-user-button--active {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-user-info {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  text-align: left;\n  min-width: 0;\n}\n\n.vtx-header-user-info > * {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 150px;\n}\n\n.vtx-header-user-dropdown {\n  position: absolute;\n  top: calc(100% + 12px);\n  right: 0;\n  min-width: 220px;\n  background: var(--vtx-background-primary);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow:\n    0 4px 20px rgba(0, 0, 0, 0.08),\n    0 0 1px rgba(0, 0, 0, 0.1);\n  animation: slideDown 0.2s ease-out;\n  z-index: var(--vtx-z-dropdown);\n  overflow: hidden;\n}\n\n/* Slide Down Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Dark Mode */\n[data-theme='dark'] .vtx-header {\n  background: var(--vtx-background-primary);\n  border-bottom-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-header-toggle,\n[data-theme='dark'] .vtx-header-icon-button {\n  color: var(--vtx-color-neutral-300);\n}\n\n[data-theme='dark'] .vtx-header-toggle:hover,\n[data-theme='dark'] .vtx-header-icon-button:hover {\n  background: rgba(255, 255, 255, 0.05);\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-theme='dark'] .vtx-header-icon-button--active {\n  background: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-header-notification-item {\n  border-bottom-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-header-notification-item:hover {\n  background: rgba(255, 255, 255, 0.05);\n}\n\n[data-theme='dark'] .vtx-header-notification-item--unread {\n  background: var(--vtx-color-primary-900);\n}\n\n[data-theme='dark'] .vtx-header-notification-item--unread:hover {\n  background: var(--vtx-color-primary-800);\n}\n\n[data-theme='dark'] .vtx-header-user-button:hover {\n  background: rgba(255, 255, 255, 0.05);\n}\n\n[data-theme='dark'] .vtx-header-user-button--active {\n  background: var(--vtx-color-primary-900);\n}\n\n/* Responsive */\n@media (max-width: 768px) {\n  .vtx-header {\n    padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n    height: 56px;\n  }\n\n  .vtx-header-title {\n    font-size: var(--vtx-font-size-lg);\n  }\n\n  .vtx-header-user-info {\n    display: none;\n  }\n\n  .vtx-header-notifications-panel {\n    width: 320px;\n    max-height: 400px;\n  }\n}\n\n/* Reduced Motion */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-header-toggle,\n  .vtx-header-icon-button,\n  .vtx-header-user-button,\n  .vtx-header-notification-item {\n    transition: none;\n  }\n\n  .vtx-header-notifications-panel,\n  .vtx-header-user-dropdown {\n    animation: none;\n  }\n}\n");const ln=()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:n.jsx("path",{d:"M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 0 1-3.46 0",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),cn=()=>n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:n.jsx("path",{d:"M4 6h16M4 12h16M4 18h16",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),sn=()=>n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:n.jsx("path",{d:"M19 9l-7 7-7-7",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),vn=a.default.forwardRef(({notifications:r,onNotificationClick:t,onMarkAllAsRead:e,onClose:o},a)=>{const i=r.filter(n=>!n.read).length;return n.jsxs("div",{ref:a,className:"vtx-header-notifications-panel",children:[n.jsx("div",{className:"vtx-header-notifications-header",children:n.jsxs(I,{justify:"between",align:"center",children:[n.jsx(W,{variant:"subtitle2",noMargin:!0,children:"Notifications"}),i>0&&e&&n.jsx("button",{className:"vtx-header-notifications-mark-read",onClick:()=>{e(),o()},children:"Mark all as read"})]})}),n.jsx("div",{className:"vtx-header-notifications-list",children:0===r.length?n.jsxs("div",{className:"vtx-header-notifications-empty",children:[n.jsx(ln,{}),n.jsx(W,{variant:"body2",color:"neutral.500",noMargin:!0,children:"No notifications"})]}):r.map(r=>n.jsxs("div",{className:`vtx-header-notification-item ${r.read?"":"vtx-header-notification-item--unread"} ${r.type?`vtx-header-notification-item--${r.type}`:""}`,onClick:()=>{null==t||t(r),o()},children:[r.icon&&n.jsx("div",{className:"vtx-header-notification-icon",children:r.icon}),n.jsxs("div",{className:"vtx-header-notification-content",children:[n.jsx(W,{variant:"body2",noMargin:!0,style:{fontWeight:r.read?400:600},children:r.title}),r.description&&n.jsx(W,{variant:"caption",color:"neutral.600",noMargin:!0,children:r.description}),n.jsx(W,{variant:"caption",color:"neutral.500",noMargin:!0,style:{marginTop:"4px"},children:r.time})]}),!r.read&&n.jsx("div",{className:"vtx-header-notification-dot"})]},r.id))})]})});vn.displayName="NotificationPanel";const dn=a.default.forwardRef(({logo:t,title:e,onToggleSidebar:o,showToggle:a=!0,notifications:i=[],onNotificationClick:l,onMarkAllAsRead:c,userName:s,userSubtitle:v,userAvatar:d,userMenuItems:x=[],actions:p,className:m="",sticky:u=!0},h)=>{const[g,f]=r.useState(!1),[b,w]=r.useState(!1),y=r.useRef(null),k=r.useRef(null),j=r.useRef(null),z=i.filter(n=>!n.read).length;r.useEffect(()=>{const n=n=>{y.current&&!y.current.contains(n.target)&&j.current&&!j.current.contains(n.target)&&f(!1),k.current&&!k.current.contains(n.target)&&w(!1)};return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[]);const N=["vtx-header",u&&"vtx-header--sticky",m].filter(Boolean).join(" ");return n.jsxs("header",{ref:h,className:N,children:[n.jsxs(I,{align:"center",gap:16,style:{flex:1},children:[a&&o&&n.jsx("button",{className:"vtx-header-toggle",onClick:o,"aria-label":"Toggle sidebar",children:n.jsx(cn,{})}),t&&n.jsx("div",{className:"vtx-header-logo",children:t}),e&&n.jsx(W,{variant:"h6",noMargin:!0,className:"vtx-header-title",children:e})]}),p&&n.jsx("div",{className:"vtx-header-actions",children:p}),n.jsxs("div",{className:"vtx-header-right",children:[i&&i.length>0&&n.jsxs("div",{className:"vtx-header-notifications",ref:y,children:[n.jsxs("button",{className:"vtx-header-icon-button "+(g?"vtx-header-icon-button--active":""),onClick:()=>f(!g),"aria-label":"Notifications",children:[n.jsx(ln,{}),z>0&&n.jsx(en,{variant:"error",size:"small",style:{position:"absolute",top:"4px",right:"4px",minWidth:"18px",height:"18px",padding:"0 4px"},children:z>9?"9+":z})]}),g&&n.jsx(vn,{ref:j,notifications:i,onNotificationClick:l,onMarkAllAsRead:c,onClose:()=>f(!1)})]}),s&&n.jsxs("div",{className:"vtx-header-user-menu",ref:k,children:[n.jsxs("button",{className:"vtx-header-user-button "+(b?"vtx-header-user-button--active":""),onClick:()=>w(!b),"aria-label":"User menu",children:[n.jsx(tn,{src:d,alt:s,size:"sm"}),!d&&n.jsx("span",{className:"vtx-header-avatar-fallback",children:s.split(" ").map(n=>n[0]).join("").slice(0,2)}),n.jsxs("div",{className:"vtx-header-user-info",children:[n.jsx(W,{variant:"body2",noMargin:!0,style:{fontWeight:600},children:s}),v&&n.jsx(W,{variant:"caption",color:"neutral.600",noMargin:!0,children:v})]}),n.jsx(sn,{})]}),b&&n.jsx("div",{className:"vtx-header-user-dropdown",children:n.jsx(Y,{items:x,responsive:!1})})]})]})]})});dn.displayName="Header";u("/* SideMenu Component Styles */\n\n.vtx-sidemenu {\n  display: flex;\n  flex-direction: column;\n  height: 100vh;\n  background: var(--vtx-background-primary);\n  border-right: 1px solid var(--vtx-border-color);\n  transition: width 0.3s ease-in-out;\n  position: relative;\n  overflow: hidden;\n}\n\n/* Header Section */\n.vtx-sidemenu-header {\n  padding: var(--vtx-spacing-4);\n  border-bottom: 1px solid var(--vtx-border-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 64px;\n  transition: padding 0.3s ease-in-out;\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-header {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-2);\n}\n\n/* Content Section */\n.vtx-sidemenu-content {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-2);\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-content {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-1);\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar {\n  width: 6px;\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-thumb {\n  background: var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-full);\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-thumb:hover {\n  background: var(--vtx-color-neutral-400);\n}\n\n/* Footer Section */\n.vtx-sidemenu-footer {\n  padding: var(--vtx-spacing-4);\n  border-top: 1px solid var(--vtx-border-color);\n  transition: padding 0.3s ease-in-out;\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-footer {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-2);\n}\n\n/* Menu Item */\n.vtx-sidemenu-item {\n  display: flex;\n  align-items: center;\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-3);\n  margin-bottom: var(--vtx-spacing-1);\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-color-neutral-700);\n  background: transparent;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  user-select: none;\n  text-decoration: none;\n  border-left: 3px solid transparent;\n  position: relative;\n}\n\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--collapsed:hover:not(.vtx-sidemenu-item--disabled):not(\n    .vtx-sidemenu-item--active\n  ) {\n  background-color: var(--vtx-color-primary-50);\n  border-left-color: transparent;\n}\n\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active)\n  .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Active State */\n.vtx-sidemenu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--collapsed.vtx-sidemenu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  box-shadow: 0 2px 8px rgba(59, 130, 246, 0.15);\n  border-left-color: transparent;\n}\n\n.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--active:hover .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Disabled State */\n.vtx-sidemenu-item--disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Collapsed State */\n.vtx-sidemenu-item--collapsed {\n  justify-content: center;\n  padding: var(--vtx-spacing-3);\n  margin: var(--vtx-spacing-2) var(--vtx-spacing-2);\n  border-left: none;\n  position: relative;\n  min-height: 48px;\n  border-radius: var(--vtx-radius-lg);\n  background: transparent;\n}\n\n.vtx-sidemenu-item--collapsed .vtx-sidemenu-item-icon {\n  width: 24px;\n  height: 24px;\n  color: var(--vtx-color-neutral-700) !important;\n}\n\n.vtx-sidemenu-item--collapsed:hover .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600) !important;\n}\n\n.vtx-sidemenu-item--collapsed.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600) !important;\n}\n\n.vtx-sidemenu-item--collapsed .vtx-sidemenu-item-icon svg {\n  stroke: currentColor !important;\n}\n\n/* Active indicator for collapsed state */\n.vtx-sidemenu-item--collapsed::before {\n  content: '';\n  position: absolute;\n  left: 50%;\n  bottom: 4px;\n  transform: translateX(-50%);\n  width: 0;\n  height: 3px;\n  background: var(--vtx-color-primary-600);\n  border-radius: var(--vtx-radius-full);\n  transition: width 0.2s ease-in-out;\n}\n\n.vtx-sidemenu-item--collapsed:hover::before {\n  width: 32px;\n}\n\n.vtx-sidemenu-item--collapsed.vtx-sidemenu-item--active::before {\n  width: 32px;\n}\n\n/* Hover effect for collapsed items */\n.vtx-sidemenu-item--collapsed:hover:not(.vtx-sidemenu-item--disabled) {\n  transform: translateY(-2px);\n  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n}\n\n.vtx-sidemenu-item--collapsed:active:not(.vtx-sidemenu-item--disabled) {\n  transform: translateY(0);\n}\n\n/* Menu Item Icon */\n.vtx-sidemenu-item-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 22px;\n  height: 22px;\n  flex-shrink: 0;\n  color: var(--vtx-color-neutral-700);\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-sidemenu-item-icon svg {\n  width: 100%;\n  height: 100%;\n  stroke: currentColor;\n  fill: none;\n}\n\n/* Badge */\n.vtx-sidemenu-item-badge {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 20px;\n  padding: 0 var(--vtx-spacing-1);\n  background: var(--vtx-color-primary-500);\n  color: white;\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-semibold);\n  border-radius: var(--vtx-radius-full);\n  line-height: 1;\n}\n\n/* Badge in collapsed state - show as dot indicator */\n.vtx-sidemenu-item--collapsed .vtx-sidemenu-item-badge {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  min-width: 10px;\n  height: 10px;\n  padding: 0;\n  font-size: 0;\n  border: 2px solid var(--vtx-background-primary);\n  box-shadow: 0 0 0 1px var(--vtx-color-primary-500);\n}\n\n/* Chevron Icon */\n.vtx-sidemenu-chevron {\n  transition: transform 0.2s ease-in-out;\n  flex-shrink: 0;\n}\n\n.vtx-sidemenu-chevron--open {\n  transform: rotate(180deg);\n}\n\n/* Submenu */\n.vtx-sidemenu-submenu {\n  display: flex;\n  flex-direction: column;\n  margin-left: var(--vtx-spacing-4);\n  margin-top: var(--vtx-spacing-1);\n  margin-bottom: var(--vtx-spacing-2);\n  padding-left: var(--vtx-spacing-4);\n  border-left: 2px solid var(--vtx-color-neutral-200);\n  animation: slideDown 0.2s ease-in-out;\n}\n\n.vtx-sidemenu-submenu .vtx-sidemenu-item {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-sm);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n/* Collapse Toggle Button */\n.vtx-sidemenu-toggle {\n  position: absolute;\n  top: 50%;\n  right: -12px;\n  transform: translateY(-50%);\n  width: 24px;\n  height: 24px;\n  border-radius: var(--vtx-radius-full);\n  border: 1px solid var(--vtx-border-color);\n  background: var(--vtx-background-primary);\n  color: var(--vtx-color-neutral-600);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  z-index: 10;\n}\n\n.vtx-sidemenu-toggle:hover {\n  background: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  border-color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-toggle:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Tooltip for collapsed items */\n.vtx-sidemenu-item--collapsed:hover::after {\n  content: attr(data-label);\n  position: absolute;\n  left: calc(100% + 16px);\n  top: 50%;\n  transform: translateY(-50%);\n  background: var(--vtx-color-neutral-900);\n  color: white;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  border-radius: var(--vtx-radius-md);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  white-space: nowrap;\n  pointer-events: none;\n  z-index: var(--vtx-z-tooltip);\n  box-shadow:\n    0 4px 12px rgba(0, 0, 0, 0.15),\n    0 0 1px rgba(0, 0, 0, 0.2);\n  animation: fadeIn 0.15s ease-in-out;\n}\n\n/* Tooltip arrow */\n.vtx-sidemenu-item--collapsed:hover::after {\n  /* Add arrow using clip-path or border trick */\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(-50%) translateX(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(-50%) translateX(0);\n  }\n}\n\n/* Slide Down Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    max-height: 0;\n    transform: translateY(-4px);\n  }\n  to {\n    opacity: 1;\n    max-height: 1000px;\n    transform: translateY(0);\n  }\n}\n\n/* Dark Mode */\n[data-theme='dark'] .vtx-sidemenu {\n  background: var(--vtx-background-primary);\n  border-right-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item {\n  color: var(--vtx-color-neutral-300);\n}\n\n[data-theme='dark']\n  .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark']\n  .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active)\n  .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--active {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--active:hover {\n  background-color: var(--vtx-color-primary-800);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--active:hover .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--collapsed .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-neutral-300) !important;\n}\n\n[data-theme='dark'] .vtx-sidemenu-item--collapsed:hover .vtx-sidemenu-item-icon,\n[data-theme='dark']\n  .vtx-sidemenu-item--collapsed.vtx-sidemenu-item--active\n  .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-400) !important;\n}\n\n[data-theme='dark'] .vtx-sidemenu-toggle {\n  background: var(--vtx-background-secondary);\n  border-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-sidemenu-toggle:hover {\n  background: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  border-color: var(--vtx-color-primary-400);\n}\n\n/* Responsive - Mobile */\n@media (max-width: 768px) {\n  .vtx-sidemenu {\n    position: fixed;\n    left: 0;\n    top: 0;\n    z-index: var(--vtx-z-modal);\n    transform: translateX(-100%);\n    transition: transform 0.3s ease-in-out;\n  }\n\n  .vtx-sidemenu--mobile-open {\n    transform: translateX(0);\n    box-shadow: var(--vtx-shadow-xl);\n  }\n}\n\n/* Reduced Motion */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-sidemenu,\n  .vtx-sidemenu-item,\n  .vtx-sidemenu-toggle,\n  .vtx-sidemenu-chevron {\n    transition: none;\n  }\n\n  .vtx-sidemenu-submenu {\n    animation: none;\n  }\n}\n");const xn=({isOpen:r})=>n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",className:"vtx-sidemenu-chevron "+(r?"vtx-sidemenu-chevron--open":""),children:n.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),pn=a.default.forwardRef(({label:t,onClick:e,icon:o,disabled:a=!1,active:i=!1,items:l,badge:c,href:s,collapsed:v=!1,level:d=0},x)=>{const[p,m]=r.useState(!1),u=l&&l.length>0,h=n.jsx(n.Fragment,{children:n.jsxs(I,{align:"center",gap:v?0:12,style:{flex:1,minWidth:0},children:[o&&n.jsx("span",{className:"vtx-sidemenu-item-icon",children:o}),!v&&n.jsxs(n.Fragment,{children:[n.jsx(W,{variant:"body2",noMargin:!0,style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t}),c&&n.jsx("span",{className:"vtx-sidemenu-item-badge",children:c}),u&&n.jsx(xn,{isOpen:p})]}),v&&c&&n.jsx("span",{className:"vtx-sidemenu-item-badge",children:c})]})}),g=["vtx-sidemenu-item",i&&"vtx-sidemenu-item--active",a&&"vtx-sidemenu-item--disabled",u&&"vtx-sidemenu-item--has-submenu",v&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" "),f=s?"a":"div";return n.jsxs(n.Fragment,{children:[n.jsx(f,{ref:x,className:g,onClick:n=>{a||(u?(n.preventDefault(),m(!p)):e&&(n.preventDefault(),e()))},onKeyDown:n=>{a||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),u?m(!p):null==e||e())},role:"menuitem",tabIndex:a?-1:0,"aria-disabled":a,"aria-expanded":u?p:void 0,href:s,title:v?t:void 0,"data-label":v?t:void 0,children:h}),u&&p&&!v&&n.jsx("div",{className:"vtx-sidemenu-submenu",children:l.map((r,t)=>n.jsx(pn,{...r,collapsed:v,level:d+1},t))})]})});pn.displayName="SideMenuItem";const mn=a.default.forwardRef(({items:r,collapsed:t=!1,onCollapseToggle:e,className:o="",width:a="260px",collapsedWidth:i="80px",header:l,footer:c},s)=>{const v=t?"number"==typeof i?`${i}px`:i:"number"==typeof a?`${a}px`:a,d=["vtx-sidemenu",t&&"vtx-sidemenu--collapsed",o].filter(Boolean).join(" ");return n.jsxs("aside",{ref:s,className:d,style:{width:v},role:"navigation",children:[l&&n.jsx("div",{className:"vtx-sidemenu-header",children:l}),n.jsx("div",{className:"vtx-sidemenu-content",children:r.map((r,e)=>n.jsx(pn,{...r,collapsed:t},e))}),c&&n.jsx("div",{className:"vtx-sidemenu-footer",children:c}),e&&n.jsx("button",{className:"vtx-sidemenu-toggle",onClick:()=>e(!t),"aria-label":t?"Expand sidebar":"Collapse sidebar",title:t?"Expand sidebar":"Collapse sidebar",children:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:n.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:t?"M9 5l7 7-7 7":"M15 19l-7-7 7-7"})})})]})});mn.displayName="SideMenu";function un({columns:t,data:e,getRowKey:o,striped:a=!1,hoverable:i=!0,bordered:l=!1,size:c="medium",caption:s,emptyMessage:v="No data available",loading:d=!1,loadingContent:x,scrollable:p=!0,maxHeight:m,onRowClick:u,isRowSelected:h,onRowSelect:g,sortable:f=!1,sortConfig:b,onSortChange:w,className:y="",containerClassName:k="",...j}){const[z,N]=r.useState(b||null),S=b||z,C=n=>{if(!f)return;const r=(null==S?void 0:S.key)===n&&"asc"===S.direction?"desc":"asc",t={key:n,direction:r};w?w(n,r):N(t)},_=r.useMemo(()=>{if(!S||!f)return e;const n=t.find(n=>n.key===S.key),r=null==n?void 0:n.sortFn;return[...e].sort((n,t)=>{if(r)return"asc"===S.direction?r(n,t):r(t,n);const e=n[S.key],o=t[S.key];if("string"==typeof e&&"string"==typeof o)return"asc"===S.direction?e.localeCompare(o):o.localeCompare(e);if("number"==typeof e&&"number"==typeof o)return"asc"===S.direction?e-o:o-e;const a=String(e),i=String(o);return"asc"===S.direction?a.localeCompare(i):i.localeCompare(a)})},[e,S,t,f]),T=["vtx-table-container",p&&"vtx-table-container--scrollable",m&&"vtx-table-container--fixed-header",k].filter(Boolean).join(" "),$=["vtx-table",`vtx-table--${c}`,a&&"vtx-table--striped",i&&"vtx-table--hoverable",l&&"vtx-table--bordered",u&&"vtx-table--clickable",y].filter(Boolean).join(" "),L=(n,r,t)=>{g&&g(n,r),null==u||u(n,r,t)},M=r=>{if(!f)return null;const t=(null==S?void 0:S.key)===r,e=null==S?void 0:S.direction;return n.jsx("span",{className:"vtx-table-sort-icon","aria-hidden":"true",children:n.jsxs("svg",{width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",children:[n.jsx("path",{d:"M6 3L9 6H3L6 3Z",fill:t&&"asc"===e?"currentColor":"#ccc"}),n.jsx("path",{d:"M6 9L3 6H9L6 9Z",fill:t&&"desc"===e?"currentColor":"#ccc"})]})})};return n.jsx("div",{className:T,style:{maxHeight:m},children:n.jsxs("table",{className:$,...j,children:[s&&n.jsx("caption",{className:"vtx-table-caption",children:s}),n.jsx("thead",{className:"vtx-table-header",children:n.jsx("tr",{children:t.map(r=>{const t=f&&!1!==r.sortable,e=["vtx-table-header-cell",t&&"vtx-table-header-cell--sortable",r.sticky&&`vtx-table-header-cell--sticky-${r.sticky}`,r.headerClassName].filter(Boolean).join(" ");return n.jsx("th",{className:e,style:{width:r.width,minWidth:r.minWidth,maxWidth:r.maxWidth,textAlign:r.align||"left"},onClick:()=>t&&C(r.key),role:t?"button":void 0,tabIndex:t?0:void 0,onKeyDown:n=>{!t||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),C(r.key))},"aria-sort":(null==S?void 0:S.key)===r.key?"asc"===S.direction?"ascending":"descending":void 0,children:n.jsxs("span",{className:"vtx-table-header-content",children:[r.header,t&&M(r.key)]})},r.key)})})}),n.jsx("tbody",{className:"vtx-table-body",children:d?n.jsx("tr",{children:n.jsx("td",{colSpan:t.length,className:"vtx-table-loading",children:x||n.jsx("span",{className:"vtx-table-loading-spinner",children:"Loading..."})})}):0===_.length?n.jsx("tr",{children:n.jsx("td",{colSpan:t.length,className:"vtx-table-empty",children:v})}):_.map((r,e)=>{const a=null==h?void 0:h(r,e),i=["vtx-table-row",a&&"vtx-table-row--selected"].filter(Boolean).join(" ");return n.jsx("tr",{className:i,onClick:n=>L(r,e,n),role:u||g?"button":void 0,tabIndex:u||g?0:void 0,"aria-selected":a,onKeyDown:n=>{!u&&!g||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),L(r,e,n))},children:t.map(t=>{const o=["vtx-table-cell",t.sticky&&`vtx-table-cell--sticky-${t.sticky}`,t.className].filter(Boolean).join(" ");return n.jsx("td",{className:o,style:{textAlign:t.align||"left",width:t.width,minWidth:t.minWidth,maxWidth:t.maxWidth},children:t.render?t.render(r,e):r[t.key]},t.key)})},o(r,e))})})]})})}u(".vtx-table-container {\n  width: 100%;\n  overflow-x: auto;\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n}\n\n.vtx-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-family: var(--vtx-font-family-sans);\n  background-color: white;\n}\n\n.vtx-table-caption {\n  padding: var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-lg);\n  font-weight: var(--vtx-font-weight-semibold);\n  text-align: left;\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Header */\n.vtx-table-header {\n  background-color: var(--vtx-color-neutral-50);\n  border-bottom: 2px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table-header-cell {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-semibold);\n  color: var(--vtx-color-neutral-700);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  white-space: nowrap;\n}\n\n/* Body */\n.vtx-table-body {\n  background-color: white;\n}\n\n.vtx-table-row {\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n  transition: background-color var(--vtx-transition-fast);\n}\n\n.vtx-table-row:last-child {\n  border-bottom: none;\n}\n\n.vtx-table-cell {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Sizes */\n.vtx-table--small .vtx-table-header-cell,\n.vtx-table--small .vtx-table-cell {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-table--large .vtx-table-header-cell,\n.vtx-table--large .vtx-table-cell {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Striped */\n.vtx-table--striped .vtx-table-row:nth-child(even) {\n  background-color: var(--vtx-color-neutral-50);\n}\n\n/* Hoverable */\n.vtx-table--hoverable .vtx-table-row:hover {\n  background-color: var(--vtx-color-primary-50);\n}\n\n/* Empty state */\n.vtx-table-empty {\n  padding: var(--vtx-spacing-12) var(--vtx-spacing-4);\n  text-align: center;\n  color: var(--vtx-color-neutral-500);\n  font-style: italic;\n}\n"),un.displayName="Table";u("/* Grid Base Styles */\n.vtx-grid {\n  box-sizing: border-box;\n}\n\n/* Container Styles */\n.vtx-grid-container {\n  display: flex;\n  flex-wrap: wrap;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Item Styles */\n.vtx-grid-item {\n  margin: 0;\n  box-sizing: border-box;\n}\n\n/* Direction */\n.vtx-grid-direction-row {\n  flex-direction: row;\n}\n\n.vtx-grid-direction-row-reverse {\n  flex-direction: row-reverse;\n}\n\n.vtx-grid-direction-column {\n  flex-direction: column;\n}\n\n.vtx-grid-direction-column-reverse {\n  flex-direction: column-reverse;\n}\n\n/* Wrap */\n.vtx-grid-wrap-nowrap {\n  flex-wrap: nowrap;\n}\n\n.vtx-grid-wrap-wrap {\n  flex-wrap: wrap;\n}\n\n.vtx-grid-wrap-wrap-reverse {\n  flex-wrap: wrap-reverse;\n}\n\n/* Spacing - Container */\n.vtx-grid-spacing-0 {\n  margin: 0;\n}\n\n.vtx-grid-spacing-0 > .vtx-grid-item {\n  padding: 0;\n}\n\n.vtx-grid-spacing-1 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-spacing-1 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-spacing-2 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-spacing-2 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-spacing-3 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-spacing-3 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-spacing-4 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-spacing-4 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-spacing-5 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n.vtx-grid-spacing-5 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n.vtx-grid-spacing-6 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 6);\n}\n\n.vtx-grid-spacing-6 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-spacing-7 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 7);\n}\n\n.vtx-grid-spacing-7 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3.5);\n}\n\n.vtx-grid-spacing-8 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 8);\n}\n\n.vtx-grid-spacing-8 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-spacing-9 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 9);\n}\n\n.vtx-grid-spacing-9 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4.5);\n}\n\n.vtx-grid-spacing-10 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 10);\n}\n\n.vtx-grid-spacing-10 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n/* Row Spacing */\n.vtx-grid-row-spacing-1 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n}\n\n.vtx-grid-row-spacing-1 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-row-spacing-2 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n}\n\n.vtx-grid-row-spacing-2 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-row-spacing-3 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n}\n\n.vtx-grid-row-spacing-3 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-row-spacing-4 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n}\n\n.vtx-grid-row-spacing-4 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-row-spacing-5 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n}\n\n.vtx-grid-row-spacing-5 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n/* Column Spacing */\n.vtx-grid-column-spacing-1 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-column-spacing-1 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-column-spacing-2 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-column-spacing-2 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-column-spacing-3 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-column-spacing-3 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-column-spacing-4 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-column-spacing-4 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-column-spacing-5 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n.vtx-grid-column-spacing-5 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n/* XS (Extra Small) - 0px and up */\n.vtx-grid-xs-auto {\n  flex-grow: 0;\n  flex-basis: auto;\n  max-width: none;\n}\n\n.vtx-grid-xs {\n  flex-grow: 1;\n  flex-basis: 0;\n  max-width: 100%;\n}\n\n.vtx-grid-xs-1 {\n  flex-grow: 0;\n  flex-basis: 8.333333%;\n  max-width: 8.333333%;\n}\n\n.vtx-grid-xs-2 {\n  flex-grow: 0;\n  flex-basis: 16.666667%;\n  max-width: 16.666667%;\n}\n\n.vtx-grid-xs-3 {\n  flex-grow: 0;\n  flex-basis: 25%;\n  max-width: 25%;\n}\n\n.vtx-grid-xs-4 {\n  flex-grow: 0;\n  flex-basis: 33.333333%;\n  max-width: 33.333333%;\n}\n\n.vtx-grid-xs-5 {\n  flex-grow: 0;\n  flex-basis: 41.666667%;\n  max-width: 41.666667%;\n}\n\n.vtx-grid-xs-6 {\n  flex-grow: 0;\n  flex-basis: 50%;\n  max-width: 50%;\n}\n\n.vtx-grid-xs-7 {\n  flex-grow: 0;\n  flex-basis: 58.333333%;\n  max-width: 58.333333%;\n}\n\n.vtx-grid-xs-8 {\n  flex-grow: 0;\n  flex-basis: 66.666667%;\n  max-width: 66.666667%;\n}\n\n.vtx-grid-xs-9 {\n  flex-grow: 0;\n  flex-basis: 75%;\n  max-width: 75%;\n}\n\n.vtx-grid-xs-10 {\n  flex-grow: 0;\n  flex-basis: 83.333333%;\n  max-width: 83.333333%;\n}\n\n.vtx-grid-xs-11 {\n  flex-grow: 0;\n  flex-basis: 91.666667%;\n  max-width: 91.666667%;\n}\n\n.vtx-grid-xs-12 {\n  flex-grow: 0;\n  flex-basis: 100%;\n  max-width: 100%;\n}\n\n/* SM (Small) - 600px and up */\n@media (min-width: 600px) {\n  .vtx-grid-sm-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-sm {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-sm-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-sm-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-sm-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-sm-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-sm-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-sm-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-sm-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-sm-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-sm-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-sm-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-sm-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-sm-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* MD (Medium) - 960px and up */\n@media (min-width: 960px) {\n  .vtx-grid-md-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-md {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-md-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-md-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-md-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-md-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-md-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-md-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-md-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-md-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-md-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-md-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-md-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-md-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* LG (Large) - 1280px and up */\n@media (min-width: 1280px) {\n  .vtx-grid-lg-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-lg {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-lg-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-lg-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-lg-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-lg-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-lg-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-lg-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-lg-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-lg-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-lg-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-lg-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-lg-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-lg-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* XL (Extra Large) - 1920px and up */\n@media (min-width: 1920px) {\n  .vtx-grid-xl-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-xl {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-xl-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-xl-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-xl-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-xl-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-xl-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-xl-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-xl-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-xl-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-xl-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-xl-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-xl-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-xl-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n");const hn=a.default.forwardRef(({container:r=!1,item:t=!1,spacing:e,rowSpacing:o,columnSpacing:a,xs:i,sm:l,md:c,lg:s,xl:v,justifyContent:d,alignItems:x,alignContent:p,direction:m="row",wrap:u="wrap",className:h="",children:g,style:f,...b},w)=>{const y=["vtx-grid",r&&"vtx-grid-container",t&&"vtx-grid-item",r&&void 0!==e&&`vtx-grid-spacing-${e}`,r&&void 0!==o&&`vtx-grid-row-spacing-${o}`,r&&void 0!==a&&`vtx-grid-column-spacing-${a}`,void 0!==i&&"vtx-grid-xs"+(!0===i?"":"auto"===i?"-auto":`-${i}`),void 0!==l&&"vtx-grid-sm"+(!0===l?"":"auto"===l?"-auto":`-${l}`),void 0!==c&&"vtx-grid-md"+(!0===c?"":"auto"===c?"-auto":`-${c}`),void 0!==s&&"vtx-grid-lg"+(!0===s?"":"auto"===s?"-auto":`-${s}`),void 0!==v&&"vtx-grid-xl"+(!0===v?"":"auto"===v?"-auto":`-${v}`),r&&"row"!==m&&`vtx-grid-direction-${m}`,r&&"wrap"!==u&&`vtx-grid-wrap-${u}`,h].filter(Boolean).join(" "),k={...f};return r&&(d&&(k.justifyContent=d),x&&(k.alignItems=x),p&&(k.alignContent=p)),n.jsx("div",{ref:w,className:y,style:Object.keys(k).length>0?k:void 0,...b,children:g})});hn.displayName="Grid";u("/**\r\n * VTX UI Design System - Base CSS Variables\r\n * \r\n * This file defines all CSS custom properties with default values from our design tokens.\r\n * These variables can be overridden by users through ThemeProvider or custom CSS.\r\n * \r\n * Usage:\r\n * - Import this file in your app entry point or ThemeProvider\r\n * - Override variables using :root selector or data-theme attributes\r\n * - All components use these variables with fallback values\r\n */\r\n\r\n:root {\r\n  /* ============================================\r\n   * COLOR TOKENS\r\n   * ============================================ */\r\n\r\n  /* Primary Colors */\r\n  --vtx-color-primary-50: #eff6ff;\r\n  --vtx-color-primary-100: #dbeafe;\r\n  --vtx-color-primary-200: #bfdbfe;\r\n  --vtx-color-primary-300: #93c5fd;\r\n  --vtx-color-primary-400: #60a5fa;\r\n  --vtx-color-primary-500: #3b82f6;\r\n  --vtx-color-primary-600: #2563eb;\r\n  --vtx-color-primary-700: #1d4ed8;\r\n  --vtx-color-primary-800: #1e40af;\r\n  --vtx-color-primary-900: #1e3a8a;\r\n\r\n  /* Secondary Colors */\r\n  --vtx-color-secondary-50: #f5f3ff;\r\n  --vtx-color-secondary-100: #ede9fe;\r\n  --vtx-color-secondary-200: #ddd6fe;\r\n  --vtx-color-secondary-300: #c4b5fd;\r\n  --vtx-color-secondary-400: #a78bfa;\r\n  --vtx-color-secondary-500: #8b5cf6;\r\n  --vtx-color-secondary-600: #7c3aed;\r\n  --vtx-color-secondary-700: #6d28d9;\r\n  --vtx-color-secondary-800: #5b21b6;\r\n  --vtx-color-secondary-900: #4c1d95;\r\n\r\n  /* Neutral Colors */\r\n  --vtx-color-neutral-50: #fafafa;\r\n  --vtx-color-neutral-100: #f5f5f5;\r\n  --vtx-color-neutral-200: #e5e5e5;\r\n  --vtx-color-neutral-300: #d4d4d4;\r\n  --vtx-color-neutral-400: #a3a3a3;\r\n  --vtx-color-neutral-500: #737373;\r\n  --vtx-color-neutral-600: #525252;\r\n  --vtx-color-neutral-700: #404040;\r\n  --vtx-color-neutral-800: #262626;\r\n  --vtx-color-neutral-900: #171717;\r\n\r\n  /* Success Colors */\r\n  --vtx-color-success-50: #f0fdf4;\r\n  --vtx-color-success-500: #22c55e;\r\n  --vtx-color-success-600: #16a34a;\r\n  --vtx-color-success-700: #15803d;\r\n\r\n  /* Warning Colors */\r\n  --vtx-color-warning-50: #fffbeb;\r\n  --vtx-color-warning-500: #f59e0b;\r\n  --vtx-color-warning-600: #d97706;\r\n  --vtx-color-warning-700: #b45309;\r\n\r\n  /* Error Colors */\r\n  --vtx-color-error-50: #fef2f2;\r\n  --vtx-color-error-500: #ef4444;\r\n  --vtx-color-error-600: #dc2626;\r\n  --vtx-color-error-700: #b91c1c;\r\n\r\n  /* Info Colors */\r\n  --vtx-color-info-50: #eff6ff;\r\n  --vtx-color-info-500: #3b82f6;\r\n  --vtx-color-info-600: #2563eb;\r\n  --vtx-color-info-700: #1d4ed8;\r\n\r\n  /* ============================================\r\n   * SPACING TOKENS\r\n   * ============================================ */\r\n  --vtx-spacing-0: 0;\r\n  --vtx-spacing-1: 0.25rem; /* 4px */\r\n  --vtx-spacing-2: 0.5rem; /* 8px */\r\n  --vtx-spacing-3: 0.75rem; /* 12px */\r\n  --vtx-spacing-4: 1rem; /* 16px */\r\n  --vtx-spacing-5: 1.25rem; /* 20px */\r\n  --vtx-spacing-6: 1.5rem; /* 24px */\r\n  --vtx-spacing-8: 2rem; /* 32px */\r\n  --vtx-spacing-10: 2.5rem; /* 40px */\r\n  --vtx-spacing-12: 3rem; /* 48px */\r\n  --vtx-spacing-16: 4rem; /* 64px */\r\n  --vtx-spacing-20: 5rem; /* 80px */\r\n  --vtx-spacing-24: 6rem; /* 96px */\r\n\r\n  /* ============================================\r\n   * TYPOGRAPHY TOKENS\r\n   * ============================================ */\r\n\r\n  /* Font Families */\r\n  --vtx-font-family-sans:\r\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\r\n  --vtx-font-family-mono:\r\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\r\n\r\n  /* Font Sizes */\r\n  --vtx-font-size-xs: 0.75rem; /* 12px */\r\n  --vtx-font-size-sm: 0.875rem; /* 14px */\r\n  --vtx-font-size-base: 1rem; /* 16px */\r\n  --vtx-font-size-lg: 1.125rem; /* 18px */\r\n  --vtx-font-size-xl: 1.25rem; /* 20px */\r\n  --vtx-font-size-2xl: 1.5rem; /* 24px */\r\n  --vtx-font-size-3xl: 1.875rem; /* 30px */\r\n  --vtx-font-size-4xl: 2.25rem; /* 36px */\r\n\r\n  /* Font Weights */\r\n  --vtx-font-weight-normal: 400;\r\n  --vtx-font-weight-medium: 500;\r\n  --vtx-font-weight-semibold: 600;\r\n  --vtx-font-weight-bold: 700;\r\n\r\n  /* Line Heights */\r\n  --vtx-line-height-tight: 1.25;\r\n  --vtx-line-height-normal: 1.5;\r\n  --vtx-line-height-relaxed: 1.75;\r\n\r\n  /* ============================================\r\n   * TEXT VARIANT TOKENS\r\n   * ============================================ */\r\n\r\n  /* Heading Variants */\r\n  --vtx-text-h1-font-size: 3.75rem; /* 60px */\r\n  --vtx-text-h1-font-weight: 700;\r\n  --vtx-text-h1-line-height: 1.2;\r\n  --vtx-text-h1-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h2-font-size: 3rem; /* 48px */\r\n  --vtx-text-h2-font-weight: 700;\r\n  --vtx-text-h2-line-height: 1.25;\r\n  --vtx-text-h2-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h3-font-size: 2.25rem; /* 36px */\r\n  --vtx-text-h3-font-weight: 600;\r\n  --vtx-text-h3-line-height: 1.3;\r\n  --vtx-text-h3-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h4-font-size: 1.875rem; /* 30px */\r\n  --vtx-text-h4-font-weight: 600;\r\n  --vtx-text-h4-line-height: 1.35;\r\n  --vtx-text-h4-letter-spacing: 0;\r\n\r\n  --vtx-text-h5-font-size: 1.5rem; /* 24px */\r\n  --vtx-text-h5-font-weight: 600;\r\n  --vtx-text-h5-line-height: 1.4;\r\n  --vtx-text-h5-letter-spacing: 0;\r\n\r\n  --vtx-text-h6-font-size: 1.25rem; /* 20px */\r\n  --vtx-text-h6-font-weight: 600;\r\n  --vtx-text-h6-line-height: 1.5;\r\n  --vtx-text-h6-letter-spacing: 0;\r\n\r\n  /* Body Text Variants */\r\n  --vtx-text-body1-font-size: 1rem; /* 16px - DEFAULT WEBSITE FONT SIZE */\r\n  --vtx-text-body1-font-weight: 400;\r\n  --vtx-text-body1-line-height: 1.5;\r\n  --vtx-text-body1-letter-spacing: 0;\r\n\r\n  --vtx-text-body2-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-body2-font-weight: 400;\r\n  --vtx-text-body2-line-height: 1.5;\r\n  --vtx-text-body2-letter-spacing: 0;\r\n\r\n  /* Subtitle Variants */\r\n  --vtx-text-subtitle1-font-size: 1.125rem; /* 18px */\r\n  --vtx-text-subtitle1-font-weight: 500;\r\n  --vtx-text-subtitle1-line-height: 1.5;\r\n  --vtx-text-subtitle1-letter-spacing: 0;\r\n\r\n  --vtx-text-subtitle2-font-size: 1rem; /* 16px */\r\n  --vtx-text-subtitle2-font-weight: 500;\r\n  --vtx-text-subtitle2-line-height: 1.5;\r\n  --vtx-text-subtitle2-letter-spacing: 0;\r\n\r\n  /* Utility Text Variants */\r\n  --vtx-text-caption-font-size: 0.75rem; /* 12px */\r\n  --vtx-text-caption-font-weight: 400;\r\n  --vtx-text-caption-line-height: 1.5;\r\n  --vtx-text-caption-letter-spacing: 0.025em;\r\n\r\n  --vtx-text-overline-font-size: 0.75rem; /* 12px */\r\n  --vtx-text-overline-font-weight: 600;\r\n  --vtx-text-overline-line-height: 1.5;\r\n  --vtx-text-overline-letter-spacing: 0.1em;\r\n\r\n  --vtx-text-button-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-button-font-weight: 600;\r\n  --vtx-text-button-line-height: 1.5;\r\n  --vtx-text-button-letter-spacing: 0.025em;\r\n\r\n  --vtx-text-label-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-label-font-weight: 500;\r\n  --vtx-text-label-line-height: 1.5;\r\n  --vtx-text-label-letter-spacing: 0;\r\n\r\n  /* ============================================\r\n   * BORDER RADIUS TOKENS\r\n   * ============================================ */\r\n  --vtx-radius-none: 0;\r\n  --vtx-radius-sm: 0.125rem; /* 2px */\r\n  --vtx-radius-base: 0.25rem; /* 4px */\r\n  --vtx-radius-md: 0.375rem; /* 6px */\r\n  --vtx-radius-lg: 0.5rem; /* 8px */\r\n  --vtx-radius-xl: 0.75rem; /* 12px */\r\n  --vtx-radius-2xl: 1rem; /* 16px */\r\n  --vtx-radius-full: 9999px;\r\n\r\n  /* ============================================\r\n   * SHADOW TOKENS\r\n   * ============================================ */\r\n  --vtx-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\r\n  --vtx-shadow-base: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-none: none;\r\n\r\n  /* ============================================\r\n   * TRANSITION TOKENS\r\n   * ============================================ */\r\n  --vtx-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n  --vtx-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);\r\n  --vtx-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);\r\n\r\n  /* ============================================\r\n  /* Z-INDEX TOKENS\r\n   * ============================================ */\r\n  --vtx-z-dropdown: 1000;\r\n  --vtx-z-sticky: 1100;\r\n  --vtx-z-modal: 1200;\r\n  --vtx-z-tooltip: 1300;\r\n  --vtx-z-notification: 1400;\r\n\r\n  /* ============================================\r\n   * SEMANTIC COLOR ALIASES\r\n   * ============================================ */\r\n  /* Text colors */\r\n  --vtx-text-primary: var(--vtx-color-neutral-900);\r\n  --vtx-text-secondary: var(--vtx-color-neutral-600);\r\n  --vtx-text-tertiary: var(--vtx-color-neutral-500);\r\n  --vtx-text-disabled: var(--vtx-color-neutral-400);\r\n\r\n  /* Background colors */\r\n  --vtx-background-primary: #ffffff;\r\n  --vtx-background-secondary: var(--vtx-color-neutral-50);\r\n  --vtx-background-hover: var(--vtx-color-neutral-100);\r\n  --vtx-background-active: var(--vtx-color-neutral-200);\r\n\r\n  /* Border colors */\r\n  --vtx-border-color: var(--vtx-color-neutral-300);\r\n  --vtx-border-color-light: var(--vtx-color-neutral-200);\r\n  --vtx-border-color-dark: var(--vtx-color-neutral-400);\r\n\r\n  /* Additional common aliases */\r\n  --vtx-transition-normal: var(--vtx-transition-base);\r\n}\r\n\r\n/* ============================================\r\n * DARK THEME OVERRIDES\r\n * ============================================ */\r\n[data-theme='dark'] {\r\n  /* Invert neutral colors for dark mode */\r\n  --vtx-color-neutral-50: #171717;\r\n  --vtx-color-neutral-100: #262626;\r\n  --vtx-color-neutral-200: #404040;\r\n  --vtx-color-neutral-300: #525252;\r\n  --vtx-color-neutral-400: #737373;\r\n  --vtx-color-neutral-500: #a3a3a3;\r\n  --vtx-color-neutral-600: #d4d4d4;\r\n  --vtx-color-neutral-700: #e5e5e5;\r\n  --vtx-color-neutral-800: #f5f5f5;\r\n  --vtx-color-neutral-900: #fafafa;\r\n\r\n  /* Dark mode semantic colors */\r\n  --vtx-text-primary: var(--vtx-color-neutral-50);\r\n  --vtx-text-secondary: var(--vtx-color-neutral-400);\r\n  --vtx-text-tertiary: var(--vtx-color-neutral-500);\r\n  --vtx-text-disabled: var(--vtx-color-neutral-600);\r\n\r\n  --vtx-background-primary: #0a0a0a;\r\n  --vtx-background-secondary: var(--vtx-color-neutral-900);\r\n  --vtx-background-hover: rgba(255, 255, 255, 0.05);\r\n  --vtx-background-active: rgba(255, 255, 255, 0.1);\r\n\r\n  --vtx-border-color: var(--vtx-color-neutral-700);\r\n  --vtx-border-color-light: var(--vtx-color-neutral-800);\r\n  --vtx-border-color-dark: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* ============================================\r\n * GLOBAL RESETS\r\n * ============================================ */\r\n*,\r\n*::before,\r\n*::after {\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Set root font size for rem calculations */\r\nhtml {\r\n  font-size: 16px; /* 1rem = 16px base */\r\n}\r\n\r\n/* Set base font styles for entire website */\r\nbody {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base); /* 1rem = 16px */\r\n  line-height: var(--vtx-line-height-normal); /* 1.5 */\r\n  font-weight: var(--vtx-font-weight-normal); /* 400 */\r\n  color: var(--vtx-color-neutral-900);\r\n  -webkit-font-smoothing: antialiased;\r\n  -moz-osx-font-smoothing: grayscale;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n/* Apply default font to all elements unless overridden */\r\n*:not(code):not(pre):not(kbd):not(samp) {\r\n  font-family: inherit;\r\n}\r\n\r\n/* Reset default margins and ensure consistent font inheritance */\r\nh1,\r\nh2,\r\nh3,\r\nh4,\r\nh5,\r\nh6,\r\np,\r\nblockquote,\r\npre,\r\nul,\r\nol,\r\nli,\r\ndl,\r\ndt,\r\ndd,\r\nfigure,\r\nfigcaption,\r\ntable,\r\nthead,\r\ntbody,\r\ntfoot,\r\ntr,\r\nth,\r\ntd {\r\n  margin: 0;\r\n  font-family: inherit;\r\n  font-size: inherit;\r\n  line-height: inherit;\r\n  font-weight: inherit;\r\n}\r\n\r\n/* Ensure form elements inherit typography */\r\nbutton,\r\ninput,\r\noptgroup,\r\nselect,\r\ntextarea {\r\n  font-family: inherit;\r\n  font-size: inherit;\r\n  line-height: inherit;\r\n}\r\n"),exports.Accordion=L,exports.AccordionItem=$,exports.Alert=E,exports.Avatar=tn,exports.Badge=en,exports.Button=h,exports.Card=on,exports.Checkbox=g,exports.CheckboxGroup=f,exports.Chip=N,exports.Divider=an,exports.Flex=I,exports.Grid=hn,exports.Header=dn,exports.Input=z,exports.Menu=Y,exports.MenuItem=V,exports.Modal=P,exports.MultiSelect=S,exports.Radio=C,exports.RadioGroup=_,exports.Select=T,exports.SideMenu=mn,exports.SideMenuItem=pn,exports.Table=un,exports.Text=W,exports.ThemeProvider=p,exports.Toast=G,exports.ToastContainer=({children:r,...t})=>n.jsxs(Z,{children:[r,n.jsx(nn,{...t})]}),exports.Tooltip=rn,exports.generateCSSVariables=v,exports.injectCSSVariables=d,exports.toast=Q,exports.tokens=s,exports.useBodyScrollLock=y,exports.useClickOutside=(n,t)=>{r.useEffect(()=>{const r=r=>{const e=null==n?void 0:n.current;e&&!e.contains(r.target)&&t(r)};return document.addEventListener("mousedown",r),document.addEventListener("touchstart",r),()=>{document.removeEventListener("mousedown",r),document.removeEventListener("touchstart",r)}},[n,t])},exports.useDebounce=(n,t)=>{const[e,o]=r.useState(n);return r.useEffect(()=>{const r=setTimeout(()=>{o(n)},t);return()=>{clearTimeout(r)}},[n,t]),e},exports.useEscapeKey=w,exports.useFocusTrap=b,exports.useId=j,exports.useThemeContext=m,exports.useToast=U;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react/jsx-runtime"),r=require("react"),e=require("react-icons/fi"),t=require("react-dom");function a(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}function o(n){if(n&&n.__esModule)return n;var r=Object.create(null);return n&&Object.keys(n).forEach(function(e){if("default"!==e){var t=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(r,e,t.get?t:{enumerable:!0,get:function(){return n[e]}})}}),r.default=n,Object.freeze(r)}var i=a(r),l=o(r);const c=[50,100,200,300,400,500,600,700,800,900];function s(n){const r={};for(const[e,t]of Object.entries(n))"string"==typeof t?(r[e]={},c.forEach(n=>{r[e][n]=t})):"object"==typeof t&&null!==t&&(r[e]=t);return r}const d={colors:{primary:{50:"#eff6ff",100:"#dbeafe",200:"#bfdbfe",300:"#93c5fd",400:"#60a5fa",500:"#3b82f6",600:"#2563eb",700:"#1d4ed8",800:"#1e40af",900:"#1e3a8a"},secondary:{50:"#f5f3ff",100:"#ede9fe",200:"#ddd6fe",300:"#c4b5fd",400:"#a78bfa",500:"#8b5cf6",600:"#7c3aed",700:"#6d28d9",800:"#5b21b6",900:"#4c1d95"},neutral:{50:"#fafafa",100:"#f5f5f5",200:"#e5e5e5",300:"#d4d4d4",400:"#a3a3a3",500:"#737373",600:"#525252",700:"#404040",800:"#262626",900:"#171717"},success:{50:"#f0fdf4",500:"#22c55e",600:"#16a34a",700:"#15803d"},warning:{50:"#fffbeb",500:"#f59e0b",600:"#d97706",700:"#b45309"},error:{50:"#fef2f2",500:"#ef4444",600:"#dc2626",700:"#b91c1c"},info:{50:"#eff6ff",500:"#3b82f6",600:"#2563eb",700:"#1d4ed8"}},spacing:{0:"0",1:"0.25rem",2:"0.5rem",3:"0.75rem",4:"1rem",5:"1.25rem",6:"1.5rem",8:"2rem",10:"2.5rem",12:"3rem",16:"4rem",20:"5rem",24:"6rem"},typography:{fontFamily:{sans:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',mono:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace'},fontSize:{xs:"0.75rem",sm:"0.875rem",base:"1rem",lg:"1.125rem",xl:"1.25rem","2xl":"1.5rem","3xl":"1.875rem","4xl":"2.25rem","5xl":"3rem","6xl":"3.75rem","7xl":"4.5rem","8xl":"6rem","9xl":"8rem"},fontWeight:{thin:"100",extralight:"200",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},lineHeight:{none:"1",tight:"1.25",snug:"1.375",normal:"1.5",relaxed:"1.625",loose:"2"},letterSpacing:{tighter:"-0.05em",tight:"-0.025em",normal:"0",wide:"0.025em",wider:"0.05em",widest:"0.1em"},textVariants:{h1:{fontSize:"3.75rem",fontWeight:"700",lineHeight:"1.2",letterSpacing:"-0.025em"},h2:{fontSize:"3rem",fontWeight:"700",lineHeight:"1.25",letterSpacing:"-0.025em"},h3:{fontSize:"2.25rem",fontWeight:"600",lineHeight:"1.3",letterSpacing:"-0.025em"},h4:{fontSize:"1.875rem",fontWeight:"600",lineHeight:"1.35",letterSpacing:"0"},h5:{fontSize:"1.5rem",fontWeight:"600",lineHeight:"1.4",letterSpacing:"0"},h6:{fontSize:"1.25rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0"},body1:{fontSize:"1rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0"},body2:{fontSize:"0.875rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0"},subtitle1:{fontSize:"1.125rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"},subtitle2:{fontSize:"1rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"},caption:{fontSize:"0.75rem",fontWeight:"400",lineHeight:"1.5",letterSpacing:"0.025em"},overline:{fontSize:"0.75rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0.1em",textTransform:"uppercase"},button:{fontSize:"0.875rem",fontWeight:"600",lineHeight:"1.5",letterSpacing:"0.025em"},label:{fontSize:"0.875rem",fontWeight:"500",lineHeight:"1.5",letterSpacing:"0"}}},borderRadius:{none:"0",sm:"0.125rem",base:"0.25rem",md:"0.375rem",lg:"0.5rem",xl:"0.75rem","2xl":"1rem",full:"9999px"},shadows:{sm:"0 1px 2px 0 rgb(0 0 0 / 0.05)",base:"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",md:"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",lg:"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",xl:"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",none:"none"},transitions:{fast:"150ms cubic-bezier(0.4, 0, 0.2, 1)",base:"200ms cubic-bezier(0.4, 0, 0.2, 1)",slow:"300ms cubic-bezier(0.4, 0, 0.2, 1)"},zIndex:{dropdown:1e3,sticky:1100,modal:1200,tooltip:1300,notification:1400}};function x(){const n=[];return Object.entries(d.colors).forEach(([r,e])=>{"object"==typeof e?Object.entries(e).forEach(([e,t])=>{n.push(`  --vtx-color-${r}-${e}: ${t};`)}):n.push(`  --vtx-color-${r}: ${e};`)}),Object.entries(d.spacing).forEach(([r,e])=>{n.push(`  --vtx-spacing-${r}: ${e};`)}),Object.entries(d.typography.fontFamily).forEach(([r,e])=>{n.push(`  --vtx-font-family-${r}: ${e};`)}),Object.entries(d.typography.fontSize).forEach(([r,e])=>{n.push(`  --vtx-font-size-${r}: ${e};`)}),Object.entries(d.typography.fontWeight).forEach(([r,e])=>{n.push(`  --vtx-font-weight-${r}: ${e};`)}),Object.entries(d.typography.lineHeight).forEach(([r,e])=>{n.push(`  --vtx-line-height-${r}: ${e};`)}),Object.entries(d.typography.letterSpacing).forEach(([r,e])=>{n.push(`  --vtx-letter-spacing-${r}: ${e};`)}),Object.entries(d.typography.textVariants).forEach(([r,e])=>{Object.entries(e).forEach(([e,t])=>{const a=e.replace(/([A-Z])/g,"-$1").toLowerCase();n.push(`  --vtx-text-${r}-${a}: ${t};`)})}),Object.entries(d.borderRadius).forEach(([r,e])=>{n.push(`  --vtx-radius-${r}: ${e};`)}),Object.entries(d.shadows).forEach(([r,e])=>{n.push(`  --vtx-shadow-${r}: ${e};`)}),Object.entries(d.transitions).forEach(([r,e])=>{n.push(`  --vtx-transition-${r}: ${e};`)}),Object.entries(d.zIndex).forEach(([r,e])=>{n.push(`  --vtx-z-${r}: ${e};`)}),n.join("\n")}function v(){if("undefined"==typeof document)return;const n="vtx-ui-variables";let r=document.getElementById(n);r||(r=document.createElement("style"),r.id=n,document.head.appendChild(r));const e=x();r.textContent=`:root {\n${e}\n}`}const p=i.default.createContext(void 0),m=i.default.forwardRef(({children:r,initialMode:e="light",customTokens:t,defaultSize:a="md",...o},l)=>{const[c,x]=i.default.useState(e),[m,h]=i.default.useState(a),u=i.default.useMemo(()=>{if(!t)return{tokens:d,mode:c,defaultSize:m};let n={...d,...t};return t.colors&&(n.colors={...d.colors,...s(t.colors)}),{tokens:n,mode:c,defaultSize:m}},[t,c,m]);i.default.useEffect(()=>{document.documentElement.setAttribute("data-theme",c),t&&v()},[c,t]);const g=i.default.useMemo(()=>({theme:u,setMode:x,setDefaultSize:h}),[u]);return n.jsx(p.Provider,{value:g,children:n.jsx("div",{ref:l,...o,children:r})})});m.displayName="ThemeProvider";const h=()=>{const n=i.default.useContext(p);if(!n)throw new Error("useThemeContext must be used within a ThemeProvider");return n},u="dynamic-styles";function g(){let n=document.getElementById(u);return n||(n=document.createElement("style"),n.id=u,document.head.appendChild(n)),n}const f=new Set,b={0:"0",1:"0.25rem",2:"0.5rem",3:"0.75rem",4:"1rem",5:"1.25rem",6:"1.5rem",8:"2rem",10:"2.5rem",12:"3rem",16:"4rem",20:"5rem",24:"6rem",32:"8rem",40:"10rem",48:"12rem",56:"14rem",64:"16rem",px:"1px",.5:"0.125rem",1.5:"0.375rem",2.5:"0.625rem",3.5:"0.875rem"},w={m:"margin",mt:"margin-top",mr:"margin-right",mb:"margin-bottom",ml:"margin-left",mx:"margin-left, margin-right",my:"margin-top, margin-bottom",p:"padding",pt:"padding-top",pr:"padding-right",pb:"padding-bottom",pl:"padding-left",px:"padding-left, padding-right",py:"padding-top, padding-bottom",w:"width",h:"height",fs:"font-size",lh:"line-height",ls:"letter-spacing",gap:"gap",rounded:"border-radius"};function y(r){return e=>{const t=(e.className||"").split(" ").map(n=>function(n){let r=n.match(/^([a-z]+)-\[(.+)\]$/);if(r){const n=r[1],e=r[2],t=`${n}-${e.replace(/[^a-z0-9]/gi,"")}`,a=w[n];if(a){let r;return r="mx"===n?`.${t} { margin-left: ${e}; margin-right: ${e}; }`:"my"===n?`.${t} { margin-top: ${e}; margin-bottom: ${e}; }`:"px"===n?`.${t} { padding-left: ${e}; padding-right: ${e}; }`:"py"===n?`.${t} { padding-top: ${e}; padding-bottom: ${e}; }`:`.${t} { ${a}: ${e}; }`,f.has(r)||(g().appendChild(document.createTextNode(r)),f.add(r)),t}}if(r=n.match(/^([a-z]+)-(.+)$/),r){const n=r[1],e=r[2],t=w[n],a=b[e];if(t&&a){const r=`${n}-${e.replace(/[^a-z0-9]/gi,"")}`;let o;return o="mx"===n?`.${r} { margin-left: ${a}; margin-right: ${a}; }`:"my"===n?`.${r} { margin-top: ${a}; margin-bottom: ${a}; }`:"px"===n?`.${r} { padding-left: ${a}; padding-right: ${a}; }`:"py"===n?`.${r} { padding-top: ${a}; padding-bottom: ${a}; }`:`.${r} { ${t}: ${a}; }`,f.has(o)||(g().appendChild(document.createTextNode(o)),f.add(o)),r}}return n}(n)).join(" ");return n.jsx(r,{...e,className:t})}}function k(n,r){void 0===r&&(r={});var e=r.insertAt;if(n&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.styleSheet?a.styleSheet.cssText=n:a.appendChild(document.createTextNode(n))}}k(".vtx-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: var(--vtx-spacing-2);\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  border: 1px solid transparent;\r\n  border-radius: var(--vtx-radius-md);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-base);\r\n  white-space: nowrap;\r\n  user-select: none;\r\n  text-decoration: none;\r\n  position: relative;\r\n}\r\n\r\n.vtx-button:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-button:disabled,\r\n.vtx-button[aria-disabled='true'] {\r\n  cursor: not-allowed;\r\n  opacity: 0.6;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-button--sm {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-sm);\r\n  min-height: 32px;\r\n}\r\n\r\n.vtx-button--md {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-base);\r\n  min-height: 40px;\r\n}\r\n\r\n.vtx-button--lg {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-lg);\r\n  min-height: 48px;\r\n}\r\n\r\n/* Variants */\r\n.vtx-button--primary {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--primary:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-button--primary:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-primary-800);\r\n}\r\n\r\n.vtx-button--secondary {\r\n  background-color: var(--vtx-color-secondary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-secondary-700);\r\n}\r\n\r\n.vtx-button--secondary:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-secondary-800);\r\n}\r\n\r\n.vtx-button--outline {\r\n  background-color: transparent;\r\n  border-color: var(--vtx-color-neutral-300);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-neutral-50);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-button--ghost {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-button--danger {\r\n  background-color: var(--vtx-color-error-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--danger:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-error-700);\r\n}\r\n\r\n.vtx-button--success {\r\n  background-color: var(--vtx-color-success-600, #16a34a);\r\n  color: white;\r\n}\r\n\r\n.vtx-button--success:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-success-700, #15803d);\r\n}\r\n\r\n.vtx-button--success:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-success-800, #166534);\r\n}\r\n\r\n.vtx-button--warning {\r\n  background-color: var(--vtx-color-warning-500, #f59e42);\r\n  color: var(--vtx-color-warning-contrast, #1a1a1a);\r\n}\r\n\r\n.vtx-button--warning:hover:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-warning-600, #d97706);\r\n}\r\n\r\n.vtx-button--warning:active:not(:disabled):not([aria-disabled='true']) {\r\n  background-color: var(--vtx-color-warning-700, #b45309);\r\n}\r\n\r\n/* Full width */\r\n.vtx-button--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Loading state */\r\n.vtx-button--loading .vtx-button__content {\r\n  visibility: hidden;\r\n}\r\n\r\n.vtx-button__spinner {\r\n  position: absolute;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-button__spinner-icon {\r\n  width: 1em;\r\n  height: 1em;\r\n  animation: vtx-spin 0.6s linear infinite;\r\n}\r\n\r\n.vtx-button__spinner-circle {\r\n  stroke: currentColor;\r\n  stroke-linecap: round;\r\n  stroke-dasharray: 50;\r\n  stroke-dashoffset: 25;\r\n}\r\n\r\n@keyframes vtx-spin {\r\n  from {\r\n    transform: rotate(0deg);\r\n  }\r\n  to {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n/* Icons */\r\n.vtx-button__icon-left,\r\n.vtx-button__icon-right {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-button__icon-left {\r\n  margin-left: calc(var(--vtx-spacing-1) * -1);\r\n}\r\n\r\n.vtx-button__icon-right {\r\n  margin-right: calc(var(--vtx-spacing-1) * -1);\r\n}\r\n\r\n/* Dark/Light text override */\r\n.vtx-button--dark-text {\r\n  color: var(--vtx-color-dark-text, var(--vtx-color-neutral-900)) !important;\r\n}\r\n.vtx-button--light-text {\r\n  color: var(--vtx-color-light-text, var(--vtx-color-white)) !important;\r\n}\r\n");const j=i.default.forwardRef(({children:r,variant:e="primary",size:t,fullWidth:a=!1,loading:o=!1,disabled:i=!1,leftIcon:l,rightIcon:c,iconOnly:s=!1,loadingText:d,asLink:x=!1,href:v,target:p,rel:m,className:u="",type:g="button",...f},b)=>{const{theme:w}=h(),y=["vtx-button",`vtx-button--${e}`,`vtx-button--${t||w.defaultSize||"md"}`,a&&"vtx-button--full-width",o&&"vtx-button--loading",s&&"vtx-button--icon-only",!0===f.darkText&&"vtx-button--dark-text",!1===f.darkText&&"vtx-button--light-text",u].filter(Boolean).join(" "),k=f.style?{...f.style}:{};f.textColor&&(k.color=f.textColor);const j=n.jsxs(n.Fragment,{children:[o&&n.jsx("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:n.jsx("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:n.jsx("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!o&&l&&n.jsx("span",{className:"vtx-button__icon-left",children:l}),!s&&n.jsx("span",{className:"vtx-button__content",children:o&&d?d:r}),s&&!o&&r,!o&&c&&n.jsx("span",{className:"vtx-button__icon-right",children:c})]});return x&&v?n.jsx("a",{ref:b,href:v,target:p,rel:"_blank"===p?"noopener noreferrer":m,className:y,"aria-disabled":i||o,style:k,...f,children:j}):n.jsx("button",{ref:b,type:g,className:y,disabled:i||o,"aria-busy":o,"aria-disabled":i||o,style:k,...f,children:j})});j.displayName="Button";const _=y(j);k("/* Checkbox Base Styles */\r\n.vtx-checkbox {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n/* Label Container */\r\n.vtx-checkbox-label {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2);\r\n  cursor: pointer;\r\n  user-select: none;\r\n  position: relative;\r\n}\r\n\r\n/* Wrapper for input and visual checkbox */\r\n.vtx-checkbox-wrapper {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Hidden input */\r\n.vtx-checkbox-input {\r\n  position: absolute;\r\n  opacity: 0;\r\n  width: 0;\r\n  height: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Visual checkbox box */\r\n.vtx-checkbox-box {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: var(--vtx-checkbox-size, 20px);\r\n  height: var(--vtx-checkbox-size, 20px);\r\n  border: var(--vtx-checkbox-border-width, 2px) solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-checkbox-border-radius, 4px);\r\n  background-color: white;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Icons */\r\n.vtx-checkbox-icon {\r\n  position: absolute;\r\n  width: 100%;\r\n  height: 100%;\r\n  color: white;\r\n  opacity: 0;\r\n  transform: scale(0.5);\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n/* Checked state */\r\n.vtx-checkbox-input:checked + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-input:checked + .vtx-checkbox-box .vtx-checkbox-icon--check {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Indeterminate state */\r\n.vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-input:indeterminate + .vtx-checkbox-box .vtx-checkbox-icon--indeterminate {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Hover state */\r\n.vtx-checkbox-label:hover .vtx-checkbox-box {\r\n  border-color: var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-checkbox-label:hover .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox-label:hover .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-checkbox-hover-color, var(--vtx-color-primary-700));\r\n  border-color: var(--vtx-checkbox-hover-color, var(--vtx-color-primary-700));\r\n}\r\n\r\n/* Focus state */\r\n.vtx-checkbox-input:focus-visible + .vtx-checkbox-box {\r\n  outline: 2px solid var(--vtx-checkbox-color, var(--vtx-color-primary-600));\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Disabled state */\r\n.vtx-checkbox--disabled .vtx-checkbox-label {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--disabled .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-neutral-300);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-label:hover .vtx-checkbox-box {\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n/* Error state */\r\n.vtx-checkbox--error .vtx-checkbox-box {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--error .vtx-checkbox-input:indeterminate + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-label:hover .vtx-checkbox-input:checked + .vtx-checkbox-box,\r\n.vtx-checkbox--error\r\n  .vtx-checkbox-label:hover\r\n  .vtx-checkbox-input:indeterminate\r\n  + .vtx-checkbox-box {\r\n  background-color: var(--vtx-color-error-700);\r\n  border-color: var(--vtx-color-error-700);\r\n}\r\n\r\n/* Label text */\r\n.vtx-checkbox-label-text {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-checkbox--disabled .vtx-checkbox-label-text {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Helper text */\r\n.vtx-checkbox-helper-text {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-600);\r\n  margin-left: calc(var(--vtx-checkbox-size, 20px) + var(--vtx-spacing-2));\r\n}\r\n\r\n.vtx-checkbox--error .vtx-checkbox-helper-text {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Size variants */\r\n.vtx-checkbox--sm {\r\n  --vtx-checkbox-size: 16px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--sm .vtx-checkbox-label-text {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-checkbox--sm .vtx-checkbox-helper-text {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.vtx-checkbox--md {\r\n  --vtx-checkbox-size: 20px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--lg {\r\n  --vtx-checkbox-size: 24px;\r\n  --vtx-checkbox-border-width: 2px;\r\n}\r\n\r\n.vtx-checkbox--lg .vtx-checkbox-label-text {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Variants */\r\n.vtx-checkbox--primary {\r\n  --vtx-checkbox-color: var(--vtx-color-primary-600);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-checkbox--secondary {\r\n  --vtx-checkbox-color: var(--vtx-color-secondary-600, var(--vtx-color-neutral-600));\r\n  --vtx-checkbox-hover-color: var(--vtx-color-secondary-700, var(--vtx-color-neutral-700));\r\n}\r\n\r\n.vtx-checkbox--success {\r\n  --vtx-checkbox-color: var(--vtx-color-success-600, #16a34a);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-success-700, #15803d);\r\n}\r\n\r\n.vtx-checkbox--error {\r\n  --vtx-checkbox-color: var(--vtx-color-error-600, #dc2626);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-error-700, #b91c1c);\r\n}\r\n\r\n.vtx-checkbox--warning {\r\n  --vtx-checkbox-color: var(--vtx-color-warning-600, #d97706);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-warning-700, #b45309);\r\n}\r\n\r\n.vtx-checkbox--info {\r\n  --vtx-checkbox-color: var(--vtx-color-info-600, #2563eb);\r\n  --vtx-checkbox-hover-color: var(--vtx-color-info-700, #1d4ed8);\r\n}\r\n");const z=i.default.forwardRef(({checked:e,indeterminate:t=!1,disabled:a=!1,label:o,size:i,variant:l="primary",error:c=!1,helperText:s,onChange:d,className:x="",inputClassName:v="",id:p,...m},u)=>{const{theme:g}=h(),f=i||g.defaultSize||"md",b=r.useId(),w=p||b,y=["vtx-checkbox",`vtx-checkbox--${f}`,`vtx-checkbox--${l}`,a&&"vtx-checkbox--disabled",c&&"vtx-checkbox--error",x].filter(Boolean).join(" "),k=["vtx-checkbox-input",v].filter(Boolean).join(" "),j=r.useRef(null);return r.useImperativeHandle(u,()=>j.current),r.useEffect(()=>{j.current&&(j.current.indeterminate=t)},[t]),n.jsxs("div",{className:y,children:[n.jsxs("label",{className:"vtx-checkbox-label",htmlFor:w,children:[n.jsxs("span",{className:"vtx-checkbox-wrapper",children:[n.jsx("input",{ref:j,type:"checkbox",id:w,className:k,checked:e,disabled:a,onChange:d,...m}),n.jsxs("span",{className:"vtx-checkbox-box",children:[n.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),n.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:n.jsx("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),o&&n.jsx("span",{className:"vtx-checkbox-label-text",children:o})]}),s&&n.jsx("div",{className:"vtx-checkbox-helper-text",children:s})]})});z.displayName="Checkbox";const N=y(z);k("/* CheckboxGroup Base Styles */\n.vtx-checkbox-group {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n}\n\n/* Group Label */\n.vtx-checkbox-group-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-checkbox-group--disabled .vtx-checkbox-group-label {\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-checkbox-group--error .vtx-checkbox-group-label {\n  color: var(--vtx-color-error-600);\n}\n\n/* Options Container */\n.vtx-checkbox-group-options {\n  display: flex;\n  gap: var(--vtx-spacing-3);\n}\n\n.vtx-checkbox-group--vertical .vtx-checkbox-group-options {\n  flex-direction: column;\n}\n\n.vtx-checkbox-group--horizontal .vtx-checkbox-group-options {\n  flex-direction: row;\n  flex-wrap: wrap;\n}\n\n/* Helper Text */\n.vtx-checkbox-group-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-checkbox-group--error .vtx-checkbox-group-helper-text {\n  color: var(--vtx-color-error-600);\n}\n");const C=i.default.forwardRef(({label:e,options:t,value:a,defaultValue:o,onChange:i,disabled:l=!1,error:c=!1,helperText:s,orientation:d="vertical",size:x,className:v="",...p},m)=>{const{theme:u}=h(),g=x||u.defaultSize||"md",[f,b]=r.useState(o||[]),w=void 0!==a,y=w?a:f,k=["vtx-checkbox-group",`vtx-checkbox-group--${d}`,c&&"vtx-checkbox-group--error",l&&"vtx-checkbox-group--disabled",v].filter(Boolean).join(" ");return n.jsxs("div",{ref:m,className:k,...p,children:[e&&n.jsx("div",{className:"vtx-checkbox-group-label",children:e}),n.jsx("div",{className:"vtx-checkbox-group-options",children:t.map(r=>{const e=y.includes(r.value),t=l||r.disabled;return n.jsx(N,{label:r.label,checked:e,disabled:t,error:c,size:g,onChange:n=>((n,r)=>{const e=r?[...y,n]:y.filter(r=>r!==n);w||b(e),null==i||i(e)})(r.value,n.target.checked)},r.value)})}),s&&n.jsx("div",{className:"vtx-checkbox-group-helper-text",children:s})]})});C.displayName="CheckboxGroup";const S=y(C),M=r=>n.jsxs("svg",{className:"vtx-multiselect-icon-spinner",width:r.size||16,height:r.size||16,viewBox:"0 0 16 16",fill:"none",children:[n.jsx("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),n.jsx("path",{className:"vtx-multiselect-icon-spinner-path",fill:"currentColor",d:"M8 2C4.686 2 2 4.686 2 8h2c0-2.21 1.79-4 4-4V2z"})]}),T=e.FiCheck,$=r=>n.jsx(e.FiX,{size:r.size||12,"aria-hidden":"true"}),I=e.FiChevronDown,D=e.FiPlus,A=e.FiMinus,E=e.FiBell,R=e.FiMenu,L=e.FiChevronUp,B=e.FiChevronLeft,O=e.FiChevronRight,F=e.FiCheckCircle,W=e.FiAlertCircle,P=e.FiAlertTriangle,V=e.FiInfo,H=e.FiMinusCircle,Y=e.FiDownload,q=e.FiPackage,X=e.FiShoppingBag,U=e.FiShare2,G=e.FiEye,K=e.FiCreditCard,Q=e.FiMessageCircle,Z=e.FiMapPin,J=e.FiPhone,nn=e.FiTruck,rn=e.FiX,en=e.FiCornerUpLeft,tn=e.FiRefreshCw,an=e.FiStar,on=e.FiSearch,ln=(n,e)=>{r.useEffect(()=>{if(!e)return;const r=n.current;if(!r)return;const t=r.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(0===t.length)return;const a=t[0],o=t[t.length-1],i=n=>{"Tab"===n.key&&(n.shiftKey?document.activeElement===a&&(null==o||o.focus(),n.preventDefault()):document.activeElement===o&&(null==a||a.focus(),n.preventDefault()))};return null==a||a.focus(),r.addEventListener("keydown",i),()=>{r.removeEventListener("keydown",i)}},[n,e])},cn=n=>{r.useEffect(()=>{const r=r=>{"Escape"===r.key&&n()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[n])},sn=n=>{r.useEffect(()=>{if(!n)return;const r=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=r}},[n])};let dn=0;const xn=(n="vtx")=>{const[e]=r.useState(()=>`${n}-${++dn}`);return e};k(".vtx-input-wrapper {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n.vtx-input-wrapper--full-width {\n  width: 100%;\n}\n\n.vtx-input-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  color: var(--vtx-color-neutral-700);\n  line-height: var(--vtx-line-height-tight);\n}\n\n.vtx-input-label__required {\n  color: var(--vtx-color-error-600);\n  margin-left: var(--vtx-spacing-1);\n}\n\n.vtx-input-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  background-color: white;\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  transition: all var(--vtx-transition-base);\n}\n\n.vtx-input-container:focus-within {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 0;\n  border-color: var(--vtx-color-primary-500);\n}\n\n.vtx-input-container--error {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-input-container--error:focus-within {\n  outline-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-input-container--disabled {\n  background-color: var(--vtx-color-neutral-100);\n  cursor: not-allowed;\n}\n\n/* Sizes */\n.vtx-input-container--small {\n  min-height: 32px;\n}\n\n.vtx-input-container--medium {\n  min-height: 40px;\n}\n\n.vtx-input-container--large {\n  min-height: 48px;\n}\n\n.vtx-input {\n  flex: 1;\n  width: 100%;\n  min-width: 0;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n  background: transparent;\n  border: none;\n  outline: none;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n}\n\n.vtx-input::placeholder {\n  color: var(--vtx-color-neutral-400);\n}\n\n.vtx-input:disabled {\n  cursor: not-allowed;\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-input-container--small .vtx-input {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-input-container--large .vtx-input {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Icons */\n.vtx-input-icon {\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n  color: var(--vtx-color-neutral-500);\n  pointer-events: none;\n}\n\n.vtx-input-icon--left {\n  padding-left: var(--vtx-spacing-3);\n}\n\n.vtx-input-icon--right {\n  padding-right: var(--vtx-spacing-3);\n}\n\n.vtx-input-container--with-left-icon .vtx-input {\n  padding-left: var(--vtx-spacing-1);\n}\n\n.vtx-input-container--with-right-icon .vtx-input {\n  padding-right: var(--vtx-spacing-1);\n}\n\n/* Helper and error text */\n.vtx-input-helper,\n.vtx-input-error {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  margin: 0;\n}\n\n.vtx-input-helper {\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-input-error {\n  color: var(--vtx-color-error-600);\n}\n");const vn=i.default.forwardRef(({label:r,helperText:e,error:t,success:a,size:o="medium",fullWidth:i=!1,leftIcon:l,rightIcon:c,clearable:s=!1,onClear:d,showCount:x=!1,className:v="",wrapperClassName:p="",labelClassName:m="",inputClassName:h="",prefix:u,suffix:g,id:f,disabled:b=!1,required:w=!1,value:y,maxLength:k,...j},_)=>{const z=xn("input"),N=f||z,C=`${N}-helper`,S=`${N}-error`,M=`${N}-success`,T=Boolean(t),I=Boolean(a)&&!T,D=s&&y&&String(y).length>0&&!b,A=[e&&!t&&!a&&C,t&&S,a&&M].filter(Boolean).join(" "),E=["vtx-input-wrapper",i&&"vtx-input-wrapper--full-width",p].filter(Boolean).join(" "),R=["vtx-input-container",`vtx-input-container--${o}`,T&&"vtx-input-container--error",I&&"vtx-input-container--success",b&&"vtx-input-container--disabled",(l||u)&&"vtx-input-container--with-left-element",(c||g||D)&&"vtx-input-container--with-right-element",v].filter(Boolean).join(" "),L=y?String(y).length:0,B=x&&k;return n.jsxs("div",{className:E,children:[r&&n.jsxs("label",{htmlFor:N,className:`vtx-input-label ${m}`.trim(),children:[r,w&&n.jsxs("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{className:R,children:[l&&n.jsx("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:l}),u&&n.jsx("span",{className:"vtx-input-prefix","aria-hidden":"true",children:u}),n.jsx("input",{ref:_,id:N,className:`vtx-input ${h}`.trim(),disabled:b,required:w,value:y,maxLength:k,"aria-invalid":T,"aria-describedby":A||void 0,...j}),g&&n.jsx("span",{className:"vtx-input-suffix","aria-hidden":"true",children:g}),D&&n.jsx("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==d||d()},"aria-label":"Clear input",tabIndex:-1,children:n.jsx($,{size:16})}),c&&!D&&n.jsx("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:c})]}),e&&!t&&!a&&n.jsx("p",{id:C,className:"vtx-input-helper",children:e}),t&&n.jsx("p",{id:S,className:"vtx-input-error",role:"alert",children:t}),a&&n.jsx("p",{id:M,className:"vtx-input-success",role:"status",children:a}),B&&n.jsxs("p",{className:"vtx-input-counter","aria-live":"polite",children:[L," / ",k]})]})});vn.displayName="Input";const pn=y(vn);k("/* Chip Component Styles */\r\n\r\n.vtx-chip {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 0.375rem;\r\n  padding: 0.25rem 0.75rem;\r\n  border-radius: 16px;\r\n  font-family: var(--vtx-font-family);\r\n  font-size: 0.875rem;\r\n  line-height: 1.25rem;\r\n  font-weight: 500;\r\n  border: 1px solid transparent;\r\n  transition: all 0.2s ease;\r\n  cursor: default;\r\n  white-space: nowrap;\r\n  max-width: 100%;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-chip--sm {\r\n  padding: 0.125rem 0.5rem;\r\n  font-size: 0.75rem;\r\n  line-height: 1rem;\r\n  gap: 0.25rem;\r\n  border-radius: 12px;\r\n}\r\n\r\n.vtx-chip--md {\r\n  padding: 0.25rem 0.75rem;\r\n  font-size: 0.875rem;\r\n  line-height: 1.25rem;\r\n  gap: 0.375rem;\r\n  border-radius: 16px;\r\n}\r\n\r\n.vtx-chip--lg {\r\n  padding: 0.375rem 1rem;\r\n  font-size: 1rem;\r\n  line-height: 1.5rem;\r\n  gap: 0.5rem;\r\n  border-radius: 20px;\r\n}\r\n\r\n/* Variants */\r\n.vtx-chip--filled {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-border);\r\n}\r\n\r\n.vtx-chip--light {\r\n  background-color: var(--vtx-color-primary-light, rgba(59, 130, 246, 0.1));\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: transparent;\r\n}\r\n\r\n/* Color Variants */\r\n.vtx-chip--primary.vtx-chip--filled {\r\n  background-color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--primary.vtx-chip--outlined {\r\n  color: var(--vtx-color-primary-600);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--primary.vtx-chip--light {\r\n  background-color: var(--vtx-color-primary-light, rgba(59, 130, 246, 0.1));\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--filled {\r\n  background-color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--outlined {\r\n  color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--success.vtx-chip--light {\r\n  background-color: var(--vtx-color-success-light, rgba(34, 197, 94, 0.1));\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--filled {\r\n  background-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--outlined {\r\n  color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--error.vtx-chip--light {\r\n  background-color: var(--vtx-color-error-light, rgba(239, 68, 68, 0.1));\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--filled {\r\n  background-color: var(--vtx-color-warning-600);\r\n  border-color: var(--vtx-color-warning-600);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--outlined {\r\n  color: var(--vtx-color-warning-600);\r\n  border-color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-chip--warning.vtx-chip--light {\r\n  background-color: var(--vtx-color-warning-light, rgba(251, 191, 36, 0.1));\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--filled {\r\n  background-color: var(--vtx-color-info-600);\r\n  border-color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--outlined {\r\n  color: var(--vtx-color-info-600);\r\n  border-color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--info.vtx-chip--light {\r\n  background-color: var(--vtx-color-info-light, rgba(6, 182, 212, 0.1));\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--filled {\r\n  background-color: var(--vtx-color-neutral-600);\r\n  border-color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--outlined {\r\n  color: var(--vtx-color-neutral-900);\r\n  border-color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-chip--default.vtx-chip--light {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* Label */\r\n.vtx-chip__label {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n/* Avatar */\r\n.vtx-chip__avatar {\r\n  width: 1.5rem;\r\n  height: 1.5rem;\r\n  border-radius: 50%;\r\n  object-fit: cover;\r\n  flex-shrink: 0;\r\n  margin-left: -0.25rem;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__avatar {\r\n  width: 1rem;\r\n  height: 1rem;\r\n  margin-left: -0.125rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__avatar {\r\n  width: 2rem;\r\n  height: 2rem;\r\n  margin-left: -0.375rem;\r\n}\r\n\r\n/* Icon */\r\n.vtx-chip__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__icon svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--medium .vtx-chip__icon svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__icon svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n}\r\n\r\n/* Delete Button */\r\n.vtx-chip__delete {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0;\r\n  margin: 0;\r\n  margin-right: -0.25rem;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  color: inherit;\r\n  opacity: 0.6;\r\n  transition:\r\n    opacity 0.2s ease,\r\n    transform 0.15s ease;\r\n  border-radius: 50%;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__delete {\r\n  margin-right: -0.125rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__delete {\r\n  margin-right: -0.375rem;\r\n}\r\n\r\n.vtx-chip__delete:hover {\r\n  opacity: 1;\r\n  transform: scale(1.1);\r\n}\r\n\r\n.vtx-chip__delete:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.vtx-chip__delete:focus-visible {\r\n  outline: 2px solid currentColor;\r\n  outline-offset: 2px;\r\n  opacity: 1;\r\n}\r\n\r\n.vtx-chip--small .vtx-chip__delete svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--medium .vtx-chip__delete svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--large .vtx-chip__delete svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n}\r\n\r\n/* Clickable */\r\n.vtx-chip--clickable {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-chip--clickable:hover {\r\n  opacity: 0.85;\r\n  transform: translateY(-1px);\r\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-chip--clickable:active {\r\n  transform: translateY(0);\r\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-chip--clickable:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-600);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Disabled */\r\n.vtx-chip--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Dark mode support */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-chip--outlined {\r\n    border-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .vtx-chip--default.vtx-chip--light {\r\n    background-color: var(--vtx-color-neutral-700);\r\n    color: var(--vtx-color-neutral-50);\r\n  }\r\n}\r\n");const mn=i.default.forwardRef(({label:r,size:e="md",variant:t="filled",color:a="default",icon:o,avatar:i,onDelete:l,onClick:c,disabled:s=!1,className:d="","aria-label":x,"data-testid":v},p)=>{const m=["vtx-chip",`vtx-chip--${e}`,`vtx-chip--${t}`,`vtx-chip--${a}`,c&&!s&&"vtx-chip--clickable",s&&"vtx-chip--disabled",d].filter(Boolean).join(" ");return n.jsxs("div",{ref:p,className:m,onClick:n=>{!s&&c&&c(n)},onKeyDown:n=>{s||!c||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),c(n))},role:c?"button":void 0,tabIndex:c&&!s?0:void 0,"aria-label":x||r,"aria-disabled":s,"data-testid":v,children:[i&&n.jsx("img",{src:i,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),o&&!i&&n.jsx("span",{className:"vtx-chip__icon","aria-hidden":"true",children:o}),n.jsx("span",{className:"vtx-chip__label",children:r}),l&&n.jsx("button",{type:"button",className:"vtx-chip__delete",onClick:n=>{n.stopPropagation(),!s&&l&&l(n)},onKeyDown:n=>{"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),n.stopPropagation(),!s&&l&&l(n))},disabled:s,"aria-label":`Remove ${r}`,tabIndex:-1,children:n.jsx($,{size:16})})]})});mn.displayName="Chip";const hn=y(mn);k("/* MultiSelect Component Styles */\r\n\r\n.vtx-multiselect-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.375rem;\r\n  font-family: var(--vtx-font-family);\r\n}\r\n\r\n.vtx-multiselect-wrapper--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Label */\r\n.vtx-multiselect-label {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  color: var(--vtx-color-neutral-700);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-multiselect-label__required {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Container */\r\n.vtx-multiselect-container {\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  background-color: white;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-container:focus-within {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 0;\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Sizes */\r\n.vtx-multiselect-container--sm {\r\n  min-height: 2rem;\r\n}\r\n\r\n.vtx-multiselect-container--md {\r\n  min-height: 2.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg {\r\n  min-height: 3rem;\r\n}\r\n\r\n/* States */\r\n.vtx-multiselect-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-multiselect-container--error:focus-within {\r\n  outline-color: var(--vtx-color-error-600);\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-multiselect-container--success {\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-multiselect-container--success:focus-within {\r\n  outline-color: var(--vtx-color-success-600);\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-multiselect-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-multiselect-container--open {\r\n  border-bottom-left-radius: 0;\r\n  border-bottom-right-radius: 0;\r\n}\r\n\r\n/* Input Area */\r\n.vtx-multiselect-input-area {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-wrap: wrap;\r\n  gap: 0.375rem;\r\n  padding: 0.5rem 2.5rem 0.5rem 0.75rem;\r\n  min-height: inherit;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-input-area {\r\n  padding: 0.25rem 2rem 0.25rem 0.5rem;\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-input-area {\r\n  padding: 0.625rem 3rem 0.625rem 1rem;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--disabled .vtx-multiselect-input-area {\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Chips Container */\r\n.vtx-multiselect-chips {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 0.375rem;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-chips {\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-chips {\r\n  gap: 0.5rem;\r\n}\r\n\r\n/* Placeholder */\r\n.vtx-multiselect-placeholder {\r\n  color: var(--vtx-color-neutral-500);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-placeholder {\r\n  font-size: 0.8125rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-placeholder {\r\n  font-size: 1rem;\r\n}\r\n\r\n/* Icon */\r\n.vtx-multiselect-icon {\r\n  position: absolute;\r\n  right: var(--vtx-spacing-3);\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  pointer-events: none;\r\n  color: var(--vtx-color-neutral-500);\r\n  transition: transform var(--vtx-transition-base);\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-multiselect-container--sm .vtx-multiselect-icon {\r\n  right: 0.5rem;\r\n}\r\n\r\n.vtx-multiselect-container--lg .vtx-multiselect-icon {\r\n  right: 1rem;\r\n}\r\n\r\n.vtx-multiselect-container--open .vtx-multiselect-icon {\r\n  transform: translateY(-50%) rotate(180deg);\r\n}\r\n\r\n/* Dropdown */\r\n.vtx-multiselect-dropdown {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: -1px;\r\n  right: -1px;\r\n  max-height: 18rem;\r\n  overflow-y: auto;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-primary-500);\r\n  border-top: none;\r\n  border-bottom-left-radius: var(--vtx-radius-md);\r\n  border-bottom-right-radius: var(--vtx-radius-md);\r\n  box-shadow: var(--vtx-shadow-md);\r\n  z-index: var(--vtx-z-index-dropdown);\r\n}\r\n\r\n/* Search Input */\r\n.vtx-multiselect-search {\r\n  position: sticky;\r\n  top: 0;\r\n  padding: var(--vtx-spacing-3);\r\n  background-color: white;\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  z-index: 1;\r\n}\r\n\r\n.vtx-multiselect-search input {\r\n  width: 100%;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-family: var(--vtx-font-family-sans);\r\n  outline: none;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-search input:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 0;\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Options List */\r\n.vtx-multiselect-options {\r\n  padding: 0.25rem;\r\n}\r\n\r\n/* Option Group */\r\n.vtx-multiselect-optgroup {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  color: var(--vtx-color-neutral-600);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-top: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-multiselect-optgroup:first-child {\r\n  margin-top: 0;\r\n}\r\n\r\n/* Option Item */\r\n.vtx-multiselect-option {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-fast);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-multiselect-option:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-multiselect-option:active {\r\n  background-color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-multiselect-option--selected {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-700);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n.vtx-multiselect-option--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Checkbox Style (Style 1) */\r\n.vtx-multiselect-checkbox {\r\n  width: 1.125rem;\r\n  height: 1.125rem;\r\n  border: 2px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-base);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  transition: all var(--vtx-transition-fast);\r\n  background-color: white;\r\n}\r\n\r\n.vtx-multiselect-option:hover .vtx-multiselect-checkbox {\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-multiselect-checkbox--checked {\r\n  background-color: var(--vtx-color-primary-500);\r\n  border-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-multiselect-checkbox svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n  color: white;\r\n  opacity: 0;\r\n  transform: scale(0.8);\r\n  transition: all var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-multiselect-checkbox--checked svg {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Checkmark Style (Style 2) */\r\n.vtx-multiselect-checkmark {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  margin-left: auto;\r\n}\r\n\r\n.vtx-multiselect-checkmark svg {\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n  color: var(--vtx-color-primary-600);\r\n  opacity: 0;\r\n  transform: scale(0.5);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-multiselect-option--selected .vtx-multiselect-checkmark svg {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Option Label */\r\n.vtx-multiselect-option-label {\r\n  flex: 1;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Select All / Clear All */\r\n.vtx-multiselect-actions {\r\n  display: flex;\r\n  gap: var(--vtx-spacing-2);\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n\r\n.vtx-multiselect-action-button {\r\n  font-size: var(--vtx-font-size-xs);\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  border: none;\r\n  background: none;\r\n  color: var(--vtx-color-primary-600);\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-radius-base);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  transition: all var(--vtx-transition-fast);\r\n  font-family: var(--vtx-font-family-sans);\r\n}\r\n\r\n.vtx-multiselect-action-button:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n}\r\n\r\n.vtx-multiselect-action-button:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n/* Empty State */\r\n.vtx-multiselect-empty {\r\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\r\n  text-align: center;\r\n  color: var(--vtx-color-neutral-500);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n/* Loading Spinner in Icon Area */\r\n.vtx-multiselect-icon-spinner {\r\n  color: var(--vtx-multiselect-loader-color, var(--vtx-color-primary-500));\r\n  animation: vtx-multiselect-spin var(--vtx-multiselect-loader-speed, 0.8s) linear infinite;\r\n}\r\n\r\n.vtx-multiselect-icon-spinner-track {\r\n  opacity: var(--vtx-multiselect-loader-track-opacity, 0.25);\r\n}\r\n\r\n.vtx-multiselect-icon-spinner-path {\r\n  opacity: var(--vtx-multiselect-loader-path-opacity, 1);\r\n}\r\n\r\n@keyframes vtx-multiselect-spin {\r\n  from {\r\n    transform: rotate(0deg);\r\n  }\r\n  to {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n/* Helper / Error / Success Text */\r\n.vtx-multiselect-helper {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-neutral-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-multiselect-error {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-error-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-multiselect-success {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-success-600);\r\n  line-height: var(--vtx-line-height-normal);\r\n  margin: 0;\r\n}\r\n\r\n/* Hidden Native Select for Form Integration */\r\n.vtx-multiselect-hidden-select {\r\n  position: absolute;\r\n  opacity: 0;\r\n  pointer-events: none;\r\n  width: 0;\r\n  height: 0;\r\n}\r\n\r\n/* Scrollbar Styling */\r\n.vtx-multiselect-dropdown::-webkit-scrollbar {\r\n  width: 8px;\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-base);\r\n}\r\n\r\n.vtx-multiselect-dropdown::-webkit-scrollbar-thumb:hover {\r\n  background: var(--vtx-color-neutral-400);\r\n}\r\n");const un=i.default.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,options:c,value:s,defaultValue:d=[],placeholder:x="Select...",className:v="",grouped:p=!1,getOptionLabel:m="label",getOptionValue:u="value",getOptionDisabled:g="disabled",getOptionGroup:f="group",onChange:b,disabled:w=!1,required:y=!1,id:k,name:j,selectionStyle:_="checkbox",searchable:z=!1,showSelectAll:N=!1,maxChipsDisplay:C,chipColor:S="primary",chipVariant:$="light",loading:D=!1},A)=>{const{theme:E}=h(),R=xn("multiselect"),L=k||R,B=`${L}-helper`,O=`${L}-error`,F=`${L}-success`,[W,P]=r.useState(!1),[V,H]=r.useState(""),[Y,q]=r.useState(d),X=r.useRef(null),U=r.useRef(null),G=void 0!==s?s:Y,K=(n,r)=>"function"==typeof r?r(n):"object"==typeof n?n[r]:n,Q=Boolean(a),Z=Boolean(o)&&!Q,J=[t&&!a&&!o&&B,a&&O,o&&F].filter(Boolean).join(" ");r.useEffect(()=>{const n=n=>{X.current&&!X.current.contains(n.target)&&U.current&&!U.current.contains(n.target)&&(P(!1),H(""))};if(W)return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[W]);const nn=n=>{if(w)return;const r=G.includes(n)?G.filter(r=>r!==n):[...G,n];if(void 0===s&&q(r),b){const n=c.filter(n=>r.includes(K(n,u)));b(r,n)}},rn=V?c.filter(n=>K(n,m).toLowerCase().includes(V.toLowerCase())):c,en=p?rn.reduce((n,r)=>{const e=K(r,f)||"Other";return n[e]||(n[e]=[]),n[e].push(r),n},{}):{"":rn},tn=c.filter(n=>G.includes(K(n,u))),an=C?tn.slice(0,C):tn,on=C?tn.length-C:0,ln=["vtx-multiselect-wrapper",l&&"vtx-multiselect-wrapper--full-width",v].filter(Boolean).join(" "),cn=i||(null==E?void 0:E.defaultSize)||"md",sn=["vtx-multiselect-container",`vtx-multiselect-container--${cn}`,Q&&"vtx-multiselect-container--error",Z&&"vtx-multiselect-container--success",w&&"vtx-multiselect-container--disabled",W&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),dn=cn;return n.jsxs("div",{className:ln,ref:A,children:[e&&n.jsxs("label",{htmlFor:L,className:"vtx-multiselect-label",children:[e,y&&n.jsxs("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{ref:X,className:sn,"aria-expanded":W,"aria-haspopup":"listbox","aria-labelledby":e?`${L}-label`:void 0,"aria-describedby":J||void 0,"aria-disabled":w,children:[n.jsx("div",{className:"vtx-multiselect-input-area",onClick:()=>!w&&P(!W),role:"button",tabIndex:w?-1:0,onKeyDown:n=>{w||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),P(!W))},children:0===tn.length?n.jsx("span",{className:"vtx-multiselect-placeholder",children:x}):n.jsxs("div",{className:"vtx-multiselect-chips",children:[an.map(r=>{const e=K(r,u),t=K(r,m);return n.jsx(hn,{label:t,size:dn,color:S,variant:$,onDelete:n=>{n.stopPropagation(),(n=>{if(w)return;const r=G.filter(r=>r!==n);if(void 0===s&&q(r),b){const n=c.filter(n=>r.includes(K(n,u)));b(r,n)}})(e)}},e)}),on>0&&n.jsx(hn,{label:`+${on} more`,size:dn,color:"default",variant:"outlined"})]})}),n.jsx("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:D?n.jsx(M,{size:16}):n.jsx(I,{size:16})}),W&&n.jsxs("div",{ref:U,className:"vtx-multiselect-dropdown",role:"listbox",children:[z&&n.jsx("div",{className:"vtx-multiselect-search",children:n.jsx("input",{type:"text",placeholder:"Search...",value:V,onChange:n=>H(n.target.value),onClick:n=>n.stopPropagation()})}),N&&n.jsxs("div",{className:"vtx-multiselect-actions",children:[n.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:n=>{n.stopPropagation(),(()=>{const n=c.filter(n=>!K(n,g)).map(n=>K(n,u));void 0===s&&q(n),b&&b(n,c.filter(n=>!K(n,g)))})()},children:"Select All"}),n.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:n=>{n.stopPropagation(),void 0===s&&q([]),b&&b([],[])},children:"Clear All"})]}),n.jsx("div",{className:"vtx-multiselect-options",children:0===rn.length?n.jsx("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(en).map(([r,e])=>n.jsxs("div",{children:[p&&r&&n.jsx("div",{className:"vtx-multiselect-optgroup",children:r}),e.map(r=>{const e=K(r,u),t=K(r,m),a=K(r,g),o=G.includes(e),i=["vtx-multiselect-option",o&&"vtx-multiselect-option--selected",a&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return n.jsxs("div",{className:i,onClick:()=>!a&&nn(e),role:"option","aria-selected":o,"aria-disabled":a,tabIndex:a?-1:0,onKeyDown:n=>{a||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),nn(e))},children:["checkbox"===_&&n.jsx("div",{className:"vtx-multiselect-checkbox "+(o?"vtx-multiselect-checkbox--checked":""),children:o&&n.jsx(T,{size:16})}),n.jsx("span",{className:"vtx-multiselect-option-label",children:t}),"checkmark"===_&&n.jsx("div",{className:"vtx-multiselect-checkmark",children:o&&n.jsx(T,{size:20})})]},e)})]},r))})]})]}),j&&n.jsx("select",{multiple:!0,name:j,value:G.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:y,disabled:w,tabIndex:-1,"aria-hidden":"true",children:c.map(r=>{const e=K(r,u);return n.jsx("option",{value:String(e),children:K(r,m)},e)})}),t&&!a&&!o&&n.jsx("p",{id:B,className:"vtx-multiselect-helper",children:t}),a&&n.jsx("p",{id:O,className:"vtx-multiselect-error",role:"alert",children:a}),o&&n.jsx("p",{id:F,className:"vtx-multiselect-success",role:"status",children:o})]})});un.displayName="MultiSelect";const gn=y(un);k("/* Radio Base Styles */\n.vtx-radio {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n/* Label Container */\n.vtx-radio-label {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  cursor: pointer;\n  user-select: none;\n  position: relative;\n}\n\n/* Wrapper for input and visual radio */\n.vtx-radio-wrapper {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* Hidden input */\n.vtx-radio-input {\n  position: absolute;\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n  padding: 0;\n  pointer-events: none;\n}\n\n/* Visual radio circle */\n.vtx-radio-circle {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--vtx-radio-size, 20px);\n  height: var(--vtx-radio-size, 20px);\n  border: var(--vtx-radio-border-width, 2px) solid var(--vtx-color-neutral-300);\n  border-radius: 50%;\n  background-color: white;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  box-sizing: border-box;\n}\n\n/* Inner dot */\n.vtx-radio-dot {\n  width: 50%;\n  height: 50%;\n  border-radius: 50%;\n  background-color: white;\n  opacity: 0;\n  transform: scale(0);\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* Checked state */\n.vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\n  border-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\n}\n\n.vtx-radio-input:checked + .vtx-radio-circle .vtx-radio-dot {\n  opacity: 1;\n  transform: scale(1);\n}\n\n/* Hover state */\n.vtx-radio-label:hover .vtx-radio-circle {\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\n  border-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\n}\n\n/* Focus state */\n.vtx-radio-input:focus-visible + .vtx-radio-circle {\n  outline: 2px solid var(--vtx-radio-color, var(--vtx-color-primary-600));\n  outline-offset: 2px;\n}\n\n/* Label text */\n.vtx-radio-label-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Disabled state */\n.vtx-radio--disabled .vtx-radio-label {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.vtx-radio--disabled .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-100);\n  border-color: var(--vtx-color-neutral-300);\n}\n\n.vtx-radio--disabled .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-400);\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-circle,\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-100);\n  border-color: var(--vtx-color-neutral-300);\n}\n\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-neutral-400);\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-radio--disabled .vtx-radio-label-text {\n  color: var(--vtx-color-neutral-500);\n}\n\n/* Error state */\n.vtx-radio--error .vtx-radio-circle {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-radio--error .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-radio--error .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\n  background-color: var(--vtx-color-error-700);\n  border-color: var(--vtx-color-error-700);\n}\n\n/* Helper text */\n.vtx-radio-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-left: calc(var(--vtx-radio-size, 20px) + var(--vtx-spacing-2));\n}\n\n.vtx-radio--error .vtx-radio-helper-text {\n  color: var(--vtx-color-error-600);\n}\n\n/* Size variants */\n.vtx-radio--small {\n  --vtx-radio-size: 16px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--small .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-radio--medium {\n  --vtx-radio-size: 20px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--large {\n  --vtx-radio-size: 24px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--large .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Variants */\n.vtx-radio--primary {\n  --vtx-radio-color: var(--vtx-color-primary-600);\n  --vtx-radio-hover-color: var(--vtx-color-primary-700);\n}\n\n.vtx-radio--secondary {\n  --vtx-radio-color: var(--vtx-color-neutral-600);\n  --vtx-radio-hover-color: var(--vtx-color-neutral-700);\n}\n\n.vtx-radio--success {\n  --vtx-radio-color: var(--vtx-color-success-600);\n  --vtx-radio-hover-color: var(--vtx-color-success-700);\n}\n\n.vtx-radio--error {\n  --vtx-radio-color: var(--vtx-color-error-600);\n  --vtx-radio-hover-color: var(--vtx-color-error-700);\n}\n\n.vtx-radio--warning {\n  --vtx-radio-color: var(--vtx-color-warning-600);\n  --vtx-radio-hover-color: var(--vtx-color-warning-700);\n}\n\n.vtx-radio--info {\n  --vtx-radio-color: var(--vtx-color-info-600);\n  --vtx-radio-hover-color: var(--vtx-color-info-700);\n}\n");const fn=i.default.forwardRef(({checked:e,disabled:t=!1,label:a,size:o="medium",variant:i="primary",error:l=!1,helperText:c,onChange:s,className:d="",inputClassName:x="",id:v,...p},m)=>{const h=r.useId(),u=v||h,g=c?`${u}-helper-text`:void 0,f=["vtx-radio",`vtx-radio--${o}`,`vtx-radio--${i}`,t&&"vtx-radio--disabled",l&&"vtx-radio--error",d].filter(Boolean).join(" "),b=["vtx-radio-input",x].filter(Boolean).join(" "),w=n.jsxs("div",{className:"vtx-radio-wrapper",children:[n.jsx("input",{ref:m,type:"radio",id:u,className:b,checked:e,disabled:t,onChange:s,"aria-describedby":g,...p}),n.jsx("span",{className:"vtx-radio-circle",children:n.jsx("span",{className:"vtx-radio-dot"})})]});return a?n.jsxs("div",{className:f,children:[n.jsxs("label",{htmlFor:u,className:"vtx-radio-label",children:[w,n.jsx("span",{className:"vtx-radio-label-text",children:a})]}),c&&n.jsx("span",{id:g,className:"vtx-radio-helper-text",children:c})]}):n.jsxs("div",{className:f,children:[w,c&&n.jsx("span",{id:g,className:"vtx-radio-helper-text",children:c})]})});fn.displayName="Radio";const bn=y(fn);k("/* RadioGroup Base Styles */\n.vtx-radio-group {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n}\n\n/* Group Label */\n.vtx-radio-group-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-radio-group--disabled .vtx-radio-group-label {\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-radio-group--error .vtx-radio-group-label {\n  color: var(--vtx-color-error-600);\n}\n\n/* Options Container */\n.vtx-radio-group-options {\n  display: flex;\n  gap: var(--vtx-spacing-3);\n}\n\n.vtx-radio-group--vertical .vtx-radio-group-options {\n  flex-direction: column;\n}\n\n.vtx-radio-group--horizontal .vtx-radio-group-options {\n  flex-direction: row;\n  flex-wrap: wrap;\n}\n\n/* Helper Text */\n.vtx-radio-group-helper-text {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-600);\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-radio-group--error .vtx-radio-group-helper-text {\n  color: var(--vtx-color-error-600);\n}\n");const wn=i.default.forwardRef(({name:e,label:t,options:a,value:o,defaultValue:i,onChange:l,disabled:c=!1,error:s=!1,helperText:d,orientation:x="vertical",size:v="medium",variant:p="primary",className:m="",...h},u)=>{const[g,f]=r.useState(i),b=void 0!==o,w=b?o:g,y=["vtx-radio-group",`vtx-radio-group--${x}`,s&&"vtx-radio-group--error",c&&"vtx-radio-group--disabled",m].filter(Boolean).join(" ");return n.jsxs("div",{ref:u,className:y,role:"radiogroup","aria-label":"string"==typeof t?t:void 0,...h,children:[t&&n.jsx("div",{className:"vtx-radio-group-label",children:t}),n.jsx("div",{className:"vtx-radio-group-options",children:a.map(r=>{const t=w===r.value,a=c||r.disabled;return n.jsx(bn,{name:e,value:r.value,label:r.label,checked:t,disabled:a,error:s,size:v,variant:p,onChange:()=>{return n=r.value,b||f(n),void(null==l||l(n));var n}},r.value)})}),d&&n.jsx("div",{className:"vtx-radio-group-helper-text",children:d})]})});wn.displayName="RadioGroup";const yn=y(wn);k(".vtx-select-wrapper {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n}\n\n.vtx-select-wrapper--full-width {\n  width: 100%;\n}\n\n.vtx-select-label {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  color: var(--vtx-color-neutral-700);\n  line-height: var(--vtx-line-height-tight);\n}\n\n.vtx-select-label__required {\n  color: var(--vtx-color-error-600);\n  margin-left: var(--vtx-spacing-1);\n}\n\n.vtx-select-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  background-color: white;\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  transition: all var(--vtx-transition-base);\n}\n\n.vtx-select-container:focus-within {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 0;\n  border-color: var(--vtx-color-primary-500);\n}\n\n.vtx-select-container--error {\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-select-container--error:focus-within {\n  outline-color: var(--vtx-color-error-600);\n  border-color: var(--vtx-color-error-600);\n}\n\n.vtx-select-container--disabled {\n  background-color: var(--vtx-color-neutral-100);\n  cursor: not-allowed;\n}\n\n/* Sizes */\n.vtx-select-container--small {\n  min-height: 32px;\n}\n\n.vtx-select-container--medium {\n  min-height: 40px;\n}\n\n.vtx-select-container--large {\n  min-height: 48px;\n}\n\n.vtx-select {\n  flex: 1;\n  width: 100%;\n  min-width: 0;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n  background: transparent;\n  border: none;\n  outline: none;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  padding-right: var(--vtx-spacing-8);\n  cursor: pointer;\n  appearance: none;\n}\n\n.vtx-select:disabled {\n  cursor: not-allowed;\n  color: var(--vtx-color-neutral-500);\n}\n\n.vtx-select-container--small .vtx-select {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  padding-right: var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-select-container--large .vtx-select {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  padding-right: var(--vtx-spacing-10);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Dropdown icon */\n.vtx-select-icon {\n  position: absolute;\n  right: var(--vtx-spacing-3);\n  display: inline-flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-500);\n  pointer-events: none;\n}\n\n.vtx-select-container--disabled .vtx-select-icon {\n  color: var(--vtx-color-neutral-400);\n}\n\n/* Loading Spinner in Icon Area */\n.vtx-select-icon-spinner {\n  color: var(--vtx-select-loader-color, var(--vtx-color-primary-500));\n  animation: vtx-select-spin var(--vtx-select-loader-speed, 0.8s) linear infinite;\n}\n\n.vtx-select-icon-spinner-track {\n  opacity: var(--vtx-select-loader-track-opacity, 0.25);\n}\n\n.vtx-select-icon-spinner-path {\n  opacity: var(--vtx-select-loader-path-opacity, 1);\n}\n\n@keyframes vtx-select-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Helper and error text */\n.vtx-select-helper,\n.vtx-select-error {\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  margin: 0;\n}\n\n.vtx-select-helper {\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-select-error {\n  color: var(--vtx-color-error-600);\n}\n");const kn=i.default.forwardRef(({label:r,helperText:e,error:t,success:a,size:o="medium",fullWidth:i=!1,options:l,placeholder:c,className:s="",wrapperClassName:d="",id:x,disabled:v=!1,required:p=!1,grouped:m=!1,getOptionLabel:h="label",getOptionValue:u="value",getOptionDisabled:g="disabled",getOptionGroup:f="group",onSelectChange:b,onChange:w,loading:y=!1,...k},j)=>{const _=xn("select"),z=x||_,N=`${z}-helper`,C=`${z}-error`,S=`${z}-success`,M=(n,r)=>"function"==typeof r?r(n):"object"==typeof n?n[r]:n,T=Boolean(t),$=Boolean(a)&&!T,I=[e&&!t&&!a&&N,t&&C,a&&S].filter(Boolean).join(" "),D=["vtx-select-wrapper",i&&"vtx-select-wrapper--full-width",d].filter(Boolean).join(" "),A=["vtx-select-container",`vtx-select-container--${o}`,T&&"vtx-select-container--error",$&&"vtx-select-container--success",v&&"vtx-select-container--disabled",s].filter(Boolean).join(" ");return n.jsxs("div",{className:D,children:[r&&n.jsxs("label",{htmlFor:z,className:"vtx-select-label",children:[r,p&&n.jsxs("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),n.jsxs("div",{className:A,children:[n.jsxs("select",{ref:j,id:z,className:"vtx-select",disabled:v,required:p,"aria-invalid":T,"aria-describedby":I||void 0,onChange:n=>{if(null==w||w(n),b){const r=l.find(r=>String(M(r,u))===n.target.value);b(n.target.value,r)}},...k,children:[c&&n.jsx("option",{value:"",disabled:!0,children:c}),(()=>{if(!m)return l.map((r,e)=>{const t=M(r,u),a=M(r,h),o=M(r,g);return n.jsx("option",{value:t,disabled:o,children:a},t||e)});const r=l.reduce((n,r)=>{const e=M(r,f)||"Other";return n[e]||(n[e]=[]),n[e].push(r),n},{});return Object.entries(r).map(([r,e])=>n.jsx("optgroup",{label:r,children:e.map((r,e)=>{const t=M(r,u),a=M(r,h),o=M(r,g);return n.jsx("option",{value:t,disabled:o,children:a},t||e)})},r))})()]}),n.jsx("span",{className:"vtx-select-icon","aria-hidden":"true",children:y?n.jsxs("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[n.jsx("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),n.jsx("path",{className:"vtx-select-icon-spinner-path",fill:"currentColor",d:"M8 2C4.686 2 2 4.686 2 8h2c0-2.21 1.79-4 4-4V2z"})]}):n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:n.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),e&&!t&&!a&&n.jsx("p",{id:N,className:"vtx-select-helper",children:e}),t&&n.jsx("p",{id:C,className:"vtx-select-error",role:"alert",children:t}),a&&n.jsx("p",{id:S,className:"vtx-select-success",role:"status",children:a})]})});kn.displayName="Select";const jn=y(kn),_n=i.default.forwardRef(({item:e,isOpen:t,onToggle:a,variant:o="default",size:i="md",showChevron:l=!0,chevronPosition:c="right",expandedIcon:s,collapsedIcon:d,iconType:x="chevron",loading:v=!1,disabled:p=!1,disableAnimations:m=!1},h)=>{const u=r.useRef(null),{id:g,header:f,children:b,disabled:w,className:y,loading:k,status:j="default",icon:_,dataTestId:z}=e,N=p||w,C=v||k,S=()=>{N||C||a()},M=()=>_?n.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||g}-custom-icon`,children:t?_.expanded:_.collapsed}):"custom"===x&&s&&d?n.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||g}-custom-icon`,children:t?s:d}):"plus-minus"===x?n.jsx("div",{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(t?"open":""),"data-testid":`${z||g}-plus-minus-icon`,children:t?n.jsx(A,{size:16,"aria-hidden":"true"}):n.jsx(n.Fragment,{children:n.jsx(D,{size:16,"aria-hidden":"true"})})}):n.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||g}-chevron-icon`,children:n.jsx(I,{size:16,"aria-hidden":"true",style:{transform:t?"rotate(180deg)":void 0,transition:"transform 0.2s"}})});return n.jsxs("div",{ref:h,className:`\n          accordion-item\n          accordion-item--${o}\n          accordion-item--${i}\n          ${t?"accordion-item--open":""}\n          ${N?"accordion-item--disabled":""}\n          ${C?"accordion-item--loading":""}\n          ${"default"!==j?`accordion-item--${j}`:""}\n          ${y||""}\n        `.trim(),"data-testid":z,"aria-expanded":t,"aria-disabled":N,"aria-busy":C,children:[n.jsxs("div",{className:"accordion-item-header",role:"button",tabIndex:N||C?-1:0,"aria-expanded":t,"aria-controls":`accordion-content-${g}`,"aria-disabled":N,"aria-busy":C,"aria-describedby":"default"!==j?`accordion-status-${g}`:void 0,onClick:S,onKeyDown:n=>{"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),S())},"data-testid":`${z||g}-header`,children:["left"===c&&l&&M(),n.jsx("div",{className:"accordion-item-header-content",children:f}),"right"===c&&l&&M()]}),n.jsx("div",{id:`accordion-content-${g}`,className:"accordion-item-content "+(t?"accordion-item-content--open":""),role:"region","aria-labelledby":`accordion-header-${g}`,ref:u,style:{maxHeight:m?t?"none":"0":t?"500px":"0",transition:m?"none":void 0},"data-testid":`${z||g}-content`,children:n.jsxs("div",{className:"accordion-item-body",children:["default"!==j&&n.jsx("div",{id:`accordion-status-${g}`,className:`accordion-status accordion-status--${j}`,"aria-live":"polite",children:n.jsxs("span",{className:"visually-hidden",children:["Status: ",j]})}),b]})})]})});_n.displayName="AccordionItem";k("/* =============================================================================\r\n * ACCORDION COMPONENT - VTX DESIGN SYSTEM\r\n * =============================================================================\r\n * \r\n * A modern, accessible accordion component that fully utilizes the VTX design \r\n * system tokens for consistent theming and beautiful visual states.\r\n * \r\n * Features:\r\n * - Complete VTX token integration\r\n * - Multiple visual variants (default, bordered, separated, flush)\r\n * - Responsive size variants (sm, md, lg)\r\n * - Enhanced hover, focus, and active states\r\n * - Dark mode support\r\n * - Accessibility features\r\n * - Smooth animations\r\n * ============================================================================= */\r\n\r\n.accordion {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* =============================================================================\r\n * VARIANT STYLES\r\n * ============================================================================= */\r\n\r\n/* Default Variant - Clean card-like appearance */\r\n.accordion--default {\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: var(--vtx-radius-xl);\r\n  overflow: hidden;\r\n  box-shadow: var(--vtx-shadow-base);\r\n  transition: box-shadow var(--vtx-transition-base);\r\n}\r\n\r\n.accordion--default:hover {\r\n  box-shadow: var(--vtx-shadow-md);\r\n}\r\n\r\n.accordion--default.accordion--divider .accordion-item:not(:last-child) {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n/* Bordered Variant - Individual cards with spacing */\r\n.accordion--bordered .accordion-item {\r\n  background: white;\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: var(--vtx-radius-lg);\r\n  box-shadow: var(--vtx-shadow-sm);\r\n  transition: \r\n    box-shadow var(--vtx-transition-base),\r\n    border-color var(--vtx-transition-base),\r\n    transform var(--vtx-transition-fast);\r\n}\r\n\r\n.accordion--bordered .accordion-item:hover {\r\n  border-color: var(--vtx-color-primary-300);\r\n  box-shadow: var(--vtx-shadow-md);\r\n  transform: translateY(-1px);\r\n}\r\n\r\n.accordion--bordered .accordion-item + .accordion-item {\r\n  margin-top: var(--vtx-spacing-4);\r\n}\r\n\r\n/* Separated Variant - Floating cards with enhanced shadows */\r\n.accordion--separated .accordion-item {\r\n  background: white;\r\n  border: 1px solid var(--vtx-color-neutral-100);\r\n  border-radius: var(--vtx-radius-xl);\r\n  box-shadow: \r\n    var(--vtx-shadow-base),\r\n    0 0 0 1px rgba(255, 255, 255, 0.8);\r\n  transition: \r\n    box-shadow var(--vtx-transition-base),\r\n    transform var(--vtx-transition-base);\r\n  backdrop-filter: blur(10px);\r\n}\r\n\r\n.accordion--separated .accordion-item:hover {\r\n  box-shadow: \r\n    var(--vtx-shadow-xl),\r\n    0 0 0 1px var(--vtx-color-primary-100);\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.accordion--separated .accordion-item + .accordion-item {\r\n  margin-top: var(--vtx-spacing-6);\r\n}\r\n\r\n/* Flush Variant - Minimal design without borders */\r\n.accordion--flush {\r\n  border: none;\r\n  box-shadow: none;\r\n  background: transparent;\r\n}\r\n\r\n.accordion--flush .accordion-item {\r\n  background: transparent;\r\n  border: none;\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  border-radius: 0;\r\n  box-shadow: none;\r\n}\r\n\r\n.accordion--flush .accordion-item:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.accordion--flush .accordion-item:hover {\r\n  background: var(--vtx-color-neutral-50);\r\n}\r\n\r\n/* Dividers for bordered variant */\r\n.accordion--bordered.accordion--divider .accordion-item:not(:last-child) {\r\n  position: relative;\r\n  margin-bottom: var(--accordion-divider-spacing, 12px);\r\n}\r\n\r\n.accordion--bordered.accordion--divider .accordion-item:not(:last-child)::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -10px;\r\n  left: 0;\r\n  right: 0;\r\n  height: 1px;\r\n  background: var(--accordion-divider, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion--separated .accordion-item {\r\n  background: var(--accordion-bg, var(--color-background, #ffffff));\r\n  border-radius: var(--accordion-item-radius-lg, var(--radius-lg, 10px));\r\n  box-shadow: var(\r\n    --accordion-separated-shadow,\r\n    var(--shadow-md, 0 4px 6px rgba(0, 0, 0, 0.07), 0 1px 3px rgba(0, 0, 0, 0.06))\r\n  );\r\n  border: 1px solid var(--accordion-separated-border, var(--color-border-light, #f3f4f6));\r\n  transition:\r\n    transform var(--transition-duration, 0.2s) var(--transition-timing, ease),\r\n    box-shadow var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n}\r\n\r\n.accordion--separated .accordion-item:hover {\r\n  transform: translateY(-2px);\r\n  box-shadow: var(\r\n    --accordion-separated-shadow-hover,\r\n    var(--shadow-lg, 0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05))\r\n  );\r\n}\r\n\r\n.accordion--separated .accordion-item + .accordion-item {\r\n  margin-top: var(--accordion-spacing-lg, var(--spacing-4, 16px));\r\n}\r\n\r\n/* Dividers for separated variant */\r\n.accordion--separated.accordion--divider .accordion-item {\r\n  position: relative;\r\n}\r\n\r\n.accordion--separated.accordion--divider .accordion-item:not(:last-child)::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -8px;\r\n  left: 10%;\r\n  right: 10%;\r\n  height: 1px;\r\n  background: var(\r\n    --accordion-divider-gradient,\r\n    linear-gradient(\r\n      to right,\r\n      transparent,\r\n      var(--color-border-hover, #d1d5db) 20%,\r\n      var(--color-border-hover, #d1d5db) 80%,\r\n      transparent\r\n    )\r\n  );\r\n  z-index: 1;\r\n}\r\n\r\n.accordion--flush {\r\n  border: none;\r\n  background: transparent;\r\n}\r\n\r\n.accordion--flush .accordion-item {\r\n  border: none;\r\n  border-radius: 0;\r\n  background: transparent;\r\n  border-bottom: 1px solid var(--accordion-divider, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion--flush .accordion-item:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n/* Accordion Item */\r\n.accordion-item {\r\n  position: relative;\r\n  background: inherit;\r\n  transition: all var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n  overflow: hidden;\r\n}\r\n\r\n.accordion-item--disabled {\r\n  opacity: var(--accordion-disabled-opacity, 0.5);\r\n  pointer-events: none;\r\n}\r\n\r\n.accordion-item--disabled .accordion-item-header {\r\n  cursor: not-allowed;\r\n  color: var(--accordion-disabled-color, var(--color-text-disabled, #9ca3af));\r\n}\r\n\r\n/* Accordion Item Header */\r\n.accordion-item-header {\r\n  display: flex;\r\n  align-items: center;\r\n  width: 100%;\r\n  cursor: pointer;\r\n  outline: none;\r\n  transition: all var(--transition-duration, 0.2s) var(--transition-timing, ease);\r\n  user-select: none;\r\n  position: relative;\r\n  border: none;\r\n  background: transparent;\r\n  text-align: left;\r\n}\r\n\r\n.accordion-item-header:hover:not(:disabled) {\r\n  background: var(\r\n    --accordion-header-hover-bg,\r\n    var(--color-background-hover, linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%))\r\n  );\r\n}\r\n\r\n.accordion-item-header:active {\r\n  transform: translateY(1px);\r\n}\r\n\r\n.accordion-item-header:focus {\r\n  outline: 2px solid var(--accordion-focus-color, var(--vtx-color-primary-500));\r\n  outline-offset: -2px;\r\n  border-radius: var(--accordion-focus-radius, var(--radius-sm, 4px));\r\n}\r\n\r\n.accordion-item-header:focus:not(:focus-visible) {\r\n  outline: none;\r\n}\r\n\r\n.accordion-item-header-content {\r\n  flex: 1;\r\n  text-align: left;\r\n  font-weight: var(--accordion-header-font-weight, var(--font-weight-semibold, 600));\r\n  color: var(--accordion-header-color, var(--color-text-primary, #1f2937));\r\n  line-height: var(--accordion-header-line-height, var(--line-height-normal, 1.5));\r\n}\r\n\r\n/* Chevron Icon */\r\n.accordion-item-chevron {\r\n  transition: transform var(--accordion-icon-transition, var(--transition-duration-slow, 0.3s))\r\n    var(--transition-timing-smooth, cubic-bezier(0.4, 0, 0.2, 1));\r\n  color: var(--accordion-icon-color, var(--color-text-secondary, #6b7280));\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: var(--accordion-icon-size, 24px);\r\n  height: var(--accordion-icon-size, 24px);\r\n  border-radius: var(--accordion-icon-radius, 50%);\r\n  background: var(--accordion-icon-bg, rgba(59, 130, 246, 0.1));\r\n}\r\n\r\n.accordion-item-chevron.open {\r\n  transform: rotate(180deg);\r\n  background: var(--accordion-icon-bg-open, rgba(59, 130, 246, 0.2));\r\n  color: var(--accordion-icon-color-open, var(--vtx-color-primary-500));\r\n}\r\n\r\n.accordion-item-header:hover .accordion-chevron {\r\n  background: var(--accordion-icon-bg-hover, rgba(59, 130, 246, 0.15));\r\n  color: var(--accordion-icon-color-hover, var(--vtx-color-primary-500));\r\n}\r\n\r\n/* Accordion Item Content */\r\n.accordion-item-content {\r\n  overflow: hidden;\r\n  transition: all var(--accordion-content-transition, var(--transition-duration-slow, 0.3s))\r\n    var(--transition-timing-smooth, cubic-bezier(0.4, 0, 0.2, 1));\r\n  max-height: 0;\r\n  background: var(--accordion-content-bg, var(--color-background-alt, #fafbfc));\r\n  border-top: 1px solid transparent;\r\n}\r\n\r\n.accordion-item-content--open {\r\n  max-height: var(--accordion-content-max-height, 500px);\r\n  border-top-color: var(--accordion-content-border, var(--color-border, #e5e7eb));\r\n}\r\n\r\n.accordion-item-body {\r\n  color: var(--accordion-body-color, var(--color-text-secondary, #4b5563));\r\n  line-height: var(--accordion-body-line-height, var(--line-height-relaxed, 1.7));\r\n  font-size: var(--accordion-body-font-size, 0.95em);\r\n}\r\n\r\n/* =============================================================================\r\n * SIZE VARIANTS\r\n * ============================================================================= */\r\n\r\n/* Small Size */\r\n.accordion--sm .accordion-item-header {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-sm);\r\n  min-height: 48px;\r\n}\r\n\r\n.accordion--sm .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.accordion--sm .accordion-item-body {\r\n  padding: var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.accordion--sm .accordion-item-chevron {\r\n  width: var(--vtx-spacing-5);\r\n  height: var(--vtx-spacing-5);\r\n}\r\n\r\n.accordion--sm .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-3);\r\n  height: var(--vtx-spacing-3);\r\n}\r\n\r\n/* Medium Size (Default) */\r\n.accordion--md .accordion-item-header {\r\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-5);\r\n  font-size: var(--vtx-font-size-base);\r\n  min-height: 56px;\r\n}\r\n\r\n.accordion--md .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n.accordion--md .accordion-item-body {\r\n  padding: var(--vtx-spacing-5);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.accordion--md .accordion-item-chevron {\r\n  width: var(--vtx-spacing-6);\r\n  height: var(--vtx-spacing-6);\r\n}\r\n\r\n.accordion--md .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-4);\r\n  height: var(--vtx-spacing-4);\r\n}\r\n\r\n/* Large Size */\r\n.accordion--lg .accordion-item-header {\r\n  padding: var(--vtx-spacing-5) var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-lg);\r\n  min-height: 64px;\r\n}\r\n\r\n.accordion--lg .accordion-item-header-content {\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n}\r\n\r\n.accordion--lg .accordion-item-body {\r\n  padding: var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n.accordion--lg .accordion-item-chevron {\r\n  width: var(--vtx-spacing-8);\r\n  height: var(--vtx-spacing-8);\r\n}\r\n\r\n.accordion--lg .accordion-item-chevron svg {\r\n  width: var(--vtx-spacing-5);\r\n  height: var(--vtx-spacing-5);\r\n}\r\n\r\n/* =============================================================================\r\n * DARK MODE SUPPORT\r\n * ============================================================================= */\r\n\r\n[data-theme=\"dark\"] .accordion,\r\n@media (prefers-color-scheme: dark) {\r\n  .accordion {\r\n    color: var(--vtx-color-neutral-100);\r\n  }\r\n\r\n  /* Dark mode variants */\r\n  .accordion--default {\r\n    background: var(--vtx-color-neutral-800);\r\n    border-color: var(--vtx-color-neutral-700);\r\n    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);\r\n  }\r\n\r\n  .accordion--bordered .accordion-item,\r\n  .accordion--separated .accordion-item {\r\n    background: var(--vtx-color-neutral-900);\r\n    border-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .accordion--flush .accordion-item:hover {\r\n    background: var(--vtx-color-neutral-800);\r\n  }\r\n\r\n  /* Header dark mode */\r\n  .accordion-item-header {\r\n    background: var(--vtx-color-neutral-900);\r\n  }\r\n\r\n  .accordion-item-header:hover {\r\n    background: linear-gradient(135deg, var(--vtx-color-neutral-800) 0%, var(--vtx-color-neutral-700) 100%);\r\n  }\r\n\r\n  .accordion-item-header-content {\r\n    color: var(--vtx-color-neutral-100);\r\n  }\r\n\r\n  .accordion-item-header:hover .accordion-item-header-content {\r\n    color: var(--vtx-color-primary-300);\r\n  }\r\n\r\n  .accordion-item--open .accordion-item-header {\r\n    background: linear-gradient(135deg, var(--vtx-color-neutral-800) 0%, var(--vtx-color-primary-900) 100%);\r\n    border-bottom-color: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .accordion-item--open .accordion-item-header-content {\r\n    color: var(--vtx-color-primary-200);\r\n  }\r\n\r\n  /* Content dark mode */\r\n  .accordion-item-content {\r\n    background: var(--vtx-color-neutral-800);\r\n    border-top-color: var(--vtx-color-neutral-700);\r\n  }\r\n\r\n  .accordion-item-content--open {\r\n    border-top-color: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .accordion-item-body {\r\n    color: var(--vtx-color-neutral-300);\r\n  }\r\n\r\n  /* Chevron dark mode */\r\n  .accordion-item-chevron {\r\n    background: var(--vtx-color-primary-900);\r\n    color: var(--vtx-color-primary-300);\r\n  }\r\n\r\n  .accordion-item-chevron.open {\r\n    background: var(--vtx-color-primary-800);\r\n    color: var(--vtx-color-primary-200);\r\n  }\r\n\r\n  .accordion-item-header:hover .accordion-item-chevron {\r\n    background: var(--vtx-color-primary-700);\r\n    color: var(--vtx-color-primary-100);\r\n  }\r\n}\r\n\r\n/* =============================================================================\r\n * ENHANCED STATES AND ANIMATIONS\r\n * ============================================================================= */\r\n\r\n/* Loading state */\r\n.accordion-item--loading {\r\n  opacity: 0.6;\r\n  pointer-events: none;\r\n}\r\n\r\n.accordion-item--loading .accordion-item-chevron {\r\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\r\n}\r\n\r\n/* Enhanced animations */\r\n@keyframes pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.5;\r\n  }\r\n}\r\n\r\n@keyframes slideDown {\r\n  from {\r\n    max-height: 0;\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    max-height: 500px;\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Enhanced visual feedback */\r\n.accordion-item-header:active {\r\n  transform: scale(0.99);\r\n}\r\n\r\n/* Beautiful gradient accents for special states */\r\n.accordion-item--featured .accordion-item-header {\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-50) 0%, var(--vtx-color-secondary-50) 100%);\r\n  border-left: 4px solid var(--vtx-color-primary-500);\r\n}\r\n\r\n/* Status indicators */\r\n.accordion-item--success .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-success-500);\r\n}\r\n\r\n.accordion-item--warning .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-warning-500);\r\n}\r\n\r\n.accordion-item--error .accordion-item-header {\r\n  border-left: 4px solid var(--vtx-color-error-500);\r\n}\r\n\r\n/* =============================================================================\r\n * ACCESSIBILITY AND MOTION\r\n * ============================================================================= */\r\n\r\n/* High contrast mode */\r\n@media (prefers-contrast: high) {\r\n  .accordion-item {\r\n    border: 2px solid currentColor;\r\n  }\r\n  \r\n  .accordion-item-header:focus-visible {\r\n    outline: 4px solid currentColor;\r\n    outline-offset: 2px;\r\n  }\r\n  \r\n  .accordion-item-header-content {\r\n    font-weight: var(--vtx-font-weight-bold);\r\n  }\r\n}\r\n\r\n/* Reduced motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .accordion-item,\r\n  .accordion-item-header,\r\n  .accordion-item-chevron,\r\n  .accordion-item-content,\r\n  .accordion-item-body {\r\n    transition: none;\r\n    animation: none;\r\n  }\r\n  \r\n  .accordion-item-chevron.open {\r\n    transform: none;\r\n  }\r\n}\r\n\r\n/* Print styles */\r\n@media print {\r\n  .accordion-item {\r\n    page-break-inside: avoid;\r\n  }\r\n  \r\n  .accordion-item-content {\r\n    max-height: none !important;\r\n    overflow: visible !important;\r\n  }\r\n  \r\n  .accordion-item-chevron {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* =============================================================================\r\n * UTILITY CLASSES\r\n * ============================================================================= */\r\n\r\n/* Custom spacing */\r\n.accordion--compact .accordion-item-header {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  min-height: 40px;\r\n}\r\n\r\n.accordion--compact .accordion-item-body {\r\n  padding: var(--vtx-spacing-3);\r\n}\r\n\r\n.accordion--spacious .accordion-item-header {\r\n  padding: var(--vtx-spacing-6) var(--vtx-spacing-8);\r\n  min-height: 72px;\r\n}\r\n\r\n.accordion--spacious .accordion-item-body {\r\n  padding: var(--vtx-spacing-8);\r\n}\r\n\r\n/* No animations */\r\n.accordion--no-animation * {\r\n  transition: none !important;\r\n  animation: none !important;\r\n}\r\n\r\n\r\n");const zn=i.default.forwardRef(({items:e,children:t,allowMultiple:a=!1,defaultOpenItems:o=[],openItems:i,onToggle:l,variant:c="default",size:s="md",className:d="",style:x,showChevron:v=!0,chevronPosition:p="right",expandedIcon:m,collapsedIcon:h,iconType:u="chevron",showDivider:g=!0,collapsible:f=!0,loading:b=!1,disabled:w=!1,spacing:y="default",disableAnimations:k=!1,...j},_)=>{const[z,N]=r.useState(o),C=void 0!==i?i:z,S=void 0!==i,M=e||r.Children.toArray(t).filter(n=>r.isValidElement(n)).map((n,e)=>{if(r.isValidElement(n)&&n.props){const r=n;return{id:r.props.id||`accordion-item-${e}`,header:r.props.header||`Item ${e+1}`,children:r.props.children,disabled:r.props.disabled,className:r.props.className}}return{id:`accordion-item-${e}`,header:`Item ${e+1}`,children:n}}),T=r.useCallback(n=>{let r;r=a?C.includes(n)?C.filter(r=>r!==n):[...C,n]:C.includes(n)?f?[]:C:[n],S||N(r),null==l||l(r)},[a,f,C,S,l]);return n.jsx("div",{ref:_,className:`\n          accordion\n          accordion--${c}\n          accordion--${s}\n          ${g?"accordion--divider":""}\n          ${"compact"===y?"accordion--compact":""}\n          ${"spacious"===y?"accordion--spacious":""}\n          ${k?"accordion--no-animation":""}\n          ${b?"accordion--loading":""}\n          ${w?"accordion--disabled":""}\n          ${d}\n        `.trim(),style:x,role:"presentation","aria-busy":b,...j,children:M.map(r=>n.jsx(_n,{item:r,isOpen:C.includes(r.id),onToggle:()=>T(r.id),variant:c,size:s,showChevron:v,chevronPosition:p,expandedIcon:m,collapsedIcon:h,iconType:u,loading:b,disabled:w,spacing:y,disableAnimations:k},r.id))})});zn.displayName="Accordion";k("/* Alert Component Styles */\r\n\r\n.alert {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-4);\r\n  border-radius: var(--vtx-radius-md);\r\n  font-family: var(--vtx-font-family-sans);\r\n  transition: all var(--vtx-transition-base);\r\n  position: relative;\r\n}\r\n\r\n.alert--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Sizes */\r\n.alert--sm {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.alert--sm .alert-icon svg {\r\n  width: 16px;\r\n  height: 16px;\r\n}\r\n\r\n.alert--md {\r\n  padding: var(--vtx-spacing-4);\r\n  gap: var(--vtx-spacing-3);\r\n}\r\n\r\n.alert--md .alert-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n.alert--lg {\r\n  padding: var(--vtx-spacing-5);\r\n  gap: var(--vtx-spacing-4);\r\n}\r\n\r\n.alert--lg .alert-icon svg {\r\n  width: 24px;\r\n  height: 24px;\r\n}\r\n\r\n/* Icon */\r\n.alert-icon {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-top: 0.125rem;\r\n}\r\n\r\n/* Content */\r\n.alert-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.alert-title {\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-tight);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.alert--sm .alert-title {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.alert--lg .alert-title {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n.alert-message {\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n  opacity: 0.9;\r\n}\r\n\r\n.alert--sm .alert-message {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.alert--lg .alert-message {\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n/* Only title, no message */\r\n.alert-title:only-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n/* Action */\r\n.alert-action {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  margin-left: auto;\r\n}\r\n\r\n/* Close Button */\r\n.alert-close {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  padding: var(--vtx-spacing-1);\r\n  margin: calc(var(--vtx-spacing-1) * -1);\r\n  border-radius: var(--vtx-radius-base);\r\n  transition: all var(--vtx-transition-fast);\r\n  opacity: 0.6;\r\n}\r\n\r\n.alert-close:hover {\r\n  opacity: 1;\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.alert-close:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.alert-close:focus-visible {\r\n  outline: 2px solid currentColor;\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* ===== VARIANTS: SUCCESS ===== */\r\n\r\n/* Subtle */\r\n.alert--success.alert--subtle {\r\n  background-color: var(--vtx-color-success-50);\r\n  color: var(--vtx-color-success-700);\r\n  border: 1px solid var(--vtx-color-success-200);\r\n}\r\n\r\n.alert--success.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--success.alert--filled {\r\n  background-color: var(--vtx-color-success-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-success-600);\r\n}\r\n\r\n.alert--success.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--success.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--success.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-success-700);\r\n  border: 2px solid var(--vtx-color-success-500);\r\n}\r\n\r\n.alert--success.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--success.alert--left-accent {\r\n  background-color: var(--vtx-color-success-50);\r\n  color: var(--vtx-color-success-700);\r\n  border: 1px solid var(--vtx-color-success-200);\r\n  border-left: 4px solid var(--vtx-color-success-600);\r\n}\r\n\r\n.alert--success.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n/* ===== VARIANTS: ERROR ===== */\r\n\r\n/* Subtle */\r\n.alert--error.alert--subtle {\r\n  background-color: var(--vtx-color-error-50);\r\n  color: var(--vtx-color-error-700);\r\n  border: 1px solid var(--vtx-color-error-200);\r\n}\r\n\r\n.alert--error.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--error.alert--filled {\r\n  background-color: var(--vtx-color-error-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-error-600);\r\n}\r\n\r\n.alert--error.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--error.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--error.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-error-700);\r\n  border: 2px solid var(--vtx-color-error-500);\r\n}\r\n\r\n.alert--error.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--error.alert--left-accent {\r\n  background-color: var(--vtx-color-error-50);\r\n  color: var(--vtx-color-error-700);\r\n  border: 1px solid var(--vtx-color-error-200);\r\n  border-left: 4px solid var(--vtx-color-error-600);\r\n}\r\n\r\n.alert--error.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* ===== VARIANTS: WARNING ===== */\r\n\r\n/* Subtle */\r\n.alert--warning.alert--subtle {\r\n  background-color: var(--vtx-color-warning-50);\r\n  color: var(--vtx-color-warning-700);\r\n  border: 1px solid var(--vtx-color-warning-200);\r\n}\r\n\r\n.alert--warning.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--warning.alert--filled {\r\n  background-color: var(--vtx-color-warning-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-warning-600);\r\n}\r\n\r\n.alert--warning.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--warning.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--warning.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-warning-700);\r\n  border: 2px solid var(--vtx-color-warning-500);\r\n}\r\n\r\n.alert--warning.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--warning.alert--left-accent {\r\n  background-color: var(--vtx-color-warning-50);\r\n  color: var(--vtx-color-warning-700);\r\n  border: 1px solid var(--vtx-color-warning-200);\r\n  border-left: 4px solid var(--vtx-color-warning-600);\r\n}\r\n\r\n.alert--warning.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n/* ===== VARIANTS: INFO ===== */\r\n\r\n/* Subtle */\r\n.alert--info.alert--subtle {\r\n  background-color: var(--vtx-color-info-50);\r\n  color: var(--vtx-color-info-700);\r\n  border: 1px solid var(--vtx-color-info-200);\r\n}\r\n\r\n.alert--info.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--info.alert--filled {\r\n  background-color: var(--vtx-color-info-600);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-info-600);\r\n}\r\n\r\n.alert--info.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--info.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--info.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-info-700);\r\n  border: 2px solid var(--vtx-color-info-500);\r\n}\r\n\r\n.alert--info.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--info.alert--left-accent {\r\n  background-color: var(--vtx-color-info-50);\r\n  color: var(--vtx-color-info-700);\r\n  border: 1px solid var(--vtx-color-info-200);\r\n  border-left: 4px solid var(--vtx-color-info-600);\r\n}\r\n\r\n.alert--info.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n/* ===== VARIANTS: NEUTRAL ===== */\r\n\r\n/* Subtle */\r\n.alert--neutral.alert--subtle {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n}\r\n\r\n.alert--neutral.alert--subtle .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Filled */\r\n.alert--neutral.alert--filled {\r\n  background-color: var(--vtx-color-neutral-700);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-neutral-700);\r\n}\r\n\r\n.alert--neutral.alert--filled .alert-icon {\r\n  color: white;\r\n}\r\n\r\n.alert--neutral.alert--filled .alert-close:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* Outlined */\r\n.alert--neutral.alert--outlined {\r\n  background-color: transparent;\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 2px solid var(--vtx-color-neutral-500);\r\n}\r\n\r\n.alert--neutral.alert--outlined .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Left Accent */\r\n.alert--neutral.alert--left-accent {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-800);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-left: 4px solid var(--vtx-color-neutral-600);\r\n}\r\n\r\n.alert--neutral.alert--left-accent .alert-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Warning colors need adjustment for better contrast */\r\n.alert--warning {\r\n  --vtx-color-warning-200: #fde68a;\r\n}\r\n");const Nn={success:n.jsx(F,{size:20}),error:n.jsx(W,{size:20}),warning:n.jsx(P,{size:20}),info:n.jsx(V,{size:20}),neutral:n.jsx(H,{size:20})},Cn=i.default.forwardRef(({children:e,title:t,description:a,variant:o="info",alertStyle:i="subtle",size:l,icon:c,dismissible:s=!1,onClose:d,action:x,fullWidth:v=!1,className:p="",style:m,role:u="alert",...g},f)=>{const{theme:b}=h(),w=l||(null==b?void 0:b.defaultSize)||"md",[y,k]=r.useState(!0);if(!y)return null;const j=!1!==c,_=void 0===c?Nn[o]:c,z=e||a;return n.jsxs("div",{ref:f,className:`\n          alert\n          alert--${o}\n          alert--${i}\n          alert--${w}\n          ${v?"alert--full-width":""}\n          ${p}\n        `.trim(),style:m,role:u,...g,children:[j&&n.jsx("div",{className:"alert-icon",children:_}),n.jsxs("div",{className:"alert-content",children:[t&&n.jsx("div",{className:"alert-title",children:t}),z&&n.jsx("div",{className:"alert-message",children:null!=e?e:a})]}),x&&n.jsx("div",{className:"alert-action",children:x}),s&&n.jsx("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==d||d()},"aria-label":"Close alert",children:n.jsx(rn,{size:16})})]})});Cn.displayName="Alert";const Sn=y(Cn);k("/* Flex Component */\n.vtx-flex {\n  display: flex;\n  gap: var(--vtx-flex-gap, 0);\n  row-gap: var(--vtx-flex-row-gap, var(--vtx-flex-gap, 0));\n  column-gap: var(--vtx-flex-column-gap, var(--vtx-flex-gap, 0));\n}\n\n/* Full width modifier */\n.vtx-flex--full-width {\n  width: 100%;\n}\n\n/* Inline variant */\n.vtx-flex--inline {\n  display: inline-flex;\n}\n\n/* Direction variants */\n.vtx-flex--column {\n  flex-direction: column;\n}\n\n.vtx-flex--row-reverse {\n  flex-direction: row-reverse;\n}\n\n.vtx-flex--column-reverse {\n  flex-direction: column-reverse;\n}\n\n/* Wrap variants */\n.vtx-flex--wrap {\n  flex-wrap: wrap;\n}\n\n.vtx-flex--wrap-reverse {\n  flex-wrap: wrap-reverse;\n}\n\n/* Justify content variants */\n.vtx-flex--justify-start {\n  justify-content: flex-start;\n}\n\n.vtx-flex--justify-end {\n  justify-content: flex-end;\n}\n\n.vtx-flex--justify-center {\n  justify-content: center;\n}\n\n.vtx-flex--justify-between {\n  justify-content: space-between;\n}\n\n.vtx-flex--justify-around {\n  justify-content: space-around;\n}\n\n.vtx-flex--justify-evenly {\n  justify-content: space-evenly;\n}\n\n/* Align items variants */\n.vtx-flex--align-start {\n  align-items: flex-start;\n}\n\n.vtx-flex--align-end {\n  align-items: flex-end;\n}\n\n.vtx-flex--align-center {\n  align-items: center;\n}\n\n.vtx-flex--align-baseline {\n  align-items: baseline;\n}\n\n.vtx-flex--align-stretch {\n  align-items: stretch;\n}\n\n/* Align content variants (for multi-line) */\n.vtx-flex--align-content-start {\n  align-content: flex-start;\n}\n\n.vtx-flex--align-content-end {\n  align-content: flex-end;\n}\n\n.vtx-flex--align-content-center {\n  align-content: center;\n}\n\n.vtx-flex--align-content-between {\n  align-content: space-between;\n}\n\n.vtx-flex--align-content-around {\n  align-content: space-around;\n}\n\n.vtx-flex--align-content-stretch {\n  align-content: stretch;\n}\n");const Mn=i.default.forwardRef(({children:r,direction:e="row",wrap:t="nowrap",justify:a="start",align:o="stretch",alignContent:i,gap:l,rowGap:c,columnGap:s,inline:d=!1,fullWidth:x=!1,grow:v,shrink:p,basis:m,className:h="",as:u="div",style:g,...f},b)=>{const w=u,y=["vtx-flex",d&&"vtx-flex--inline",x&&"vtx-flex--full-width","row"!==e&&`vtx-flex--${e}`,"nowrap"!==t&&`vtx-flex--${t}`,"start"!==a&&`vtx-flex--justify-${a}`,"stretch"!==o&&`vtx-flex--align-${o}`,i&&`vtx-flex--align-content-${i}`,h].filter(Boolean).join(" "),k={...g};return void 0!==l&&(k["--vtx-flex-gap"]="number"==typeof l?`${l}px`:l),void 0!==c&&(k["--vtx-flex-row-gap"]="number"==typeof c?`${c}px`:c),void 0!==s&&(k["--vtx-flex-column-gap"]="number"==typeof s?`${s}px`:s),void 0!==v&&(k.flexGrow=v),void 0!==p&&(k.flexShrink=p),void 0!==m&&(k.flexBasis="number"==typeof m?`${m}px`:m),n.jsx(w,{ref:b,className:y,style:k,...f,children:r})});Mn.displayName="Flex";const Tn=y(Mn);k("/* ===== Text Component Base Styles ===== */\n.vtx-text {\n  margin: 0;\n  padding: 0;\n  font-family: var(--vtx-font-family-sans);\n  color: inherit;\n  transition: color var(--vtx-transition-fast);\n}\n\n/* ===== Typography Variants ===== */\n\n/* ===== Headings with Fluid Typography ===== */\n.vtx-text--h1 {\n  font-size: clamp(2.25rem, 5vw + 1rem, 3.75rem);\n  font-weight: var(--vtx-text-h1-font-weight, 700);\n  line-height: var(--vtx-text-h1-line-height, 1.2);\n  letter-spacing: var(--vtx-text-h1-letter-spacing, -0.025em);\n  margin-bottom: clamp(1rem, 2vw + 0.5rem, 1.5rem);\n}\n\n.vtx-text--h2 {\n  font-size: clamp(1.875rem, 4vw + 0.75rem, 3rem);\n  font-weight: var(--vtx-text-h2-font-weight, 700);\n  line-height: var(--vtx-text-h2-line-height, 1.25);\n  letter-spacing: var(--vtx-text-h2-letter-spacing, -0.025em);\n  margin-bottom: clamp(0.875rem, 1.75vw + 0.5rem, 1.25rem);\n}\n\n.vtx-text--h3 {\n  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);\n  font-weight: var(--vtx-text-h3-font-weight, 600);\n  line-height: var(--vtx-text-h3-line-height, 1.3);\n  letter-spacing: var(--vtx-text-h3-letter-spacing, -0.025em);\n  margin-bottom: clamp(0.75rem, 1.5vw + 0.5rem, 1rem);\n}\n\n.vtx-text--h4 {\n  font-size: clamp(1.25rem, 2.5vw + 0.5rem, 1.875rem);\n  font-weight: var(--vtx-text-h4-font-weight, 600);\n  line-height: var(--vtx-text-h4-line-height, 1.35);\n  letter-spacing: var(--vtx-text-h4-letter-spacing, 0);\n  margin-bottom: clamp(0.75rem, 1.5vw + 0.25rem, 1rem);\n}\n\n.vtx-text--h5 {\n  font-size: clamp(1.125rem, 2vw + 0.25rem, 1.5rem);\n  font-weight: var(--vtx-text-h5-font-weight, 600);\n  line-height: var(--vtx-text-h5-line-height, 1.4);\n  letter-spacing: var(--vtx-text-h5-letter-spacing, 0);\n  margin-bottom: clamp(0.625rem, 1.25vw + 0.25rem, 0.75rem);\n}\n\n.vtx-text--h6 {\n  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.25rem);\n  font-weight: var(--vtx-text-h6-font-weight, 600);\n  line-height: var(--vtx-text-h6-line-height, 1.5);\n  letter-spacing: var(--vtx-text-h6-letter-spacing, 0);\n  margin-bottom: clamp(0.625rem, 1.25vw + 0.25rem, 0.75rem);\n}\n\n/* ===== Body Text with Responsive Sizing ===== */\n.vtx-text--body1 {\n  font-size: clamp(0.9375rem, 1vw + 0.125rem, 1rem);\n  font-weight: var(--vtx-text-body1-font-weight, 400);\n  line-height: var(--vtx-text-body1-line-height, 1.6);\n  letter-spacing: var(--vtx-text-body1-letter-spacing, 0);\n  margin-bottom: clamp(0.625rem, 1vw + 0.25rem, 0.75rem);\n}\n\n.vtx-text--body2 {\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\n  font-weight: var(--vtx-text-body2-font-weight, 400);\n  line-height: var(--vtx-text-body2-line-height, 1.6);\n  letter-spacing: var(--vtx-text-body2-letter-spacing, 0.01em);\n  margin-bottom: clamp(0.625rem, 1vw + 0.25rem, 0.75rem);\n}\n\n/* ===== Subtitles with Responsive Sizing ===== */\n.vtx-text--subtitle1 {\n  font-size: clamp(1rem, 1.25vw + 0.125rem, 1.125rem);\n  font-weight: var(--vtx-text-subtitle1-font-weight, 500);\n  line-height: var(--vtx-text-subtitle1-line-height, 1.5);\n  letter-spacing: var(--vtx-text-subtitle1-letter-spacing, 0.0075em);\n  margin-bottom: clamp(0.5rem, 0.75vw + 0.125rem, 0.625rem);\n}\n\n.vtx-text--subtitle2 {\n  font-size: clamp(0.9375rem, 1vw + 0.0625rem, 1rem);\n  font-weight: var(--vtx-text-subtitle2-font-weight, 500);\n  line-height: var(--vtx-text-subtitle2-line-height, 1.5);\n  letter-spacing: var(--vtx-text-subtitle2-letter-spacing, 0.01em);\n  margin-bottom: clamp(0.5rem, 0.75vw + 0.125rem, 0.625rem);\n}\n\n/* ===== Caption with Responsive Sizing ===== */\n.vtx-text--caption {\n  font-size: clamp(0.6875rem, 0.75vw + 0.0625rem, 0.75rem);\n  font-weight: var(--vtx-text-caption-font-weight, 400);\n  line-height: var(--vtx-text-caption-line-height, 1.5);\n  letter-spacing: var(--vtx-text-caption-letter-spacing, 0.025em);\n  color: var(--vtx-color-neutral-600);\n}\n\n/* ===== Overline with Responsive Sizing ===== */\n.vtx-text--overline {\n  font-size: clamp(0.6875rem, 0.75vw + 0.0625rem, 0.75rem);\n  font-weight: var(--vtx-text-overline-font-weight, 600);\n  line-height: var(--vtx-text-overline-line-height, 1.5);\n  letter-spacing: var(--vtx-text-overline-letter-spacing, 0.1em);\n  text-transform: uppercase;\n  color: var(--vtx-color-neutral-600);\n}\n\n/* ===== Button Text with Responsive Sizing ===== */\n.vtx-text--button {\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\n  font-weight: var(--vtx-text-button-font-weight, 600);\n  line-height: var(--vtx-text-button-line-height, 1.5);\n  letter-spacing: var(--vtx-text-button-letter-spacing, 0.025em);\n}\n\n/* ===== Label with Responsive Sizing ===== */\n.vtx-text--label {\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\n  font-weight: var(--vtx-text-label-font-weight, 500);\n  line-height: var(--vtx-text-label-line-height, 1.5);\n  letter-spacing: var(--vtx-text-label-letter-spacing, 0.0075em);\n  display: inline-block;\n  margin-bottom: clamp(0.375rem, 0.5vw + 0.125rem, 0.5rem);\n}\n\n/* ===== Text Alignment ===== */\n.vtx-text--align-left {\n  text-align: left;\n}\n\n.vtx-text--align-center {\n  text-align: center;\n}\n\n.vtx-text--align-right {\n  text-align: right;\n}\n\n.vtx-text--align-justify {\n  text-align: justify;\n}\n\n/* ===== Font Weights ===== */\n.vtx-text--weight-thin {\n  font-weight: var(--vtx-font-weight-thin, 100);\n}\n\n.vtx-text--weight-extralight {\n  font-weight: var(--vtx-font-weight-extralight, 200);\n}\n\n.vtx-text--weight-light {\n  font-weight: var(--vtx-font-weight-light, 300);\n}\n\n.vtx-text--weight-normal {\n  font-weight: var(--vtx-font-weight-normal, 400);\n}\n\n.vtx-text--weight-medium {\n  font-weight: var(--vtx-font-weight-medium, 500);\n}\n\n.vtx-text--weight-semibold {\n  font-weight: var(--vtx-font-weight-semibold, 600);\n}\n\n.vtx-text--weight-bold {\n  font-weight: var(--vtx-font-weight-bold, 700);\n}\n\n.vtx-text--weight-extrabold {\n  font-weight: var(--vtx-font-weight-extrabold, 800);\n}\n\n.vtx-text--weight-black {\n  font-weight: var(--vtx-font-weight-black, 900);\n}\n\n/* ===== Text Transform ===== */\n.vtx-text--transform-none {\n  text-transform: none;\n}\n\n.vtx-text--transform-uppercase {\n  text-transform: uppercase;\n}\n\n.vtx-text--transform-lowercase {\n  text-transform: lowercase;\n}\n\n.vtx-text--transform-capitalize {\n  text-transform: capitalize;\n}\n\n/* ===== Text Decoration ===== */\n.vtx-text--decoration-none {\n  text-decoration: none;\n}\n\n.vtx-text--decoration-underline {\n  text-decoration: underline;\n}\n\n.vtx-text--decoration-line-through {\n  text-decoration: line-through;\n}\n\n.vtx-text--decoration-overline {\n  text-decoration: overline;\n}\n\n/* ===== Text Utilities ===== */\n/* Truncation */\n.vtx-text--truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Line Clamp */\n.vtx-text--line-clamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* Break Word */\n.vtx-text--break-word {\n  word-break: break-word;\n  overflow-wrap: break-word;\n}\n\n/* Italic */\n.vtx-text--italic {\n  font-style: italic;\n}\n\n/* Underline */\n.vtx-text--underline {\n  text-decoration: underline;\n}\n\n/* Strikethrough */\n.vtx-text--strikethrough {\n  text-decoration: line-through;\n}\n\n/* Gradient Text */\n.vtx-text--gradient {\n  background-clip: text;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-size: 100%;\n}\n\n/* No Select */\n.vtx-text--no-select {\n  user-select: none;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n}\n\n/* ===== Dark Theme Support ===== */\n[data-theme='dark'] .vtx-text--caption,\n[data-theme='dark'] .vtx-text--overline {\n  color: var(--vtx-color-neutral-400);\n}\n\n/* ===== Responsive Breakpoint Adjustments ===== */\n\n/* Small Mobile: < 480px */\n@media (max-width: 479px) {\n  .vtx-text--h1 {\n    font-size: clamp(1.875rem, 8vw, 2.5rem);\n    line-height: 1.15;\n    margin-bottom: 0.875rem;\n  }\n\n  .vtx-text--h2 {\n    font-size: clamp(1.625rem, 7vw, 2.125rem);\n    line-height: 1.2;\n    margin-bottom: 0.75rem;\n  }\n\n  .vtx-text--h3 {\n    font-size: clamp(1.375rem, 6vw, 1.75rem);\n    line-height: 1.25;\n    margin-bottom: 0.625rem;\n  }\n\n  .vtx-text--h4,\n  .vtx-text--h5,\n  .vtx-text--h6 {\n    margin-bottom: 0.5rem;\n  }\n\n  .vtx-text--body1,\n  .vtx-text--body2 {\n    line-height: 1.65;\n  }\n}\n\n/* Mobile: 480px - 767px */\n@media (min-width: 480px) and (max-width: 767px) {\n  .vtx-text--h1 {\n    line-height: 1.15;\n  }\n\n  .vtx-text--h2 {\n    line-height: 1.2;\n  }\n\n  .vtx-text--body1,\n  .vtx-text--body2 {\n    line-height: 1.65;\n  }\n}\n/* Enhancements ===== */\n.vtx-text:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n  border-radius: var(--vtx-radius-sm);\n}\n\n/* Reduced motion support */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-text {\n    transition: none;\n    animation: none;\n  }\n}\n\n/* High contrast mode */\n@media (prefers-contrast: high) {\n  .vtx-text {\n    font-weight: 500;\n  }\n\n  .vtx-text--h1,\n  .vtx-text--h2,\n  .vtx-text--h3,\n  .vtx-text--h4,\n  .vtx-text--h5,\n  .vtx-text--h6 {\n    font-weight: 700;\n  }\n\n  .vtx-text--caption,\n  .vtx-text--overline {\n    opacity: 1;\n  }\n}\n\n/* ===== Container Query Support (Modern Browsers) ===== */\n@supports (container-type: inline-size) {\n  @container (max-width: 600px) {\n    .vtx-text--h1 {\n      font-size: clamp(1.875rem, 6vw, 2.5rem);\n    }\n\n    .vtx-text--h2 {\n      font-size: clamp(1.625rem, 5vw, 2.125rem);\n    }\n\n    .vtx-text--h3 {\n      font-size: clamp(1.375rem, 4vw, 1.75rem);\n    }\n  }\n}\n\n/* ===== Touch Device Optimizations ===== */\n@media (hover: none) and (pointer: coarse) {\n  .vtx-text--body1,\n  .vtx-text--body2 {\n    line-height: 1.65;\n    font-size: clamp(0.9375rem, 1.1vw + 0.125rem, 1.0625rem);\n  }\n\n  .vtx-text--button,\n  .vtx-text--label {\n    font-size: clamp(0.875rem, 1vw + 0.125rem, 0.9375rem);\n    line-height: 1.6;\n  }\n}\n\n/* ===== Very Small Screens (<= 320px) ===== */\n@media (max-width: 320px) {\n  .vtx-text--h1 {\n    font-size: 1.75rem;\n    line-height: 1.1;\n  }\n\n  .vtx-text--h2 {\n    font-size: 1.5rem;\n    line-height: 1.15;\n  }\n\n  .vtx-text--h3 {\n    font-size: 1.25rem;\n    line-height: 1.2;\n  }\n\n  .vtx-text--h4 {\n    font-size: 1.125rem;\n  }\n\n  .vtx-text--h5,\n  .vtx-text--h6 {\n    font-size: 1rem\n  };\n}\n\n/* Desktop: 1024px - 1439px */\n@media (min-width: 1024px) and (max-width: 1439px) {\n  .vtx-text--h1 {\n    line-height: 1.2;\n  }\n}\n\n/* Large Desktop: >= 1440px */\n@media (min-width: 1440px) {\n  .vtx-text--h1 {\n    letter-spacing: -0.03em;\n  }\n\n  .vtx-text--h2 {\n    letter-spacing: -0.03em;\n  }\n\n  .vtx-text--h3 {\n    letter-spacing: -0.03em;\n  }\n}\n\n/* ===== Landscape Mode Adjustments ===== */\n@media (max-width: 1023px) and (orientation: landscape) {\n  .vtx-text--h1,\n  .vtx-text--h2,\n  .vtx-text--h3 {\n    margin-bottom: 0.5rem;\n  }\n\n  .vtx-text--body1,\n  .vtx-text--body2 {\n    margin-bottom: 0.5rem;\n  }\n}\n\n/* ===== High Resolution Displays ===== */\n@media (min-resolution: 2dppx) {\n  .vtx-text {\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    text-rendering: optimizeLegibility;\n  }\n}\n\n/* ===== Print Styles ===== */\n@media print {\n  .vtx-text {\n    color: #000;\n  }\n\n  .vtx-text--gradient {\n    -webkit-text-fill-color: initial;\n    background-clip: initial;\n    -webkit-background-clip: initial;\n  }\n}\n\n/* ===== Utility Classes ===== */\n.vtx-text--no-margin {\n  margin: 0 !important;\n}\n\n.vtx-text--no-padding {\n  padding: 0 !important;\n}\n\n/* ===== Accessibility ===== */\n.vtx-text:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n  border-radius: var(--vtx-radius-sm);\n}\n\n/* Reduced motion support */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-text {\n    transition: none;\n  }\n}\n");const $n=l.forwardRef(({variant:n="body1",as:r,align:e,color:t,weight:a,transform:o,decoration:i,truncate:c=!1,lineClamp:s,breakWord:d=!1,italic:x=!1,underline:v=!1,strikethrough:p=!1,gradient:m,noSelect:h=!1,size:u,lineHeight:g,letterSpacing:f,noMargin:b=!1,noPadding:w=!1,className:y="",style:k,children:j,..._},z)=>{const N=r||(n=>({h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",body1:"p",body2:"p",subtitle1:"p",subtitle2:"p",caption:"span",overline:"span",button:"span",label:"label"}[n]))(n),C=["vtx-text",`vtx-text--${n}`,e&&`vtx-text--align-${e}`,a&&"string"==typeof a&&`vtx-text--weight-${a}`,o&&`vtx-text--transform-${o}`,i&&`vtx-text--decoration-${i}`,c&&"vtx-text--truncate",s&&"vtx-text--line-clamp",d&&"vtx-text--break-word",x&&"vtx-text--italic",v&&"vtx-text--underline",p&&"vtx-text--strikethrough",m&&"vtx-text--gradient",h&&"vtx-text--no-select",b&&"vtx-text--no-margin",w&&"vtx-text--no-padding",y].filter(Boolean).join(" "),S={...k};if(t)if(t.includes(".")){const[n,r]=t.split(".");S.color=`var(--vtx-color-${n}-${r})`}else S.color=t;if(a&&"number"==typeof a&&(S.fontWeight=a),s&&(S.WebkitLineClamp=s),m&&m.length>0){const n=1===m.length?m[0]:`linear-gradient(135deg, ${m.join(", ")})`;S.backgroundImage=n}return u&&(S.fontSize="number"==typeof u?`${u}px`:u),g&&(S.lineHeight="number"==typeof g?`${g}`:g),f&&(S.letterSpacing="number"==typeof f?`${f}px`:f),l.createElement(N,{ref:z,className:C,style:S,..._},j)});$n.displayName="Text";const In=y($n);k("/* Menu Component Styles */\n\n.vtx-menu-container {\n  position: relative;\n}\n\n/* Menu Toggle (Hamburger) */\n.vtx-menu-toggle {\n  display: none;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: var(--vtx-spacing-2);\n  background: transparent;\n  border: none;\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-text-primary);\n  cursor: pointer;\n  transition: all var(--vtx-transition-normal);\n}\n\n.vtx-menu-toggle:hover {\n  background: var(--vtx-background-hover);\n}\n\n.vtx-menu-toggle:active {\n  background: var(--vtx-background-active);\n}\n\n.vtx-menu-toggle:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Menu Container */\n.vtx-menu {\n  display: flex;\n  flex-direction: column;\n  background: var(--vtx-background-primary);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow: var(--vtx-shadow-sm);\n  overflow: hidden;\n}\n\n/* Vertical Menu (Default) */\n.vtx-menu--vertical {\n  flex-direction: column;\n  min-width: 200px;\n  padding: var(--vtx-spacing-2);\n  gap: var(--vtx-spacing-1);\n}\n\n/* Horizontal Menu */\n.vtx-menu--horizontal {\n  flex-direction: row;\n  padding: var(--vtx-spacing-2);\n  gap: var(--vtx-spacing-1);\n  box-shadow: none;\n  border-radius: 0;\n}\n\n/* Menu Item - Professional Sidebar Style */\n.vtx-menu-item {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  margin-bottom: var(--vtx-spacing-1);\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-color-neutral-700);\n  background: transparent;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  user-select: none;\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  border-left: 3px solid transparent;\n}\n\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item:active:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.98);\n}\n\n.vtx-menu-item:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n/* Active Menu Item - Professional Style */\n.vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-menu-item--active:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Disabled Menu Item */\n.vtx-menu-item--disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Danger Variant */\n.vtx-menu-item--danger {\n  color: var(--vtx-color-danger-600);\n}\n\n.vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\n  background: var(--vtx-color-danger-50);\n}\n\n.vtx-menu-item--danger:active:not(.vtx-menu-item--disabled) {\n  background: var(--vtx-color-danger-100);\n}\n\n/* Menu Item Icon */\n.vtx-menu-item-icon,\n.vtx-menu-item-right-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.vtx-menu-item-icon svg,\n.vtx-menu-item-right-icon svg {\n  width: 100%;\n  height: 100%;\n  transition: inherit;\n}\n\n.vtx-menu-item-icon {\n  color: var(--vtx-color-neutral-600);\n  transition: color 0.15s ease-in-out;\n}\n\n.vtx-menu-item:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Shortcut */\n.vtx-menu-item-shortcut {\n  opacity: 0.6;\n  font-size: var(--vtx-font-size-xs);\n  white-space: nowrap;\n}\n\n/* Menu Divider */\n.vtx-menu-divider {\n  height: 1px;\n  margin: var(--vtx-spacing-2) 0;\n  background: var(--vtx-border-color);\n}\n\n.vtx-menu--horizontal .vtx-menu-divider {\n  width: 1px;\n  height: auto;\n  margin: 0 var(--vtx-spacing-2);\n}\n\n/* Submenu Styles - Inline Expansion for Sidebar */\n.vtx-menu-item--has-submenu {\n  position: relative;\n}\n\n.vtx-submenu {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  padding-left: var(--vtx-spacing-5);\n  margin-top: var(--vtx-spacing-2);\n  margin-bottom: var(--vtx-spacing-2);\n  animation: slideDown 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.vtx-submenu .vtx-menu-item {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\n  padding-left: var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-normal);\n  margin-bottom: var(--vtx-spacing-1);\n}\n\n.vtx-submenu .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-600);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-600);\n}\n\n.vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Nested submenu - additional indentation */\n.vtx-submenu .vtx-submenu {\n  padding-left: var(--vtx-spacing-4);\n}\n\n/* Submenu Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    max-height: 0;\n    transform: translateY(-4px);\n  }\n  to {\n    opacity: 1;\n    max-height: 1000px;\n    transform: translateY(0);\n  }\n}\n\n/* Responsive Styles */\n@media (max-width: 768px) {\n  .vtx-menu--responsive .vtx-menu-toggle {\n    display: flex;\n  }\n\n  .vtx-menu--responsive.vtx-menu {\n    position: absolute;\n    top: 48px;\n    left: 0;\n    right: 0;\n    z-index: 1000;\n    display: none;\n    min-width: 100%;\n    max-height: calc(100vh - 64px);\n    overflow-y: auto;\n    box-shadow: var(--vtx-shadow-lg);\n    animation: slideDown 0.2s ease-out;\n  }\n\n  .vtx-menu--responsive.vtx-menu--mobile-open {\n    display: flex;\n  }\n\n  /* Force vertical layout on mobile */\n  .vtx-menu--responsive.vtx-menu--horizontal {\n    flex-direction: column;\n    padding: var(--vtx-spacing-2);\n    gap: var(--vtx-spacing-1);\n    border-radius: var(--vtx-radius-lg);\n  }\n\n  .vtx-menu--responsive.vtx-menu--horizontal .vtx-menu-divider {\n    width: auto;\n    height: 1px;\n    margin: var(--vtx-spacing-2) 0;\n  }\n}\n\n/* Slide Down Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Dark Mode - Professional Style */\n[data-theme='dark'] .vtx-menu {\n  background: var(--vtx-background-primary);\n  box-shadow: var(--vtx-shadow-lg);\n}\n\n[data-theme='dark'] .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark']\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active)\n  .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-300);\n}\n\n[data-theme='dark'] .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-800);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--active:hover .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--danger {\n  color: var(--vtx-color-danger-400);\n}\n\n[data-theme='dark'] .vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\n  background: rgba(var(--vtx-color-danger-rgb), 0.15);\n}\n\n[data-theme='dark']\n  .vtx-submenu\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active {\n  background-color: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active:hover {\n  background-color: var(--vtx-color-primary-800);\n  color: var(--vtx-color-primary-400);\n  font-weight: 600;\n  border-left-color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\n  color: var(--vtx-color-primary-400);\n}\n\n/* Reduced Motion */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-menu-item,\n  .vtx-menu-toggle {\n    transition: none;\n  }\n\n  .vtx-submenu {\n    animation: none;\n  }\n\n  @keyframes slideDown {\n    from,\n    to {\n      opacity: 1;\n      max-height: 1000px;\n      transform: translateY(0);\n    }\n  }\n}\n");const Dn=({isOpen:r})=>r?n.jsx(L,{size:16}):n.jsx(I,{size:16}),An=i.default.forwardRef(({label:e,onClick:t,icon:a,rightIcon:o,disabled:i=!1,active:l=!1,variant:c="default",shortcut:s,divider:d=!1,items:x},v)=>{const[p,m]=r.useState(!1),h=r.useRef(null),u=x&&x.length>0,g=o||(u?n.jsx(Dn,{isOpen:p}):null);return n.jsxs(n.Fragment,{children:[n.jsx("div",{ref:v||h,className:["vtx-menu-item",l&&"vtx-menu-item--active",i&&"vtx-menu-item--disabled","default"!==c&&`vtx-menu-item--${c}`,u&&"vtx-menu-item--has-submenu",p&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{i||(u?m(!p):t&&t())},onKeyDown:n=>{i||("Enter"===n.key||" "===n.key?(n.preventDefault(),u?m(!p):null==t||t()):"ArrowDown"===n.key&&u&&!p?(n.preventDefault(),m(!0)):"ArrowUp"===n.key&&u&&p&&(n.preventDefault(),m(!1)))},role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-haspopup":u?"menu":void 0,"aria-expanded":u?p:void 0,children:n.jsxs(Tn,{align:"center",gap:8,style:{flex:1},children:[a&&n.jsx("span",{className:"vtx-menu-item-icon",children:a}),n.jsx(In,{variant:"body2",noMargin:!0,style:{flex:1},children:e}),s&&n.jsx(In,{variant:"caption",color:"neutral.500",noMargin:!0,className:"vtx-menu-item-shortcut",children:s}),g&&n.jsx("span",{className:"vtx-menu-item-right-icon",children:g})]})}),u&&p&&n.jsx("div",{className:"vtx-submenu",role:"menu",children:x.map((r,e)=>n.jsx(An,{...r},e))}),d&&n.jsx("div",{className:"vtx-menu-divider",role:"separator"})]})});An.displayName="MenuItem";const En=i.default.forwardRef(({items:e,children:t,orientation:a="vertical",responsive:o=!0,className:i="",width:l},c)=>{const[s,d]=r.useState(!1),x=r.useRef(null);r.useEffect(()=>{if(!o||!s)return;const n=n=>{x.current&&!x.current.contains(n.target)&&d(!1)};return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[o,s]),r.useEffect(()=>{if(!o||!s)return;const n=n=>{"Escape"===n.key&&d(!1)};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[o,s]);const v=e?e.map((r,e)=>n.jsx(An,{...r},e)):t,p=["vtx-menu",`vtx-menu--${a}`,o&&"vtx-menu--responsive",s&&"vtx-menu--mobile-open",i].filter(Boolean).join(" "),m={width:"vertical"===a&&l?"number"==typeof l?`${l}px`:l:void 0};return n.jsxs("div",{ref:x,className:"vtx-menu-container",children:[o&&n.jsx("button",{className:"vtx-menu-toggle",onClick:()=>d(!s),"aria-label":"Toggle menu","aria-expanded":s,children:s?n.jsx(rn,{size:24}):n.jsx(R,{size:24})}),n.jsx("div",{ref:c,className:p,role:"menu",style:m,children:v})]})});En.displayName="Menu";const Rn=y(En);k("/* ===== Modal Component - Professional Design ===== */\r\n\r\n/* Backdrop */\r\n.vtx-modal-backdrop {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  background: var(--vtx-modal-backdrop-bg, rgba(15, 23, 42, 0.75));\r\n  backdrop-filter: var(--vtx-modal-backdrop-blur, blur(4px));\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: var(--vtx-z-modal, 1200);\r\n  padding: var(--vtx-modal-backdrop-padding, var(--vtx-spacing-4));\r\n  animation: vtx-modal-backdrop-fade-in var(--vtx-transition-slow, 300ms)\r\n    cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-modal-backdrop--transparent {\r\n  background: transparent;\r\n  backdrop-filter: none;\r\n}\r\n\r\n@keyframes vtx-modal-backdrop-fade-in {\r\n  from {\r\n    opacity: 0;\r\n    backdrop-filter: blur(0);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    backdrop-filter: blur(4px);\r\n  }\r\n}\r\n\r\n/* Modal Container */\r\n.vtx-modal {\r\n  position: relative;\r\n  background: var(--vtx-modal-bg, var(--vtx-color-neutral-50));\r\n  border-radius: var(--vtx-modal-radius, var(--vtx-radius-xl, 12px));\r\n  box-shadow: var(\r\n    --vtx-modal-shadow,\r\n    0 20px 25px -5px rgba(0, 0, 0, 0.1),\r\n    0 10px 10px -5px rgba(0, 0, 0, 0.04),\r\n    0 0 0 1px rgba(0, 0, 0, 0.05)\r\n  );\r\n  display: flex;\r\n  flex-direction: column;\r\n  max-height: calc(100vh - var(--vtx-modal-max-height-offset, var(--vtx-spacing-8)));\r\n  overflow: hidden;\r\n  animation: vtx-modal-slide-up var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n  transform-origin: center center;\r\n}\r\n\r\n@keyframes vtx-modal-slide-up {\r\n  from {\r\n    transform: translateY(var(--vtx-modal-slide-distance, 32px)) scale(0.96);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0) scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Size Variants */\r\n.vtx-modal--sm {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-sm, 400px);\r\n}\r\n\r\n.vtx-modal--md {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-md, 600px);\r\n}\r\n\r\n.vtx-modal--lg {\r\n  width: 100%;\r\n  max-width: var(--vtx-modal-width-lg, 900px);\r\n}\r\n\r\n.vtx-modal--fullscreen {\r\n  width: 100%;\r\n  height: calc(100vh - var(--vtx-modal-max-height-offset, var(--vtx-spacing-8)));\r\n  max-width: none;\r\n  border-radius: var(--vtx-modal-fullscreen-radius, var(--vtx-radius-lg, 8px));\r\n}\r\n\r\n/* Header - Uses Flex component */\r\n.vtx-modal-header {\r\n  padding: var(--vtx-modal-header-padding, var(--vtx-spacing-3));\r\n  background: var(--vtx-modal-header-bg, transparent);\r\n  border-bottom: var(--vtx-modal-header-border, 1px solid var(--vtx-color-neutral-200));\r\n}\r\n\r\n/* Close button alignment fix */\r\n.vtx-modal-close {\r\n  margin-right: calc(var(--vtx-spacing-1) * -2);\r\n}\r\n\r\n/* Body */\r\n.vtx-modal-body {\r\n  flex: 1;\r\n  overflow-y: auto;\r\n  padding: var(--vtx-modal-body-padding, var(--vtx-spacing-3));\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-modal-body-size, var(--vtx-font-size-base, 1rem));\r\n  color: var(--vtx-modal-body-color, var(--vtx-color-neutral-700));\r\n  line-height: var(--vtx-modal-body-line-height, var(--vtx-line-height-relaxed, 1.625));\r\n\r\n  /* Custom scrollbar */\r\n  scrollbar-width: thin;\r\n  scrollbar-color: var(--vtx-color-neutral-300) transparent;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar {\r\n  width: 8px;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300);\r\n  border-radius: 4px;\r\n}\r\n\r\n.vtx-modal-body::-webkit-scrollbar-thumb:hover {\r\n  background: var(--vtx-color-neutral-400);\r\n}\r\n\r\n/* Footer - Uses Flex component */\r\n.vtx-modal-footer {\r\n  padding: var(--vtx-modal-footer-padding, var(--vtx-spacing-3));\r\n  background: var(--vtx-modal-footer-bg, var(--vtx-color-neutral-50));\r\n  border-top: var(--vtx-modal-footer-border, 1px solid var(--vtx-color-neutral-200));\r\n}\r\n\r\n/* Scrollable Variant */\r\n.vtx-modal--scrollable .vtx-modal-body {\r\n  max-height: var(--vtx-modal-scrollable-max-height, 60vh);\r\n}\r\n\r\n/* Animation Variants */\r\n.vtx-modal--zoom {\r\n  animation: vtx-modal-zoom var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n}\r\n\r\n@keyframes vtx-modal-zoom {\r\n  from {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--slide-down {\r\n  animation: vtx-modal-slide-down var(--vtx-transition-slow, 300ms) cubic-bezier(0.16, 1, 0.3, 1);\r\n}\r\n\r\n@keyframes vtx-modal-slide-down {\r\n  from {\r\n    transform: translateY(-32px) scale(0.96);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0) scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--fade {\r\n  animation: vtx-modal-fade var(--vtx-transition-slow, 300ms) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n@keyframes vtx-modal-fade {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-modal--none {\r\n  animation: none;\r\n}\r\n\r\n/* Dark Mode */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-modal {\r\n    background: var(--vtx-modal-bg-dark, var(--vtx-color-neutral-800));\r\n    box-shadow: var(\r\n      --vtx-modal-shadow-dark,\r\n      0 20px 25px -5px rgba(0, 0, 0, 0.4),\r\n      0 10px 10px -5px rgba(0, 0, 0, 0.3),\r\n      0 0 0 1px rgba(255, 255, 255, 0.1)\r\n    );\r\n  }\r\n\r\n  .vtx-modal-backdrop {\r\n    background: var(--vtx-modal-backdrop-bg-dark, rgba(0, 0, 0, 0.85));\r\n  }\r\n\r\n  .vtx-modal-header {\r\n    border-bottom-color: var(--vtx-modal-header-border-dark, var(--vtx-color-neutral-700));\r\n  }\r\n\r\n  .vtx-modal-body {\r\n    color: var(--vtx-modal-body-color-dark, var(--vtx-color-neutral-300));\r\n  }\r\n\r\n  .vtx-modal-footer {\r\n    background: var(--vtx-modal-footer-bg-dark, var(--vtx-color-neutral-800));\r\n    border-top-color: var(--vtx-modal-footer-border-dark, var(--vtx-color-neutral-700));\r\n  }\r\n\r\n  .vtx-modal-close {\r\n    color: var(--vtx-modal-close-color-dark, var(--vtx-color-neutral-400));\r\n  }\r\n\r\n  .vtx-modal-close:hover {\r\n    background: var(--vtx-modal-close-hover-bg-dark, var(--vtx-color-neutral-700));\r\n    color: var(--vtx-modal-close-hover-color-dark, var(--vtx-color-neutral-200));\r\n  }\r\n\r\n  .vtx-modal-body::-webkit-scrollbar-thumb {\r\n    background: var(--vtx-color-neutral-600);\r\n  }\r\n\r\n  .vtx-modal-body::-webkit-scrollbar-thumb:hover {\r\n    background: var(--vtx-color-neutral-500);\r\n  }\r\n}\r\n\r\n/* Responsive Design */\r\n@media (max-width: 640px) {\r\n  .vtx-modal-backdrop {\r\n    padding: 0;\r\n  }\r\n\r\n  .vtx-modal {\r\n    width: 100%;\r\n    max-width: 100%;\r\n    min-height: 100vh;\r\n    max-height: 100vh;\r\n    border-radius: 0;\r\n    animation: vtx-modal-slide-up-mobile var(--vtx-transition-slow, 300ms)\r\n      cubic-bezier(0.16, 1, 0.3, 1);\r\n  }\r\n\r\n  @keyframes vtx-modal-slide-up-mobile {\r\n    from {\r\n      transform: translateY(100%);\r\n    }\r\n    to {\r\n      transform: translateY(0);\r\n    }\r\n  }\r\n\r\n  .vtx-modal--sm,\r\n  .vtx-modal--md,\r\n  .vtx-modal--lg {\r\n    max-width: 100%;\r\n    border-radius: 0;\r\n  }\r\n\r\n  .vtx-modal-header {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .vtx-modal-body {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .vtx-modal-footer {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  /* Stack footer buttons vertically on mobile */\r\n  .vtx-modal-footer.vtx-flex {\r\n    flex-direction: column;\r\n  }\r\n\r\n  .vtx-modal-footer > * {\r\n    width: 100%;\r\n  }\r\n}\r\n\r\n/* High Contrast Mode */\r\n@media (prefers-contrast: high) {\r\n  .vtx-modal {\r\n    border: 2px solid currentColor;\r\n  }\r\n\r\n  .vtx-modal-close:focus-visible {\r\n    outline-width: 3px;\r\n  }\r\n}\r\n\r\n/* Reduced Motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-modal,\r\n  .vtx-modal-backdrop {\r\n    animation-duration: 1ms;\r\n  }\r\n\r\n  .vtx-modal-close:hover {\r\n    transform: none;\r\n  }\r\n}\r\n");const Ln=i.default.forwardRef(({isOpen:e,onClose:a,title:o,description:i,children:l,header:c,footer:s,footerButtons:d,size:x,closeOnBackdropClick:v=!0,closeOnEscape:p=!0,showCloseButton:m=!0,transparentBackdrop:u=!1,className:g="",backdropClassName:f="",preventScroll:b=!0,animation:w="fade",onAfterOpen:y,onAfterClose:k,scrollable:j=!1,centered:z=!0},N)=>{const C=r.useRef(null),S=r.useRef(null),{theme:M}=h();let T="md";if(x?T=x:(null==M?void 0:M.defaultSize)&&(T=M.defaultSize),ln(C,e),sn(b&&e),cn(()=>{p&&e&&a()}),r.useEffect(()=>{e?(S.current=document.activeElement,null==y||y()):S.current&&(S.current.focus(),null==k||k())},[e,y,k]),!e)return null;const $=["vtx-modal-backdrop",u&&"vtx-modal-backdrop--transparent",z&&"vtx-modal-backdrop--centered",`vtx-modal-backdrop--${w}`,f].filter(Boolean).join(" "),I=["vtx-modal",`vtx-modal--${T}`,j&&"vtx-modal--scrollable",`vtx-modal--${w}`,g].filter(Boolean).join(" "),D=n.jsx("div",{className:$,onClick:n=>{v&&n.target===n.currentTarget&&a()},role:"presentation",children:n.jsxs("div",{ref:n=>{C.current=n,"function"==typeof N?N(n):N&&(N.current=n)},className:I,role:"dialog","aria-modal":"true","aria-labelledby":o?"vtx-modal-title":void 0,"aria-describedby":i?"vtx-modal-description":void 0,children:[c?n.jsx("div",{className:"vtx-modal-header",children:c}):o||m?n.jsxs(Tn,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[o&&n.jsxs(Tn,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[n.jsx(In,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:o}),i&&n.jsx(In,{variant:"body2",color:"neutral.600",id:"vtx-modal-description",noMargin:!0,children:i})]}),m&&n.jsx(_,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:a,"aria-label":"Close modal",children:n.jsx(rn,{size:20})})]}):null,n.jsx(Tn,{direction:"column",className:"vtx-modal-body",children:l}),(s||d)&&n.jsx(Tn,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:d?d.map((r,e)=>n.jsx(_,{variant:r.variant||"secondary",size:r.size||(null==M?void 0:M.defaultSize)||"md",loading:r.loading,disabled:r.disabled,onClick:r.onClick,children:r.label},e)):s})]})});return t.createPortal(D,document.body)});Ln.displayName="Modal";const Bn=y(Ln);k("/* ===== Toast Component Styles ===== */\n.vtx-toast {\n  --vtx-toast-animation-duration: 300ms;\n\n  display: flex;\n  flex-direction: column;\n  min-width: 300px;\n  max-width: 500px;\n  padding: 0;\n  margin: 0;\n  background: var(--vtx-color-neutral-50);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow: var(--vtx-shadow-lg);\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  color: var(--vtx-color-neutral-900);\n  pointer-events: auto;\n  overflow: hidden;\n  position: relative;\n  animation: vtx-toast-enter var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\n    forwards;\n}\n\n.vtx-toast--exiting {\n  animation: vtx-toast-exit var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\n    forwards;\n}\n\n/* ===== Toast Variants ===== */\n.vtx-toast--success {\n  border-left: 4px solid var(--vtx-color-success-500);\n}\n\n.vtx-toast--error {\n  border-left: 4px solid var(--vtx-color-error-500);\n}\n\n.vtx-toast--warning {\n  border-left: 4px solid var(--vtx-color-warning-500);\n}\n\n.vtx-toast--info {\n  border-left: 4px solid var(--vtx-color-info-500);\n}\n\n.vtx-toast--default {\n  border-left: 4px solid var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary {\n  background: var(--vtx-color-neutral-50);\n  color: var(--vtx-color-primary-600);\n  border: 1px solid var(--vtx-color-primary-200);\n  border-left: 4px solid var(--vtx-color-primary-500);\n}\n\n/* ===== Toast Wrapper ===== */\n.vtx-toast__wrapper {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-4);\n  min-height: 64px;\n}\n\n/* ===== Toast Icon ===== */\n.vtx-toast__icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.vtx-toast--success .vtx-toast__icon {\n  color: var(--vtx-color-success-600);\n}\n\n.vtx-toast--error .vtx-toast__icon {\n  color: var(--vtx-color-error-600);\n}\n\n.vtx-toast--warning .vtx-toast__icon {\n  color: var(--vtx-color-warning-600);\n}\n\n.vtx-toast--info .vtx-toast__icon {\n  color: var(--vtx-color-info-600);\n}\n\n.vtx-toast--default .vtx-toast__icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* ===== Toast Content ===== */\n.vtx-toast__content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-1);\n  min-width: 0; /* Allow content to shrink */\n}\n\n.vtx-toast__title {\n  font-weight: var(--vtx-font-weight-semibold);\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.4;\n  color: var(--vtx-color-neutral-900);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__title {\n  color: var(--vtx-color-primary-700);\n}\n\n.vtx-toast__description {\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.5;\n  color: var(--vtx-color-neutral-700);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__description {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast__body {\n  font-size: var(--vtx-font-size-sm);\n  line-height: 1.5;\n  color: var(--vtx-color-neutral-800);\n  margin: 0;\n}\n\n.vtx-toast--primary .vtx-toast__body {\n  color: var(--vtx-color-primary-700);\n}\n\n/* ===== Toast Actions ===== */\n.vtx-toast__actions {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-2);\n  flex-shrink: 0;\n}\n\n.vtx-toast__action {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\n  background: transparent;\n  border: 1px solid var(--vtx-color-primary-500);\n  border-radius: var(--vtx-radius-base);\n  color: var(--vtx-color-primary-600);\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: 1;\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n  text-decoration: none;\n  white-space: nowrap;\n}\n\n.vtx-toast__action:hover {\n  background: var(--vtx-color-primary-50);\n  border-color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast__action:focus {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n.vtx-toast--primary .vtx-toast__action {\n  border-color: var(--vtx-color-primary-500);\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__action:hover {\n  background: var(--vtx-color-primary-50);\n  border-color: var(--vtx-color-primary-600);\n}\n\n.vtx-toast--primary .vtx-toast__action:focus {\n  outline-color: var(--vtx-color-primary-500);\n}\n\n.vtx-toast__close {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  background: transparent;\n  border: none;\n  border-radius: var(--vtx-radius-base);\n  color: var(--vtx-color-neutral-500);\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n  flex-shrink: 0;\n}\n\n.vtx-toast__close:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-700);\n}\n\n.vtx-toast__close:focus {\n  outline: 2px solid var(--vtx-color-primary-500);\n  outline-offset: 2px;\n}\n\n.vtx-toast--primary .vtx-toast__close {\n  color: var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary .vtx-toast__close:hover {\n  background: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-700);\n}\n\n.vtx-toast--primary .vtx-toast__close:focus {\n  outline-color: var(--vtx-color-primary-500);\n}\n\n/* ===== Progress Bar ===== */\n.vtx-toast__progress-container {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 4px;\n  background: var(--vtx-color-neutral-200);\n  overflow: hidden;\n}\n\n.vtx-toast__progress {\n  height: 100%;\n  background: currentColor;\n  transform-origin: left;\n  transition: transform 16ms linear;\n}\n\n.vtx-toast--success .vtx-toast__progress {\n  background: var(--vtx-color-success-500);\n}\n\n.vtx-toast--error .vtx-toast__progress {\n  background: var(--vtx-color-error-500);\n}\n\n.vtx-toast--warning .vtx-toast__progress {\n  background: var(--vtx-color-warning-500);\n}\n\n.vtx-toast--info .vtx-toast__progress {\n  background: var(--vtx-color-info-500);\n}\n\n.vtx-toast--default .vtx-toast__progress {\n  background: var(--vtx-color-primary-500);\n}\n\n.vtx-toast--primary .vtx-toast__progress {\n  background: var(--vtx-color-primary-500);\n}\n\n/* ===== Toast Animations ===== */\n@keyframes vtx-toast-enter {\n  from {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes vtx-toast-exit {\n  from {\n    opacity: 1;\n    transform: translateX(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateX(100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n/* Position-specific animations */\n.vtx-toast-container--top-left .vtx-toast,\n.vtx-toast-container--bottom-left .vtx-toast {\n  animation-name: vtx-toast-enter-left;\n}\n\n.vtx-toast-container--top-left .vtx-toast--exiting,\n.vtx-toast-container--bottom-left .vtx-toast--exiting {\n  animation-name: vtx-toast-exit-left;\n}\n\n@keyframes vtx-toast-enter-left {\n  from {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes vtx-toast-exit-left {\n  from {\n    opacity: 1;\n    transform: translateX(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateX(-100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n.vtx-toast-container--top-center .vtx-toast,\n.vtx-toast-container--bottom-center .vtx-toast {\n  animation-name: vtx-toast-enter-center;\n}\n\n.vtx-toast-container--top-center .vtx-toast--exiting,\n.vtx-toast-container--bottom-center .vtx-toast--exiting {\n  animation-name: vtx-toast-exit-center;\n}\n\n@keyframes vtx-toast-enter-center {\n  from {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes vtx-toast-exit-center {\n  from {\n    opacity: 1;\n    transform: translateY(0);\n    max-height: 200px;\n    margin-bottom: var(--vtx-toast-gap, 12px);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(-100%);\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n/* ===== Dark Theme Support ===== */\n[data-vtx-toast-theme='dark'] .vtx-toast {\n  background: var(--vtx-color-neutral-800);\n  border-color: var(--vtx-color-neutral-700);\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__title {\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__description {\n  color: var(--vtx-color-neutral-300);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__body {\n  color: var(--vtx-color-neutral-200);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__close {\n  color: var(--vtx-color-neutral-400);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__close:hover {\n  background: var(--vtx-color-neutral-700);\n  color: var(--vtx-color-neutral-200);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__progress-container {\n  background: var(--vtx-color-neutral-600);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__action {\n  border-color: var(--vtx-color-primary-400);\n  color: var(--vtx-color-primary-400);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast__action:hover {\n  background: var(--vtx-color-primary-900);\n  border-color: var(--vtx-color-primary-300);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary {\n  background: var(--vtx-color-primary-500);\n  color: white;\n  border: 1px solid var(--vtx-color-primary-500);\n  border-left: 4px solid var(--vtx-color-primary-600);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__icon {\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__title {\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__description {\n  color: rgba(255, 255, 255, 0.9);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__body {\n  color: rgba(255, 255, 255, 0.95);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close {\n  color: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:hover {\n  background: rgba(255, 255, 255, 0.1);\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:focus {\n  outline-color: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__progress {\n  background: rgba(255, 255, 255, 0.8);\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action {\n  border-color: rgba(255, 255, 255, 0.6);\n  color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:hover {\n  background: rgba(255, 255, 255, 0.1);\n  border-color: white;\n}\n\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:focus {\n  outline-color: rgba(255, 255, 255, 0.8);\n}\n\n/* ===== Responsive Design ===== */\n@media (max-width: 640px) {\n  .vtx-toast {\n    min-width: 280px;\n    max-width: calc(100vw - 32px);\n    margin: 0;\n  }\n\n  .vtx-toast__wrapper {\n    padding: var(--vtx-spacing-3);\n  }\n\n  .vtx-toast__actions {\n    gap: var(--vtx-spacing-1);\n  }\n\n  .vtx-toast__action {\n    font-size: var(--vtx-font-size-xs);\n    padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  }\n}\n\n/* ===== High Contrast Mode ===== */\n@media (prefers-contrast: high) {\n  .vtx-toast {\n    border-width: 2px;\n  }\n\n  .vtx-toast__close:focus,\n  .vtx-toast__action:focus {\n    outline-width: 3px;\n  }\n}\n\n/* ===== Reduced Motion ===== */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-toast {\n    animation-duration: 1ms;\n  }\n\n  .vtx-toast__progress {\n    transition: none;\n  }\n}\n");const On={success:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm-2 15l-5-5 1.414-1.414L8 12.172l7.586-7.586L17 6l-9 9z",fill:"currentColor"})}),error:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm5 13.59L13.59 15 10 11.41 6.41 15 5 13.59 8.59 10 5 6.41 6.41 5 10 8.59 13.59 5 15 6.41 11.41 10 15 13.59z",fill:"currentColor"})}),warning:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-2h2v2zm0-4H9V5h2v6z",fill:"currentColor"})}),info:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9V9h2v6zm0-8H9V5h2v2z",fill:"currentColor"})}),default:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9V9h2v6zm0-8H9V5h2v2z",fill:"currentColor"})}),primary:n.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-6h2v6zm0-8H9V5h2v2z",fill:"currentColor"})})},Fn=i.default.forwardRef(({children:e,onDismiss:t,id:a,variant:o="default",autoClose:l=5e3,closeButton:c=!0,progressBar:s=!0,pauseOnHover:d=!0,pauseOnFocusLoss:x=!0,icon:v,action:p,className:m="",style:h,title:u,description:g,animationDuration:f=300,isVisible:b,createdAt:w,onClose:y,onOpen:k,toastId:j,..._},z)=>{const[N,C]=r.useState(!1),[S,M]=r.useState(!1),[T,I]=r.useState(100),D=r.useRef(null),A=r.useRef(Date.now()),E=r.useRef(0),R=i.default.useCallback(()=>{C(!0),setTimeout(()=>{t()},f)},[t,f]);r.useEffect(()=>{if(!1===l||S)return;return D.current=setInterval(()=>{const n=Date.now()-A.current-E.current,r=Math.max(0,l-n);I(r/l*100),r<=0&&R()},16),()=>{D.current&&clearInterval(D.current)}},[l,S,R]);const L=["vtx-toast",`vtx-toast--${o}`,N&&"vtx-toast--exiting",m].filter(Boolean).join(" ");return n.jsxs("div",{ref:z,className:L,style:{...h,"--vtx-toast-animation-duration":`${f}ms`},onMouseEnter:()=>{d&&!S&&(M(!0),E.current=Date.now())},onMouseLeave:()=>{if(d&&S){M(!1);const n=Date.now()-E.current;A.current+=n}},onFocus:()=>{if(x&&S){M(!1);const n=Date.now()-E.current;A.current+=n}},onBlur:()=>{x&&!S&&(M(!0),E.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":a,..._,children:[n.jsxs("div",{className:"vtx-toast__wrapper",children:[!1===v?null:v?n.jsx("div",{className:"vtx-toast__icon",children:v}):n.jsx("div",{className:"vtx-toast__icon",children:On[o]}),u||g?n.jsxs("div",{className:"vtx-toast__content",children:[u&&n.jsx("div",{className:"vtx-toast__title",children:u}),g&&n.jsx("div",{className:"vtx-toast__description",children:g}),e&&n.jsx("div",{className:"vtx-toast__body",children:e})]}):n.jsx("div",{className:"vtx-toast__content",children:e}),n.jsxs("div",{className:"vtx-toast__actions",children:[p&&n.jsx("button",{className:"vtx-toast__action",onClick:p.onClick,type:"button",children:p.label}),c&&n.jsx("button",{className:"vtx-toast__close",onClick:R,type:"button","aria-label":"Close notification",children:n.jsx($,{size:16})})]})]}),s&&!1!==l&&n.jsx("div",{className:"vtx-toast__progress-container",children:n.jsx("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${T/100})`,animationPlayState:S?"paused":"running"}})})]})});Fn.displayName="Toast";const Wn=y(Fn),Pn=r.createContext(null),Vn=()=>{const n=r.useContext(Pn);if(!n)throw new Error("useToast must be used within a ToastProvider");return n},Hn=({children:e})=>{const[t,a]=r.useState([]),o=r.useCallback(n=>{a(r=>{var e;const t=r.find(r=>r.id===n);return t&&(null===(e=t.onClose)||void 0===e||e.call(t)),r.filter(r=>r.id!==n)})},[]),i=r.useCallback((n,r={})=>{var e;const t=r.toastId||Date.now()+Math.random(),i={id:t,content:n,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...r};return a(n=>{const r=n.filter(n=>n.id!==t);return[i,...r]}),!1!==i.autoClose&&setTimeout(()=>{o(t)},i.autoClose),null===(e=r.onOpen)||void 0===e||e.call(r),t},[o]),l=r.useCallback(()=>{a([])},[]),c=r.useCallback((n,r)=>{a(e=>e.map(e=>e.id===n?{...e,...r}:e))},[]),s={toasts:t,addToast:i,removeToast:o,clearAllToasts:l,updateToast:c};return n.jsx(Pn.Provider,{value:s,children:e})};class Yn{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return Yn.instance||(Yn.instance=new Yn),Yn.instance}setMethods(n,r,e,t){this.addToastFn=n,this.removeToastFn=r,this.clearAllToastsFn=e,this.updateToastFn=t}show(n,r){return this.addToastFn?this.addToastFn(n,r):(console.warn("Toast system not initialized. Make sure ToastContainer is mounted."),"")}success(n,r){return this.show(n,{...r,variant:"success"})}error(n,r){return this.show(n,{...r,variant:"error"})}warning(n,r){return this.show(n,{...r,variant:"warning"})}info(n,r){return this.show(n,{...r,variant:"info"})}primary(n,r){return this.show(n,{...r,variant:"primary"})}dismiss(n){this.removeToastFn?this.removeToastFn(n):console.warn("Toast system not initialized.")}dismissAll(){this.clearAllToastsFn?this.clearAllToastsFn():console.warn("Toast system not initialized.")}update(n,r){this.updateToastFn?this.updateToastFn(n,r):console.warn("Toast system not initialized.")}}const qn=Yn.getInstance();k("/* ===== Toast Container Styles ===== */\n.vtx-toast-container {\n  --vtx-toast-gap: 12px;\n\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  max-width: 100vw;\n  pointer-events: none;\n}\n\n.vtx-toast-container__hidden-count {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  margin-bottom: var(--vtx-toast-gap);\n  background: var(--vtx-color-neutral-100);\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-full);\n  color: var(--vtx-color-neutral-700);\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-medium);\n  pointer-events: auto;\n  backdrop-filter: blur(8px);\n  animation: vtx-toast-fade-in 200ms ease-out;\n}\n\n.vtx-toast-container__list {\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-toast-gap);\n  align-items: stretch;\n}\n\n/* ===== Position Variants ===== */\n.vtx-toast-container--top-left,\n.vtx-toast-container--top-center,\n.vtx-toast-container--top-right {\n  flex-direction: column;\n}\n\n.vtx-toast-container--bottom-left,\n.vtx-toast-container--bottom-center,\n.vtx-toast-container--bottom-right {\n  flex-direction: column-reverse;\n}\n\n.vtx-toast-container--bottom-left .vtx-toast-container__hidden-count,\n.vtx-toast-container--bottom-center .vtx-toast-container__hidden-count,\n.vtx-toast-container--bottom-right .vtx-toast-container__hidden-count {\n  order: -1;\n  margin-bottom: 0;\n  margin-top: var(--vtx-toast-gap);\n}\n\n/* ===== Stacked Layout ===== */\n.vtx-toast-container--stacked .vtx-toast-container__list {\n  position: relative;\n}\n\n.vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n  transform: translateY(-2px) scale(0.98);\n  opacity: 0.9;\n  z-index: -1;\n}\n\n.vtx-toast-container--stacked .vtx-toast:nth-child(3) {\n  transform: translateY(-4px) scale(0.96);\n  opacity: 0.8;\n}\n\n.vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\n  transform: translateY(-6px) scale(0.94);\n  opacity: 0.7;\n}\n\n/* ===== Dark Theme Support ===== */\n[data-vtx-toast-theme='dark'] .vtx-toast-container__hidden-count {\n  background: var(--vtx-color-neutral-800);\n  border-color: var(--vtx-color-neutral-600);\n  color: var(--vtx-color-neutral-300);\n}\n\n/* ===== Responsive Design ===== */\n@media (max-width: 640px) {\n  .vtx-toast-container {\n    left: var(--vtx-spacing-4) !important;\n    right: var(--vtx-spacing-4) !important;\n    transform: none !important;\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n    transform: translateY(-1px) scale(0.99);\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:nth-child(3) {\n    transform: translateY(-2px) scale(0.98);\n  }\n\n  .vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\n    transform: translateY(-3px) scale(0.97);\n  }\n}\n\n/* ===== Animations ===== */\n@keyframes vtx-toast-fade-in {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* ===== Accessibility ===== */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\n    transform: none;\n    opacity: 1;\n  }\n\n  .vtx-toast-container__hidden-count {\n    animation: none;\n  }\n}\n\n/* ===== Print Styles ===== */\n@media print {\n  .vtx-toast-container {\n    display: none;\n  }\n}\n");const Xn=({position:e="top-right",limit:a=5,gap:o=12,margin:i=16,className:l="",style:c,stacked:s=!0,theme:d="auto"})=>{const{toasts:x,removeToast:v,addToast:p,clearAllToasts:m,updateToast:h}=Vn(),u=r.useRef(null);r.useEffect(()=>{qn.setMethods(p,v,m,h)},[p,v,m,h]),r.useEffect(()=>{if("auto"===d){const n=window.matchMedia("(prefers-color-scheme: dark)"),r=()=>{document.documentElement.setAttribute("data-vtx-toast-theme",n.matches?"dark":"light")};return r(),n.addEventListener("change",r),()=>n.removeEventListener("change",r)}document.documentElement.setAttribute("data-vtx-toast-theme",d)},[d]);const g=x.slice(0,a),f=Math.max(0,x.length-a),b=["vtx-toast-container",`vtx-toast-container--${e}`,s&&"vtx-toast-container--stacked",l].filter(Boolean).join(" ");return 0===g.length?null:t.createPortal(n.jsxs("div",{ref:u,className:b,style:{...(n=>{const r={position:"fixed",zIndex:"var(--vtx-z-notification, 1400)",pointerEvents:"none"};switch(n){case"top-left":return{...r,top:i,left:i};case"top-center":return{...r,top:i,left:"50%",transform:"translateX(-50%)"};case"top-right":default:return{...r,top:i,right:i};case"bottom-left":return{...r,bottom:i,left:i};case"bottom-center":return{...r,bottom:i,left:"50%",transform:"translateX(-50%)"};case"bottom-right":return{...r,bottom:i,right:i}}})(e),"--vtx-toast-gap":`${o}px`,...c},"aria-live":"polite","aria-label":"Notifications",children:[f>0&&n.jsxs("div",{className:"vtx-toast-container__hidden-count",children:["+",f," more"]}),n.jsx("div",{className:"vtx-toast-container__list",children:g.map((r,e)=>n.jsx(Wn,{id:r.id,isVisible:r.isVisible,onDismiss:()=>v(r.id),variant:r.variant,autoClose:r.autoClose,closeButton:r.closeButton,progressBar:r.progressBar,pauseOnHover:r.pauseOnHover,pauseOnFocusLoss:r.pauseOnFocusLoss,icon:r.icon,action:r.action,className:r.className,style:r.style,title:r.title,description:r.description,animationDuration:r.animationDuration,createdAt:r.createdAt,onClose:r.onClose,onOpen:r.onOpen,"data-toast-index":e,children:r.content},r.id))})]}),document.body)};k(".vtx-tooltip {\n  position: fixed;\n  z-index: var(--vtx-z-tooltip);\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  background-color: var(--vtx-color-neutral-900);\n  color: white;\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-font-size-sm);\n  line-height: var(--vtx-line-height-normal);\n  border-radius: var(--vtx-radius-md);\n  max-width: 300px;\n  word-wrap: break-word;\n  pointer-events: auto;\n  box-shadow: var(--vtx-shadow-lg);\n  opacity: 0;\n  transition:\n    opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),\n    transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  will-change: transform, opacity;\n}\n\n.vtx-tooltip--visible {\n  opacity: 1;\n}\n\n/* Inner wrapper for content and close button */\n.vtx-tooltip-inner {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-2);\n}\n\n.vtx-tooltip-content {\n  flex: 1;\n  min-width: 0;\n}\n\n/* Close button */\n.vtx-tooltip-close {\n  flex-shrink: 0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  padding: 0;\n  background: transparent;\n  border: none;\n  color: currentColor;\n  cursor: pointer;\n  border-radius: var(--vtx-radius-sm);\n  transition: all var(--vtx-transition-base);\n  opacity: 0.7;\n  margin-top: -2px;\n}\n\n.vtx-tooltip-close:hover {\n  opacity: 1;\n  background: rgba(255, 255, 255, 0.1);\n}\n\n.vtx-tooltip-close:active {\n  transform: scale(0.95);\n}\n\n.vtx-tooltip-close:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n  opacity: 1;\n}\n\n/* Placement-specific transforms with entry animations */\n.vtx-tooltip--top {\n  transform: translate(-50%, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom center;\n}\n\n.vtx-tooltip--top.vtx-tooltip--visible {\n  transform: translate(-50%, -100%) scale(1);\n}\n\n.vtx-tooltip--bottom {\n  transform: translate(-50%, 4px) scale(0.9);\n  transform-origin: top center;\n}\n\n.vtx-tooltip--bottom.vtx-tooltip--visible {\n  transform: translate(-50%, 0) scale(1);\n}\n\n.vtx-tooltip--left {\n  transform: translate(calc(-100% - 4px), -50%) scale(0.9);\n  transform-origin: right center;\n}\n\n.vtx-tooltip--left.vtx-tooltip--visible {\n  transform: translate(-100%, -50%) scale(1);\n}\n\n.vtx-tooltip--right {\n  transform: translate(4px, -50%) scale(0.9);\n  transform-origin: left center;\n}\n\n.vtx-tooltip--right.vtx-tooltip--visible {\n  transform: translate(0, -50%) scale(1);\n}\n\n/* Placement-start and placement-end variants */\n.vtx-tooltip--top-start {\n  transform: translate(0, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom left;\n}\n\n.vtx-tooltip--top-start.vtx-tooltip--visible {\n  transform: translate(0, -100%) scale(1);\n}\n\n.vtx-tooltip--top-end {\n  transform: translate(-100%, calc(-100% - 4px)) scale(0.9);\n  transform-origin: bottom right;\n}\n\n.vtx-tooltip--top-end.vtx-tooltip--visible {\n  transform: translate(-100%, -100%) scale(1);\n}\n\n.vtx-tooltip--bottom-start {\n  transform: translate(0, 4px) scale(0.9);\n  transform-origin: top left;\n}\n\n.vtx-tooltip--bottom-start.vtx-tooltip--visible {\n  transform: translate(0, 0) scale(1);\n}\n\n.vtx-tooltip--bottom-end {\n  transform: translate(-100%, 4px) scale(0.9);\n  transform-origin: top right;\n}\n\n.vtx-tooltip--bottom-end.vtx-tooltip--visible {\n  transform: translate(-100%, 0) scale(1);\n}\n\n.vtx-tooltip--left-start {\n  transform: translate(calc(-100% - 4px), 0) scale(0.9);\n  transform-origin: right top;\n}\n\n.vtx-tooltip--left-start.vtx-tooltip--visible {\n  transform: translate(-100%, 0) scale(1);\n}\n\n.vtx-tooltip--left-end {\n  transform: translate(calc(-100% - 4px), -100%) scale(0.9);\n  transform-origin: right bottom;\n}\n\n.vtx-tooltip--left-end.vtx-tooltip--visible {\n  transform: translate(-100%, -100%) scale(1);\n}\n\n.vtx-tooltip--right-start {\n  transform: translate(4px, 0) scale(0.9);\n  transform-origin: left top;\n}\n\n.vtx-tooltip--right-start.vtx-tooltip--visible {\n  transform: translate(0, 0) scale(1);\n}\n\n.vtx-tooltip--right-end {\n  transform: translate(4px, -100%) scale(0.9);\n  transform-origin: left bottom;\n}\n\n.vtx-tooltip--right-end.vtx-tooltip--visible {\n  transform: translate(0, -100%) scale(1);\n}\n\n/* Variants */\n.vtx-tooltip--dark {\n  background-color: var(--vtx-color-neutral-900);\n  color: white;\n}\n\n.vtx-tooltip--light {\n  background-color: white;\n  color: var(--vtx-color-neutral-900);\n  border: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-tooltip--light .vtx-tooltip-close:hover {\n  background: var(--vtx-color-neutral-100);\n}\n\n.vtx-tooltip--error {\n  background-color: var(--vtx-color-error-600);\n  color: white;\n}\n\n.vtx-tooltip--warning {\n  background-color: var(--vtx-color-warning-500);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-tooltip--success {\n  background-color: var(--vtx-color-success-600);\n  color: white;\n}\n\n.vtx-tooltip--info {\n  background-color: var(--vtx-color-info-600);\n  color: white;\n}\n\n/* Arrow */\n.vtx-tooltip--with-arrow .vtx-tooltip-arrow {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background-color: inherit;\n  transform: rotate(45deg);\n  border: inherit;\n}\n\n.vtx-tooltip--top .vtx-tooltip-arrow {\n  bottom: -4px;\n  left: 50%;\n  margin-left: -4px;\n}\n\n.vtx-tooltip--bottom .vtx-tooltip-arrow {\n  top: -4px;\n  left: 50%;\n  margin-left: -4px;\n}\n\n.vtx-tooltip--left .vtx-tooltip-arrow {\n  right: -4px;\n  top: 50%;\n  margin-top: -4px;\n}\n\n.vtx-tooltip--right .vtx-tooltip-arrow {\n  left: -4px;\n  top: 50%;\n  margin-top: -4px;\n}\n");const Un=i.default.forwardRef(({content:e,placement:a="top",delay:o=200,hideDelay:i=0,children:l,open:c,disabled:s=!1,arrow:d=!1,maxWidth:x="300px",variant:v="dark",dismissible:p=!1,onShow:m,onHide:h,onDismiss:u,className:g="",...f},b)=>{const[w,y]=r.useState(c||!1),[k,j]=r.useState(!1),[_,z]=r.useState({top:0,left:0}),N=r.useRef(null),C=r.useRef(null),S=r.useRef(null),M=r.useRef(null),T=r.useRef(!1),I=()=>{s||(T.current=!0,S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current),C.current=setTimeout(()=>{if(N.current&&T.current){const n=N.current.getBoundingClientRect(),r=A(n,a);z(r),j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0),null==m||m()})})}},o))},D=()=>{T.current=!1,C.current&&clearTimeout(C.current),S.current=setTimeout(()=>{T.current||(y(!1),null==h||h(),M.current=setTimeout(()=>{j(!1)},150))},i)},A=(n,r)=>{const e=d?12:8;let t=0,a=0;return r.startsWith("top")?(t=n.top-e+window.scrollY,a=n.left+n.width/2+window.scrollX,"top-start"===r&&(a=n.left+window.scrollX),"top-end"===r&&(a=n.right+window.scrollX)):r.startsWith("bottom")?(t=n.bottom+e+window.scrollY,a=n.left+n.width/2+window.scrollX,"bottom-start"===r&&(a=n.left+window.scrollX),"bottom-end"===r&&(a=n.right+window.scrollX)):r.startsWith("left")?(t=n.top+n.height/2+window.scrollY,a=n.left-e+window.scrollX,"left-start"===r&&(t=n.top+window.scrollY),"left-end"===r&&(t=n.bottom+window.scrollY)):r.startsWith("right")&&(t=n.top+n.height/2+window.scrollY,a=n.right+e+window.scrollX,"right-start"===r&&(t=n.top+window.scrollY),"right-end"===r&&(t=n.bottom+window.scrollY)),{top:t,left:a}};r.useEffect(()=>{void 0!==c&&(c?(j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0)})})):(y(!1),M.current=setTimeout(()=>{j(!1)},150)))},[c]),r.useEffect(()=>()=>{C.current&&clearTimeout(C.current),S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current)},[]);const E=["vtx-tooltip",`vtx-tooltip--${a}`,`vtx-tooltip--${v}`,d&&"vtx-tooltip--with-arrow",w&&"vtx-tooltip--visible",g].filter(Boolean).join(" "),R=void 0!==c&&c||k,L=r.cloneElement(l,{ref:n=>{N.current=n;const r=l.ref;"function"==typeof r?r(n):r&&"object"==typeof r&&"current"in r&&(r.current=n)},onMouseEnter:n=>{var r,e;void 0===c&&I(),null===(e=(r=l.props).onMouseEnter)||void 0===e||e.call(r,n)},onMouseLeave:n=>{var r,e;void 0===c&&D(),null===(e=(r=l.props).onMouseLeave)||void 0===e||e.call(r,n)},onFocus:n=>{var r,e;void 0===c&&I(),null===(e=(r=l.props).onFocus)||void 0===e||e.call(r,n)},onBlur:n=>{var r,e;void 0===c&&D(),null===(e=(r=l.props).onBlur)||void 0===e||e.call(r,n)},"aria-describedby":w?"vtx-tooltip-content":void 0});return n.jsxs(n.Fragment,{children:[L,R&&t.createPortal(n.jsxs("div",{ref:b,id:"vtx-tooltip-content",role:"tooltip",className:E,style:{top:`${_.top}px`,left:`${_.left}px`,maxWidth:x},onMouseEnter:()=>{s||void 0!==c||(T.current=!0,S.current&&clearTimeout(S.current))},onMouseLeave:()=>{s||void 0!==c||D()},...f,children:[d&&n.jsx("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),n.jsxs("div",{className:"vtx-tooltip-inner",children:[n.jsx("span",{className:"vtx-tooltip-content",children:e}),p&&n.jsx("button",{type:"button",className:"vtx-tooltip-close",onClick:()=>{T.current=!1,y(!1),null==u||u(),null==h||h(),M.current=setTimeout(()=>{j(!1)},150)},"aria-label":"Dismiss tooltip",children:n.jsx($,{size:14})})]})]}),document.body)]})});Un.displayName="Tooltip";k(".vtx-avatar {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  background-color: var(--vtx-color-neutral-200);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-avatar-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.vtx-avatar-fallback {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  color: var(--vtx-color-neutral-700);\r\n  user-select: none;\r\n}\r\n\r\n/* Sizes */\r\n\r\n.vtx-avatar--sm {\r\n  width: 32px;\r\n  height: 32px;\r\n}\r\n.vtx-avatar--sm .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.vtx-avatar--md {\r\n  width: 40px;\r\n  height: 40px;\r\n}\r\n.vtx-avatar--md .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-avatar--lg {\r\n  width: 56px;\r\n  height: 56px;\r\n}\r\n.vtx-avatar--lg .vtx-avatar-fallback {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Shapes */\r\n.vtx-avatar--circle {\r\n  border-radius: var(--vtx-radius-full);\r\n}\r\n\r\n.vtx-avatar--square {\r\n  border-radius: var(--vtx-radius-md);\r\n}\r\n");const Gn=i.default.forwardRef(({src:e,alt:t="",size:a,shape:o="circle",fallback:i="?",onImageError:l,onImageLoad:c,imgProps:s,statusIndicator:d,statusPosition:x="bottom-right",className:v="",...p},m)=>{const{theme:u}=h(),g=a||u.defaultSize||"md",[f,b]=r.useState(!1),w=["vtx-avatar",`vtx-avatar--${g}`,`vtx-avatar--${o}`,d&&"vtx-avatar--with-status",v].filter(Boolean).join(" "),y=e&&!f,k=i.slice(0,2).toUpperCase();return n.jsxs("div",{ref:m,className:w,role:"img","aria-label":t||i||"Avatar",...p,children:[y?n.jsx("img",{src:e,alt:t,className:"vtx-avatar-image",onError:n=>{b(!0),null==l||l(n)},onLoad:n=>{null==c||c(n)},loading:"lazy",...s}):n.jsx("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),d&&n.jsx("span",{className:`vtx-avatar-status vtx-avatar-status--${x}`,"aria-label":"Status indicator",children:d})]})});Gn.displayName="Avatar";const Kn=y(Gn);k(".vtx-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--vtx-spacing-1);\n  font-family: var(--vtx-font-family-sans);\n  font-weight: var(--vtx-font-weight-medium);\n  line-height: 1;\n  white-space: nowrap;\n  border-radius: var(--vtx-radius-base);\n  transition: all var(--vtx-transition-base);\n}\n\n/* Sizes */\n.vtx-badge--small {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-xs);\n}\n\n.vtx-badge--medium {\n  padding: calc(var(--vtx-spacing-1) + 1px) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-badge--large {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-base);\n}\n\n/* Variants */\n.vtx-badge--neutral {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-800);\n}\n\n.vtx-badge--primary {\n  background-color: var(--vtx-color-primary-100);\n  color: var(--vtx-color-primary-800);\n}\n\n.vtx-badge--success {\n  background-color: var(--vtx-color-success-50);\n  color: var(--vtx-color-success-700);\n}\n\n.vtx-badge--warning {\n  background-color: var(--vtx-color-warning-50);\n  color: var(--vtx-color-warning-700);\n}\n\n.vtx-badge--error {\n  background-color: var(--vtx-color-error-50);\n  color: var(--vtx-color-error-700);\n}\n\n.vtx-badge--info {\n  background-color: var(--vtx-color-info-50);\n  color: var(--vtx-color-info-700);\n}\n\n/* Pill shape */\n.vtx-badge--pill {\n  border-radius: var(--vtx-radius-full);\n}\n\n/* Dot indicator */\n.vtx-badge-dot {\n  width: 6px;\n  height: 6px;\n  border-radius: var(--vtx-radius-full);\n  flex-shrink: 0;\n}\n\n.vtx-badge--neutral .vtx-badge-dot {\n  background-color: var(--vtx-color-neutral-600);\n}\n\n.vtx-badge--primary .vtx-badge-dot {\n  background-color: var(--vtx-color-primary-600);\n}\n\n.vtx-badge--success .vtx-badge-dot {\n  background-color: var(--vtx-color-success-600);\n}\n\n.vtx-badge--warning .vtx-badge-dot {\n  background-color: var(--vtx-color-warning-600);\n}\n\n.vtx-badge--error .vtx-badge-dot {\n  background-color: var(--vtx-color-error-600);\n}\n\n.vtx-badge--info .vtx-badge-dot {\n  background-color: var(--vtx-color-info-600);\n}\n");const Qn=i.default.forwardRef(({variant:e="neutral",size:t="medium",pill:a=!1,dot:o=!1,outline:i=!1,maxLength:l,icon:c,children:s,className:d="",onRemove:x,...v},p)=>{const m=["vtx-badge",`vtx-badge--${e}`,`vtx-badge--${t}`,a&&"vtx-badge--pill",o&&"vtx-badge--with-dot",i&&"vtx-badge--outline",x&&"vtx-badge--removable",d].filter(Boolean).join(" "),h=r.useMemo(()=>l&&"string"==typeof s&&s.length>l?`${s.slice(0,l)}...`:s,[s,l]);return n.jsxs("span",{ref:p,className:m,...v,children:[o&&n.jsx("span",{className:"vtx-badge-dot","aria-hidden":"true"}),c&&n.jsx("span",{className:"vtx-badge-icon","aria-hidden":"true",children:c}),n.jsx("span",{className:"vtx-badge-content",children:h}),x&&n.jsx("button",{type:"button",className:"vtx-badge-remove",onClick:x,"aria-label":"Remove badge",children:n.jsx($,{})})]})});Qn.displayName="Badge";const Zn=y(Qn);k(".vtx-card {\r\n  background-color: var(--vtx-color-white);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n  overflow: hidden;\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  font-family: var(--vtx-font-family-sans);\r\n  isolation: isolate; /* Create stacking context for better layering */\r\n  box-sizing: border-box;\r\n  width: 100%;\r\n}\r\n\r\n/* Sizes with refined spacing */\r\n.vtx-card--sm {\r\n  --vtx-card-padding: var(--vtx-spacing-3, 12px);\r\n  border-radius: var(--vtx-radius-md, 8px);\r\n}\r\n\r\n.vtx-card--md {\r\n  --vtx-card-padding: var(--vtx-spacing-4, 16px);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n}\r\n\r\n.vtx-card--lg {\r\n  --vtx-card-padding: var(--vtx-spacing-6, 24px);\r\n  border-radius: var(--vtx-radius-xl, 16px);\r\n}\r\n\r\n/* Variants with enhanced visual design */\r\n.vtx-card--elevated {\r\n  box-shadow: \r\n    0 1px 3px 0 rgba(0, 0, 0, 0.1),\r\n    0 1px 2px -1px rgba(0, 0, 0, 0.1);\r\n  border: 1px solid rgba(0, 0, 0, 0.05);\r\n  background-color: var(--vtx-color-white);\r\n}\r\n\r\n.vtx-card--outlined {\r\n  box-shadow: none;\r\n  border: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-white);\r\n}\r\n\r\n.vtx-card--filled {\r\n  box-shadow: none;\r\n  border: 1px solid var(--vtx-color-neutral-100, #f5f5f5);\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n}\r\n\r\n/* Card Content with improved typography */\r\n.vtx-card-content {\r\n  padding: var(--vtx-card-padding, 16px);\r\n  flex: 1;\r\n  line-height: 1.6;\r\n  color: var(--vtx-color-neutral-900, #1a1a1a);\r\n}\r\n\r\n.vtx-card-content > *:first-child {\r\n  margin-top: 0;\r\n}\r\n\r\n.vtx-card-content > *:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n/* No Padding Modifier */\r\n.vtx-card--no-padding .vtx-card-content {\r\n  padding: 0;\r\n}\r\n\r\n/* Header and Footer with refined styling */\r\n.vtx-card-header,\r\n.vtx-card-footer {\r\n  padding: var(--vtx-card-padding, 16px);\r\n}\r\n\r\n.vtx-card-header {\r\n  color: var(--vtx-color-neutral-900, #1a1a1a);\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-card-footer {\r\n  color: var(--vtx-color-neutral-700, #404040);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-end;\r\n  gap: var(--vtx-spacing-2, 8px);\r\n}\r\n\r\n.vtx-card-header--divider {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-neutral-25, #fcfcfc);\r\n}\r\n\r\n.vtx-card-footer--divider {\r\n  border-top: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  background-color: var(--vtx-color-neutral-25, #fcfcfc);\r\n}\r\n\r\n/* Maintain consistent padding when noPadding is set */\r\n.vtx-card--no-padding .vtx-card-header,\r\n.vtx-card--no-padding .vtx-card-footer {\r\n  padding: var(--vtx-card-padding, 16px);\r\n}\r\n\r\n/* Enhanced Interactive States */\r\n.vtx-card--hoverable {\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-card--hoverable:hover {\r\n  transform: translateY(-1px);\r\n}\r\n\r\n.vtx-card--elevated.vtx-card--hoverable:hover {\r\n  box-shadow: \r\n    0 10px 15px -3px rgba(0, 0, 0, 0.1),\r\n    0 4px 6px -4px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--outlined.vtx-card--hoverable:hover {\r\n  border-color: var(--vtx-color-neutral-300, #d4d4d4);\r\n  box-shadow: \r\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\r\n    0 2px 4px -2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--filled.vtx-card--hoverable:hover {\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n  box-shadow: \r\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\r\n    0 2px 4px -2px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-card--clickable {\r\n  cursor: pointer;\r\n  user-select: none;\r\n  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-card--clickable:active {\r\n  transform: translateY(0) scale(0.98);\r\n}\r\n\r\n/* Enhanced Focus State for better accessibility */\r\n.vtx-card:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500, #3b82f6);\r\n  outline-offset: 2px;\r\n  box-shadow: \r\n    0 0 0 4px rgba(59, 130, 246, 0.1),\r\n    0 1px 3px 0 rgba(0, 0, 0, 0.1),\r\n    0 1px 2px -1px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n/* Loading state */\r\n.vtx-card--loading {\r\n  position: relative;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-card--loading::after {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background: rgba(255, 255, 255, 0.8);\r\n  backdrop-filter: blur(2px);\r\n  z-index: 1;\r\n}\r\n\r\n/* Media queries for responsive design */\r\n@media (max-width: 768px) {\r\n  .vtx-card--sm {\r\n    --vtx-card-padding: var(--vtx-spacing-2, 8px);\r\n  }\r\n  \r\n  .vtx-card--md {\r\n    --vtx-card-padding: var(--vtx-spacing-3, 12px);\r\n  }\r\n  \r\n  .vtx-card--lg {\r\n    --vtx-card-padding: var(--vtx-spacing-4, 16px);\r\n  }\r\n  \r\n  .vtx-card-footer {\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n    gap: var(--vtx-spacing-3, 12px);\r\n  }\r\n}\r\n\r\n/* Reduced motion support */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-card,\r\n  .vtx-card--hoverable,\r\n  .vtx-card--clickable {\r\n    transition: none;\r\n  }\r\n  \r\n  .vtx-card--hoverable:hover,\r\n  .vtx-card--clickable:active {\r\n    transform: none;\r\n  }\r\n}\r\n\r\n/* High contrast mode support */\r\n@media (prefers-contrast: high) {\r\n  .vtx-card--outlined {\r\n    border-width: 2px;\r\n    border-color: var(--vtx-color-neutral-900, #000);\r\n  }\r\n  \r\n  .vtx-card-header--divider,\r\n  .vtx-card-footer--divider {\r\n    border-width: 2px;\r\n    border-color: var(--vtx-color-neutral-900, #000);\r\n  }\r\n}\r\n");const Jn=i.default.forwardRef(({children:r,variant:e="elevated",size:t,noPadding:a=!1,padding:o,hoverable:i=!1,clickable:l=!1,className:c="",header:s,footer:d,divider:x=!1,style:v,onClick:p,tabIndex:m,...u},g)=>{const{theme:f}=h(),b=["vtx-card",`vtx-card--${e}`,`vtx-card--${t||(null==f?void 0:f.defaultSize)||"md"}`,i?"vtx-card--hoverable":"",l?"vtx-card--clickable":"",a&&!o?"vtx-card--no-padding":"",c].filter(Boolean).join(" "),w={...v||{},...o?{"--vtx-card-padding":o}:{}},y=l?"number"==typeof m?m:0:m;return n.jsxs("div",{ref:g,className:b,style:w,onClick:p,tabIndex:y,...u,children:[s&&n.jsx("div",{className:"vtx-card-header"+(x?" vtx-card-header--divider":""),children:s}),n.jsx("div",{className:"vtx-card-content",children:r}),d&&n.jsx("div",{className:"vtx-card-footer"+(x?" vtx-card-footer--divider":""),children:d})]})});Jn.displayName="Card";const nr=y(Jn);k("/* Base divider styles */\n.vtx-divider {\n  margin: 0;\n  flex-shrink: 0;\n  border-width: 0;\n  border-style: solid;\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\n  border-bottom-width: thin;\n}\n\n/* Light variant */\n.vtx-divider--light {\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\n}\n\n/* Horizontal orientation (default) */\n.vtx-divider--horizontal {\n  width: 100%;\n  border-bottom-width: 1px;\n}\n\n/* Vertical orientation */\n.vtx-divider--vertical {\n  height: auto;\n  align-self: stretch;\n  border-bottom-width: 0;\n  border-right-width: 1px;\n}\n\n/* Flex item variant */\n.vtx-divider--flex-item {\n  height: auto;\n  align-self: stretch;\n}\n\n.vtx-divider--flex-item.vtx-divider--horizontal {\n  height: 1px;\n  width: 100%;\n  align-self: auto;\n}\n\n/* Variants */\n.vtx-divider--fullWidth {\n  width: 100%;\n}\n\n.vtx-divider--inset {\n  margin-left: var(--vtx-spacing-9);\n}\n\n.vtx-divider--middle {\n  margin-left: var(--vtx-spacing-3);\n  margin-right: var(--vtx-spacing-3);\n}\n\n.vtx-divider--vertical.vtx-divider--inset {\n  margin-left: 0;\n  margin-top: var(--vtx-spacing-2);\n}\n\n.vtx-divider--vertical.vtx-divider--middle {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: var(--vtx-spacing-2);\n  margin-bottom: var(--vtx-spacing-2);\n}\n\n/* With children */\n.vtx-divider--with-children {\n  display: flex;\n  white-space: nowrap;\n  text-align: center;\n  border: 0;\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\n  font-family: var(--vtx-font-family-sans);\n  font-size: var(--vtx-divider-text-size, var(--vtx-font-size-sm));\n  color: var(--vtx-divider-text-color, var(--vtx-color-neutral-600));\n  font-weight: var(--vtx-divider-text-weight, var(--vtx-font-weight-medium));\n}\n\n.vtx-divider--with-children.vtx-divider--light {\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\n  color: var(--vtx-divider-text-color-light, var(--vtx-color-neutral-500));\n}\n\n.vtx-divider--with-children::before,\n.vtx-divider--with-children::after {\n  content: '';\n  align-self: center;\n  border-top: thin solid;\n  border-color: inherit;\n}\n\n/* Text alignment - horizontal only */\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::before {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::after {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::before {\n  width: 5%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::after {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::before {\n  width: 100%;\n}\n\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::after {\n  width: 5%;\n}\n\n/* Wrapper for children content */\n.vtx-divider-wrapper {\n  display: inline-flex;\n  align-items: center;\n  padding-left: var(--vtx-spacing-3);\n  padding-right: var(--vtx-spacing-3);\n}\n\n/* Vertical divider with children (not commonly used but supported) */\n.vtx-divider--with-children.vtx-divider--vertical {\n  flex-direction: column;\n}\n\n.vtx-divider--with-children.vtx-divider--vertical::before,\n.vtx-divider--with-children.vtx-divider--vertical::after {\n  border-top: 0;\n  border-left: thin solid;\n  height: 100%;\n  width: auto;\n}\n\n.vtx-divider--with-children.vtx-divider--vertical .vtx-divider-wrapper {\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: var(--vtx-spacing-2);\n  padding-bottom: var(--vtx-spacing-2);\n}\n");const rr=i.default.forwardRef(({textAlign:r="center",orientation:e="horizontal",variant:t="fullWidth",light:a=!1,flexItem:o=!1,children:i,component:l,className:c="",role:s,...d},x)=>{const v=l||(i||"vertical"===e?"div":"hr"),p=s||("hr"!==v?"separator":void 0),m=["vtx-divider",`vtx-divider--${e}`,`vtx-divider--${t}`,a&&"vtx-divider--light",o&&"vtx-divider--flex-item",i&&"vtx-divider--with-children",i&&`vtx-divider--text-${r}`,c].filter(Boolean).join(" "),h="vertical"===e&&"hr"!==v?{"aria-orientation":"vertical"}:{};return n.jsx(v,{ref:x,className:m,role:p,...h,...d,children:i&&n.jsx("span",{className:"vtx-divider-wrapper",children:i})})});rr.displayName="Divider";const er=y(rr);k("/* Header Component Styles */\n\n.vtx-header {\n  display: flex;\n  align-items: center;\n  padding: 0 var(--vtx-spacing-6);\n  background: var(--vtx-background-primary);\n  border-bottom: 1px solid var(--vtx-border-color);\n  height: 64px;\n  gap: var(--vtx-spacing-4);\n  z-index: var(--vtx-z-sticky);\n}\n\n.vtx-header--sticky {\n  position: sticky;\n  top: 0;\n}\n\n/* Toggle Button */\n.vtx-header-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: 0;\n  border: none;\n  border-radius: var(--vtx-radius-md);\n  background: transparent;\n  color: var(--vtx-color-neutral-700);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-toggle:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-header-toggle:active {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.95);\n}\n\n/* Logo */\n.vtx-header-logo {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* Title */\n.vtx-header-title {\n  color: var(--vtx-color-neutral-900);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* Actions */\n.vtx-header-actions {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-3);\n  margin-left: auto;\n  margin-right: var(--vtx-spacing-4);\n}\n\n/* Right Section */\n.vtx-header-right {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  margin-left: auto;\n  padding-left: var(--vtx-spacing-4);\n  border-left: 1px solid var(--vtx-border-color);\n  height: 40px;\n}\n\n/* Icon Button */\n.vtx-header-icon-button {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  padding: 0;\n  border: none;\n  border-radius: var(--vtx-radius-lg);\n  background: transparent;\n  color: var(--vtx-color-neutral-600);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-icon-button:hover {\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n  transform: scale(1.05);\n}\n\n.vtx-header-icon-button:active {\n  transform: scale(0.95);\n}\n\n.vtx-header-icon-button--active {\n  background: var(--vtx-color-primary-50);\n  color: var(--vtx-color-primary-600);\n}\n\n/* Notifications */\n.vtx-header-notifications {\n  position: relative;\n}\n\n.vtx-header-notifications-panel {\n  position: absolute;\n  top: calc(100% + 12px);\n  right: 0;\n  width: 380px;\n  max-height: 500px;\n  background: var(--vtx-background-primary);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow:\n    0 4px 20px rgba(0, 0, 0, 0.08),\n    0 0 1px rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n  animation: slideDown 0.2s ease-out;\n  z-index: var(--vtx-z-dropdown);\n}\n\n.vtx-header-notifications-header {\n  padding: var(--vtx-spacing-4);\n  border-bottom: 1px solid var(--vtx-border-color);\n}\n\n.vtx-header-notifications-mark-read {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  border: none;\n  border-radius: var(--vtx-radius-sm);\n  background: transparent;\n  color: var(--vtx-color-primary-600);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-medium);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-notifications-mark-read:hover {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-notifications-list {\n  max-height: 400px;\n  overflow-y: auto;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar {\n  width: 6px;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.vtx-header-notifications-list::-webkit-scrollbar-thumb {\n  background: var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-full);\n}\n\n.vtx-header-notifications-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--vtx-spacing-2);\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\n  color: var(--vtx-color-neutral-400);\n}\n\n.vtx-header-notification-item {\n  position: relative;\n  display: flex;\n  align-items: flex-start;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  border-bottom: 1px solid var(--vtx-border-color);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n}\n\n.vtx-header-notification-item:last-child {\n  border-bottom: none;\n}\n\n.vtx-header-notification-item:hover {\n  background: var(--vtx-color-neutral-50);\n}\n\n.vtx-header-notification-item--unread {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-notification-item--unread:hover {\n  background: var(--vtx-color-primary-100);\n}\n\n.vtx-header-notification-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-700);\n  flex-shrink: 0;\n}\n\n.vtx-header-notification-item--info .vtx-header-notification-icon {\n  background: var(--vtx-color-info-50);\n  color: var(--vtx-color-info-600);\n}\n\n.vtx-header-notification-item--success .vtx-header-notification-icon {\n  background: var(--vtx-color-success-50);\n  color: var(--vtx-color-success-600);\n}\n\n.vtx-header-notification-item--warning .vtx-header-notification-icon {\n  background: var(--vtx-color-warning-50);\n  color: var(--vtx-color-warning-600);\n}\n\n.vtx-header-notification-item--error .vtx-header-notification-icon {\n  background: var(--vtx-color-error-50);\n  color: var(--vtx-color-error-600);\n}\n\n.vtx-header-notification-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.vtx-header-notification-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-primary-600);\n  flex-shrink: 0;\n  margin-top: 6px;\n}\n\n/* User Menu */\n.vtx-header-user-menu {\n  position: relative;\n}\n\n.vtx-header-user-button {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\n  border: none;\n  border-radius: var(--vtx-radius-lg);\n  background: transparent;\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  height: 40px;\n}\n\n.vtx-header-user-button:hover {\n  background: var(--vtx-color-neutral-100);\n}\n\n.vtx-header-user-button:active {\n  transform: scale(0.98);\n}\n\n.vtx-header-user-button--active {\n  background: var(--vtx-color-primary-50);\n}\n\n.vtx-header-user-info {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  text-align: left;\n  min-width: 0;\n}\n\n.vtx-header-user-info > * {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 150px;\n}\n\n.vtx-header-user-dropdown {\n  position: absolute;\n  top: calc(100% + 12px);\n  right: 0;\n  min-width: 220px;\n  background: var(--vtx-background-primary);\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n  box-shadow:\n    0 4px 20px rgba(0, 0, 0, 0.08),\n    0 0 1px rgba(0, 0, 0, 0.1);\n  animation: slideDown 0.2s ease-out;\n  z-index: var(--vtx-z-dropdown);\n  overflow: hidden;\n}\n\n/* Slide Down Animation */\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Dark Mode */\n[data-theme='dark'] .vtx-header {\n  background: var(--vtx-background-primary);\n  border-bottom-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-header-toggle,\n[data-theme='dark'] .vtx-header-icon-button {\n  color: var(--vtx-color-neutral-300);\n}\n\n[data-theme='dark'] .vtx-header-toggle:hover,\n[data-theme='dark'] .vtx-header-icon-button:hover {\n  background: rgba(255, 255, 255, 0.05);\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-theme='dark'] .vtx-header-icon-button--active {\n  background: var(--vtx-color-primary-900);\n  color: var(--vtx-color-primary-400);\n}\n\n[data-theme='dark'] .vtx-header-notification-item {\n  border-bottom-color: var(--vtx-border-color);\n}\n\n[data-theme='dark'] .vtx-header-notification-item:hover {\n  background: rgba(255, 255, 255, 0.05);\n}\n\n[data-theme='dark'] .vtx-header-notification-item--unread {\n  background: var(--vtx-color-primary-900);\n}\n\n[data-theme='dark'] .vtx-header-notification-item--unread:hover {\n  background: var(--vtx-color-primary-800);\n}\n\n[data-theme='dark'] .vtx-header-user-button:hover {\n  background: rgba(255, 255, 255, 0.05);\n}\n\n[data-theme='dark'] .vtx-header-user-button--active {\n  background: var(--vtx-color-primary-900);\n}\n\n/* Responsive */\n@media (max-width: 768px) {\n  .vtx-header {\n    padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n    height: 56px;\n  }\n\n  .vtx-header-title {\n    font-size: var(--vtx-font-size-lg);\n  }\n\n  .vtx-header-user-info {\n    display: none;\n  }\n\n  .vtx-header-notifications-panel {\n    width: 320px;\n    max-height: 400px;\n  }\n}\n\n/* Reduced Motion */\n@media (prefers-reduced-motion: reduce) {\n  .vtx-header-toggle,\n  .vtx-header-icon-button,\n  .vtx-header-user-button,\n  .vtx-header-notification-item {\n    transition: none;\n  }\n\n  .vtx-header-notifications-panel,\n  .vtx-header-user-dropdown {\n    animation: none;\n  }\n}\n");const tr=i.default.forwardRef(({notifications:r,onNotificationClick:e,onMarkAllAsRead:t,onClose:a},o)=>{const i=r.filter(n=>!n.read).length;return n.jsxs("div",{ref:o,className:"vtx-header-notifications-panel",children:[n.jsx("div",{className:"vtx-header-notifications-header",children:n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"subtitle2",noMargin:!0,children:"Notifications"}),i>0&&t&&n.jsx("button",{className:"vtx-header-notifications-mark-read",onClick:()=>{t(),a()},children:"Mark all as read"})]})}),n.jsx("div",{className:"vtx-header-notifications-list",children:0===r.length?n.jsxs("div",{className:"vtx-header-notifications-empty",children:[n.jsx(E,{}),n.jsx(In,{variant:"body2",color:"neutral.500",noMargin:!0,children:"No notifications"})]}):r.map(r=>n.jsxs("div",{className:`vtx-header-notification-item ${r.read?"":"vtx-header-notification-item--unread"} ${r.type?`vtx-header-notification-item--${r.type}`:""}`,onClick:()=>{null==e||e(r),a()},children:[r.icon&&n.jsx("div",{className:"vtx-header-notification-icon",children:r.icon}),n.jsxs("div",{className:"vtx-header-notification-content",children:[n.jsx(In,{variant:"body2",noMargin:!0,style:{fontWeight:r.read?400:600},children:r.title}),r.description&&n.jsx(In,{variant:"caption",color:"neutral.600",noMargin:!0,children:r.description}),n.jsx(In,{variant:"caption",color:"neutral.500",noMargin:!0,style:{marginTop:"4px"},children:r.time})]}),!r.read&&n.jsx("div",{className:"vtx-header-notification-dot"})]},r.id))})]})});tr.displayName="NotificationPanel";const ar=i.default.forwardRef(({logo:e,title:t,onToggleSidebar:a,showToggle:o=!0,notifications:i=[],onNotificationClick:l,onMarkAllAsRead:c,userName:s,userSubtitle:d,userAvatar:x,userMenuItems:v=[],actions:p,className:m="",sticky:h=!0},u)=>{const[g,f]=r.useState(!1),[b,w]=r.useState(!1),y=r.useRef(null),k=r.useRef(null),j=r.useRef(null),_=i.filter(n=>!n.read).length;r.useEffect(()=>{const n=n=>{y.current&&!y.current.contains(n.target)&&j.current&&!j.current.contains(n.target)&&f(!1),k.current&&!k.current.contains(n.target)&&w(!1)};return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[]);const z=["vtx-header",h&&"vtx-header--sticky",m].filter(Boolean).join(" ");return n.jsxs("header",{ref:u,className:z,children:[n.jsxs(Tn,{align:"center",gap:16,style:{flex:1},children:[o&&a&&n.jsx("button",{className:"vtx-header-toggle",onClick:a,"aria-label":"Toggle sidebar",children:n.jsx(R,{})}),e&&n.jsx("div",{className:"vtx-header-logo",children:e}),t&&n.jsx(In,{variant:"h6",noMargin:!0,className:"vtx-header-title",children:t})]}),p&&n.jsx("div",{className:"vtx-header-actions",children:p}),n.jsxs("div",{className:"vtx-header-right",children:[i&&i.length>0&&n.jsxs("div",{className:"vtx-header-notifications",ref:y,children:[n.jsxs("button",{className:"vtx-header-icon-button "+(g?"vtx-header-icon-button--active":""),onClick:()=>f(!g),"aria-label":"Notifications",children:[n.jsx(E,{}),_>0&&n.jsx(Zn,{variant:"error",size:"small",style:{position:"absolute",top:"4px",right:"4px",minWidth:"18px",height:"18px",padding:"0 4px"},children:_>9?"9+":_})]}),g&&n.jsx(tr,{ref:j,notifications:i,onNotificationClick:l,onMarkAllAsRead:c,onClose:()=>f(!1)})]}),s&&n.jsxs("div",{className:"vtx-header-user-menu",ref:k,children:[n.jsxs("button",{className:"vtx-header-user-button "+(b?"vtx-header-user-button--active":""),onClick:()=>w(!b),"aria-label":"User menu",children:[n.jsx(Kn,{src:x,alt:s,size:"sm"}),!x&&n.jsx("span",{className:"vtx-header-avatar-fallback",children:s.split(" ").map(n=>n[0]).join("").slice(0,2)}),n.jsxs("div",{className:"vtx-header-user-info",children:[n.jsx(In,{variant:"body2",noMargin:!0,style:{fontWeight:600},children:s}),d&&n.jsx(In,{variant:"caption",color:"neutral.600",noMargin:!0,children:d})]}),n.jsx(I,{})]}),b&&n.jsx("div",{className:"vtx-header-user-dropdown",children:n.jsx(Rn,{items:v,responsive:!1})})]})]})]})});ar.displayName="Header";const or=y(ar);k("/* ===================================\n   SideMenu - Enterprise Sidebar Navigation\n   =================================== */\n\n/* CSS Variables for Theming - Using Theme Tokens */\n:root {\n  /* Default/Light Theme - Using theme token colors */\n  --vtx-sidemenu-bg: var(--vtx-color-neutral-50, #ffffff);\n  --vtx-sidemenu-border: var(--vtx-color-neutral-200, #e5e5e5);\n  --vtx-sidemenu-shadow: var(--vtx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));\n  \n  --vtx-sidemenu-item-color: var(--vtx-color-neutral-700, #404040);\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-neutral-100, #f5f5f5);\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-50, #eff6ff);\n  --vtx-sidemenu-item-active-color: var(--vtx-color-primary-600, #2563eb);\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-neutral-500, #737373);\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-primary-600, #2563eb);\n  \n  --vtx-sidemenu-submenu-bg: var(--vtx-color-neutral-50, #fafafa);\n  --vtx-sidemenu-submenu-border: var(--vtx-color-neutral-100, #f5f5f5);\n  \n  --vtx-sidemenu-header-border: var(--vtx-color-neutral-200, #e5e5e5);\n  --vtx-sidemenu-footer-border: var(--vtx-color-neutral-200, #e5e5e5);\n  \n  --vtx-sidemenu-toggle-bg: var(--vtx-color-neutral-100, #f5f5f5);\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-neutral-200, #e5e5e5);\n  --vtx-sidemenu-toggle-color: var(--vtx-color-neutral-500, #737373);\n  \n  --vtx-sidemenu-badge-bg: var(--vtx-color-error-500, #ef4444);\n  --vtx-sidemenu-badge-color: var(--vtx-color-neutral-50, #ffffff);\n  \n  --vtx-sidemenu-transition-speed: var(--vtx-transition-base, 200ms);\n  --vtx-sidemenu-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* ===================================\n   Base Sidebar Structure\n   =================================== */\n\n.vtx-sidemenu {\n  display: flex;\n  flex-direction: column;\n  background-color: var(--vtx-sidemenu-bg);\n  height: 100vh;\n  overflow: hidden;\n  transition: width var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n  position: relative;\n  flex-shrink: 0;\n}\n\n.vtx-sidemenu--elevated {\n  box-shadow: var(--vtx-sidemenu-shadow);\n}\n\n.vtx-sidemenu--bordered {\n  border-right: 1px solid var(--vtx-sidemenu-border);\n}\n\n.vtx-sidemenu--right {\n  border-right: none;\n  border-left: 1px solid var(--vtx-sidemenu-border);\n}\n\n.vtx-sidemenu--collapsed {\n  transition: width var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n/* ===================================\n   Header Section\n   =================================== */\n\n.vtx-sidemenu-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 20px 16px;\n  border-bottom: 1px solid var(--vtx-sidemenu-header-border);\n  flex-shrink: 0;\n  min-height: 64px;\n}\n\n.vtx-sidemenu-header-content {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-header {\n  justify-content: center;\n  padding: 20px 8px;\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-header-content {\n  display: none;\n}\n\n/* ===================================\n   Content Section (Scrollable Menu Items)\n   =================================== */\n\n.vtx-sidemenu-content {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 8px;\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar {\n  width: 6px;\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-thumb {\n  background: var(--vtx-color-neutral-300, #d4d4d4);\n  border-radius: var(--vtx-border-radius-sm, 0.125rem);\n}\n\n.vtx-sidemenu-content::-webkit-scrollbar-thumb:hover {\n  background: var(--vtx-color-neutral-400, #a3a3a3);\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-content {\n  padding: 8px 4px;\n}\n\n/* ===================================\n   Footer Section\n   =================================== */\n\n.vtx-sidemenu-footer {\n  border-top: 1px solid var(--vtx-sidemenu-footer-border);\n  padding: 16px;\n  flex-shrink: 0;\n}\n\n.vtx-sidemenu--collapsed .vtx-sidemenu-footer {\n  padding: 16px 8px;\n  text-align: center;\n}\n\n/* ===================================\n   Menu Items\n   =================================== */\n\n.vtx-sidemenu-item {\n  display: block;\n  width: 100%;\n  text-decoration: none;\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\n  margin-bottom: var(--vtx-spacing-1, 0.25rem);\n  cursor: pointer;\n  transition: all var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n  outline: none;\n  border: none;\n  background: none;\n  text-align: left;\n}\n\n.vtx-sidemenu-item:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\n  outline-offset: 2px;\n}\n\n.vtx-sidemenu-item-content {\n  padding: 10px 12px;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  position: relative;\n}\n\n.vtx-sidemenu-item--collapsed .vtx-sidemenu-item-content {\n  justify-content: center;\n  padding: 12px 8px;\n  gap: 0;\n}\n\n/* Icon Styling */\n.vtx-sidemenu-item-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  color: var(--vtx-sidemenu-item-icon-color);\n  transition: color var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n.vtx-sidemenu-item-icon svg {\n  width: 100%;\n  height: 100%;\n}\n\n/* Text Content */\n.vtx-sidemenu-item-text {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.vtx-sidemenu-item-label {\n  color: var(--vtx-sidemenu-item-color);\n  font-size: var(--vtx-font-size-sm, 0.875rem);\n  font-weight: var(--vtx-font-weight-medium, 500);\n  line-height: 1.4;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  transition: color var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n.vtx-sidemenu-item-description {\n  color: var(--vtx-color-neutral-400, #a3a3a3);\n  font-size: var(--vtx-font-size-xs, 0.75rem);\n  line-height: 1.3;\n  margin-top: 2px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* End Section (Badge & Chevron) */\n.vtx-sidemenu-item-end {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.vtx-sidemenu-item-badge {\n  font-size: var(--vtx-font-size-xs, 0.75rem);\n  font-weight: var(--vtx-font-weight-semibold, 600);\n  min-width: 18px;\n  height: 18px;\n  padding: 0 var(--vtx-spacing-2, 0.5rem);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--vtx-border-radius-full, 9999px);\n}\n\n.vtx-sidemenu-item-badge-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background-color: var(--vtx-sidemenu-badge-bg);\n  position: absolute;\n  top: 8px;\n  right: 8px;\n}\n\n.vtx-sidemenu-item-chevron {\n  display: flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-400, #a3a3a3);\n  transition: transform var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n/* Hover State */\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) {\n  background-color: var(--vtx-sidemenu-item-hover-bg);\n}\n\n/* Active State */\n.vtx-sidemenu-item--active {\n  background-color: var(--vtx-sidemenu-item-active-bg);\n}\n\n.vtx-sidemenu-item--active .vtx-sidemenu-item-label {\n  color: var(--vtx-sidemenu-item-active-color);\n  font-weight: 600;\n}\n\n.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-sidemenu-item-icon-active-color);\n}\n\n/* Disabled State */\n.vtx-sidemenu-item--disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n/* Nested Levels */\n.vtx-sidemenu-item--level-1 .vtx-sidemenu-item-content {\n  padding-left: 44px;\n}\n\n.vtx-sidemenu-item--level-2 .vtx-sidemenu-item-content {\n  padding-left: 60px;\n}\n\n.vtx-sidemenu-item--level-3 .vtx-sidemenu-item-content {\n  padding-left: 76px;\n}\n\n/* ===================================\n   Submenu\n   =================================== */\n\n.vtx-sidemenu-submenu {\n  margin-top: 4px;\n  margin-bottom: 4px;\n  background-color: var(--vtx-sidemenu-submenu-bg);\n  border-radius: 8px;\n  padding: 4px 0;\n  animation: slideDown 200ms var(--vtx-sidemenu-transition-easing);\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* ===================================\n   Collapse Toggle Button\n   =================================== */\n\n.vtx-sidemenu-collapse-wrapper {\n  padding: 12px 16px;\n  display: flex;\n  justify-content: center;\n  border-top: 1px solid var(--vtx-sidemenu-header-border);\n}\n\n.vtx-sidemenu-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n  background-color: var(--vtx-sidemenu-toggle-bg);\n  border: none;\n  cursor: pointer;\n  color: var(--vtx-sidemenu-toggle-color);\n  transition: all var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n  outline: none;\n}\n\n.vtx-sidemenu-toggle:hover {\n  background-color: var(--vtx-sidemenu-toggle-hover-bg);\n}\n\n.vtx-sidemenu-toggle:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\n  outline-offset: 2px;\n}\n\n.vtx-sidemenu-toggle-icon {\n  transition: transform var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n.vtx-sidemenu-toggle-icon--rotated {\n  transform: rotate(180deg);\n}\n\n/* ===================================\n   VARIANT: Compact\n   =================================== */\n\n.vtx-sidemenu--compact .vtx-sidemenu-item-content {\n  padding: 8px 12px;\n}\n\n.vtx-sidemenu--compact .vtx-sidemenu-content {\n  padding: 4px;\n}\n\n.vtx-sidemenu--compact .vtx-sidemenu-header {\n  padding: 16px 12px;\n  min-height: 56px;\n}\n\n.vtx-sidemenu--compact .vtx-sidemenu-item-label {\n  font-size: 13px;\n}\n\n.vtx-sidemenu--compact .vtx-sidemenu-item-icon {\n  width: 18px;\n  height: 18px;\n}\n\n/* ===================================\n   VARIANT: Modern\n   =================================== */\n\n.vtx-sidemenu--modern .vtx-sidemenu-item {\n  border-radius: 12px;\n  position: relative;\n  overflow: hidden;\n}\n\n.vtx-sidemenu--modern .vtx-sidemenu-item::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  width: 3px;\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n  opacity: 0;\n  transition: opacity var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n}\n\n.vtx-sidemenu--modern .vtx-sidemenu-item--active::before {\n  opacity: 1;\n}\n\n.vtx-sidemenu--modern .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) {\n  transform: translateX(2px);\n}\n\n.vtx-sidemenu--modern .vtx-sidemenu-item-icon {\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-clip: text;\n}\n\n.vtx-sidemenu--modern .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  animation: pulse 2s infinite;\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n\n/* ===================================\n   VARIANT: Enterprise\n   =================================== */\n\n.vtx-sidemenu--enterprise {\n  border-right: 1px solid #e5e7eb;\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-item {\n  border-radius: 6px;\n  margin-bottom: 2px;\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-item-content {\n  padding: 12px 16px;\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-item-label {\n  font-size: 14px;\n  font-weight: 500;\n  letter-spacing: -0.01em;\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-item--active {\n  background-color: var(--vtx-color-primary-50, #eff6ff);\n  border-left: 3px solid var(--vtx-color-primary-600, #2563eb);\n  padding-left: 13px;\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-header {\n  padding: var(--vtx-spacing-6, 1.5rem) var(--vtx-spacing-5, 1.25rem);\n  border-bottom: 2px solid var(--vtx-color-neutral-200, #e5e5e5);\n}\n\n.vtx-sidemenu--enterprise .vtx-sidemenu-submenu {\n  background-color: var(--vtx-color-neutral-50, #fafafa);\n  border-left: 2px solid var(--vtx-color-neutral-200, #e5e5e5);\n  margin-left: var(--vtx-spacing-3, 0.75rem);\n  border-radius: 0 var(--vtx-border-radius-lg, 0.5rem) var(--vtx-border-radius-lg, 0.5rem) 0;\n}\n\n/* ===================================\n   VARIANT: Minimal\n   =================================== */\n\n.vtx-sidemenu--minimal {\n  background-color: transparent;\n  box-shadow: none;\n}\n\n.vtx-sidemenu--minimal .vtx-sidemenu-item {\n  border-radius: 4px;\n  margin-bottom: 0;\n}\n\n.vtx-sidemenu--minimal .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) {\n  background-color: rgba(0, 0, 0, 0.03);\n}\n\n.vtx-sidemenu--minimal .vtx-sidemenu-item--active {\n  background-color: rgba(37, 99, 235, 0.08);\n}\n\n.vtx-sidemenu--minimal .vtx-sidemenu-header,\n.vtx-sidemenu--minimal .vtx-sidemenu-footer {\n  border-color: transparent;\n}\n\n.vtx-sidemenu--minimal .vtx-sidemenu-submenu {\n  background-color: transparent;\n}\n\n/* ===================================\n   THEME: Dark - Using Theme Tokens\n   =================================== */\n\n.vtx-sidemenu--dark {\n  --vtx-sidemenu-bg: var(--vtx-color-neutral-800, #262626);\n  --vtx-sidemenu-border: var(--vtx-color-neutral-700, #404040);\n  --vtx-sidemenu-shadow: var(--vtx-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1));\n  \n  --vtx-sidemenu-item-color: var(--vtx-color-neutral-200, #e5e5e5);\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-neutral-700, #404040);\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-600, #2563eb);\n  --vtx-sidemenu-item-active-color: var(--vtx-color-neutral-50, #fafafa);\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-neutral-400, #a3a3a3);\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-neutral-50, #fafafa);\n  \n  --vtx-sidemenu-submenu-bg: var(--vtx-color-neutral-900, #171717);\n  --vtx-sidemenu-submenu-border: var(--vtx-color-neutral-700, #404040);\n  \n  --vtx-sidemenu-header-border: var(--vtx-color-neutral-700, #404040);\n  --vtx-sidemenu-footer-border: var(--vtx-color-neutral-700, #404040);\n  \n  --vtx-sidemenu-toggle-bg: var(--vtx-color-neutral-700, #404040);\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-neutral-600, #525252);\n  --vtx-sidemenu-toggle-color: var(--vtx-color-neutral-400, #a3a3a3);\n}\n\n/* ===================================\n   THEME: Primary - Using Theme Tokens\n   =================================== */\n\n.vtx-sidemenu--primary {\n  --vtx-sidemenu-bg: var(--vtx-color-primary-800, #1e40af);\n  --vtx-sidemenu-border: var(--vtx-color-primary-900, #1e3a8a);\n  --vtx-sidemenu-shadow: var(--vtx-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1));\n  \n  --vtx-sidemenu-item-color: var(--vtx-color-primary-100, #dbeafe);\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-primary-900, #1e3a8a);\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-500, #3b82f6);\n  --vtx-sidemenu-item-active-color: var(--vtx-color-neutral-50, #fafafa);\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-primary-300, #93c5fd);\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-neutral-50, #fafafa);\n  \n  --vtx-sidemenu-submenu-bg: var(--vtx-color-primary-900, #1e3a8a);\n  --vtx-sidemenu-submenu-border: var(--vtx-color-primary-800, #1e40af);\n  \n  --vtx-sidemenu-header-border: var(--vtx-color-primary-900, #1e3a8a);\n  --vtx-sidemenu-footer-border: var(--vtx-color-primary-900, #1e3a8a);\n  \n  --vtx-sidemenu-toggle-bg: var(--vtx-color-primary-900, #1e3a8a);\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-primary-700, #1d4ed8);\n  --vtx-sidemenu-toggle-color: var(--vtx-color-primary-300, #93c5fd);\n}\n\n/* ===================================\n   THEME: Gradient\n   =================================== */\n\n.vtx-sidemenu--gradient {\n  background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);\n  --vtx-sidemenu-bg: transparent;\n  --vtx-sidemenu-border: rgba(255, 255, 255, 0.1);\n  --vtx-sidemenu-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);\n  \n  --vtx-sidemenu-item-color: rgba(255, 255, 255, 0.9);\n  --vtx-sidemenu-item-hover-bg: rgba(255, 255, 255, 0.1);\n  --vtx-sidemenu-item-active-bg: rgba(255, 255, 255, 0.2);\n  --vtx-sidemenu-item-active-color: #ffffff;\n  --vtx-sidemenu-item-icon-color: rgba(255, 255, 255, 0.7);\n  --vtx-sidemenu-item-icon-active-color: #ffffff;\n  \n  --vtx-sidemenu-submenu-bg: rgba(0, 0, 0, 0.1);\n  --vtx-sidemenu-submenu-border: rgba(255, 255, 255, 0.1);\n  \n  --vtx-sidemenu-header-border: rgba(255, 255, 255, 0.1);\n  --vtx-sidemenu-footer-border: rgba(255, 255, 255, 0.1);\n  \n  --vtx-sidemenu-toggle-bg: rgba(255, 255, 255, 0.1);\n  --vtx-sidemenu-toggle-hover-bg: rgba(255, 255, 255, 0.2);\n  --vtx-sidemenu-toggle-color: rgba(255, 255, 255, 0.9);\n}\n\n/* ===================================\n   Responsive Adjustments\n   =================================== */\n\n/* Mobile Menu Button */\n.vtx-mobile-menu-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 44px;\n  height: 44px;\n  border: none;\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\n  background-color: transparent;\n  color: var(--vtx-color-neutral-700, #404040);\n  cursor: pointer;\n  transition: all var(--vtx-transition-base, 200ms) cubic-bezier(0.4, 0, 0.2, 1);\n  outline: none;\n  position: relative;\n  overflow: hidden;\n}\n\n.vtx-mobile-menu-button::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background-color: var(--vtx-color-neutral-900, #171717);\n  opacity: 0;\n  transition: opacity var(--vtx-transition-base, 200ms) cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.vtx-mobile-menu-button:hover::before {\n  opacity: 0.05;\n}\n\n.vtx-mobile-menu-button:active::before {\n  opacity: 0.1;\n}\n\n.vtx-mobile-menu-button:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\n  outline-offset: 2px;\n}\n\n.vtx-mobile-menu-button svg {\n  position: relative;\n  z-index: 1;\n}\n\n/* Button Variants */\n.vtx-mobile-menu-button--default {\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\n}\n\n.vtx-mobile-menu-button--default:hover {\n  background-color: var(--vtx-color-neutral-200, #e5e5e5);\n}\n\n.vtx-mobile-menu-button--ghost {\n  background-color: transparent;\n  border: 1px solid var(--vtx-color-neutral-300, #d4d4d4);\n}\n\n.vtx-mobile-menu-button--ghost:hover {\n  border-color: var(--vtx-color-neutral-400, #a3a3a3);\n  background-color: var(--vtx-color-neutral-50, #fafafa);\n}\n\n.vtx-mobile-menu-button--minimal {\n  background-color: transparent;\n}\n\n/* Hide on desktop by default */\n@media (min-width: 769px) {\n  .vtx-mobile-menu-button {\n    display: none;\n  }\n}\n\n/* Mobile: Overlay Mode */\n.vtx-sidemenu--mobile {\n  position: fixed;\n  left: 0;\n  top: 0;\n  z-index: var(--vtx-z-index-modal, 1200);\n  transform: translateX(-100%);\n  transition: transform var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n  box-shadow: var(--vtx-shadow-xl, 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1));\n}\n\n.vtx-sidemenu--mobile.vtx-sidemenu--right {\n  left: auto;\n  right: 0;\n  transform: translateX(100%);\n}\n\n.vtx-sidemenu--mobile.vtx-sidemenu--mobile-open {\n  transform: translateX(0);\n}\n\n/* Backdrop */\n.vtx-sidemenu-backdrop {\n  position: fixed;\n  inset: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  z-index: calc(var(--vtx-z-index-modal, 1200) - 1);\n  animation: fadeIn 200ms var(--vtx-sidemenu-transition-easing);\n  backdrop-filter: blur(2px);\n  -webkit-backdrop-filter: blur(2px);\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n/* Mobile Close Button */\n.vtx-sidemenu-mobile-close {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n  color: var(--vtx-sidemenu-item-color);\n  transition: all var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\n  outline: none;\n  flex-shrink: 0;\n}\n\n.vtx-sidemenu-mobile-close:hover {\n  background-color: var(--vtx-sidemenu-item-hover-bg);\n}\n\n.vtx-sidemenu-mobile-close:focus-visible {\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\n  outline-offset: 2px;\n}\n\n/* Mobile: Larger touch targets */\n.vtx-sidemenu--mobile .vtx-sidemenu-item-content {\n  padding: 14px 16px;\n  min-height: 48px;\n}\n\n.vtx-sidemenu--mobile .vtx-sidemenu-item-icon {\n  width: 24px;\n  height: 24px;\n}\n\n.vtx-sidemenu--mobile .vtx-sidemenu-toggle {\n  width: 44px;\n  height: 44px;\n}\n\n.vtx-sidemenu--mobile .vtx-sidemenu-header {\n  min-height: 64px;\n  padding: var(--vtx-spacing-4, 1rem) var(--vtx-spacing-4, 1rem);\n}\n\n/* Desktop: Push Mode */\n@media (min-width: 769px) {\n  .vtx-sidemenu {\n    position: relative;\n    transform: none !important;\n  }\n}\n\n/* Tablet: Adjust for medium screens */\n@media (max-width: 1024px) and (min-width: 769px) {\n  .vtx-sidemenu {\n    width: 240px !important;\n  }\n  \n  .vtx-sidemenu--collapsed {\n    width: 64px !important;\n  }\n}\n\n/* ===================================\n   Accessibility\n   =================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  .vtx-sidemenu,\n  .vtx-sidemenu-item,\n  .vtx-sidemenu-toggle,\n  .vtx-sidemenu-item-icon,\n  .vtx-sidemenu-item-chevron,\n  .vtx-sidemenu-submenu {\n    transition: none;\n    animation: none;\n  }\n}\n\n/* High Contrast Mode */\n@media (prefers-contrast: high) {\n  .vtx-sidemenu {\n    border: 2px solid currentColor;\n  }\n  \n  .vtx-sidemenu-item--active {\n    outline: 2px solid currentColor;\n    outline-offset: -2px;\n  }\n}\n");const ir=i.default.memo(({id:e,label:t,onClick:a,icon:o,disabled:i=!1,active:l=!1,items:c,badge:s,href:d,description:x,dataAttributes:v,collapsed:p=!1,level:m=0,onItemClick:h,showTooltipsWhenCollapsed:u=!0,variant:g="default"})=>{const[f,b]=r.useState(!1),w=c&&c.length>0,y=r.useCallback(n=>{i?n.preventDefault():w&&!p?(n.preventDefault(),b(n=>!n)):a?(n.preventDefault(),a(),null==h||h({id:e,label:t,onClick:a,icon:o,disabled:i,active:l,items:c,badge:s,href:d,description:x})):d||n.preventDefault()},[i,w,p,a,h,e,t,o,l,c,s,d,x]),k=r.useCallback(n=>{i||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),w&&!p?b(n=>!n):(null==a||a(),null==h||h({id:e,label:t,onClick:a,icon:o,disabled:i,active:l,items:c,badge:s,href:d,description:x})))},[i,w,p,a,h,e,t,o,l,c,s,d,x]),j=["vtx-sidemenu-item",`vtx-sidemenu-item--level-${m}`,`vtx-sidemenu-item--${g}`,l&&"vtx-sidemenu-item--active",i&&"vtx-sidemenu-item--disabled",w&&"vtx-sidemenu-item--has-submenu",p&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" "),_=n.jsxs(Tn,{align:"center",gap:0,className:"vtx-sidemenu-item-content",children:[o&&n.jsx("span",{className:"vtx-sidemenu-item-icon",children:o}),!p&&n.jsxs(n.Fragment,{children:[n.jsxs("div",{className:"vtx-sidemenu-item-text",children:[n.jsx(In,{variant:"body2",noMargin:!0,className:"vtx-sidemenu-item-label",children:t}),x&&"compact"!==g&&n.jsx(In,{variant:"caption",noMargin:!0,className:"vtx-sidemenu-item-description",children:x})]}),n.jsxs("div",{className:"vtx-sidemenu-item-end",children:[s&&n.jsx(Zn,{size:"small",className:"vtx-sidemenu-item-badge",children:s}),w&&n.jsx("span",{className:"vtx-sidemenu-item-chevron",children:f?n.jsx(L,{size:16}):n.jsx(I,{size:16})})]})]}),p&&s&&n.jsx("span",{className:"vtx-sidemenu-item-badge-dot"})]}),z=d?"a":"div",N=n.jsx(z,{className:j,onClick:y,onKeyDown:k,role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-expanded":w?f:void 0,"aria-current":l?"page":void 0,href:d,...v||{},children:_});return n.jsxs(n.Fragment,{children:[p&&u?n.jsx(Un,{content:t,placement:"right",children:N}):N,w&&f&&!p&&n.jsx("div",{className:"vtx-sidemenu-submenu",children:c.map(r=>n.jsx(ir,{...r,collapsed:p,level:m+1,onItemClick:h,showTooltipsWhenCollapsed:u,variant:g},r.id))})]})});ir.displayName="SideMenuItem";const lr=i.default.forwardRef(({items:e,collapsed:t=!1,onCollapseToggle:a,className:o="",width:i="280px",collapsedWidth:l="72px",header:c,footer:s,variant:d="default",theme:x="light",position:v="left",elevated:p=!0,bordered:m=!1,collapsible:h=!0,collapseButtonPosition:u="bottom",showTooltipsWhenCollapsed:g=!0,allowMultipleExpanded:f=!0,onItemClick:b,style:w,mobileOpen:y=!1,onMobileToggle:k,mobileBreakpoint:j=768,showBackdrop:_=!0,closeOnItemClick:z=!0,...N},C)=>{const[S,M]=r.useState(!1),T=r.useRef(0),$=r.useRef(0);r.useEffect(()=>{const n=()=>{M(window.innerWidth<j)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)},[j]),r.useEffect(()=>{if(S&&y){const n=window.innerWidth-document.documentElement.clientWidth;document.body.style.overflow="hidden",document.body.style.paddingRight=`${n}px`}else document.body.style.overflow="",document.body.style.paddingRight="";return()=>{document.body.style.overflow="",document.body.style.paddingRight=""}},[S,y]),r.useEffect(()=>{const n=n=>{"Escape"===n.key&&S&&y&&(null==k||k(!1))};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[S,y,k]);const I=r.useCallback(n=>{S&&(T.current=n.touches[0].clientX)},[S]),D=r.useCallback(n=>{S&&($.current=n.touches[0].clientX)},[S]),A=r.useCallback(()=>{if(!S)return;const n=$.current-T.current;("left"===v&&n<-50&&y||"right"===v&&n>50&&y)&&(null==k||k(!1)),T.current=0,$.current=0},[S,v,y,k]),E=t?"number"==typeof l?`${l}px`:l:"number"==typeof i?`${i}px`:i,R=["vtx-sidemenu",`vtx-sidemenu--${d}`,`vtx-sidemenu--${x}`,`vtx-sidemenu--${v}`,t&&"vtx-sidemenu--collapsed",p&&"vtx-sidemenu--elevated",m&&"vtx-sidemenu--bordered",S&&"vtx-sidemenu--mobile",S&&y&&"vtx-sidemenu--mobile-open",o].filter(Boolean).join(" "),L=r.useCallback(()=>{null==a||a(!t)},[t,a]),F=r.useCallback(()=>{S&&y&&(null==k||k(!1))},[S,y,k]),W=r.useCallback(n=>{null==b||b(n),S&&z&&(null==k||k(!1))},[S,z,b,k]),P=h&&a&&n.jsx("button",{className:"vtx-sidemenu-toggle",onClick:L,"aria-label":t?"Expand sidebar":"Collapse sidebar",title:t?"Expand sidebar":"Collapse sidebar",type:"button",children:"left"===v?n.jsx(B,{size:20,className:t?"vtx-sidemenu-toggle-icon--rotated":"vtx-sidemenu-toggle-icon"}):n.jsx(O,{size:20,className:t?"vtx-sidemenu-toggle-icon--rotated":"vtx-sidemenu-toggle-icon"})});return n.jsxs(n.Fragment,{children:[S&&_&&y&&n.jsx("div",{className:"vtx-sidemenu-backdrop",onClick:F,"aria-hidden":"true"}),n.jsxs("aside",{ref:C,className:R,style:{width:S?i:E,...w},role:"navigation","aria-label":"Side navigation","aria-hidden":S&&!y,onTouchStart:I,onTouchMove:D,onTouchEnd:A,...N,children:[c&&n.jsxs("div",{className:"vtx-sidemenu-header",children:["header"===u&&!S&&P,n.jsx("div",{className:"vtx-sidemenu-header-content",children:c}),S&&n.jsx("button",{className:"vtx-sidemenu-mobile-close",onClick:()=>null==k?void 0:k(!1),"aria-label":"Close menu",type:"button",children:n.jsx(B,{size:24})})]}),"top"===u&&!c&&!S&&n.jsx("div",{className:"vtx-sidemenu-collapse-wrapper",children:P}),n.jsx("div",{className:"vtx-sidemenu-content",children:e.map(r=>n.jsx(ir,{...r,collapsed:!S&&t,onItemClick:W,showTooltipsWhenCollapsed:g,variant:d},r.id))}),s&&n.jsx("div",{className:"vtx-sidemenu-footer",children:s}),"bottom"===u&&!S&&n.jsx("div",{className:"vtx-sidemenu-collapse-wrapper",children:P})]})]})});lr.displayName="SideMenuDefault";const cr=i.default.forwardRef((r,e)=>n.jsx(lr,{ref:e,...r,variant:"compact"}));cr.displayName="SideMenuCompact";const sr=i.default.forwardRef((r,e)=>n.jsx(lr,{ref:e,...r,variant:"modern"}));sr.displayName="SideMenuModern";const dr=i.default.forwardRef((r,e)=>n.jsx(lr,{ref:e,...r,variant:"enterprise"}));dr.displayName="SideMenuEnterprise";const xr=i.default.forwardRef((r,e)=>n.jsx(lr,{ref:e,...r,variant:"minimal"}));xr.displayName="SideMenuMinimal";const vr={Default:y(lr),Compact:y(cr),Modern:y(sr),Enterprise:y(dr),Minimal:y(xr)};function pr({columns:e,data:t,getRowKey:a,striped:o=!1,hoverable:i=!0,bordered:l=!1,size:c="medium",caption:s,emptyMessage:d="No data available",loading:x=!1,loadingContent:v,scrollable:p=!0,maxHeight:m,onRowClick:h,isRowSelected:u,onRowSelect:g,sortable:f=!1,sortConfig:b,onSortChange:w,className:y="",containerClassName:k="",...j}){const[_,z]=r.useState(b||null),N=b||_,C=n=>{if(!f)return;const r=(null==N?void 0:N.key)===n&&"asc"===N.direction?"desc":"asc",e={key:n,direction:r};w?w(n,r):z(e)},S=r.useMemo(()=>{if(!N||!f)return t;const n=e.find(n=>n.key===N.key),r=null==n?void 0:n.sortFn;return[...t].sort((n,e)=>{if(r)return"asc"===N.direction?r(n,e):r(e,n);const t=n[N.key],a=e[N.key];if("string"==typeof t&&"string"==typeof a)return"asc"===N.direction?t.localeCompare(a):a.localeCompare(t);if("number"==typeof t&&"number"==typeof a)return"asc"===N.direction?t-a:a-t;const o=String(t),i=String(a);return"asc"===N.direction?o.localeCompare(i):i.localeCompare(o)})},[t,N,e,f]),M=["vtx-table-container",p&&"vtx-table-container--scrollable",m&&"vtx-table-container--fixed-header",k].filter(Boolean).join(" "),T=["vtx-table",`vtx-table--${c}`,o&&"vtx-table--striped",i&&"vtx-table--hoverable",l&&"vtx-table--bordered",h&&"vtx-table--clickable",y].filter(Boolean).join(" "),$=(n,r,e)=>{g&&g(n,r),null==h||h(n,r,e)},I=r=>{if(!f)return null;const e=(null==N?void 0:N.key)===r,t=null==N?void 0:N.direction;return n.jsx("span",{className:"vtx-table-sort-icon","aria-hidden":"true",children:n.jsxs("svg",{width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",children:[n.jsx("path",{d:"M6 3L9 6H3L6 3Z",fill:e&&"asc"===t?"currentColor":"#ccc"}),n.jsx("path",{d:"M6 9L3 6H9L6 9Z",fill:e&&"desc"===t?"currentColor":"#ccc"})]})})};return n.jsx("div",{className:M,style:{maxHeight:m},children:n.jsxs("table",{className:T,...j,children:[s&&n.jsx("caption",{className:"vtx-table-caption",children:s}),n.jsx("thead",{className:"vtx-table-header",children:n.jsx("tr",{children:e.map(r=>{const e=f&&!1!==r.sortable,t=["vtx-table-header-cell",e&&"vtx-table-header-cell--sortable",r.sticky&&`vtx-table-header-cell--sticky-${r.sticky}`,r.headerClassName].filter(Boolean).join(" ");return n.jsx("th",{className:t,style:{width:r.width,minWidth:r.minWidth,maxWidth:r.maxWidth,textAlign:r.align||"left"},onClick:()=>e&&C(r.key),role:e?"button":void 0,tabIndex:e?0:void 0,onKeyDown:n=>{!e||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),C(r.key))},"aria-sort":(null==N?void 0:N.key)===r.key?"asc"===N.direction?"ascending":"descending":void 0,children:n.jsxs("span",{className:"vtx-table-header-content",children:[r.header,e&&I(r.key)]})},r.key)})})}),n.jsx("tbody",{className:"vtx-table-body",children:x?n.jsx("tr",{children:n.jsx("td",{colSpan:e.length,className:"vtx-table-loading",children:v||n.jsx("span",{className:"vtx-table-loading-spinner",children:"Loading..."})})}):0===S.length?n.jsx("tr",{children:n.jsx("td",{colSpan:e.length,className:"vtx-table-empty",children:d})}):S.map((r,t)=>{const o=null==u?void 0:u(r,t),i=["vtx-table-row",o&&"vtx-table-row--selected"].filter(Boolean).join(" ");return n.jsx("tr",{className:i,onClick:n=>$(r,t,n),role:h||g?"button":void 0,tabIndex:h||g?0:void 0,"aria-selected":o,onKeyDown:n=>{!h&&!g||"Enter"!==n.key&&" "!==n.key||(n.preventDefault(),$(r,t,n))},children:e.map(e=>{const a=["vtx-table-cell",e.sticky&&`vtx-table-cell--sticky-${e.sticky}`,e.className].filter(Boolean).join(" ");return n.jsx("td",{className:a,style:{textAlign:e.align||"left",width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth},children:e.render?e.render(r,t):r[e.key]},e.key)})},a(r,t))})})]})})}k(".vtx-table-container {\n  width: 100%;\n  overflow-x: auto;\n  border: 1px solid var(--vtx-color-neutral-200);\n  border-radius: var(--vtx-radius-lg);\n}\n\n.vtx-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-family: var(--vtx-font-family-sans);\n  background-color: white;\n}\n\n.vtx-table-caption {\n  padding: var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-lg);\n  font-weight: var(--vtx-font-weight-semibold);\n  text-align: left;\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Header */\n.vtx-table-header {\n  background-color: var(--vtx-color-neutral-50);\n  border-bottom: 2px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table-header-cell {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-sm);\n  font-weight: var(--vtx-font-weight-semibold);\n  color: var(--vtx-color-neutral-700);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  white-space: nowrap;\n}\n\n/* Body */\n.vtx-table-body {\n  background-color: white;\n}\n\n.vtx-table-row {\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n  transition: background-color var(--vtx-transition-fast);\n}\n\n.vtx-table-row:last-child {\n  border-bottom: none;\n}\n\n.vtx-table-cell {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  font-size: var(--vtx-font-size-base);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Sizes */\n.vtx-table--small .vtx-table-header-cell,\n.vtx-table--small .vtx-table-cell {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-table--large .vtx-table-header-cell,\n.vtx-table--large .vtx-table-cell {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-lg);\n}\n\n/* Striped */\n.vtx-table--striped .vtx-table-row:nth-child(even) {\n  background-color: var(--vtx-color-neutral-50);\n}\n\n/* Hoverable */\n.vtx-table--hoverable .vtx-table-row:hover {\n  background-color: var(--vtx-color-primary-50);\n}\n\n/* Empty state */\n.vtx-table-empty {\n  padding: var(--vtx-spacing-12) var(--vtx-spacing-4);\n  text-align: center;\n  color: var(--vtx-color-neutral-500);\n  font-style: italic;\n}\n"),pr.displayName="Table";const mr=y(pr);k("/* ==================== Timeline Base ==================== */\r\n.timeline {\r\n  display: flex;\r\n  width: 100%;\r\n  position: relative;\r\n}\r\n\r\n/* ==================== Orientation ==================== */\r\n.timeline--horizontal {\r\n  flex-direction: row;\r\n  align-items: flex-start;\r\n}\r\n\r\n.timeline--vertical {\r\n  flex-direction: column;\r\n  align-items: stretch;\r\n}\r\n\r\n/* ==================== Timeline Step ==================== */\r\n.timeline-step {\r\n  display: flex;\r\n  position: relative;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n}\r\n\r\n.timeline--horizontal .timeline-step {\r\n  flex-direction: column;\r\n  align-items: center;\r\n  flex: 1 1 0;\r\n  min-width: 0;\r\n  position: relative;\r\n}\r\n\r\n.timeline--vertical .timeline-step {\r\n  flex-direction: row;\r\n  align-items: flex-start;\r\n  padding: var(--vtx-spacing-2, 8px) 0;\r\n  position: relative;\r\n}\r\n\r\n/* Clickable steps */\r\n.timeline-step--clickable {\r\n  cursor: pointer;\r\n}\r\n\r\n.timeline-step--clickable:hover .timeline-step-icon-wrapper {\r\n  transform: scale(1.1);\r\n}\r\n\r\n/* ==================== Step Indicator ==================== */\r\n.timeline-step-indicator {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.timeline--horizontal .timeline-step-indicator {\r\n  margin-bottom: var(--vtx-spacing-2, 8px);\r\n}\r\n\r\n.timeline--vertical .timeline-step-indicator {\r\n  margin-right: var(--vtx-spacing-3, 12px);\r\n  align-items: flex-start;\r\n}\r\n\r\n/* ==================== Step Icon Wrapper ==================== */\r\n.timeline-step-icon-wrapper {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-neutral-200, #e5e5e5);\r\n  color: var(--vtx-color-neutral-600, #525252);\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  flex-shrink: 0;\r\n  position: relative;\r\n  z-index: 2;\r\n}\r\n\r\n/* Size variants */\r\n.timeline--sm {\r\n  --icon-size: 24px;\r\n}\r\n\r\n.timeline--sm .timeline-step-icon-wrapper {\r\n  width: var(--icon-size);\r\n  height: var(--icon-size);\r\n}\r\n\r\n.timeline--md {\r\n  --icon-size: 32px;\r\n}\r\n\r\n.timeline--md .timeline-step-icon-wrapper {\r\n  width: var(--icon-size);\r\n  height: var(--icon-size);\r\n}\r\n\r\n.timeline--lg {\r\n  --icon-size: 40px;\r\n}\r\n\r\n.timeline--lg .timeline-step-icon-wrapper {\r\n  width: var(--icon-size);\r\n  height: var(--icon-size);\r\n}\r\n\r\n/* ==================== Step States ==================== */\r\n\r\n/* Completed State */\r\n.timeline-step--completed .timeline-step-icon-wrapper {\r\n  background: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n}\r\n\r\n.timeline-step--completed .timeline-step-label {\r\n  color: var(--vtx-color-neutral-700, #404040);\r\n}\r\n\r\n/* Active State */\r\n.timeline-step--active .timeline-step-icon-wrapper {\r\n  background: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n  box-shadow: 0 0 0 4px var(--step-color-light, var(--vtx-color-success-100, #dcfce7));\r\n}\r\n\r\n.timeline-step--active .timeline-step-label {\r\n  color: var(--vtx-color-neutral-900, #171717);\r\n}\r\n\r\n/* Pending State */\r\n.timeline-step--pending .timeline-step-icon-wrapper {\r\n  background: var(--vtx-color-neutral-200, #e5e5e5);\r\n  color: var(--vtx-color-neutral-500, #737373);\r\n}\r\n\r\n.timeline-step--pending .timeline-step-label {\r\n  color: var(--vtx-color-neutral-500, #737373);\r\n}\r\n\r\n/* ==================== Connector Lines ==================== */\r\n.timeline-connector {\r\n  background: var(--vtx-color-neutral-300, #d4d4d4);\r\n  position: absolute;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  z-index: 0;\r\n}\r\n\r\n/* Horizontal connectors */\r\n.timeline--horizontal .timeline-connector {\r\n  height: 3px;\r\n  top: calc(var(--icon-size) / 2);\r\n  transform: translateY(-50%);\r\n  left: calc(50% + var(--icon-size) / 2);\r\n  right: calc(-50% + var(--icon-size) / 2);\r\n  width: auto;\r\n}\r\n\r\n/* Vertical connectors */\r\n.timeline--vertical .timeline-connector {\r\n  width: 3px;\r\n  left: calc(var(--icon-size) / 2);\r\n  transform: translateX(-50%);\r\n  top: calc(var(--icon-size) + var(--vtx-spacing-2, 8px));\r\n  bottom: calc(-100% + var(--vtx-spacing-2, 8px));\r\n  height: auto;\r\n}\r\n\r\n/* Filled/Active connector */\r\n.timeline-connector--filled {\r\n  background: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n}\r\n\r\n/* ==================== Icons ==================== */\r\n.timeline-step-checkmark {\r\n  width: 60%;\r\n  height: 60%;\r\n}\r\n\r\n.timeline-step-number {\r\n  font-size: 0.75em;\r\n  font-weight: 600;\r\n  line-height: 1;\r\n}\r\n\r\n.timeline-step-dot {\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  background: currentColor;\r\n}\r\n\r\n.timeline-step-custom-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 0.875em;\r\n}\r\n\r\n/* ==================== Step Content ==================== */\r\n.timeline-step-content {\r\n  text-align: center;\r\n  min-width: 0;\r\n}\r\n\r\n.timeline--horizontal .timeline-step-content {\r\n  width: 100%;\r\n}\r\n\r\n.timeline--vertical .timeline-step-content {\r\n  flex: 1;\r\n  text-align: left;\r\n}\r\n\r\n.timeline-step-label {\r\n  word-wrap: break-word;\r\n  overflow-wrap: break-word;\r\n  hyphens: auto;\r\n}\r\n\r\n.timeline--horizontal .timeline-step-label {\r\n  display: block;\r\n}\r\n\r\n.timeline-step-description {\r\n  margin-top: var(--vtx-spacing-1, 4px);\r\n  opacity: 0.8;\r\n}\r\n\r\n/* ==================== Variants ==================== */\r\n\r\n/* Circle Variant - Larger circles */\r\n.timeline--circle .timeline-step-icon-wrapper {\r\n  border: 2px solid var(--vtx-color-neutral-300, #d4d4d4);\r\n}\r\n\r\n.timeline--circle .timeline-step--completed .timeline-step-icon-wrapper,\r\n.timeline--circle .timeline-step--active .timeline-step-icon-wrapper {\r\n  border-color: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n}\r\n\r\n/* Simple Variant - Minimal style */\r\n.timeline--simple .timeline-step-icon-wrapper {\r\n  background: transparent;\r\n  border: 2px solid var(--vtx-color-neutral-300, #d4d4d4);\r\n}\r\n\r\n.timeline--simple .timeline-step--completed .timeline-step-icon-wrapper,\r\n.timeline--simple .timeline-step--active .timeline-step-icon-wrapper {\r\n  border-color: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n  background: var(--step-color, var(--vtx-color-success-600, #16a34a));\r\n}\r\n\r\n/* ==================== Color Variants ==================== */\r\n.timeline--primary {\r\n  --step-color: var(--vtx-color-primary-600, #2563eb);\r\n  --step-color-light: var(--vtx-color-primary-100, #dbeafe);\r\n}\r\n\r\n.timeline--success {\r\n  --step-color: var(--vtx-color-success-600, #16a34a);\r\n  --step-color-light: var(--vtx-color-success-50, #f0fdf4);\r\n}\r\n\r\n.timeline--info {\r\n  --step-color: var(--vtx-color-info-600, #2563eb);\r\n  --step-color-light: var(--vtx-color-info-50, #eff6ff);\r\n}\r\n\r\n.timeline--warning {\r\n  --step-color: var(--vtx-color-warning-600, #d97706);\r\n  --step-color-light: var(--vtx-color-warning-50, #fffbeb);\r\n}\r\n\r\n.timeline--error {\r\n  --step-color: var(--vtx-color-error-600, #dc2626);\r\n  --step-color-light: var(--vtx-color-error-50, #fef2f2);\r\n}\r\n\r\n/* ==================== Responsive Design ==================== */\r\n\r\n@media (max-width: 768px) {\r\n  .timeline--horizontal .timeline-step-content {\r\n    font-size: 0.875rem;\r\n  }\r\n\r\n  .timeline--horizontal .timeline-step-label {\r\n    font-size: 0.875rem;\r\n  }\r\n\r\n  .timeline--md {\r\n    --icon-size: 28px;\r\n  }\r\n\r\n  .timeline--lg {\r\n    --icon-size: 36px;\r\n  }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n  .timeline--horizontal .timeline-step {\r\n    min-width: 70px;\r\n  }\r\n\r\n  .timeline--horizontal .timeline-step-label {\r\n    font-size: 0.8125rem;\r\n  }\r\n\r\n  .timeline-step-description {\r\n    font-size: 0.6875rem;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .timeline--horizontal {\r\n    overflow-x: auto;\r\n    -webkit-overflow-scrolling: touch;\r\n    padding-bottom: var(--vtx-spacing-2, 8px);\r\n  }\r\n\r\n  .timeline--horizontal .timeline-step {\r\n    min-width: 60px;\r\n  }\r\n\r\n  .timeline--horizontal .timeline-step-label {\r\n    font-size: 0.75rem;\r\n    line-height: 1.3;\r\n  }\r\n\r\n  .timeline--sm {\r\n    --icon-size: 20px;\r\n  }\r\n\r\n  .timeline--md {\r\n    --icon-size: 24px;\r\n  }\r\n\r\n  .timeline--lg {\r\n    --icon-size: 32px;\r\n  }\r\n\r\n  .timeline-step-description {\r\n    display: none;\r\n  }\r\n\r\n  .timeline--vertical .timeline-step-content {\r\n    font-size: 0.875rem;\r\n  }\r\n}\r\n\r\n@media (max-width: 375px) {\r\n  .timeline--horizontal .timeline-step {\r\n    min-width: 50px;\r\n  }\r\n\r\n  .timeline--horizontal .timeline-step-label {\r\n    font-size: 0.6875rem;\r\n  }\r\n\r\n  .timeline--sm {\r\n    --icon-size: 18px;\r\n  }\r\n\r\n  .timeline--md {\r\n    --icon-size: 22px;\r\n  }\r\n\r\n  .timeline--lg {\r\n    --icon-size: 28px;\r\n  }\r\n}\r\n");const hr=({steps:r,currentStep:e,orientation:t="horizontal",variant:a="default",showCheckmarks:o=!0,color:i="success",size:l="md",className:c="",style:s})=>{const d=r.map(n=>"string"==typeof n?{label:n}:n),x=(r,e,t)=>r.icon?n.jsx("span",{className:"timeline-step-custom-icon",children:r.icon}):"completed"===t&&o?n.jsx("svg",{className:"timeline-step-checkmark",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:n.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})}):"numbered"===a?n.jsx("span",{className:"timeline-step-number",children:e+1}):n.jsx("span",{className:"timeline-step-dot"});return n.jsx("div",{className:`timeline timeline--${t} timeline--${a} timeline--${i} timeline--${l} ${c}`,style:s,children:d.map((r,t)=>{const a=(n=>n<e?"completed":n===e?"active":"pending")(t),o=t===d.length-1,i=!!r.onClick,l=(n=>n<e)(t);return n.jsxs("div",{className:`timeline-step timeline-step--${a} ${i?"timeline-step--clickable":""}`,onClick:()=>(n=>{n.onClick&&n.onClick()})(r),children:[n.jsx("div",{className:"timeline-step-indicator",children:n.jsx("div",{className:"timeline-step-icon-wrapper",children:x(r,t,a)})}),!o&&n.jsx("div",{className:"timeline-connector "+(l?"timeline-connector--filled":"")}),n.jsxs("div",{className:"timeline-step-content",children:[n.jsx(In,{variant:"body2",weight:"active"===a?"semibold":"medium",noMargin:!0,className:"timeline-step-label",children:r.label}),r.description&&n.jsx(In,{variant:"caption",noMargin:!0,className:"timeline-step-description",children:r.description})]})]},t)})})};k("/* Grid Base Styles */\n.vtx-grid {\n  box-sizing: border-box;\n}\n\n/* Container Styles */\n.vtx-grid-container {\n  display: flex;\n  flex-wrap: wrap;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Item Styles */\n.vtx-grid-item {\n  margin: 0;\n  box-sizing: border-box;\n}\n\n/* Direction */\n.vtx-grid-direction-row {\n  flex-direction: row;\n}\n\n.vtx-grid-direction-row-reverse {\n  flex-direction: row-reverse;\n}\n\n.vtx-grid-direction-column {\n  flex-direction: column;\n}\n\n.vtx-grid-direction-column-reverse {\n  flex-direction: column-reverse;\n}\n\n/* Wrap */\n.vtx-grid-wrap-nowrap {\n  flex-wrap: nowrap;\n}\n\n.vtx-grid-wrap-wrap {\n  flex-wrap: wrap;\n}\n\n.vtx-grid-wrap-wrap-reverse {\n  flex-wrap: wrap-reverse;\n}\n\n/* Spacing - Container */\n.vtx-grid-spacing-0 {\n  margin: 0;\n}\n\n.vtx-grid-spacing-0 > .vtx-grid-item {\n  padding: 0;\n}\n\n.vtx-grid-spacing-1 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-spacing-1 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-spacing-2 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-spacing-2 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-spacing-3 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-spacing-3 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-spacing-4 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-spacing-4 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-spacing-5 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n.vtx-grid-spacing-5 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n.vtx-grid-spacing-6 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 6);\n}\n\n.vtx-grid-spacing-6 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-spacing-7 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 7);\n}\n\n.vtx-grid-spacing-7 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3.5);\n}\n\n.vtx-grid-spacing-8 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 8);\n}\n\n.vtx-grid-spacing-8 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-spacing-9 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 9);\n}\n\n.vtx-grid-spacing-9 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4.5);\n}\n\n.vtx-grid-spacing-10 {\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 10);\n}\n\n.vtx-grid-spacing-10 > .vtx-grid-item {\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n/* Row Spacing */\n.vtx-grid-row-spacing-1 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n}\n\n.vtx-grid-row-spacing-1 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-row-spacing-2 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n}\n\n.vtx-grid-row-spacing-2 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-row-spacing-3 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n}\n\n.vtx-grid-row-spacing-3 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-row-spacing-4 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n}\n\n.vtx-grid-row-spacing-4 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-row-spacing-5 {\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n}\n\n.vtx-grid-row-spacing-5 > .vtx-grid-item {\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n/* Column Spacing */\n.vtx-grid-column-spacing-1 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-column-spacing-1 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\n}\n\n.vtx-grid-column-spacing-2 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-column-spacing-2 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\n}\n\n.vtx-grid-column-spacing-3 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\n}\n\n.vtx-grid-column-spacing-3 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\n}\n\n.vtx-grid-column-spacing-4 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\n}\n\n.vtx-grid-column-spacing-4 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\n}\n\n.vtx-grid-column-spacing-5 {\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\n}\n\n.vtx-grid-column-spacing-5 > .vtx-grid-item {\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\n}\n\n/* XS (Extra Small) - 0px and up */\n.vtx-grid-xs-auto {\n  flex-grow: 0;\n  flex-basis: auto;\n  max-width: none;\n}\n\n.vtx-grid-xs {\n  flex-grow: 1;\n  flex-basis: 0;\n  max-width: 100%;\n}\n\n.vtx-grid-xs-1 {\n  flex-grow: 0;\n  flex-basis: 8.333333%;\n  max-width: 8.333333%;\n}\n\n.vtx-grid-xs-2 {\n  flex-grow: 0;\n  flex-basis: 16.666667%;\n  max-width: 16.666667%;\n}\n\n.vtx-grid-xs-3 {\n  flex-grow: 0;\n  flex-basis: 25%;\n  max-width: 25%;\n}\n\n.vtx-grid-xs-4 {\n  flex-grow: 0;\n  flex-basis: 33.333333%;\n  max-width: 33.333333%;\n}\n\n.vtx-grid-xs-5 {\n  flex-grow: 0;\n  flex-basis: 41.666667%;\n  max-width: 41.666667%;\n}\n\n.vtx-grid-xs-6 {\n  flex-grow: 0;\n  flex-basis: 50%;\n  max-width: 50%;\n}\n\n.vtx-grid-xs-7 {\n  flex-grow: 0;\n  flex-basis: 58.333333%;\n  max-width: 58.333333%;\n}\n\n.vtx-grid-xs-8 {\n  flex-grow: 0;\n  flex-basis: 66.666667%;\n  max-width: 66.666667%;\n}\n\n.vtx-grid-xs-9 {\n  flex-grow: 0;\n  flex-basis: 75%;\n  max-width: 75%;\n}\n\n.vtx-grid-xs-10 {\n  flex-grow: 0;\n  flex-basis: 83.333333%;\n  max-width: 83.333333%;\n}\n\n.vtx-grid-xs-11 {\n  flex-grow: 0;\n  flex-basis: 91.666667%;\n  max-width: 91.666667%;\n}\n\n.vtx-grid-xs-12 {\n  flex-grow: 0;\n  flex-basis: 100%;\n  max-width: 100%;\n}\n\n/* SM (Small) - 600px and up */\n@media (min-width: 600px) {\n  .vtx-grid-sm-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-sm {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-sm-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-sm-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-sm-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-sm-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-sm-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-sm-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-sm-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-sm-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-sm-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-sm-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-sm-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-sm-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* MD (Medium) - 960px and up */\n@media (min-width: 960px) {\n  .vtx-grid-md-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-md {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-md-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-md-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-md-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-md-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-md-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-md-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-md-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-md-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-md-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-md-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-md-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-md-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* LG (Large) - 1280px and up */\n@media (min-width: 1280px) {\n  .vtx-grid-lg-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-lg {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-lg-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-lg-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-lg-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-lg-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-lg-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-lg-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-lg-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-lg-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-lg-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-lg-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-lg-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-lg-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n\n/* XL (Extra Large) - 1920px and up */\n@media (min-width: 1920px) {\n  .vtx-grid-xl-auto {\n    flex-grow: 0;\n    flex-basis: auto;\n    max-width: none;\n  }\n\n  .vtx-grid-xl {\n    flex-grow: 1;\n    flex-basis: 0;\n    max-width: 100%;\n  }\n\n  .vtx-grid-xl-1 {\n    flex-grow: 0;\n    flex-basis: 8.333333%;\n    max-width: 8.333333%;\n  }\n\n  .vtx-grid-xl-2 {\n    flex-grow: 0;\n    flex-basis: 16.666667%;\n    max-width: 16.666667%;\n  }\n\n  .vtx-grid-xl-3 {\n    flex-grow: 0;\n    flex-basis: 25%;\n    max-width: 25%;\n  }\n\n  .vtx-grid-xl-4 {\n    flex-grow: 0;\n    flex-basis: 33.333333%;\n    max-width: 33.333333%;\n  }\n\n  .vtx-grid-xl-5 {\n    flex-grow: 0;\n    flex-basis: 41.666667%;\n    max-width: 41.666667%;\n  }\n\n  .vtx-grid-xl-6 {\n    flex-grow: 0;\n    flex-basis: 50%;\n    max-width: 50%;\n  }\n\n  .vtx-grid-xl-7 {\n    flex-grow: 0;\n    flex-basis: 58.333333%;\n    max-width: 58.333333%;\n  }\n\n  .vtx-grid-xl-8 {\n    flex-grow: 0;\n    flex-basis: 66.666667%;\n    max-width: 66.666667%;\n  }\n\n  .vtx-grid-xl-9 {\n    flex-grow: 0;\n    flex-basis: 75%;\n    max-width: 75%;\n  }\n\n  .vtx-grid-xl-10 {\n    flex-grow: 0;\n    flex-basis: 83.333333%;\n    max-width: 83.333333%;\n  }\n\n  .vtx-grid-xl-11 {\n    flex-grow: 0;\n    flex-basis: 91.666667%;\n    max-width: 91.666667%;\n  }\n\n  .vtx-grid-xl-12 {\n    flex-grow: 0;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n}\n");const ur=i.default.forwardRef(({container:r=!1,item:e=!1,spacing:t,rowSpacing:a,columnSpacing:o,xs:i,sm:l,md:c,lg:s,xl:d,justifyContent:x,alignItems:v,alignContent:p,direction:m="row",wrap:h="wrap",className:u="",children:g,style:f,...b},w)=>{const y=["vtx-grid",r&&"vtx-grid-container",e&&"vtx-grid-item",r&&void 0!==t&&`vtx-grid-spacing-${t}`,r&&void 0!==a&&`vtx-grid-row-spacing-${a}`,r&&void 0!==o&&`vtx-grid-column-spacing-${o}`,void 0!==i&&"vtx-grid-xs"+(!0===i?"":"auto"===i?"-auto":`-${i}`),void 0!==l&&"vtx-grid-sm"+(!0===l?"":"auto"===l?"-auto":`-${l}`),void 0!==c&&"vtx-grid-md"+(!0===c?"":"auto"===c?"-auto":`-${c}`),void 0!==s&&"vtx-grid-lg"+(!0===s?"":"auto"===s?"-auto":`-${s}`),void 0!==d&&"vtx-grid-xl"+(!0===d?"":"auto"===d?"-auto":`-${d}`),r&&"row"!==m&&`vtx-grid-direction-${m}`,r&&"wrap"!==h&&`vtx-grid-wrap-${h}`,u].filter(Boolean).join(" "),k={...f};return r&&(x&&(k.justifyContent=x),v&&(k.alignItems=v),p&&(k.alignContent=p)),n.jsx("div",{ref:w,className:y,style:Object.keys(k).length>0?k:void 0,...b,children:g})});ur.displayName="Grid";const gr=y(ur);k("/**\r\n * VTX UI Design System - Base CSS Variables\r\n * \r\n * This file defines all CSS custom properties with default values from our design tokens.\r\n * These variables can be overridden by users through ThemeProvider or custom CSS.\r\n * \r\n * Usage:\r\n * - Import this file in your app entry point or ThemeProvider\r\n * - Override variables using :root selector or data-theme attributes\r\n * - All components use these variables with fallback values\r\n */\r\n\r\n:root {\r\n  /* ============================================\r\n   * COLOR TOKENS\r\n   * ============================================ */\r\n\r\n  /* Primary Colors */\r\n  --vtx-color-primary-50: #eff6ff;\r\n  --vtx-color-primary-100: #dbeafe;\r\n  --vtx-color-primary-200: #bfdbfe;\r\n  --vtx-color-primary-300: #93c5fd;\r\n  --vtx-color-primary-400: #60a5fa;\r\n  --vtx-color-primary-500: #3b82f6;\r\n  --vtx-color-primary-600: #2563eb;\r\n  --vtx-color-primary-700: #1d4ed8;\r\n  --vtx-color-primary-800: #1e40af;\r\n  --vtx-color-primary-900: #1e3a8a;\r\n\r\n  /* Secondary Colors */\r\n  --vtx-color-secondary-50: #f5f3ff;\r\n  --vtx-color-secondary-100: #ede9fe;\r\n  --vtx-color-secondary-200: #ddd6fe;\r\n  --vtx-color-secondary-300: #c4b5fd;\r\n  --vtx-color-secondary-400: #a78bfa;\r\n  --vtx-color-secondary-500: #8b5cf6;\r\n  --vtx-color-secondary-600: #7c3aed;\r\n  --vtx-color-secondary-700: #6d28d9;\r\n  --vtx-color-secondary-800: #5b21b6;\r\n  --vtx-color-secondary-900: #4c1d95;\r\n\r\n  /* Neutral Colors */\r\n  --vtx-color-neutral-50: #fafafa;\r\n  --vtx-color-neutral-100: #f5f5f5;\r\n  --vtx-color-neutral-200: #e5e5e5;\r\n  --vtx-color-neutral-300: #d4d4d4;\r\n  --vtx-color-neutral-400: #a3a3a3;\r\n  --vtx-color-neutral-500: #737373;\r\n  --vtx-color-neutral-600: #525252;\r\n  --vtx-color-neutral-700: #404040;\r\n  --vtx-color-neutral-800: #262626;\r\n  --vtx-color-neutral-900: #171717;\r\n\r\n  /* Success Colors */\r\n  --vtx-color-success-50: #f0fdf4;\r\n  --vtx-color-success-500: #22c55e;\r\n  --vtx-color-success-600: #16a34a;\r\n  --vtx-color-success-700: #15803d;\r\n\r\n  /* Warning Colors */\r\n  --vtx-color-warning-50: #fffbeb;\r\n  --vtx-color-warning-500: #f59e0b;\r\n  --vtx-color-warning-600: #d97706;\r\n  --vtx-color-warning-700: #b45309;\r\n\r\n  /* Error Colors */\r\n  --vtx-color-error-50: #fef2f2;\r\n  --vtx-color-error-500: #ef4444;\r\n  --vtx-color-error-600: #dc2626;\r\n  --vtx-color-error-700: #b91c1c;\r\n\r\n  /* Info Colors */\r\n  --vtx-color-info-50: #eff6ff;\r\n  --vtx-color-info-500: #3b82f6;\r\n  --vtx-color-info-600: #2563eb;\r\n  --vtx-color-info-700: #1d4ed8;\r\n\r\n  /* ============================================\r\n   * SPACING TOKENS\r\n   * ============================================ */\r\n  --vtx-spacing-0: 0;\r\n  --vtx-spacing-1: 0.25rem; /* 4px */\r\n  --vtx-spacing-2: 0.5rem; /* 8px */\r\n  --vtx-spacing-3: 0.75rem; /* 12px */\r\n  --vtx-spacing-4: 1rem; /* 16px */\r\n  --vtx-spacing-5: 1.25rem; /* 20px */\r\n  --vtx-spacing-6: 1.5rem; /* 24px */\r\n  --vtx-spacing-8: 2rem; /* 32px */\r\n  --vtx-spacing-10: 2.5rem; /* 40px */\r\n  --vtx-spacing-12: 3rem; /* 48px */\r\n  --vtx-spacing-16: 4rem; /* 64px */\r\n  --vtx-spacing-20: 5rem; /* 80px */\r\n  --vtx-spacing-24: 6rem; /* 96px */\r\n\r\n  /* ============================================\r\n   * TYPOGRAPHY TOKENS\r\n   * ============================================ */\r\n\r\n  /* Font Families */\r\n  --vtx-font-family-sans:\r\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\r\n  --vtx-font-family-mono:\r\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\r\n\r\n  /* Font Sizes */\r\n  --vtx-font-size-xs: 0.75rem; /* 12px */\r\n  --vtx-font-size-sm: 0.875rem; /* 14px */\r\n  --vtx-font-size-base: 1rem; /* 16px */\r\n  --vtx-font-size-lg: 1.125rem; /* 18px */\r\n  --vtx-font-size-xl: 1.25rem; /* 20px */\r\n  --vtx-font-size-2xl: 1.5rem; /* 24px */\r\n  --vtx-font-size-3xl: 1.875rem; /* 30px */\r\n  --vtx-font-size-4xl: 2.25rem; /* 36px */\r\n\r\n  /* Font Weights */\r\n  --vtx-font-weight-normal: 400;\r\n  --vtx-font-weight-medium: 500;\r\n  --vtx-font-weight-semibold: 600;\r\n  --vtx-font-weight-bold: 700;\r\n\r\n  /* Line Heights */\r\n  --vtx-line-height-tight: 1.25;\r\n  --vtx-line-height-normal: 1.5;\r\n  --vtx-line-height-relaxed: 1.75;\r\n\r\n  /* ============================================\r\n   * TEXT VARIANT TOKENS\r\n   * ============================================ */\r\n\r\n  /* Heading Variants */\r\n  --vtx-text-h1-font-size: 3.75rem; /* 60px */\r\n  --vtx-text-h1-font-weight: 700;\r\n  --vtx-text-h1-line-height: 1.2;\r\n  --vtx-text-h1-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h2-font-size: 3rem; /* 48px */\r\n  --vtx-text-h2-font-weight: 700;\r\n  --vtx-text-h2-line-height: 1.25;\r\n  --vtx-text-h2-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h3-font-size: 2.25rem; /* 36px */\r\n  --vtx-text-h3-font-weight: 600;\r\n  --vtx-text-h3-line-height: 1.3;\r\n  --vtx-text-h3-letter-spacing: -0.025em;\r\n\r\n  --vtx-text-h4-font-size: 1.875rem; /* 30px */\r\n  --vtx-text-h4-font-weight: 600;\r\n  --vtx-text-h4-line-height: 1.35;\r\n  --vtx-text-h4-letter-spacing: 0;\r\n\r\n  --vtx-text-h5-font-size: 1.5rem; /* 24px */\r\n  --vtx-text-h5-font-weight: 600;\r\n  --vtx-text-h5-line-height: 1.4;\r\n  --vtx-text-h5-letter-spacing: 0;\r\n\r\n  --vtx-text-h6-font-size: 1.25rem; /* 20px */\r\n  --vtx-text-h6-font-weight: 600;\r\n  --vtx-text-h6-line-height: 1.5;\r\n  --vtx-text-h6-letter-spacing: 0;\r\n\r\n  /* Body Text Variants */\r\n  --vtx-text-body1-font-size: 1rem; /* 16px - DEFAULT WEBSITE FONT SIZE */\r\n  --vtx-text-body1-font-weight: 400;\r\n  --vtx-text-body1-line-height: 1.5;\r\n  --vtx-text-body1-letter-spacing: 0;\r\n\r\n  --vtx-text-body2-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-body2-font-weight: 400;\r\n  --vtx-text-body2-line-height: 1.5;\r\n  --vtx-text-body2-letter-spacing: 0;\r\n\r\n  /* Subtitle Variants */\r\n  --vtx-text-subtitle1-font-size: 1.125rem; /* 18px */\r\n  --vtx-text-subtitle1-font-weight: 500;\r\n  --vtx-text-subtitle1-line-height: 1.5;\r\n  --vtx-text-subtitle1-letter-spacing: 0;\r\n\r\n  --vtx-text-subtitle2-font-size: 1rem; /* 16px */\r\n  --vtx-text-subtitle2-font-weight: 500;\r\n  --vtx-text-subtitle2-line-height: 1.5;\r\n  --vtx-text-subtitle2-letter-spacing: 0;\r\n\r\n  /* Utility Text Variants */\r\n  --vtx-text-caption-font-size: 0.75rem; /* 12px */\r\n  --vtx-text-caption-font-weight: 400;\r\n  --vtx-text-caption-line-height: 1.5;\r\n  --vtx-text-caption-letter-spacing: 0.025em;\r\n\r\n  --vtx-text-overline-font-size: 0.75rem; /* 12px */\r\n  --vtx-text-overline-font-weight: 600;\r\n  --vtx-text-overline-line-height: 1.5;\r\n  --vtx-text-overline-letter-spacing: 0.1em;\r\n\r\n  --vtx-text-button-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-button-font-weight: 600;\r\n  --vtx-text-button-line-height: 1.5;\r\n  --vtx-text-button-letter-spacing: 0.025em;\r\n\r\n  --vtx-text-label-font-size: 0.875rem; /* 14px */\r\n  --vtx-text-label-font-weight: 500;\r\n  --vtx-text-label-line-height: 1.5;\r\n  --vtx-text-label-letter-spacing: 0;\r\n\r\n  /* ============================================\r\n   * BORDER RADIUS TOKENS\r\n   * ============================================ */\r\n  --vtx-radius-none: 0;\r\n  --vtx-radius-sm: 0.125rem; /* 2px */\r\n  --vtx-radius-base: 0.25rem; /* 4px */\r\n  --vtx-radius-md: 0.375rem; /* 6px */\r\n  --vtx-radius-lg: 0.5rem; /* 8px */\r\n  --vtx-radius-xl: 0.75rem; /* 12px */\r\n  --vtx-radius-2xl: 1rem; /* 16px */\r\n  --vtx-radius-full: 9999px;\r\n\r\n  /* ============================================\r\n   * SHADOW TOKENS\r\n   * ============================================ */\r\n  --vtx-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\r\n  --vtx-shadow-base: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\r\n  --vtx-shadow-none: none;\r\n\r\n  /* ============================================\r\n   * TRANSITION TOKENS\r\n   * ============================================ */\r\n  --vtx-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n  --vtx-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);\r\n  --vtx-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);\r\n\r\n  /* ============================================\r\n  /* Z-INDEX TOKENS\r\n   * ============================================ */\r\n  --vtx-z-dropdown: 1000;\r\n  --vtx-z-sticky: 1100;\r\n  --vtx-z-modal: 1200;\r\n  --vtx-z-tooltip: 1300;\r\n  --vtx-z-notification: 1400;\r\n\r\n  --vtx-color-white: #ffffff;\r\n  --vtx-color-black: #000000;\r\n\r\n  /* ============================================\r\n   * SEMANTIC COLOR ALIASES\r\n   * ============================================ */\r\n  /* Text colors */\r\n  --vtx-text-primary: var(--vtx-color-neutral-900);\r\n  --vtx-text-secondary: var(--vtx-color-neutral-600);\r\n  --vtx-text-tertiary: var(--vtx-color-neutral-500);\r\n  --vtx-text-disabled: var(--vtx-color-neutral-400);\r\n\r\n  /* Background colors */\r\n  --vtx-background-primary: #ffffff;\r\n  --vtx-background-secondary: var(--vtx-color-neutral-50);\r\n  --vtx-background-hover: var(--vtx-color-neutral-100);\r\n  --vtx-background-active: var(--vtx-color-neutral-200);\r\n\r\n  /* Border colors */\r\n  --vtx-border-color: var(--vtx-color-neutral-300);\r\n  --vtx-border-color-light: var(--vtx-color-neutral-200);\r\n  --vtx-border-color-dark: var(--vtx-color-neutral-400);\r\n\r\n  /* Additional common aliases */\r\n  --vtx-transition-normal: var(--vtx-transition-base);\r\n}\r\n\r\n/* ============================================\r\n * DARK THEME OVERRIDES\r\n * ============================================ */\r\n[data-theme='dark'] {\r\n  /* Invert neutral colors for dark mode */\r\n  --vtx-color-neutral-50: #171717;\r\n  --vtx-color-neutral-100: #262626;\r\n  --vtx-color-neutral-200: #404040;\r\n  --vtx-color-neutral-300: #525252;\r\n  --vtx-color-neutral-400: #737373;\r\n  --vtx-color-neutral-500: #a3a3a3;\r\n  --vtx-color-neutral-600: #d4d4d4;\r\n  --vtx-color-neutral-700: #e5e5e5;\r\n  --vtx-color-neutral-800: #f5f5f5;\r\n  --vtx-color-neutral-900: #fafafa;\r\n\r\n  /* Dark mode semantic colors */\r\n  --vtx-text-primary: var(--vtx-color-neutral-50);\r\n  --vtx-text-secondary: var(--vtx-color-neutral-400);\r\n  --vtx-text-tertiary: var(--vtx-color-neutral-500);\r\n  --vtx-text-disabled: var(--vtx-color-neutral-600);\r\n\r\n  --vtx-background-primary: #0a0a0a;\r\n  --vtx-background-secondary: var(--vtx-color-neutral-900);\r\n  --vtx-background-hover: rgba(255, 255, 255, 0.05);\r\n  --vtx-background-active: rgba(255, 255, 255, 0.1);\r\n\r\n  --vtx-border-color: var(--vtx-color-neutral-700);\r\n  --vtx-border-color-light: var(--vtx-color-neutral-800);\r\n  --vtx-border-color-dark: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* ============================================\r\n * GLOBAL RESETS\r\n * ============================================ */\r\n*,\r\n*::before,\r\n*::after {\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Set root font size for rem calculations */\r\nhtml {\r\n  font-size: 16px; /* 1rem = 16px base */\r\n}\r\n\r\n/* Set base font styles for entire website */\r\nbody {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base); /* 1rem = 16px */\r\n  line-height: var(--vtx-line-height-normal); /* 1.5 */\r\n  font-weight: var(--vtx-font-weight-normal); /* 400 */\r\n  color: var(--vtx-color-neutral-900);\r\n  -webkit-font-smoothing: antialiased;\r\n  -moz-osx-font-smoothing: grayscale;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n/* Apply default font to all elements unless overridden */\r\n*:not(code):not(pre):not(kbd):not(samp) {\r\n  font-family: inherit;\r\n}\r\n\r\n/* Reset default margins and ensure consistent font inheritance */\r\nh1,\r\nh2,\r\nh3,\r\nh4,\r\nh5,\r\nh6,\r\np,\r\nblockquote,\r\npre,\r\nul,\r\nol,\r\nli,\r\ndl,\r\ndt,\r\ndd,\r\nfigure,\r\nfigcaption,\r\ntable,\r\nthead,\r\ntbody,\r\ntfoot,\r\ntr,\r\nth,\r\ntd {\r\n  margin: 0;\r\n  font-family: inherit;\r\n  font-size: inherit;\r\n  line-height: inherit;\r\n  font-weight: inherit;\r\n}\r\n\r\n/* Ensure form elements inherit typography */\r\nbutton,\r\ninput,\r\noptgroup,\r\nselect,\r\ntextarea {\r\n  font-family: inherit;\r\n  font-size: inherit;\r\n  line-height: inherit;\r\n}\r\n");k(".infocard-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 2rem;\r\n  width: 40px;\r\n  height: 40px;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n}\r\n\r\n.infocard-icon--primary {\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n}\r\n.infocard-icon--secondary {\r\n  background: var(--vtx-color-secondary-100, #f3e8ff);\r\n  color: var(--vtx-color-secondary-600, #7c3aed);\r\n}\r\n.infocard-icon--success {\r\n  background: var(--vtx-color-success-100, #e6f4ea);\r\n  color: var(--vtx-color-success-600, #388e3c);\r\n}\r\n.infocard-icon--danger {\r\n  background: var(--vtx-color-danger-100, #ffebee);\r\n  color: var(--vtx-color-danger-600, #d32f2f);\r\n}\r\n.infocard-icon--warning {\r\n  background: var(--vtx-color-warning-100, #fff8e1);\r\n  color: var(--vtx-color-warning-600, #fbc02d);\r\n}\r\n.infocard-icon--info {\r\n  background: var(--vtx-color-info-100, #e3f7fc);\r\n  color: var(--vtx-color-info-600, #0288d1);\r\n}\r\n");const fr=i.default.forwardRef(({icon:r,iconVariant:e="primary",text:t,subText:a,className:o="",style:i,...l},c)=>n.jsx(nr,{variant:"outlined",className:o,style:i,ref:c,...l,children:n.jsxs(gr,{container:!0,spacing:2,alignItems:"center",wrap:"nowrap",justifyContent:"center",children:[n.jsx(gr,{item:!0,xs:"auto",children:n.jsx(Tn,{align:"center",justify:"center",children:n.jsx("span",{className:`infocard-icon infocard-icon--${e}`,children:r})})}),n.jsxs(gr,{item:!0,xs:!0,children:[n.jsx(In,{variant:"caption",children:t}),a&&n.jsx(In,{variant:"subtitle2",children:a})]})]})}));fr.displayName="InfoCardBase";const br=i.default.forwardRef(({value:r,label:e,className:t="",style:a,...o},i)=>n.jsx(nr,{variant:"outlined",className:t,style:a,ref:i,...o,children:n.jsxs(Tn,{direction:"column",align:"center",justify:"center",style:{minHeight:80},children:[n.jsx(In,{variant:"h4",children:r}),e&&n.jsx(In,{variant:"caption",children:e})]})}));br.displayName="InfoCardMetric";const wr={Base:y(fr),Metric:y(br)};k("/* Base InfoText Styles */\r\n.infotext-base {\r\n  /* Container styles handled by Flex component */\r\n}\r\n\r\n.infotext-stat {\r\n  /* Container styles handled by Flex component */\r\n}\r\n\r\n.infotext-feature {\r\n  /* Container styles handled by Flex component */\r\n}\r\n\r\n.infotext-compact {\r\n  /* Container styles handled by Flex component */\r\n}\r\n\r\n.infotext-vertical {\r\n  /* Container styles handled by Flex component */\r\n}\r\n\r\n/* Icon Wrapper */\r\n.infotext-icon-wrapper {\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Plain Icon (no circle background) */\r\n.infotext-icon-plain {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  width: 40px;\r\n  height: 40px;\r\n  transition: all 0.2s ease-in-out;\r\n}\r\n\r\n.infotext-icon-small-plain {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1rem;\r\n  width: 24px;\r\n  height: 24px;\r\n  transition: all 0.2s ease-in-out;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Icon Styles */\r\n.infotext-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  width: 40px;\r\n  height: 40px;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n  transition: all 0.2s ease-in-out;\r\n}\r\n\r\n.infotext-icon--primary {\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n}\r\n\r\n.infotext-icon--secondary {\r\n  background: var(--vtx-color-secondary-100, #f3e8ff);\r\n  color: var(--vtx-color-secondary-600, #7c3aed);\r\n}\r\n\r\n.infotext-icon--success {\r\n  background: var(--vtx-color-success-100, #e6f4ea);\r\n  color: var(--vtx-color-success-600, #388e3c);\r\n}\r\n\r\n.infotext-icon--danger {\r\n  background: var(--vtx-color-danger-100, #ffebee);\r\n  color: var(--vtx-color-danger-600, #d32f2f);\r\n}\r\n\r\n.infotext-icon--warning {\r\n  background: var(--vtx-color-warning-100, #fff8e1);\r\n  color: var(--vtx-color-warning-600, #fbc02d);\r\n}\r\n\r\n.infotext-icon--info {\r\n  background: var(--vtx-color-info-100, #e3f7fc);\r\n  color: var(--vtx-color-info-600, #0288d1);\r\n}\r\n\r\n/* Small Icon Styles for Compact Variant */\r\n.infotext-icon-small {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1rem;\r\n  width: 24px;\r\n  height: 24px;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n  transition: all 0.2s ease-in-out;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.infotext-icon-small--primary {\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n}\r\n\r\n.infotext-icon-small--secondary {\r\n  background: var(--vtx-color-secondary-100, #f3e8ff);\r\n  color: var(--vtx-color-secondary-600, #7c3aed);\r\n}\r\n\r\n.infotext-icon-small--success {\r\n  background: var(--vtx-color-success-100, #e6f4ea);\r\n  color: var(--vtx-color-success-600, #388e3c);\r\n}\r\n\r\n.infotext-icon-small--danger {\r\n  background: var(--vtx-color-danger-100, #ffebee);\r\n  color: var(--vtx-color-danger-600, #d32f2f);\r\n}\r\n\r\n.infotext-icon-small--warning {\r\n  background: var(--vtx-color-warning-100, #fff8e1);\r\n  color: var(--vtx-color-warning-600, #fbc02d);\r\n}\r\n\r\n.infotext-icon-small--info {\r\n  background: var(--vtx-color-info-100, #e3f7fc);\r\n  color: var(--vtx-color-info-600, #0288d1);\r\n}\r\n\r\n/* Badge Styles */\r\n.infotext-badge {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 2px 8px;\r\n  border-radius: 12px;\r\n  font-size: 0.75rem;\r\n  font-weight: 500;\r\n  background: var(--vtx-color-primary-100, #e3f2fd);\r\n  color: var(--vtx-color-primary-600, #1976d2);\r\n}\r\n\r\n/* Hover Effects (Optional) */\r\n.infotext-base:hover .infotext-icon,\r\n.infotext-stat:hover .infotext-icon,\r\n.infotext-feature:hover .infotext-icon,\r\n.infotext-vertical:hover .infotext-icon {\r\n  transform: scale(1.05);\r\n}\r\n\r\n.infotext-compact:hover .infotext-icon-small {\r\n  transform: scale(1.1);\r\n}\r\n");const yr=i.default.forwardRef(({icon:r,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...c},s)=>n.jsxs(Tn,{direction:"row",align:"center",gap:8,className:`infotext-base ${i}`,style:l,ref:s,...c,children:[n.jsx(Tn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?n.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:r}):n.jsx("span",{className:"infotext-icon-plain",children:r})}),n.jsxs(Tn,{direction:"column",gap:4,children:[n.jsx(In,{variant:"body1",weight:"medium",noMargin:!0,children:a}),o&&n.jsx(In,{variant:"caption",color:"text-secondary",noMargin:!0,children:o})]})]}));yr.displayName="InfoTextBase";const kr=i.default.forwardRef(({icon:r,iconVariant:e="primary",iconCircle:t=!0,value:a,label:o,subText:i,className:l="",style:c,...s},d)=>n.jsxs(Tn,{direction:"row",align:"center",gap:8,className:`infotext-stat ${l}`,style:c,ref:d,...s,children:[r&&n.jsx(Tn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?n.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:r}):n.jsx("span",{className:"infotext-icon-plain",children:r})}),n.jsxs(Tn,{direction:"column",gap:4,children:[n.jsx(In,{variant:"h5",weight:"bold",noMargin:!0,children:a}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:o}),i&&n.jsx(In,{variant:"caption",color:"text-secondary",noMargin:!0,children:i})]})]}));kr.displayName="InfoTextStat";const jr=i.default.forwardRef(({icon:r,iconVariant:e="primary",iconCircle:t=!0,title:a,description:o,badge:i,className:l="",style:c,...s},d)=>n.jsxs(Tn,{direction:"row",align:"start",gap:8,className:`infotext-feature ${l}`,style:c,ref:d,...s,children:[n.jsx(Tn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?n.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:r}):n.jsx("span",{className:"infotext-icon-plain",children:r})}),n.jsxs(Tn,{direction:"column",gap:6,style:{flex:1},children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:a}),i&&n.jsx("span",{className:"infotext-badge",children:i})]}),n.jsx(In,{variant:"body2",color:"text-secondary",noMargin:!0,children:o})]})]}));jr.displayName="InfoTextFeature";const _r=i.default.forwardRef(({icon:r,iconVariant:e="primary",iconCircle:t=!0,text:a,className:o="",style:i,...l},c)=>n.jsxs(Tn,{direction:"row",align:"center",gap:8,className:`infotext-compact ${o}`,style:i,ref:c,...l,children:[t?n.jsx("span",{className:`infotext-icon-small infotext-icon-small--${e}`,children:r}):n.jsx("span",{className:"infotext-icon-small-plain",children:r}),n.jsx(In,{variant:"body2",noMargin:!0,children:a})]}));_r.displayName="InfoTextCompact";const zr=i.default.forwardRef(({icon:r,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...c},s)=>n.jsxs(Tn,{direction:"column",align:"center",gap:10,className:`infotext-vertical ${i}`,style:l,ref:s,...c,children:[n.jsx(Tn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?n.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:r}):n.jsx("span",{className:"infotext-icon-plain",children:r})}),n.jsxs(Tn,{direction:"column",gap:4,align:"center",children:[n.jsx(In,{variant:"body1",weight:"medium",align:"center",noMargin:!0,children:a}),o&&n.jsx(In,{variant:"caption",color:"text-secondary",align:"center",noMargin:!0,children:o})]})]}));zr.displayName="InfoTextVertical";const Nr={Base:y(yr),Stat:y(kr),Feature:y(jr),Compact:y(_r),Vertical:y(zr)};k("/* ==================== Base ProductCard ==================== */\r\n.productcard {\r\n  max-width: 320px;\r\n  width: 100%;\r\n  border: 1px solid var(--vtx-color-neutral-200, #e0e0e0);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n  position: relative;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  overflow: hidden;\r\n}\r\n\r\n.productcard:hover {\r\n  box-shadow: var(--vtx-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));\r\n  transform: translateY(-4px);\r\n}\r\n\r\n.productcard-image-wrapper {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 200px;\r\n  overflow: hidden;\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-50, #f5f5f5), var(--vtx-color-neutral-100, #fafafa));\r\n}\r\n\r\n.productcard-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  transition: var(--vtx-transition-slow, transform 0.4s ease);\r\n}\r\n\r\n.productcard-image-wrapper:hover .productcard-image {\r\n  transform: scale(1.08);\r\n}\r\n\r\n@media (max-width: 375px) {\r\n  .productcard {\r\n    max-width: 100%;\r\n  }\r\n  \r\n  .productcard-image-wrapper {\r\n    height: 180px;\r\n  }\r\n}\r\n\r\n/* Badges */\r\n.productcard-badges {\r\n  position: absolute;\r\n  top: 12px;\r\n  left: 12px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n  z-index: 2;\r\n}\r\n\r\n.productcard-featured-badge {\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-600, #2563eb) 0%, var(--vtx-color-secondary-600, #7c3aed) 100%);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n  font-size: 11px;\r\n  font-weight: 600;\r\n  padding: 4px 10px;\r\n  border-radius: 4px;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  box-shadow: var(--vtx-shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.15));\r\n}\r\n\r\n.productcard-discount-badge {\r\n  background: var(--vtx-color-error-600, #dc2626);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  padding: 4px 10px;\r\n  border-radius: 4px;\r\n  box-shadow: var(--vtx-shadow-sm, 0 2px 8px rgba(220, 38, 38, 0.3));\r\n}\r\n\r\n/* Wishlist Button */\r\n.productcard-wishlist-btn {\r\n  position: absolute;\r\n  top: 12px;\r\n  right: 12px;\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 50%;\r\n  border: none;\r\n  background: rgba(255, 255, 255, 0.95);\r\n  color: var(--vtx-color-neutral-500, #737373);\r\n  font-size: 1.25rem;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  z-index: 3;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  box-shadow: var(--vtx-shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.1));\r\n}\r\n\r\n.productcard-wishlist-btn:hover {\r\n  background: var(--vtx-color-neutral-50, #ffffff);\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n  transform: scale(1.1);\r\n  box-shadow: var(--vtx-shadow-md, 0 4px 12px rgba(220, 38, 38, 0.2));\r\n}\r\n\r\n.productcard-wishlist-btn--active {\r\n  background: var(--vtx-color-error-600, #dc2626);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n}\r\n\r\n.productcard-wishlist-btn--active:hover {\r\n  background: var(--vtx-color-error-700, #b91c1c);\r\n  transform: scale(1.1);\r\n}\r\n\r\n/* Hover Overlay for Quick View */\r\n.productcard-hover-overlay {\r\n  position: absolute;\r\n  left: 0;\r\n  bottom: 0;\r\n  width: 100%;\r\n  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);\r\n  opacity: 0;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: flex-end;\r\n  padding: var(--vtx-spacing-4, 16px);\r\n  z-index: 2;\r\n  transition: var(--vtx-transition-normal, opacity 0.3s ease);\r\n  pointer-events: none;\r\n}\r\n\r\n.productcard-image-wrapper:hover .productcard-hover-overlay {\r\n  opacity: 1;\r\n  pointer-events: all;\r\n}\r\n\r\n/* Category Chip */\r\n.productcard-category {\r\n  font-size: 12px;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n}\r\n\r\n.productcard-category:hover {\r\n  background-color: var(--vtx-color-primary-600, #1976d2);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n  cursor: pointer;\r\n}\r\n\r\n/* Weight/Units */\r\n.productcard-weight {\r\n  font-size: 14px;\r\n  color: var(--vtx-color-neutral-600, #757575);\r\n}\r\n\r\n/* Rating */\r\n.productcard-rating-wrapper {\r\n  font-size: 14px;\r\n}\r\n\r\n.productcard-rating {\r\n  color: var(--vtx-color-warning-500, #fbc02d);\r\n  font-size: 16px;\r\n  line-height: 1;\r\n  letter-spacing: 1px;\r\n}\r\n\r\n/* Price */\r\n.productcard-price {\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n  font-size: 18px;\r\n  font-weight: 700;\r\n}\r\n\r\n.productcard-original-price {\r\n  color: var(--vtx-color-neutral-500, #999);\r\n  text-decoration: line-through;\r\n  font-size: 14px;\r\n}\r\n\r\n/* Quantity Selector */\r\n.productcard-quantity-selector {\r\n  border-radius: 6px;\r\n  width: 100%;\r\n  height: 44px;\r\n  border: 1px solid var(--vtx-color-neutral-300, #ddd);\r\n}\r\n\r\n.productcard-quantity-value {\r\n  text-align: center;\r\n  font-size: 16px;\r\n  font-weight: 600;\r\n  min-width: 40px;\r\n}\r\n\r\n/* ==================== Compact ProductCard ==================== */\r\n.productcard-compact {\r\n  transition: box-shadow 0.2s ease-in-out;\r\n}\r\n\r\n.productcard-compact:hover {\r\n  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.productcard-image-compact-wrapper {\r\n  position: relative;\r\n  width: 100px;\r\n  height: 100px;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n  border-radius: 8px;\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n}\r\n\r\n.productcard-image-compact {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  transition: transform 0.3s ease-in-out;\r\n}\r\n\r\n.productcard-image-compact-wrapper:hover .productcard-image-compact {\r\n  transform: scale(1.05);\r\n}\r\n\r\n.productcard-badge-compact {\r\n  position: absolute;\r\n  top: 6px;\r\n  left: 6px;\r\n  z-index: 1;\r\n}\r\n\r\n.productcard-rating-compact {\r\n  color: var(--vtx-color-warning-500, #fbc02d);\r\n  font-size: 0.875rem;\r\n  line-height: 1;\r\n}\r\n\r\n/* ==================== List ProductCard ==================== */\r\n.productcard-list {\r\n  padding: 16px;\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200, #e0e0e0);\r\n  transition: background-color 0.2s ease-in-out;\r\n}\r\n\r\n.productcard-list:hover {\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n}\r\n\r\n.productcard-image-list-wrapper {\r\n  position: relative;\r\n  width: 120px;\r\n  height: 120px;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n  border-radius: 8px;\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n}\r\n\r\n.productcard-image-list {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.productcard-badge-list {\r\n  position: absolute;\r\n  top: 8px;\r\n  left: 8px;\r\n  z-index: 1;\r\n}\r\n\r\n.productcard-quantity-btn {\r\n  width: 32px;\r\n  height: 32px;\r\n  border: 1px solid var(--vtx-color-neutral-300, #d0d0d0);\r\n  border-radius: 4px;\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n  color: var(--vtx-color-text-primary, #212121);\r\n  font-size: 1rem;\r\n  font-weight: 600;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease-in-out;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.productcard-quantity-btn:hover {\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n  border-color: var(--vtx-color-neutral-400, #bdbdbd);\r\n}\r\n\r\n.productcard-quantity-btn:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n/* ==================== Featured ProductCard ==================== */\r\n.productcard-featured {\r\n  max-width: 100%;\r\n  transition: box-shadow 0.2s ease-in-out;\r\n}\r\n\r\n.productcard-featured:hover {\r\n  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.productcard-image-featured-wrapper {\r\n  position: relative;\r\n  width: 300px;\r\n  height: 300px;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n  border-radius: 12px;\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n}\r\n\r\n.productcard-image-featured {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  transition: transform 0.3s ease-in-out;\r\n}\r\n\r\n.productcard-image-featured-wrapper:hover .productcard-image-featured {\r\n  transform: scale(1.05);\r\n}\r\n\r\n.productcard-badge-featured {\r\n  position: absolute;\r\n  top: 16px;\r\n  left: 16px;\r\n  z-index: 1;\r\n}\r\n\r\n.productcard-rating-large {\r\n  color: var(--vtx-color-warning-500, #fbc02d);\r\n  font-size: 1.25rem;\r\n  line-height: 1;\r\n}\r\n\r\n.productcard-feature-bullet {\r\n  color: var(--vtx-color-success-600, #388e3c);\r\n  font-size: 1.125rem;\r\n  font-weight: bold;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* ==================== Wide Variant (Horizontal Layout) ==================== */\r\n.productcard-wide {\r\n  max-width: 100%;\r\n  width: 100%;\r\n  border: 1px solid var(--vtx-color-neutral-200, #e0e0e0);\r\n  border-radius: var(--vtx-radius-lg, 12px);\r\n  overflow: hidden;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  display: flex;\r\n}\r\n\r\n.productcard-wide:hover {\r\n  box-shadow: var(--vtx-shadow-lg, 0 6px 20px rgba(0, 0, 0, 0.1));\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.productcard-wide-image-wrapper {\r\n  position: relative;\r\n  width: 240px;\r\n  height: 100%;\r\n  min-height: 200px;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-50, #f5f5f5), var(--vtx-color-neutral-100, #fafafa));\r\n}\r\n\r\n.productcard-wide-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  transition: var(--vtx-transition-slow, transform 0.4s ease);\r\n}\r\n\r\n.productcard-wide-image-wrapper:hover .productcard-wide-image {\r\n  transform: scale(1.06);\r\n}\r\n\r\n/* Wide variant rating */\r\n.productcard-wide .productcard-rating {\r\n  font-size: 18px;\r\n  letter-spacing: 2px;\r\n}\r\n\r\n/* Wide variant cart actions */\r\n.productcard-wide .productcard-quantity-selector {\r\n  width: 100%;\r\n  height: 44px;\r\n}\r\n\r\n/* Wide variant content padding adjustments */\r\n.productcard-wide .productcard-category {\r\n  font-size: 12px;\r\n  padding: 4px 12px;\r\n}\r\n\r\n.productcard-wide .productcard-price {\r\n  font-size: 24px;\r\n}\r\n\r\n/* ==================== Minimal Variant ==================== */\r\n.productcard-minimal {\r\n  max-width: 240px;\r\n  position: relative;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n}\r\n\r\n.productcard-minimal:hover {\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.productcard-minimal-image-wrapper {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 240px;\r\n  overflow: hidden;\r\n  border-radius: 12px;\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-50, #f5f5f5), var(--vtx-color-neutral-100, #fafafa));\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.productcard-minimal-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  transition: var(--vtx-transition-slow, transform 0.4s ease);\r\n}\r\n\r\n.productcard-minimal-image-wrapper:hover .productcard-minimal-image {\r\n  transform: scale(1.08);\r\n}\r\n\r\n.productcard-minimal-discount {\r\n  position: absolute;\r\n  top: 10px;\r\n  left: 10px;\r\n  background: var(--vtx-color-error-600, #dc2626);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n  font-size: 11px;\r\n  font-weight: 700;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n  box-shadow: var(--vtx-shadow-sm, 0 2px 6px rgba(220, 38, 38, 0.3));\r\n  z-index: 2;\r\n}\r\n\r\n.productcard-minimal-wishlist {\r\n  position: absolute;\r\n  top: 10px;\r\n  right: 10px;\r\n  width: 32px;\r\n  height: 32px;\r\n  border-radius: 50%;\r\n  border: none;\r\n  background: rgba(255, 255, 255, 0.95);\r\n  color: var(--vtx-color-neutral-500, #737373);\r\n  font-size: 1.1rem;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  z-index: 3;\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  box-shadow: var(--vtx-shadow-sm, 0 2px 6px rgba(0, 0, 0, 0.1));\r\n}\r\n\r\n.productcard-minimal-wishlist:hover {\r\n  background: var(--vtx-color-neutral-50, #ffffff);\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n  transform: scale(1.1);\r\n}\r\n\r\n.productcard-minimal-wishlist--active {\r\n  background: var(--vtx-color-error-600, #dc2626);\r\n  color: var(--vtx-color-neutral-50, #ffffff);\r\n}\r\n\r\n.productcard-rating-minimal {\r\n  color: var(--vtx-color-warning-500, #fbc02d);\r\n  font-size: 15px;\r\n  line-height: 1;\r\n  letter-spacing: 1px;\r\n}\r\n\r\n.productcard-quantity-selector-minimal {\r\n  height: 36px;\r\n  border-radius: 6px;\r\n  border: 1px solid var(--vtx-color-neutral-300, #ddd);\r\n  padding: 0 8px;\r\n}\r\n\r\n/* ==================== Responsive ==================== */\r\n\r\n/* Tablet and below */\r\n@media (max-width: 768px) {\r\n  .productcard {\r\n    max-width: 100%;\r\n  }\r\n  \r\n  .productcard-featured {\r\n    flex-direction: column !important;\r\n  }\r\n  \r\n  .productcard-image-featured-wrapper {\r\n    width: 100%;\r\n    max-width: 100%;\r\n    height: 250px;\r\n  }\r\n  \r\n  .productcard-wide {\r\n    max-width: 100%;\r\n  }\r\n  \r\n  .productcard-wide > div {\r\n    flex-direction: column !important;\r\n  }\r\n  \r\n  .productcard-wide-image-wrapper {\r\n    width: 100%;\r\n    height: 220px;\r\n    min-height: 220px;\r\n  }\r\n  \r\n  .productcard-wide .productcard-rating {\r\n    font-size: 16px;\r\n    letter-spacing: 1.5px;\r\n  }\r\n  \r\n  .productcard-wide .productcard-quantity-selector {\r\n    min-width: 100%;\r\n    max-width: 100%;\r\n  }\r\n  \r\n  .productcard-wide .productcard-price {\r\n    font-size: 22px;\r\n  }\r\n  \r\n  .productcard-minimal {\r\n    max-width: 100%;\r\n  }\r\n  \r\n  .productcard-minimal-image-wrapper {\r\n    height: 220px;\r\n  }\r\n}\r\n\r\n/* Mobile */\r\n@media (max-width: 480px) {\r\n  .productcard-image-wrapper {\r\n    height: 180px;\r\n  }\r\n  \r\n  .productcard-wide-image-wrapper {\r\n    height: 200px;\r\n    min-height: 200px;\r\n  }\r\n  \r\n  .productcard-image-featured-wrapper {\r\n    height: 200px;\r\n  }\r\n  \r\n  .productcard-minimal-image-wrapper {\r\n    height: 200px;\r\n  }\r\n  \r\n  .productcard-image-list-wrapper {\r\n    width: 80px;\r\n    height: 80px;\r\n  }\r\n  \r\n  .productcard-rating {\r\n    font-size: 15px;\r\n  }\r\n  \r\n  .productcard-wide .productcard-rating {\r\n    font-size: 15px;\r\n  }\r\n}\r\n\r\n/* Small mobile */\r\n@media (max-width: 375px) {\r\n  .productcard-image-wrapper {\r\n    height: 160px;\r\n  }\r\n  \r\n  .productcard-wide-image-wrapper {\r\n    height: 180px;\r\n    min-height: 180px;\r\n  }\r\n  \r\n  .productcard-image-featured-wrapper {\r\n    height: 180px;\r\n  }\r\n  \r\n  .productcard-minimal-image-wrapper {\r\n    height: 180px;\r\n  }\r\n  \r\n  .productcard-rating {\r\n    font-size: 14px;\r\n  }\r\n}\r\n");const Cr=i.default.forwardRef(({id:e,image:t,imageAlt:a="Product",category:o,name:i,weight:l,units:c,price:s,originalPrice:d,discount:x,rating:v,initialQuantity:p=0,featured:m=!1,featuredText:h="Featured",showWishlist:u=!1,isWishlisted:g=!1,cartIcon:f,wishlistIcon:b,wishlistFilledIcon:w,quickViewIcon:y,onAddToCart:k,onIncrementCart:j,onDecrementCart:z,onWishlist:N,onQuickView:C,onClick:S,loading:M=!1,className:T="",style:$,...I},D)=>{const[A,E]=r.useState(p),[R,L]=r.useState(!1),B=R||M;return n.jsx(nr,{variant:"outlined",className:`productcard ${T}`,style:{padding:0,...$},ref:D,...I,children:n.jsxs(Tn,{direction:"column",children:[n.jsxs("div",{className:"productcard-image-wrapper",onClick:S,style:{cursor:S?"pointer":"default"},children:[n.jsx("img",{src:t,alt:a,className:"productcard-image"}),n.jsxs("div",{className:"productcard-badges",children:[m&&n.jsx("span",{className:"productcard-featured-badge",children:h}),x&&n.jsx("span",{className:"productcard-discount-badge",children:x})]}),u&&N&&n.jsx("button",{className:"productcard-wishlist-btn "+(g?"productcard-wishlist-btn--active":""),onClick:n=>{n.stopPropagation(),N()},"aria-label":g?"Remove from wishlist":"Add to wishlist",children:g?w||b||"♥":b||"♡"}),C&&n.jsx("div",{className:"productcard-hover-overlay",children:n.jsx(_,{variant:"secondary",size:"sm",leftIcon:y||"👁",onClick:n=>{n.stopPropagation(),C()},children:"Quick View"})})]}),n.jsxs(Tn,{direction:"column",gap:5,style:{padding:"12px"},children:[o&&n.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:n.jsx(hn,{label:o,variant:"outlined",className:"productcard-category"})}),n.jsx(In,{variant:"body1",noMargin:!0,onClick:S,style:{cursor:S?"pointer":"default"},children:i}),(void 0!==l||c)&&n.jsx(In,{variant:"body1",noMargin:!0,className:"productcard-weight",children:void 0!==l&&c?`${l} ${c}`:void 0!==l?l:"-"}),void 0!==v&&n.jsxs(Tn,{align:"center",gap:5,className:"productcard-rating-wrapper",children:[n.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(v)),"☆".repeat(5-Math.floor(v))]}),n.jsx(In,{variant:"caption",noMargin:!0,children:v})]}),n.jsxs(Tn,{align:"center",gap:8,children:[n.jsxs(In,{variant:"h5",noMargin:!0,className:"productcard-price",children:["$",Number(s).toFixed(2)]}),d&&d>s&&n.jsxs(In,{variant:"body2",noMargin:!0,className:"productcard-original-price",children:["$",Number(d).toFixed(2)]})]}),B?n.jsx(_,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===A?n.jsx(_,{fullWidth:!0,variant:"primary",leftIcon:f,onClick:async()=>{if(k){L(!0);try{await k(e,1),E(1)}catch(n){console.error("Add to cart error:",n)}finally{L(!1)}}},children:"Add to cart"}):n.jsxs(Tn,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[n.jsx(_,{variant:"secondary",onClick:async()=>{if(z&&!(A<=0)){L(!0);try{await z(e,A),E(A-1)}catch(n){console.error("Decrement error:",n)}finally{L(!1)}}},children:"-"}),n.jsx(In,{noMargin:!0,className:"productcard-quantity-value",children:A}),n.jsx(_,{variant:"secondary",onClick:async()=>{if(j){L(!0);try{await j(e,A),E(A+1)}catch(n){console.error("Increment error:",n)}finally{L(!1)}}},children:"+"})]})]})]})})});Cr.displayName="ProductCardBase";const Sr=i.default.forwardRef(({imagePosition:e="left",...t},a)=>{const{id:o,image:i,imageAlt:l="Product",category:c,name:s,weight:d,units:x,price:v,originalPrice:p,discount:m,rating:h,initialQuantity:u=0,featured:g=!1,featuredText:f="Featured",showWishlist:b=!1,isWishlisted:w=!1,cartIcon:y,wishlistIcon:k,wishlistFilledIcon:j,quickViewIcon:z,onAddToCart:N,onIncrementCart:C,onDecrementCart:S,onWishlist:M,onQuickView:T,onClick:$,loading:I=!1,className:D="",style:A}=t,[E,R]=r.useState(u),[L,B]=r.useState(!1),O=L||I;return n.jsx(nr,{variant:"outlined",className:`productcard-wide ${D}`,style:{padding:0,...A},ref:a,children:n.jsxs(Tn,{direction:"left"===e?"row":"row-reverse",children:[n.jsxs("div",{className:"productcard-wide-image-wrapper",onClick:$,style:{cursor:$?"pointer":"default"},children:[n.jsx("img",{src:i,alt:l,className:"productcard-wide-image"}),n.jsxs("div",{className:"productcard-badges",children:[g&&n.jsx("span",{className:"productcard-featured-badge",children:f}),m&&n.jsx("span",{className:"productcard-discount-badge",children:m})]}),b&&M&&n.jsx("button",{className:"productcard-wishlist-btn "+(w?"productcard-wishlist-btn--active":""),onClick:n=>{n.stopPropagation(),M()},children:w?j||k||"♥":k||"♡"})]}),n.jsxs(Tn,{direction:"column",gap:12,style:{padding:"16px 20px",flex:1,minWidth:0},children:[c&&n.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:n.jsx(hn,{label:c,variant:"outlined",className:"productcard-category"})}),n.jsxs(Tn,{direction:"column",gap:6,children:[n.jsx(In,{variant:"h5",weight:"bold",noMargin:!0,onClick:$,style:{cursor:$?"pointer":"default",wordBreak:"break-word"},children:s}),(void 0!==d||x)&&n.jsx(In,{variant:"body2",noMargin:!0,className:"productcard-weight",children:void 0!==d&&x?`${d} ${x}`:void 0!==d?d:"-"})]}),void 0!==h&&n.jsxs(Tn,{align:"center",gap:6,children:[n.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(h)),"☆".repeat(5-Math.floor(h))]}),n.jsx(In,{variant:"caption",noMargin:!0,children:h})]}),n.jsxs(Tn,{align:"center",gap:8,wrap:"wrap",style:{marginTop:"auto"},children:[n.jsxs(In,{variant:"h4",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(v).toFixed(2)]}),p&&p>v&&n.jsxs(In,{variant:"body1",noMargin:!0,className:"productcard-original-price",children:["$",Number(p).toFixed(2)]})]}),n.jsxs(Tn,{gap:12,align:"center",direction:"row",wrap:"wrap",children:[n.jsx("div",{style:{flex:"1 1 auto",minWidth:"140px"},children:O?n.jsx(_,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===E?n.jsx(_,{fullWidth:!0,variant:"primary",leftIcon:y,onClick:async()=>{if(N){B(!0);try{await N(o,1),R(1)}catch(n){console.error("Add to cart error:",n)}finally{B(!1)}}},children:"Add to cart"}):n.jsxs(Tn,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[n.jsx(_,{variant:"secondary",onClick:async()=>{if(S&&!(E<=0)){B(!0);try{await S(o,E),R(E-1)}catch(n){console.error("Decrement error:",n)}finally{B(!1)}}},children:"-"}),n.jsx(In,{noMargin:!0,className:"productcard-quantity-value",children:E}),n.jsx(_,{variant:"primary",onClick:async()=>{if(C){B(!0);try{await C(o,E),R(E+1)}catch(n){console.error("Increment error:",n)}finally{B(!1)}}},children:"+"})]})}),T&&n.jsx(_,{variant:"outline",size:"md",leftIcon:z||"👁",onClick:T,children:"View"})]})]})]})})});Sr.displayName="ProductCardWide";const Mr=i.default.forwardRef((e,t)=>{const{id:a,image:o,imageAlt:i="Product",name:l,price:c,originalPrice:s,discount:d,rating:x,initialQuantity:v=0,showWishlist:p=!1,isWishlisted:m=!1,cartIcon:h,wishlistIcon:u,wishlistFilledIcon:g,onAddToCart:f,onIncrementCart:b,onDecrementCart:w,onWishlist:y,onClick:k,loading:j=!1,className:z="",style:N}=e,[C,S]=r.useState(v),[M,T]=r.useState(!1),$=M||j;return n.jsxs("div",{className:`productcard-minimal ${z}`,style:N,ref:t,children:[n.jsxs("div",{className:"productcard-minimal-image-wrapper",onClick:k,style:{cursor:k?"pointer":"default"},children:[n.jsx("img",{src:o,alt:i,className:"productcard-minimal-image"}),d&&n.jsx("span",{className:"productcard-minimal-discount",children:d}),p&&y&&n.jsx("button",{className:"productcard-minimal-wishlist "+(m?"productcard-minimal-wishlist--active":""),onClick:n=>{n.stopPropagation(),y()},children:m?g||u||"♥":u||"♡"})]}),n.jsxs(Tn,{direction:"column",gap:8,style:{padding:"12px 0"},children:[n.jsx(In,{variant:"body1",weight:"medium",noMargin:!0,onClick:k,style:{cursor:k?"pointer":"default"},children:l}),n.jsxs(Tn,{align:"center",gap:8,children:[n.jsxs(In,{variant:"h6",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(c).toFixed(2)]}),s&&s>c&&n.jsxs(In,{variant:"caption",noMargin:!0,className:"productcard-original-price",children:["$",Number(s).toFixed(2)]})]}),void 0!==x&&n.jsxs("div",{className:"productcard-rating-minimal",children:["★".repeat(Math.floor(x)),"☆".repeat(5-Math.floor(x))]}),$?n.jsx(_,{loading:!0,variant:"primary",size:"sm",children:"Loading"}):0===C?n.jsx(_,{variant:"primary",size:"sm",leftIcon:h,onClick:async()=>{if(f){T(!0);try{await f(a,1),S(1)}catch(n){console.error("Add to cart error:",n)}finally{T(!1)}}},fullWidth:!0,children:"Add"}):n.jsxs(Tn,{align:"center",justify:"between",className:"productcard-quantity-selector-minimal",children:[n.jsx(_,{variant:"secondary",size:"sm",onClick:async()=>{if(w&&!(C<=0)){T(!0);try{await w(a,C),S(C-1)}catch(n){console.error("Decrement error:",n)}finally{T(!1)}}},children:"-"}),n.jsx(In,{variant:"body2",noMargin:!0,weight:"medium",children:C}),n.jsx(_,{variant:"primary",size:"sm",onClick:async()=>{if(b){T(!0);try{await b(a,C),S(C+1)}catch(n){console.error("Increment error:",n)}finally{T(!1)}}},children:"+"})]})]})]})});Mr.displayName="ProductCardMinimal";const Tr={Base:y(Cr),Wide:y(Sr),Minimal:y(Mr)};k("/* ==================== Order Card ==================== */\r\n.ordercard {\r\n  width: 100%;\r\n  max-width: 100%;\r\n  padding: var(--vtx-spacing-3, 12px);\r\n  transition: var(--vtx-transition-normal, all 0.3s ease);\r\n  cursor: pointer;\r\n}\r\n\r\n.ordercard:hover {\r\n  box-shadow: var(--vtx-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.1));\r\n  transform: translateY(-2px);\r\n}\r\n\r\n/* Header Section */\r\n.ordercard-header {\r\n  padding-bottom: var(--vtx-spacing-2, 8px);\r\n  margin-bottom: var(--vtx-spacing-2, 8px);\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n}\r\n\r\n/* Image Wrapper */\r\n.ordercard-image-wrapper {\r\n  width: 56px;\r\n  height: 56px;\r\n  flex-shrink: 0;\r\n  border-radius: var(--vtx-radius-md, 8px);\r\n  overflow: hidden;\r\n  background: var(--vtx-color-neutral-100, #f5f5f5);\r\n}\r\n\r\n.ordercard-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n/* Product Name */\r\n.ordercard-product-name {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 2;\r\n  -webkit-box-orient: vertical;\r\n  line-height: 1.5;\r\n  word-break: break-word;\r\n  color: var(--vtx-color-neutral-800, #262626);\r\n}\r\n\r\n/* More Items Text */\r\n.ordercard-more-items {\r\n  opacity: 0.8;\r\n}\r\n\r\n/* Delivery Date */\r\n.ordercard-delivery {\r\n  opacity: 0.85;\r\n}\r\n\r\n/* Price */\r\n.ordercard-price {\r\n  color: var(--vtx-color-neutral-900, #171717);\r\n  font-size: 1.125rem;\r\n}\r\n\r\n/* Track Button */\r\n.ordercard-track-btn {\r\n  flex-shrink: 0;\r\n  min-width: 110px;\r\n}\r\n\r\n/* Content Section */\r\n.ordercard-content {\r\n  align-items: flex-start;\r\n  padding: var(--vtx-spacing-2, 8px) 0;\r\n}\r\n\r\n/* Footer Section */\r\n.ordercard-footer {\r\n  padding-top: var(--vtx-spacing-2, 8px);\r\n  margin-top: var(--vtx-spacing-2, 8px);\r\n  border-top: 1px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n}\r\n\r\n/* ==================== Responsive Design ==================== */\r\n\r\n/* Tablet and below */\r\n@media (max-width: 768px) {\r\n  .ordercard {\r\n    padding: var(--vtx-spacing-3, 12px);\r\n  }\r\n\r\n  .ordercard-image-wrapper {\r\n    width: 52px;\r\n    height: 52px;\r\n  }\r\n\r\n  .ordercard-track-btn {\r\n    min-width: 100px;\r\n  }\r\n}\r\n\r\n/* Mobile */\r\n@media (max-width: 480px) {\r\n  .ordercard {\r\n    padding: var(--vtx-spacing-2, 8px) var(--vtx-spacing-3, 12px);\r\n  }\r\n\r\n  .ordercard-image-wrapper {\r\n    width: 48px;\r\n    height: 48px;\r\n  }\r\n\r\n  .ordercard-content {\r\n    padding: var(--vtx-spacing-1, 4px) 0;\r\n  }\r\n\r\n  .ordercard-footer {\r\n    flex-direction: column;\r\n    align-items: stretch !important;\r\n    gap: var(--vtx-spacing-2, 8px);\r\n  }\r\n\r\n  .ordercard-track-btn {\r\n    width: 100%;\r\n    min-width: unset;\r\n  }\r\n\r\n  .ordercard-price {\r\n    font-size: 1rem;\r\n  }\r\n}\r\n\r\n/* Small mobile - very compact */\r\n@media (max-width: 375px) {\r\n  .ordercard {\r\n    padding: var(--vtx-spacing-2, 8px);\r\n  }\r\n\r\n  .ordercard-image-wrapper {\r\n    width: 46px;\r\n    height: 46px;\r\n  }\r\n\r\n  .ordercard-header {\r\n    padding-bottom: var(--vtx-spacing-1, 4px);\r\n    margin-bottom: var(--vtx-spacing-1, 4px);\r\n  }\r\n\r\n  .ordercard-content {\r\n    gap: var(--vtx-spacing-2, 8px);\r\n  }\r\n}\r\n\r\n/* ==================== Long Text Handling ==================== */\r\n\r\n/* Ensure long text doesn't break layout */\r\n.ordercard * {\r\n  min-width: 0;\r\n}\r\n\r\n/* Status badge should not wrap */\r\n.ordercard .vtx-badge {\r\n  flex-shrink: 0;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* ==================== Print Styles ==================== */\r\n@media print {\r\n  .ordercard {\r\n    box-shadow: none !important;\r\n    border: 1px solid var(--vtx-color-neutral-300, #d4d4d4);\r\n  }\r\n\r\n  .ordercard:hover {\r\n    transform: none;\r\n  }\r\n\r\n  .ordercard-track-btn {\r\n    display: none;\r\n  }\r\n}\r\n");const $r=i.default.forwardRef(({orderId:r,orderNumber:e,status:t="pending",statusText:a,items:o,deliveryDate:i,deliveryLabel:l="Delivered on",totalAmount:c,currency:s="₹",onTrackOrder:d,onViewDetails:x,trackButtonText:v="Track Order",className:p="",style:m,...h},u)=>{const g=o[0],f=o.length-1;return n.jsx(nr,{variant:"outlined",className:`ordercard ${p}`,style:m,onClick:x?()=>x(r):void 0,ref:u,...h,children:n.jsxs(Tn,{direction:"column",gap:0,children:[n.jsxs(Tn,{align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-header",children:[n.jsx(In,{variant:"body1",weight:"semibold",noMargin:!0,children:e||`Order #${r}`}),n.jsx(Zn,{variant:(()=>{switch(t){case"delivered":return"success";case"cancelled":return"error";case"processing":case"shipped":return"info";case"pending":return"warning";default:return"neutral"}})(),children:a||t.charAt(0).toUpperCase()+t.slice(1)})]}),n.jsxs(Tn,{direction:"row",gap:10,className:"ordercard-content",children:[g.image&&n.jsx("div",{className:"ordercard-image-wrapper",children:n.jsx("img",{src:g.image,alt:g.name,className:"ordercard-image"})}),n.jsxs(Tn,{direction:"column",gap:2,style:{flex:1,minWidth:0},children:[n.jsxs(In,{variant:"body2",weight:"medium",noMargin:!0,className:"ordercard-product-name",children:[g.name,g.quantity&&g.quantity>1&&` × ${g.quantity}`]}),f>0&&n.jsxs(In,{variant:"caption",noMargin:!0,className:"ordercard-more-items",children:["+ ",f," more ",1===f?"item":"items"]})]})]}),n.jsxs(Tn,{direction:"row",align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-footer",children:[n.jsxs(Tn,{direction:"column",gap:2,style:{flex:"1 1 auto",minWidth:"140px"},children:[i&&n.jsxs(In,{variant:"caption",noMargin:!0,className:"ordercard-delivery",children:[l,": ",i]}),n.jsxs(In,{variant:"body1",weight:"bold",noMargin:!0,className:"ordercard-price",children:[s,c.toLocaleString()]})]}),d&&n.jsx(_,{variant:"primary",size:"sm",onClick:n=>{null==n||n.stopPropagation(),d(r)},className:"ordercard-track-btn",children:v})]})]})})});$r.displayName="OrderCard";const Ir=y($r);k("/* ==================== Info List Card ==================== */\r\n.info-list-card {\r\n  padding: var(--vtx-spacing-4, 16px);\r\n  width: 100%;\r\n  max-width: 100%;\r\n}\r\n\r\n.info-list-card--compact {\r\n  padding: var(--vtx-spacing-3, 12px);\r\n}\r\n\r\n/* ==================== Heading ==================== */\r\n.info-list-card-heading {\r\n  color: var(--vtx-color-neutral-900, #171717);\r\n  line-height: 1.3;\r\n  word-break: break-word;\r\n}\r\n\r\n/* ==================== Items Container ==================== */\r\n.info-list-card-items {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-3, 12px);\r\n}\r\n\r\n.info-list-card--compact .info-list-card-items {\r\n  gap: var(--vtx-spacing-2, 8px);\r\n}\r\n\r\n/* ==================== Individual Item ==================== */\r\n.info-list-card-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-4, 16px);\r\n  min-height: 24px;\r\n}\r\n\r\n/* ==================== Label ==================== */\r\n.info-list-card-label {\r\n  color: var(--vtx-color-neutral-600, #525252);\r\n  flex: 0 0 auto;\r\n  max-width: 50%;\r\n  word-break: break-word;\r\n  line-height: 1.5;\r\n}\r\n\r\n/* ==================== Value ==================== */\r\n.info-list-card-value {\r\n  color: var(--vtx-color-neutral-900, #171717);\r\n  text-align: right;\r\n  flex: 1 1 auto;\r\n  word-break: break-word;\r\n  line-height: 1.5;\r\n  min-width: 0;\r\n}\r\n\r\n/* ==================== Value Variants ==================== */\r\n.info-list-card-value.value-primary {\r\n  color: var(--vtx-color-primary-600, #2563eb);\r\n}\r\n\r\n.info-list-card-value.value-success {\r\n  color: var(--vtx-color-success-600, #16a34a);\r\n}\r\n\r\n.info-list-card-value.value-warning {\r\n  color: var(--vtx-color-warning-600, #d97706);\r\n}\r\n\r\n.info-list-card-value.value-error {\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n}\r\n\r\n.info-list-card-value.value-muted {\r\n  color: var(--vtx-color-neutral-500, #737373);\r\n}\r\n\r\n.info-list-card-value.value-bold {\r\n  font-weight: var(--vtx-font-weight-semibold, 600);\r\n}\r\n\r\n.info-list-card-value.value-large {\r\n  font-size: 1.125rem;\r\n  font-weight: var(--vtx-font-weight-bold, 700);\r\n}\r\n\r\n/* ==================== Responsive Design ==================== */\r\n\r\n/* Tablet */\r\n@media (max-width: 768px) {\r\n  .info-list-card {\r\n    padding: var(--vtx-spacing-3, 12px);\r\n  }\r\n\r\n  .info-list-card-item {\r\n    gap: var(--vtx-spacing-3, 12px);\r\n  }\r\n\r\n  .info-list-card-label {\r\n    max-width: 45%;\r\n    font-size: 0.875rem;\r\n  }\r\n\r\n  .info-list-card-value {\r\n    font-size: 0.875rem;\r\n  }\r\n}\r\n\r\n/* Mobile */\r\n@media (max-width: 480px) {\r\n  .info-list-card {\r\n    padding: var(--vtx-spacing-3, 12px);\r\n  }\r\n\r\n  .info-list-card--compact {\r\n    padding: var(--vtx-spacing-2, 8px);\r\n  }\r\n\r\n  .info-list-card-items {\r\n    gap: var(--vtx-spacing-2, 8px);\r\n  }\r\n\r\n  .info-list-card--compact .info-list-card-items {\r\n    gap: var(--vtx-spacing-1, 4px);\r\n  }\r\n\r\n  .info-list-card-item {\r\n    gap: var(--vtx-spacing-2, 8px);\r\n    min-height: 20px;\r\n  }\r\n\r\n  .info-list-card-label {\r\n    max-width: 48%;\r\n    font-size: 0.8125rem;\r\n  }\r\n\r\n  .info-list-card-value {\r\n    font-size: 0.8125rem;\r\n  }\r\n\r\n  .info-list-card-value.value-large {\r\n    font-size: 1rem;\r\n  }\r\n}\r\n\r\n/* Small Mobile */\r\n@media (max-width: 375px) {\r\n  .info-list-card-item {\r\n    flex-direction: column;\r\n    gap: var(--vtx-spacing-1, 4px);\r\n    align-items: stretch;\r\n  }\r\n\r\n  .info-list-card-label {\r\n    max-width: 100%;\r\n  }\r\n\r\n  .info-list-card-value {\r\n    text-align: left;\r\n  }\r\n}\r\n\r\n/* ==================== Long Text Handling ==================== */\r\n\r\n/* Ensure long text doesn't break layout */\r\n.info-list-card-item * {\r\n  min-width: 0;\r\n  overflow-wrap: break-word;\r\n  word-wrap: break-word;\r\n  hyphens: auto;\r\n}\r\n\r\n/* ==================== Print Styles ==================== */\r\n@media print {\r\n  .info-list-card {\r\n    box-shadow: none !important;\r\n    border: 1px solid var(--vtx-color-neutral-300, #d4d4d4);\r\n    page-break-inside: avoid;\r\n  }\r\n\r\n  .info-list-card-item {\r\n    page-break-inside: avoid;\r\n  }\r\n}\r\n");const Dr=i.default.forwardRef(({heading:r,items:e,showDividers:t=!1,compact:a=!1,variant:o="outlined",className:l="",style:c,...s},d)=>{const x=e.filter(n=>!n.hidden);return n.jsxs(nr,{variant:"flat"===o?"filled":o,className:`info-list-card ${a?"info-list-card--compact":""} ${l}`,style:c,ref:d,...s,children:[r&&n.jsxs(n.Fragment,{children:[n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,className:"info-list-card-heading",children:r}),n.jsx(er,{style:{margin:"12px 0 16px 0"}})]}),n.jsx("div",{className:"info-list-card-items",children:x.map((r,e)=>n.jsxs(i.default.Fragment,{children:[n.jsxs("div",{className:"info-list-card-item",children:[n.jsx("div",{className:`info-list-card-label ${r.labelClass||""}`,children:"string"==typeof r.label?n.jsx(In,{variant:"body2",noMargin:!0,children:r.label}):r.label}),n.jsx("div",{className:`info-list-card-value ${r.valueClass||""}`,children:"string"==typeof r.value||"number"==typeof r.value?n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:r.value}):r.value})]}),t&&e<x.length-1&&n.jsx(er,{style:{margin:a?"8px 0":"12px 0"}})]},e))})]})});Dr.displayName="InfoListCard";const Ar=y(Dr);k(".orderconfirmation {\r\n  width: 100%;\r\n  max-width: 100%;\r\n}\r\n\r\n/* Header */\r\n.orderconfirmation-header {\r\n  background: linear-gradient(135deg, var(--vtx-color-success-50) 0%, var(--vtx-color-success-100) 100%);\r\n  border: 1px solid var(--vtx-color-success-200);\r\n  padding: var(--vtx-spacing-6);\r\n}\r\n\r\n.orderconfirmation-success-icon {\r\n  width: 56px;\r\n  height: 56px;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-success-500);\r\n  color: var(--vtx-color-white);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 32px;\r\n  font-weight: bold;\r\n  box-shadow: var(--vtx-shadow-md);\r\n}\r\n\r\n.orderconfirmation-subtitle {\r\n  color: var(--vtx-color-neutral-600);\r\n  max-width: 400px;\r\n}\r\n\r\n/* Items Card */\r\n.orderconfirmation-items-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderconfirmation-item {\r\n  width: 100%;\r\n}\r\n\r\n.orderconfirmation-item-image-wrapper {\r\n  width: 64px;\r\n  height: 64px;\r\n  flex-shrink: 0;\r\n  border-radius: var(--vtx-radius-md);\r\n  overflow: hidden;\r\n  background: var(--vtx-color-neutral-100);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.orderconfirmation-item-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.orderconfirmation-item-name {\r\n  color: var(--vtx-color-neutral-900);\r\n  word-break: break-word;\r\n  overflow-wrap: break-word;\r\n  hyphens: auto;\r\n}\r\n\r\n.orderconfirmation-item-variant {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.orderconfirmation-item-unit-price {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Summary Card */\r\n.orderconfirmation-summary-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderconfirmation-discount {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n.orderconfirmation-total {\r\n  color: var(--vtx-color-primary-600);\r\n  font-size: 1.125rem;\r\n}\r\n\r\n/* Address Card */\r\n.orderconfirmation-address-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderconfirmation-address {\r\n  color: var(--vtx-color-neutral-700);\r\n  line-height: 1.6;\r\n}\r\n\r\n.orderconfirmation-address-name {\r\n  font-weight: 600;\r\n  color: var(--vtx-color-neutral-900);\r\n  margin-bottom: 4px;\r\n}\r\n\r\n/* Actions Card */\r\n.orderconfirmation-actions-card {\r\n  padding: var(--vtx-spacing-4);\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n/* Help Card */\r\n.orderconfirmation-help-card {\r\n  padding: var(--vtx-spacing-3);\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.orderconfirmation-help-text {\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.orderconfirmation-help-email {\r\n  color: var(--vtx-color-neutral-600);\r\n  font-weight: 500;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (max-width: 640px) {\r\n  .orderconfirmation-header {\r\n    padding: var(--vtx-spacing-4);\r\n  }\r\n\r\n  .orderconfirmation-success-icon {\r\n    width: 48px;\r\n    height: 48px;\r\n    font-size: 28px;\r\n  }\r\n\r\n  .orderconfirmation-items-card,\r\n  .orderconfirmation-summary-card,\r\n  .orderconfirmation-address-card {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .orderconfirmation-item-image-wrapper {\r\n    width: 56px;\r\n    height: 56px;\r\n  }\r\n\r\n  .orderconfirmation-item {\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  .orderconfirmation-total {\r\n    font-size: 1rem;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .orderconfirmation-success-icon {\r\n    width: 40px;\r\n    height: 40px;\r\n    font-size: 24px;\r\n  }\r\n\r\n  .orderconfirmation-item-image-wrapper {\r\n    width: 48px;\r\n    height: 48px;\r\n  }\r\n}\r\n");const Er=i.default.forwardRef(({orderId:r,orderNumber:e,orderDate:t,status:a="confirmed",statusText:o,headerText:i="Order Confirmed!",headerSubtitle:l="Thank you for your order. We'll send you a confirmation email shortly.",customerEmail:c,customerPhone:s,shippingAddress:d,billingAddress:x,items:v,subtotal:p,shippingCost:m=0,tax:h=0,discount:u=0,total:g,currency:f="₹",paymentMethod:b,transactionId:w,estimatedDelivery:y,trackingNumber:k,onDownloadInvoice:j,onContinueShopping:z,onTrackOrder:N,onViewDetails:C,onContactSupport:S,onShareOrder:M,downloadInvoiceText:T="Download Invoice",continueShoppingText:$="Continue Shopping",trackOrderText:I="Track Order",viewDetailsText:D="View Details",contactSupportText:A="Contact Support",shareOrderText:E="Share",showActions:R=!0,hideDownloadInvoice:L=!1,hideContinueShopping:B=!1,hideTrackOrder:O=!1,hideContactSupport:W=!1,className:P="",style:V,...H},nn)=>{const rn=r=>n.jsxs("div",{className:"orderconfirmation-address",children:[n.jsx("div",{className:"orderconfirmation-address-name",children:r.name}),n.jsx("div",{children:r.addressLine1}),r.addressLine2&&n.jsx("div",{children:r.addressLine2}),n.jsxs("div",{children:[r.city,", ",r.state," ",r.zipCode]}),r.phone&&n.jsxs("div",{children:["Phone: ",r.phone]})]}),en=[{label:"Order Number",value:e||`#${r}`,valueClass:"value-bold"},t?{label:"Order Date",value:t}:{label:"",value:"",hidden:!0},{label:"Status",value:n.jsx(Zn,{variant:(()=>{switch(a){case"confirmed":case"delivered":return"success";case"cancelled":return"error";case"processing":return"info";case"pending":return"warning";default:return"neutral"}})(),children:o||a.charAt(0).toUpperCase()+a.slice(1)})},y?{label:"Estimated Delivery",value:y,valueClass:"value-primary"}:{label:"",value:"",hidden:!0},k?{label:"Tracking Number",value:k,valueClass:"value-bold"}:{label:"",value:"",hidden:!0}].filter(n=>!n.hidden),tn=[c?{label:"Email",value:c}:{label:"",value:"",hidden:!0},s?{label:"Phone",value:s}:{label:"",value:"",hidden:!0}].filter(n=>!n.hidden),an=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Transaction ID",value:w,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(n=>!n.hidden);return n.jsx("div",{className:`orderconfirmation ${P}`,style:V,ref:nn,...H,children:n.jsxs(Tn,{direction:"column",gap:20,children:[n.jsx(nr,{variant:"filled",className:"orderconfirmation-header",children:n.jsxs(Tn,{direction:"column",align:"center",gap:12,children:[n.jsx("span",{className:"orderconfirmation-success-icon",children:n.jsx(F,{size:32})}),n.jsx(In,{variant:"h4",weight:"bold",align:"center",noMargin:!0,children:i}),n.jsx(In,{variant:"body1",align:"center",noMargin:!0,className:"orderconfirmation-subtitle",children:l}),n.jsxs(Zn,{variant:"success",style:{padding:"8px 20px",borderRadius:"20px",fontWeight:600,marginTop:"8px"},children:["Order ",e||`#${r}`]})]})}),n.jsx(Ar,{heading:"Order Details",items:en,variant:"outlined",showDividers:!0}),tn.length>0&&n.jsx(Ar,{heading:"Customer Information",items:tn,variant:"outlined",showDividers:!0}),n.jsxs(nr,{variant:"outlined",className:"orderconfirmation-items-card",children:[n.jsxs(In,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Order Items (",v.length,")"]}),n.jsx(Tn,{direction:"column",gap:12,children:v.map((r,e)=>n.jsxs("div",{children:[n.jsxs(Tn,{direction:"row",gap:12,className:"orderconfirmation-item",children:[r.image&&n.jsx("div",{className:"orderconfirmation-item-image-wrapper",children:n.jsx("img",{src:r.image,alt:r.name,className:"orderconfirmation-item-image"})}),n.jsxs(Tn,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,className:"orderconfirmation-item-name",children:r.name}),r.variant&&n.jsx(In,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-variant",children:r.variant}),n.jsxs(In,{variant:"caption",noMargin:!0,children:["Qty: ",r.quantity]})]}),n.jsxs(Tn,{direction:"column",align:"end",gap:2,children:[n.jsxs(In,{variant:"body2",weight:"semibold",noMargin:!0,children:[f,(r.price*r.quantity).toLocaleString()]}),n.jsxs(In,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-unit-price",children:[f,r.price.toLocaleString()," each"]})]})]}),e<v.length-1&&n.jsx(er,{style:{margin:"12px 0"}})]},r.id))})]}),n.jsxs(nr,{variant:"outlined",className:"orderconfirmation-summary-card",children:[n.jsx(In,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Payment Summary"}),n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Subtotal"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[f,p.toLocaleString()]})]}),m>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Shipping"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[f,m.toLocaleString()]})]}),h>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Tax"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[f,h.toLocaleString()]})]}),u>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:"Discount"}),n.jsxs(In,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:["-",f,u.toLocaleString()]})]}),n.jsx(er,{style:{margin:"8px 0"}}),n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n.jsxs(In,{variant:"body1",weight:"bold",noMargin:!0,className:"orderconfirmation-total",children:[f,g.toLocaleString()]})]})]}),an.length>0&&n.jsxs(n.Fragment,{children:[n.jsx(er,{style:{margin:"12px 0"}}),n.jsx(Tn,{direction:"column",gap:8,children:an.map((r,e)=>n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:r.label}),n.jsx(In,{variant:"body2",noMargin:!0,className:r.valueClass,children:r.value})]},e))})]})]}),n.jsxs(Tn,{direction:"row",gap:16,wrap:"wrap",children:[n.jsx(nr,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n.jsxs(Tn,{direction:"column",gap:12,children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(Z,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),n.jsx(er,{}),rn(d)]})}),x&&n.jsx(nr,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n.jsxs(Tn,{direction:"column",gap:12,children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(K,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),n.jsx(er,{}),rn(x)]})})]}),R&&n.jsx(nr,{variant:"outlined",className:"orderconfirmation-actions-card",children:n.jsxs(Tn,{direction:"column",gap:16,children:[n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"What's Next?"}),n.jsx(er,{}),n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",children:[!L&&j&&n.jsx(_,{variant:"primary",size:"md",onClick:()=>j(r),leftIcon:n.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:T}),!O&&N&&k&&n.jsx(_,{variant:"primary",size:"md",onClick:()=>N(r),leftIcon:n.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:I})]}),n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",children:[!B&&z&&n.jsx(_,{variant:"outline",size:"md",onClick:z,leftIcon:n.jsx(X,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:$}),C&&n.jsx(_,{variant:"outline",size:"md",onClick:()=>C(r),leftIcon:n.jsx(G,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:D})]}),n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",justify:"center",children:[!W&&S&&n.jsx(_,{variant:"ghost",size:"md",onClick:()=>S(r),leftIcon:n.jsx(Q,{size:18}),children:A}),M&&n.jsx(_,{variant:"ghost",size:"md",onClick:()=>M(r),leftIcon:n.jsx(U,{size:18}),children:E})]})]})}),n.jsx(nr,{variant:"filled",className:"orderconfirmation-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n.jsxs(Tn,{direction:"column",gap:12,align:"center",children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(Q,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),n.jsx(In,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n.jsxs(Tn,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n.jsxs(Tn,{align:"center",gap:6,children:[n.jsx(Q,{size:16}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n.jsxs(Tn,{align:"center",gap:6,children:[n.jsx(J,{size:16}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Er.displayName="OrderConfirmation";const Rr=y(Er);k(".orderdetails {\r\n  width: 100%;\r\n  max-width: 100%;\r\n}\r\n\r\n/* Header */\r\n.orderdetails-header {\r\n  padding: var(--vtx-spacing-4);\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 2px solid var(--vtx-color-neutral-300);\r\n}\r\n\r\n.orderdetails-date {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* Items Card */\r\n.orderdetails-items-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderdetails-item {\r\n  width: 100%;\r\n}\r\n\r\n.orderdetails-item-image-wrapper {\r\n  width: 64px;\r\n  height: 64px;\r\n  flex-shrink: 0;\r\n  border-radius: var(--vtx-radius-md);\r\n  overflow: hidden;\r\n  background: var(--vtx-color-neutral-100);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.orderdetails-item-image {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.orderdetails-item-name {\r\n  color: var(--vtx-color-neutral-900);\r\n  word-break: break-word;\r\n  overflow-wrap: break-word;\r\n  hyphens: auto;\r\n}\r\n\r\n.orderdetails-item-variant,\r\n.orderdetails-item-sku {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.orderdetails-item-unit-price {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Summary Card */\r\n.orderdetails-summary-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderdetails-discount {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n.orderdetails-total {\r\n  color: var(--vtx-color-primary-600);\r\n  font-size: 1.125rem;\r\n}\r\n\r\n/* Address Card */\r\n.orderdetails-address-card {\r\n  padding: var(--vtx-spacing-4);\r\n}\r\n\r\n.orderdetails-address {\r\n  color: var(--vtx-color-neutral-700);\r\n  line-height: 1.6;\r\n}\r\n\r\n.orderdetails-address-name {\r\n  font-weight: 600;\r\n  color: var(--vtx-color-neutral-900);\r\n  margin-bottom: 4px;\r\n}\r\n\r\n/* Actions Card */\r\n.orderdetails-actions-card {\r\n  padding: var(--vtx-spacing-4);\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n/* Help Card */\r\n.orderdetails-help-card {\r\n  padding: var(--vtx-spacing-3);\r\n  background: var(--vtx-color-neutral-50);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.orderdetails-help-text {\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.orderdetails-help-email {\r\n  color: var(--vtx-color-neutral-600);\r\n  font-weight: 500;\r\n}\r\n\r\n/* Tracking Link */\r\n.orderdetails-tracking-link {\r\n  color: var(--vtx-color-primary-600);\r\n  text-decoration: none;\r\n  font-weight: 600;\r\n  transition: color var(--vtx-transition-base);\r\n}\r\n\r\n.orderdetails-tracking-link:hover {\r\n  color: var(--vtx-color-primary-700);\r\n  text-decoration: underline;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (max-width: 640px) {\r\n  .orderdetails-header {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .orderdetails-items-card,\r\n  .orderdetails-summary-card,\r\n  .orderdetails-address-card,\r\n  .orderdetails-actions-card {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .orderdetails-item-image-wrapper {\r\n    width: 56px;\r\n    height: 56px;\r\n  }\r\n\r\n  .orderdetails-item {\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  .orderdetails-total {\r\n    font-size: 1rem;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .orderdetails-item-image-wrapper {\r\n    width: 48px;\r\n    height: 48px;\r\n  }\r\n}\r\n");const Lr=i.default.forwardRef(({orderId:r,orderNumber:e,orderDate:t,status:a,statusText:o,customerName:i,customerEmail:l,customerPhone:c,shippingAddress:s,billingAddress:d,items:x,subtotal:v,shippingCost:p=0,tax:m=0,discount:h=0,total:u,currency:g="₹",couponCode:f,paymentMethod:b,paymentStatus:w,transactionId:y,estimatedDelivery:k,deliveredDate:j,trackingNumber:z,trackingUrl:N,carrier:C,onDownloadInvoice:S,onTrackOrder:M,onCancelOrder:T,onReturnOrder:$,onReorder:I,onContactSupport:D,onWriteReview:A,downloadInvoiceText:E="Download Invoice",trackOrderText:R="Track Package",cancelOrderText:L="Cancel Order",returnOrderText:B="Return Items",reorderText:O="Reorder",contactSupportText:F="Contact Support",writeReviewText:W="Write Review",showActions:P=!0,allowCancel:V=!0,allowReturn:H=!0,allowReorder:X=!0,className:U="",style:G,...on},ln)=>{const cn=()=>{switch(w){case"paid":return"success";case"failed":return"error";case"pending":return"warning";case"refunded":return"info";default:return"neutral"}},sn=r=>n.jsxs("div",{className:"orderdetails-address",children:[n.jsx("div",{className:"orderdetails-address-name",children:r.name}),n.jsx("div",{children:r.addressLine1}),r.addressLine2&&n.jsx("div",{children:r.addressLine2}),n.jsxs("div",{children:[r.city,", ",r.state," ",r.zipCode]}),r.phone&&n.jsxs("div",{children:["Phone: ",r.phone]})]}),dn=V&&("pending"===a||"processing"===a),xn=H&&"delivered"===a,vn=z&&("shipped"===a||"delivered"===a),pn=[i?{label:"Name",value:i}:{label:"",value:"",hidden:!0},l?{label:"Email",value:l}:{label:"",value:"",hidden:!0},c?{label:"Phone",value:c}:{label:"",value:"",hidden:!0}].filter(n=>!n.hidden),mn=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Payment Status",value:n.jsx(Zn,{variant:cn(),children:w.charAt(0).toUpperCase()+w.slice(1)})}:{label:"",value:"",hidden:!0},y?{label:"Transaction ID",value:y,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(n=>!n.hidden);return n.jsx("div",{className:`orderdetails ${U}`,style:G,ref:ln,...on,children:n.jsxs(Tn,{direction:"column",gap:24,children:[n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsx(In,{variant:"h3",weight:"bold",noMargin:!0,children:"Order Details"}),n.jsxs(In,{variant:"body1",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:["Placed on ",t]})]}),n.jsx(nr,{variant:"outlined",style:{padding:"32px 24px"},children:n.jsx(hr,{steps:["Order Placed","Packed","Shipped","Delivered"],currentStep:(()=>{switch(a){case"pending":case"cancelled":case"returned":default:return 0;case"processing":case"confirmed":return 1;case"shipped":return 2;case"delivered":return 3}})(),orientation:"horizontal",variant:"circle",showCheckmarks:!0,color:"success",size:"md"})}),n.jsxs(Tn,{direction:"row",gap:16,wrap:"wrap",children:[n.jsx(nr,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Order Number"}),n.jsx(In,{variant:"h6",weight:"bold",noMargin:!0,children:e||`#${r}`})]})}),n.jsx(nr,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Status"}),n.jsx(Zn,{variant:(()=>{switch(a){case"delivered":return"success";case"cancelled":case"returned":return"error";case"shipped":case"processing":return"info";case"pending":return"warning";default:return"neutral"}})(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:o||a.charAt(0).toUpperCase()+a.slice(1)})]})}),(j||k)&&n.jsx(nr,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:j?"Delivered On":"Estimated Delivery"}),n.jsx(In,{variant:"h6",weight:"bold",noMargin:!0,style:{color:j?"var(--vtx-color-success-600)":"inherit"},children:j||k})]})}),w&&n.jsx(nr,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Payment"}),n.jsx(Zn,{variant:cn(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:w.charAt(0).toUpperCase()+w.slice(1)})]})})]}),P&&(S||vn&&M)&&n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",children:[S&&n.jsx(_,{variant:"outline",size:"md",onClick:()=>S(r),leftIcon:n.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:E}),vn&&M&&n.jsx(_,{variant:"primary",size:"md",onClick:()=>M(r),leftIcon:n.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:R})]}),(z||C)&&n.jsx(nr,{variant:"outlined",children:n.jsxs(Tn,{direction:"column",gap:12,children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(nn,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Information"})]}),n.jsx(er,{}),n.jsxs(Tn,{direction:"column",gap:12,children:[z&&n.jsxs(Tn,{direction:"column",gap:4,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Tracking Number"}),N?n.jsx("a",{href:N,target:"_blank",rel:"noopener noreferrer",style:{color:"var(--vtx-color-primary-600)",fontWeight:600,textDecoration:"none"},children:z}):n.jsx(In,{variant:"body2",weight:"semibold",noMargin:!0,children:z})]}),C&&n.jsxs(Tn,{direction:"column",gap:4,children:[n.jsx(In,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Carrier"}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:C})]})]})]})}),n.jsxs(nr,{variant:"outlined",className:"orderdetails-items-card",children:[n.jsxs(In,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Items (",x.length,")"]}),n.jsx(Tn,{direction:"column",gap:12,children:x.map((r,e)=>n.jsxs("div",{children:[n.jsxs(Tn,{direction:"row",gap:12,className:"orderdetails-item",children:[r.image&&n.jsx("div",{className:"orderdetails-item-image-wrapper",children:n.jsx("img",{src:r.image,alt:r.name,className:"orderdetails-item-image"})}),n.jsxs(Tn,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,className:"orderdetails-item-name",children:r.name}),r.variant&&n.jsx(In,{variant:"caption",noMargin:!0,className:"orderdetails-item-variant",children:r.variant}),n.jsxs(In,{variant:"caption",noMargin:!0,children:["Qty: ",r.quantity]})]}),n.jsxs(Tn,{direction:"column",align:"end",gap:2,children:[n.jsxs(In,{variant:"body2",weight:"semibold",noMargin:!0,children:[g,(r.price*r.quantity).toLocaleString()]}),n.jsxs(In,{variant:"caption",noMargin:!0,className:"orderdetails-item-unit-price",children:[g,r.price.toLocaleString()," each"]})]})]}),e<x.length-1&&n.jsx(er,{style:{margin:"12px 0"}})]},r.id))})]}),n.jsxs(nr,{variant:"outlined",className:"orderdetails-summary-card",children:[n.jsx(In,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Order Summary"}),n.jsxs(Tn,{direction:"column",gap:8,children:[n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Subtotal"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[g,v.toLocaleString()]})]}),p>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Shipping"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[g,p.toLocaleString()]})]}),m>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:"Tax"}),n.jsxs(In,{variant:"body2",noMargin:!0,children:[g,m.toLocaleString()]})]}),f&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:"Coupon Applied"}),n.jsx(In,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:f})]}),h>0&&n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:"Discount"}),n.jsxs(In,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:["-",g,h.toLocaleString()]})]}),n.jsx(er,{style:{margin:"8px 0"}}),n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n.jsxs(In,{variant:"body1",weight:"bold",noMargin:!0,className:"orderdetails-total",children:[g,u.toLocaleString()]})]})]}),mn.length>0&&n.jsxs(n.Fragment,{children:[n.jsx(er,{style:{margin:"12px 0"}}),n.jsx(Tn,{direction:"column",gap:8,children:mn.map((r,e)=>n.jsxs(Tn,{justify:"between",align:"center",children:[n.jsx(In,{variant:"body2",noMargin:!0,children:r.label}),n.jsx(In,{variant:"body2",noMargin:!0,className:r.valueClass,children:r.value})]},e))})]})]}),pn.length>0&&n.jsx(Ar,{heading:"Customer Information",items:pn,variant:"outlined",showDividers:!0}),n.jsxs(Tn,{direction:"row",gap:16,wrap:"wrap",children:[n.jsx(nr,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n.jsxs(Tn,{direction:"column",gap:12,children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(Z,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),n.jsx(er,{}),sn(s)]})}),d&&n.jsx(nr,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n.jsxs(Tn,{direction:"column",gap:12,children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(K,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),n.jsx(er,{}),sn(d)]})})]}),P&&n.jsx(nr,{variant:"outlined",className:"orderdetails-actions-card",children:n.jsxs(Tn,{direction:"column",gap:16,children:[n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Order Actions"}),n.jsx(er,{}),n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",children:[dn&&T&&n.jsx(_,{variant:"outline",size:"md",onClick:()=>T(r),leftIcon:n.jsx(rn,{size:18}),style:{flex:"1 1 auto",minWidth:"160px",borderColor:"var(--vtx-color-error-500)",color:"var(--vtx-color-error-600)"},children:L}),xn&&$&&n.jsx(_,{variant:"outline",size:"md",onClick:()=>$(r),leftIcon:n.jsx(en,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:B}),X&&I&&n.jsx(_,{variant:"outline",size:"md",onClick:()=>I(r),leftIcon:n.jsx(tn,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:O})]}),n.jsxs(Tn,{direction:"row",gap:12,wrap:"wrap",children:["delivered"===a&&A&&n.jsx(_,{variant:"ghost",size:"md",onClick:()=>A(r),leftIcon:n.jsx(an,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:W}),D&&n.jsx(_,{variant:"ghost",size:"md",onClick:()=>D(r),leftIcon:n.jsx(Q,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:F})]})]})}),n.jsx(nr,{variant:"filled",className:"orderdetails-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n.jsxs(Tn,{direction:"column",gap:12,align:"center",children:[n.jsxs(Tn,{align:"center",gap:8,children:[n.jsx(Q,{size:20}),n.jsx(In,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),n.jsx(In,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n.jsxs(Tn,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n.jsxs(Tn,{align:"center",gap:6,children:[n.jsx(Q,{size:16}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n.jsxs(Tn,{align:"center",gap:6,children:[n.jsx(J,{size:16}),n.jsx(In,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Lr.displayName="OrderDetails";const Br=y(Lr);k("/* ===================================================================\r\n   Header - Professional Design System\r\n   =================================================================== */\r\n\r\n.vtx-header {\r\n  width: 100%;\r\n  position: relative;\r\n  z-index: 1000;\r\n}\r\n\r\n.vtx-header__container {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  height: var(--vtx-header-height, 64px);\r\n  padding: 0 var(--vtx-spacing-lg, 24px);\r\n  max-width: var(--vtx-header-max-width, 1440px);\r\n  margin: 0 auto;\r\n  background-color: var(--header-bg, #ffffff);\r\n  color: var(--header-color, #1f2937);\r\n  transition: all 0.3s ease;\r\n}\r\n\r\n.vtx-header--full-width .vtx-header__container {\r\n  max-width: 100%;\r\n}\r\n\r\n.vtx-header--elevated .vtx-header__container {\r\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-header--sticky {\r\n  position: sticky;\r\n  top: 0;\r\n}\r\n\r\n/* ===================================================================\r\n   Scroll Behavior - Transparent to Solid\r\n   =================================================================== */\r\n\r\n/* Initial state: transparent background + white text */\r\n.vtx-header--scroll-behavior .vtx-header__container {\r\n  background-color: transparent;\r\n  color: #ffffff;\r\n  box-shadow: none;\r\n}\r\n\r\n/* Nav links, search, and icons white initially */\r\n.vtx-header--scroll-behavior .vtx-header__nav-link {\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--scroll-behavior .vtx-header__search-input {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.3);\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--scroll-behavior .vtx-header__search-input::placeholder {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n.vtx-header--scroll-behavior .vtx-header__search-icon {\r\n  color: rgba(255, 255, 255, 0.8);\r\n}\r\n\r\n.vtx-header--scroll-behavior .vtx-header__logo {\r\n  color: #ffffff;\r\n}\r\n\r\n/* Scrolled state: white background + dark text */\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__container {\r\n  background-color: #ffffff;\r\n  color: #1f2937;\r\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__nav-link {\r\n  color: #1f2937;\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__search-input {\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n  border-color: rgba(0, 0, 0, 0.1);\r\n  color: #1f2937;\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__search-input::placeholder {\r\n  color: #9ca3af;\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__search-icon {\r\n  color: #9ca3af;\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled .vtx-header__logo {\r\n  color: #1f2937;\r\n}\r\n\r\n/* Two-row layout scroll behavior */\r\n.vtx-header--scroll-behavior.vtx-header--layout-two-row .vtx-header__top-row .vtx-header__container {\r\n  background-color: transparent;\r\n  color: #ffffff;\r\n  border-bottom-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--layout-two-row .vtx-header__top-row .vtx-header__container {\r\n  background-color: #ffffff;\r\n  color: #1f2937;\r\n  border-bottom-color: rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n/* Override theme colors when using scroll behavior - force transparent + white initially */\r\n.vtx-header--scroll-behavior.vtx-header--primary .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--secondary .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--dark .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--light .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--gradient .vtx-header__container {\r\n  background-color: transparent !important;\r\n  background: transparent !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n/* Scrolled state for all themes - white background + dark text */\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--primary .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--secondary .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--dark .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--light .vtx-header__container,\r\n.vtx-header--scroll-behavior.vtx-header--scrolled.vtx-header--gradient .vtx-header__container {\r\n  background-color: #ffffff !important;\r\n  background: #ffffff !important;\r\n  color: #1f2937 !important;\r\n}\r\n\r\n/* ===================================================================\r\n   Top Bar\r\n   =================================================================== */\r\n\r\n.vtx-header__topbar {\r\n  width: 100%;\r\n  min-height: 36px;\r\n  display: flex;\r\n  align-items: center;\r\n  font-size: 0.8125rem;\r\n  line-height: 1.4;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n}\r\n\r\n.vtx-header__topbar-container {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  width: 100%;\r\n  max-width: var(--vtx-header-max-width, 1440px);\r\n  margin: 0 auto;\r\n  padding: 0 var(--vtx-spacing-lg, 24px);\r\n  gap: var(--vtx-spacing-md, 16px);\r\n}\r\n\r\n.vtx-header--full-width .vtx-header__topbar-container {\r\n  max-width: 100%;\r\n}\r\n\r\n.vtx-header__topbar-left,\r\n.vtx-header__topbar-right {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-md, 16px);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-header__topbar-content {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex: 1;\r\n  text-align: center;\r\n  gap: var(--vtx-spacing-sm, 8px);\r\n}\r\n\r\n.vtx-header__topbar-dismiss {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 28px;\r\n  height: 28px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: all 0.2s ease;\r\n  color: inherit;\r\n  opacity: 0.7;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-header__topbar-dismiss:hover {\r\n  opacity: 1;\r\n  background-color: rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n/* Top Bar Variants */\r\n.vtx-header__topbar--subtle {\r\n  background-color: #f8f9fa;\r\n  color: #495057;\r\n}\r\n\r\n.vtx-header__topbar--bold {\r\n  background-color: #343a40;\r\n  color: #ffffff;\r\n  border-bottom-color: transparent;\r\n}\r\n\r\n.vtx-header__topbar--bold .vtx-header__topbar-dismiss:hover {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n}\r\n\r\n.vtx-header__topbar--accent {\r\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n  color: #ffffff;\r\n  border-bottom-color: transparent;\r\n}\r\n\r\n.vtx-header__topbar--accent .vtx-header__topbar-dismiss:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.vtx-header__topbar--dark {\r\n  background-color: #1a1a1a;\r\n  color: #e9ecef;\r\n  border-bottom-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.vtx-header__topbar--dark .vtx-header__topbar-dismiss:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.vtx-header__topbar--gradient {\r\n  background: linear-gradient(90deg, #f093fb 0%, #f5576c 100%);\r\n  color: #ffffff;\r\n  border-bottom-color: transparent;\r\n}\r\n\r\n.vtx-header__topbar--gradient .vtx-header__topbar-dismiss:hover {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n/* ===================================================================\r\n   Logo\r\n   =================================================================== */\r\n\r\n.vtx-header__logo {\r\n  display: flex;\r\n  align-items: center;\r\n  font-size: 1.5rem;\r\n  font-weight: 600;\r\n  flex-shrink: 0;\r\n  color: inherit;\r\n}\r\n\r\n.vtx-header__logo img {\r\n  max-height: 40px;\r\n  height: auto;\r\n}\r\n\r\n/* ===================================================================\r\n   Desktop Navigation\r\n   =================================================================== */\r\n\r\n.vtx-header--desktop .vtx-header__nav {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  flex: 1;\r\n  margin: 0 32px;\r\n}\r\n\r\n.vtx-header__nav-item {\r\n  position: relative;\r\n}\r\n\r\n.vtx-header__nav-link {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  padding: 8px 16px;\r\n  text-decoration: none;\r\n  color: inherit;\r\n  border-radius: 8px;\r\n  font-size: 0.9375rem;\r\n  font-weight: 500;\r\n  transition: all 0.2s ease;\r\n  white-space: nowrap;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-header__nav-link:hover {\r\n  background-color: var(--hover-bg, rgba(0, 0, 0, 0.05));\r\n}\r\n\r\n.vtx-header__nav-link--active {\r\n  background-color: var(--active-bg, rgba(0, 0, 0, 0.08));\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-header__nav-link--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-header__nav-icon,\r\n.vtx-header__nav-label,\r\n.vtx-header__nav-badge,\r\n.vtx-header__nav-chevron {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-header__nav-label {\r\n  flex: 1;\r\n}\r\n\r\n.vtx-header__nav-badge {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  margin-left: 4px;\r\n}\r\n\r\n/* Badge component styling overrides for header context */\r\n.vtx-header__nav-badge .vtx-badge,\r\n.vtx-header__dropdown-badge .vtx-badge,\r\n.vtx-header__mega-menu-badge .vtx-badge,\r\n.vtx-header__mobile-nav-badge .vtx-badge {\r\n  margin: 0;\r\n}\r\n\r\n/* ===================================================================\r\n   Dropdown Menus\r\n   =================================================================== */\r\n\r\n.vtx-header__dropdown {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 0;\r\n  margin-top: 8px;\r\n  min-width: 200px;\r\n  background-color: #ffffff;\r\n  border-radius: 8px;\r\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\r\n  padding: 8px;\r\n  z-index: 1001;\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.vtx-header__dropdown-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  padding: 10px 12px;\r\n  text-decoration: none;\r\n  color: #1f2937;\r\n  border-radius: 6px;\r\n  font-size: 0.875rem;\r\n  transition: all 0.2s ease;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-header__dropdown-item:hover {\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-header__dropdown-item--active {\r\n  background-color: rgba(59, 130, 246, 0.1);\r\n  color: #3b82f6;\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-header__dropdown-item--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-header__dropdown-icon,\r\n.vtx-header__dropdown-label,\r\n.vtx-header__dropdown-badge {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-header__dropdown-label {\r\n  flex: 1;\r\n}\r\n\r\n/* ===================================================================\r\n   Mega Menu\r\n   =================================================================== */\r\n\r\n.vtx-header__mega-menu {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  margin-top: 8px;\r\n  background-color: #ffffff;\r\n  border-radius: 12px;\r\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);\r\n  padding: 24px;\r\n  z-index: 1001;\r\n  min-width: 600px;\r\n  max-width: 900px;\r\n}\r\n\r\n.vtx-header__mega-menu-container {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\r\n  gap: 32px;\r\n}\r\n\r\n.vtx-header__mega-menu-column-title {\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  color: #6b7280;\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.vtx-header__mega-menu-items {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n}\r\n\r\n.vtx-header__mega-menu-item {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 12px;\r\n  padding: 12px;\r\n  text-decoration: none;\r\n  color: #1f2937;\r\n  border-radius: 8px;\r\n  transition: all 0.2s ease;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-header__mega-menu-item:hover {\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n}\r\n\r\n.vtx-header__mega-menu-item--active {\r\n  background-color: rgba(59, 130, 246, 0.08);\r\n  color: #3b82f6;\r\n}\r\n\r\n.vtx-header__mega-menu-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 32px;\r\n  height: 32px;\r\n  background-color: rgba(59, 130, 246, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n  color: #3b82f6;\r\n}\r\n\r\n.vtx-header__mega-menu-item-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.vtx-header__mega-menu-item-label {\r\n  display: block;\r\n  font-size: 0.875rem;\r\n  font-weight: 600;\r\n  margin-bottom: 2px;\r\n}\r\n\r\n.vtx-header__mega-menu-item-description {\r\n  display: block;\r\n  font-size: 0.8125rem;\r\n  color: #6b7280;\r\n  line-height: 1.4;\r\n}\r\n\r\n.vtx-header__mega-menu-badge {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n  margin-top: 2px;\r\n}\r\n\r\n/* ===================================================================\r\n   Search\r\n   =================================================================== */\r\n\r\n.vtx-header__search {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  max-width: 400px;\r\n}\r\n\r\n.vtx-header__search-icon {\r\n  position: absolute;\r\n  left: 12px;\r\n  color: #9ca3af;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-header__search-input {\r\n  width: 100%;\r\n  height: 40px;\r\n  padding: 0 16px 0 40px;\r\n  border: 1px solid rgba(0, 0, 0, 0.1);\r\n  border-radius: 8px;\r\n  font-size: 0.875rem;\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n  color: inherit;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.vtx-header__search-input:focus {\r\n  outline: none;\r\n  border-color: #3b82f6;\r\n  background-color: #ffffff;\r\n  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\r\n}\r\n\r\n.vtx-header__search-input::placeholder {\r\n  color: #9ca3af;\r\n}\r\n\r\n/* ===================================================================\r\n   Actions\r\n   =================================================================== */\r\n\r\n.vtx-header__actions {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n}\r\n\r\n.vtx-header__actions-group {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n}\r\n\r\n/* ===================================================================\r\n   Two-Row Layout\r\n   =================================================================== */\r\n\r\n.vtx-header--layout-two-row {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__top-row {\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__top-row .vtx-header__container {\r\n  height: 64px;\r\n  justify-content: space-between;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__bottom-row {\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__bottom-row .vtx-header__container {\r\n  height: 56px;\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav {\r\n  margin: 0;\r\n  flex: 1;\r\n  max-width: 1400px;\r\n  justify-content: space-evenly;\r\n  gap: 0;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-item {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-item:not(:last-child)::after {\r\n  content: '|';\r\n  color: rgba(0, 0, 0, 0.15);\r\n  margin: 0 16px;\r\n  font-weight: 300;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-link {\r\n  padding: 8px 24px;\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  letter-spacing: 0.01em;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n  position: relative;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-link:hover {\r\n  background-color: rgba(0, 0, 0, 0.04);\r\n  transform: translateY(-1px);\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-link--active {\r\n  background-color: rgba(0, 0, 0, 0.06);\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__nav-link--active::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -14px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  width: 60%;\r\n  height: 3px;\r\n  background-color: currentColor;\r\n  border-radius: 3px 3px 0 0;\r\n}\r\n\r\n.vtx-header--layout-two-row .vtx-header__search--expanded {\r\n  flex: 1;\r\n  max-width: 600px;\r\n  margin: 0 32px;\r\n}\r\n\r\n/* Two-Row Bottom Style Variants */\r\n.vtx-header--layout-two-row.vtx-header--divider .vtx-header__top-row {\r\n  border-bottom: 2px solid rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--divider .vtx-header__bottom-row {\r\n  background-color: transparent;\r\n  box-shadow: none;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--dark-bottom .vtx-header__bottom-row {\r\n  background-color: rgba(0, 0, 0, 0.08);\r\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--dark-bottom .vtx-header__nav-link {\r\n  color: rgba(0, 0, 0, 0.85);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--dark-bottom .vtx-header__nav-link:hover {\r\n  background-color: rgba(0, 0, 0, 0.06);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--gradient-bottom .vtx-header__bottom-row {\r\n  background: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.05) 100%);\r\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--elevated-bottom .vtx-header__bottom-row {\r\n  background-color: #ffffff;\r\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--elevated-bottom .vtx-header__top-row {\r\n  border-bottom: none;\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--elevated-bottom .vtx-header__nav-link--active {\r\n  background-color: transparent;\r\n}\r\n\r\n.vtx-header--layout-two-row.vtx-header--elevated-bottom .vtx-header__nav-link:hover {\r\n  background-color: rgba(0, 0, 0, 0.02);\r\n}\r\n\r\n/* ===================================================================\r\n   Centered Layout\r\n   =================================================================== */\r\n\r\n.vtx-header--layout-centered .vtx-header__container {\r\n  justify-content: center;\r\n  gap: 32px;\r\n}\r\n\r\n.vtx-header--layout-centered .vtx-header__logo {\r\n  position: absolute;\r\n  left: 24px;\r\n}\r\n\r\n.vtx-header--layout-centered .vtx-header__actions {\r\n  position: absolute;\r\n  right: 24px;\r\n}\r\n\r\n.vtx-header--layout-centered .vtx-header__nav {\r\n  margin: 0;\r\n  flex: 0;\r\n}\r\n\r\n/* ===================================================================\r\n   Mobile Styles\r\n   =================================================================== */\r\n\r\n.vtx-header--mobile .vtx-header__menu-toggle {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 40px;\r\n  height: 40px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  cursor: pointer;\r\n  border-radius: 8px;\r\n  color: inherit;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.vtx-header--mobile .vtx-header__menu-toggle:hover {\r\n  background-color: var(--hover-bg, rgba(0, 0, 0, 0.05));\r\n}\r\n\r\n.vtx-header__overlay {\r\n  position: fixed;\r\n  inset: 0;\r\n  background-color: rgba(0, 0, 0, 0.5);\r\n  z-index: 999;\r\n  animation: fadeIn 0.3s ease;\r\n}\r\n\r\n@keyframes fadeIn {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.vtx-header__mobile-menu {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  bottom: 0;\r\n  width: 280px;\r\n  background-color: #ffffff;\r\n  box-shadow: 4px 0 16px rgba(0, 0, 0, 0.1);\r\n  z-index: 1000;\r\n  transform: translateX(-100%);\r\n  transition: transform 0.3s ease;\r\n  overflow-y: auto;\r\n}\r\n\r\n.vtx-header__mobile-menu--open {\r\n  transform: translateX(0);\r\n}\r\n\r\n.vtx-header__mobile-menu-content {\r\n  padding: 24px;\r\n}\r\n\r\n.vtx-header__mobile-search {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.vtx-header__mobile-search-icon {\r\n  position: absolute;\r\n  left: 12px;\r\n  color: #9ca3af;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-header__mobile-search-input {\r\n  width: 100%;\r\n  height: 40px;\r\n  padding: 0 16px 0 40px;\r\n  border: 1px solid rgba(0, 0, 0, 0.1);\r\n  border-radius: 8px;\r\n  font-size: 0.875rem;\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n  color: #1f2937;\r\n}\r\n\r\n.vtx-header__mobile-search-input:focus {\r\n  outline: none;\r\n  border-color: #3b82f6;\r\n  background-color: #ffffff;\r\n}\r\n\r\n.vtx-header__mobile-nav {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n}\r\n\r\n.vtx-header__mobile-nav-item {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-header__mobile-nav-link-wrapper {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n}\r\n\r\n.vtx-header__mobile-nav-link {\r\n  flex: 1;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  padding: 12px;\r\n  text-decoration: none;\r\n  color: #1f2937;\r\n  border-radius: 8px;\r\n  font-size: 0.9375rem;\r\n  font-weight: 500;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.vtx-header__mobile-nav-link:hover {\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-header__mobile-nav-link--active {\r\n  background-color: rgba(59, 130, 246, 0.1);\r\n  color: #3b82f6;\r\n  font-weight: 600;\r\n}\r\n\r\n.vtx-header__mobile-nav-link--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-header__mobile-nav-icon,\r\n.vtx-header__mobile-nav-label,\r\n.vtx-header__mobile-nav-badge {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-header__mobile-nav-label {\r\n  flex: 1;\r\n}\r\n\r\n.vtx-header__mobile-nav-toggle {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 32px;\r\n  height: 32px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  cursor: pointer;\r\n  border-radius: 6px;\r\n  color: #6b7280;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.vtx-header__mobile-nav-toggle:hover {\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-header__mobile-nav-toggle--expanded {\r\n  transform: rotate(180deg);\r\n}\r\n\r\n.vtx-header__mobile-nav-children {\r\n  padding-left: 20px;\r\n  margin-top: 4px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n}\r\n\r\n.vtx-header__mobile-nav-item--level-1 .vtx-header__mobile-nav-link {\r\n  padding-left: 24px;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vtx-header__mobile-actions {\r\n  margin-top: 24px;\r\n  padding-top: 24px;\r\n  border-top: 1px solid rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n/* ===================================================================\r\n   Theme Variants\r\n   =================================================================== */\r\n\r\n/* Primary */\r\n.vtx-header--primary {\r\n  --header-bg: #3b82f6;\r\n  --header-color: #ffffff;\r\n  --hover-bg: rgba(255, 255, 255, 0.1);\r\n  --active-bg: rgba(255, 255, 255, 0.15);\r\n}\r\n\r\n/* Apply theme to single-row container */\r\n.vtx-header--primary.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--primary.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--primary.vtx-header--layout-two-row .vtx-header__top-row .vtx-header__container {\r\n  background-color: var(--header-bg);\r\n  color: var(--header-color);\r\n}\r\n\r\n.vtx-header--primary .vtx-header__search-input {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--primary .vtx-header__search-input::placeholder {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n.vtx-header--primary .vtx-header__search-icon {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n/* Secondary */\r\n.vtx-header--secondary {\r\n  --header-bg: #6366f1;\r\n  --header-color: #ffffff;\r\n  --hover-bg: rgba(255, 255, 255, 0.1);\r\n  --active-bg: rgba(255, 255, 255, 0.15);\r\n}\r\n\r\n.vtx-header--secondary.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--secondary.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--secondary.vtx-header--layout-two-row .vtx-header__top-row .vtx-header__container {\r\n  background-color: var(--header-bg);\r\n  color: var(--header-color);\r\n}\r\n\r\n.vtx-header--secondary .vtx-header__search-input {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--secondary .vtx-header__search-input::placeholder {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n.vtx-header--secondary .vtx-header__search-icon {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n/* Dark */\r\n.vtx-header--dark {\r\n  --header-bg: #1f2937;\r\n  --header-color: #ffffff;\r\n  --hover-bg: rgba(255, 255, 255, 0.1);\r\n  --active-bg: rgba(255, 255, 255, 0.15);\r\n}.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--dark.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--dark.vtx-header--layout-two-row .vtx-header__top-row\r\n\r\n.vtx-header--dark .vtx-header__container {\r\n  background-color: var(--header-bg);\r\n  color: var(--header-color);\r\n}\r\n\r\n.vtx-header--dark .vtx-header__search-input {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--dark .vtx-header__search-input::placeholder {\r\n  color: rgba(255, 255, 255, 0.6);\r\n}\r\n\r\n.vtx-header--dark .vtx-header__search-icon {\r\n  color: rgba(255, 255, 255, 0.6);\r\n}\r\n\r\n/* Light */\r\n.vtx-header--light {\r\n  --header-bg: #f9fafb;\r\n  --header-color: #1f2937;\r\n  --hover-bg: rgba(0, 0, 0, 0.05);\r\n  --active-bg: rgba(0, 0, 0, 0.08);\r\n}.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--light.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--light.vtx-header--layout-two-row .vtx-header__top-row\r\n\r\n.vtx-header--light .vtx-header__container {\r\n  background-color: var(--header-bg);\r\n  color: var(--header-color);\r\n}\r\n\r\n/* Transparent */\r\n.vtx-header--transparent {\r\n  --header-bg: transparent;\r\n  --header-color: #1f2937;\r\n  --hover-bg: rgba(0, 0, 0, 0.05);\r\n  --active-bg: rgba(0, 0, 0, 0.08);\r\n}.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--transparent.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--transparent.vtx-header--layout-two-row .vtx-header__top-row\r\n\r\n.vtx-header--transparent .vtx-header__container {\r\n  background-color: var(--header-bg);\r\n  color: var(--header-color);\r\n}\r\n\r\n/* Gradient */\r\n.vtx-header--gradient {\r\n  --header-color: #ffffff;\r\n  --hover-bg: rgba(255, 255, 255, 0.1);\r\n  --active-bg: rgba(255, 255, 255, 0.15);\r\n}.vtx-header--layout-single-row .vtx-header__container,\r\n.vtx-header--gradient.vtx-header--layout-centered .vtx-header__container,\r\n.vtx-header--gradient.vtx-header--layout-two-row .vtx-header__top-row\r\n\r\n.vtx-header--gradient .vtx-header__container {\r\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n  color: var(--header-color);\r\n}\r\n\r\n.vtx-header--gradient .vtx-header__search-input {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n  color: #ffffff;\r\n}\r\n\r\n.vtx-header--gradient .vtx-header__search-input::placeholder {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n.vtx-header--gradient .vtx-header__search-icon {\r\n  color: rgba(255, 255, 255, 0.7);\r\n}\r\n\r\n/* ===================================================================\r\n   Responsive Adjustments\r\n   =================================================================== */\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-header__container {\r\n    padding: 0 16px;\r\n  }\r\n\r\n  .vtx-header__topbar-container {\r\n    padding: 0 16px;\r\n  }\r\n}\r\n");const Or=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:l=!1,sticky:c=!1,fullWidth:s=!1,searchEnabled:d=!1,searchPlaceholder:x="Search...",onSearch:v,onLogoClick:p,layout:m="single-row",twoRowBottomStyle:h="default",topBar:u,scrollBehavior:g,scrollThreshold:f=50,onScrollStateChange:b,className:w="",style:y,...k},j)=>{const[_,z]=r.useState(""),[N,C]=r.useState(null),[S,M]=r.useState(!1),[T,$]=r.useState(!1);i.default.useEffect(()=>{if(!g)return;const n=()=>{const n=window.scrollY>f;$(r=>(r!==n&&(null==b||b(n)),n))};return window.addEventListener("scroll",n,{passive:!0}),()=>window.removeEventListener("scroll",n)},[g,f,b]);const D=["vtx-header","vtx-header--desktop",`vtx-header--${o}`,`vtx-header--layout-${m}`,"two-row"===m&&"default"!==h&&`vtx-header--${h}`,l&&"vtx-header--elevated",c&&"vtx-header--sticky",s&&"vtx-header--full-width",u&&!S&&"vtx-header--has-topbar",g&&"vtx-header--scroll-behavior",g&&T&&"vtx-header--scrolled",w].filter(Boolean).join(" "),A=n=>{n.preventDefault(),v&&v(_)},E=r=>{const e=r.children&&r.children.length>0,t=r.megaMenu&&r.megaMenuColumns&&r.megaMenuColumns.length>0,a=N===r.id;return n.jsxs("div",{className:`vtx-header__nav-item ${e||t?"vtx-header__nav-item--has-dropdown":""} ${t?"vtx-header__nav-item--mega":""}`,onMouseEnter:()=>(e||t)&&C(r.id),onMouseLeave:()=>(e||t)&&C(null),children:[n.jsxs("a",{href:r.href,onClick:n=>{r.onClick&&(n.preventDefault(),r.onClick())},className:`vtx-header__nav-link ${r.active?"vtx-header__nav-link--active":""} ${r.disabled?"vtx-header__nav-link--disabled":""}`,"aria-current":r.active?"page":void 0,"aria-disabled":r.disabled,children:[r.icon&&n.jsx("span",{className:"vtx-header__nav-icon",children:r.icon}),n.jsx("span",{className:"vtx-header__nav-label",children:r.label}),r.badge&&n.jsx(Zn,{size:"small",variant:"error",className:"vtx-header__nav-badge",children:r.badge}),(e||t)&&n.jsx(I,{className:"vtx-header__nav-chevron",size:16})]}),t&&a&&n.jsx("div",{className:"vtx-header__mega-menu",children:n.jsx("div",{className:"vtx-header__mega-menu-container",children:r.megaMenuColumns.map((r,e)=>n.jsxs("div",{className:"vtx-header__mega-menu-column",children:[r.title&&n.jsx(In,{variant:"overline",weight:"bold",className:"vtx-header__mega-menu-column-title",children:r.title}),n.jsx("div",{className:"vtx-header__mega-menu-items",children:r.items.map(r=>n.jsxs("a",{href:r.href,onClick:n=>{r.onClick&&(n.preventDefault(),r.onClick())},className:"vtx-header__mega-menu-item "+(r.active?"vtx-header__mega-menu-item--active":""),children:[r.icon&&n.jsx("span",{className:"vtx-header__mega-menu-icon",children:r.icon}),n.jsxs("div",{className:"vtx-header__mega-menu-item-content",children:[n.jsx(In,{variant:"body2",weight:"semibold",className:"vtx-header__mega-menu-item-label",children:r.label}),r.description&&n.jsx(In,{variant:"caption",color:"#6b7280",className:"vtx-header__mega-menu-item-description",children:r.description})]}),r.badge&&n.jsx(Zn,{size:"small",variant:"error",className:"vtx-header__mega-menu-badge",children:r.badge})]},r.id))})]},e))})}),e&&!t&&a&&n.jsx("div",{className:"vtx-header__dropdown",children:r.children.map(r=>n.jsxs("a",{href:r.href,onClick:n=>{r.onClick&&(n.preventDefault(),r.onClick())},className:`vtx-header__dropdown-item ${r.active?"vtx-header__dropdown-item--active":""} ${r.disabled?"vtx-header__dropdown-item--disabled":""}`,children:[r.icon&&n.jsx("span",{className:"vtx-header__dropdown-icon",children:r.icon}),n.jsx("span",{className:"vtx-header__dropdown-label",children:r.label}),r.badge&&n.jsx(Zn,{size:"small",variant:"error",className:"vtx-header__dropdown-badge",children:r.badge})]},r.id))})]},r.id)},R=()=>{if(!u||S)return null;const r=u.variant||"subtle";return n.jsx("div",{className:`vtx-header__topbar vtx-header__topbar--${r}`,children:n.jsxs("div",{className:"vtx-header__topbar-container",children:[u.leftContent&&n.jsx("div",{className:"vtx-header__topbar-left",children:u.leftContent}),u.content&&n.jsx("div",{className:"vtx-header__topbar-content",children:u.content}),u.rightContent&&n.jsx("div",{className:"vtx-header__topbar-right",children:u.rightContent}),u.dismissible&&n.jsx("button",{className:"vtx-header__topbar-dismiss",onClick:()=>{var n;M(!0),null===(n=u.onDismiss)||void 0===n||n.call(u)},"aria-label":"Dismiss",children:n.jsx(rn,{size:14})})]})})};return"single-row"===m?n.jsxs("header",{ref:j,className:D,style:y,...k,children:[R(),n.jsxs("div",{className:"vtx-header__container",children:[e&&n.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&n.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(E)}),n.jsxs("div",{className:"vtx-header__actions",children:[d&&n.jsxs("form",{onSubmit:A,className:"vtx-header__search",children:[n.jsx(on,{className:"vtx-header__search-icon",size:18}),n.jsx("input",{type:"search",placeholder:x,value:_,onChange:n=>z(n.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&n.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]}):"two-row"===m?n.jsxs("header",{ref:j,className:D,style:y,...k,children:[R(),n.jsx("div",{className:"vtx-header__top-row",children:n.jsxs("div",{className:"vtx-header__container",children:[e&&n.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),d&&n.jsxs("form",{onSubmit:A,className:"vtx-header__search vtx-header__search--expanded",children:[n.jsx(on,{className:"vtx-header__search-icon",size:18}),n.jsx("input",{type:"search",placeholder:x,value:_,onChange:n=>z(n.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&n.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),t.length>0&&n.jsx("div",{className:"vtx-header__bottom-row",children:n.jsx("div",{className:"vtx-header__container",children:n.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(E)})})})]}):n.jsxs("header",{ref:j,className:D,style:y,...k,children:[R(),n.jsxs("div",{className:"vtx-header__container",children:[e&&n.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&n.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(E)}),n.jsxs("div",{className:"vtx-header__actions",children:[d&&n.jsxs("form",{onSubmit:A,className:"vtx-header__search",children:[n.jsx(on,{className:"vtx-header__search-icon",size:18}),n.jsx("input",{type:"search",placeholder:x,value:_,onChange:n=>z(n.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&n.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]})});Or.displayName="HeaderDesktop";const Fr=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:i=!1,sticky:l=!1,searchEnabled:c=!1,searchPlaceholder:s="Search...",onSearch:d,onLogoClick:x,menuOpen:v,onMenuOpenChange:p,className:m="",style:h,...u},g)=>{const[f,b]=r.useState(!1),[w,y]=r.useState(""),[k,j]=r.useState(new Set),_=void 0!==v,z=_?v:f,N=n=>{_?null==p||p(n):b(n)},C=["vtx-header","vtx-header--mobile",`vtx-header--${o}`,i&&"vtx-header--elevated",l&&"vtx-header--sticky",z&&"vtx-header--menu-open",m].filter(Boolean).join(" "),S=n=>{const r=new Set(k);r.has(n)?r.delete(n):r.add(n),j(r)},M=(r,e=0)=>{const t=r.children&&r.children.length>0,a=k.has(r.id);return n.jsxs("div",{className:`vtx-header__mobile-nav-item vtx-header__mobile-nav-item--level-${e}`,children:[n.jsxs("div",{className:"vtx-header__mobile-nav-link-wrapper",children:[n.jsxs("a",{href:r.href,onClick:n=>{t?(n.preventDefault(),S(r.id)):r.onClick?(n.preventDefault(),r.onClick(),N(!1)):N(!1)},className:`vtx-header__mobile-nav-link ${r.active?"vtx-header__mobile-nav-link--active":""} ${r.disabled?"vtx-header__mobile-nav-link--disabled":""}`,"aria-current":r.active?"page":void 0,"aria-disabled":r.disabled,children:[r.icon&&n.jsx("span",{className:"vtx-header__mobile-nav-icon",children:r.icon}),n.jsx("span",{className:"vtx-header__mobile-nav-label",children:r.label}),r.badge&&n.jsx(Zn,{size:"small",variant:"error",className:"vtx-header__mobile-nav-badge",children:r.badge})]}),t&&n.jsx("button",{className:"vtx-header__mobile-nav-toggle "+(a?"vtx-header__mobile-nav-toggle--expanded":""),onClick:()=>S(r.id),"aria-label":`Toggle ${r.label} submenu`,"aria-expanded":a,children:n.jsx(I,{size:16})})]}),t&&a&&n.jsx("div",{className:"vtx-header__mobile-nav-children",children:r.children.map(n=>M(n,e+1))})]},r.id)};return n.jsxs(n.Fragment,{children:[n.jsx("header",{ref:g,className:C,style:h,...u,children:n.jsxs("div",{className:"vtx-header__container",children:[n.jsx("button",{className:"vtx-header__menu-toggle",onClick:()=>N(!z),"aria-label":"Toggle menu","aria-expanded":z,children:z?n.jsx(rn,{size:24}):n.jsx(R,{size:24})}),e&&n.jsx("div",{className:"vtx-header__logo",onClick:x,style:{cursor:x?"pointer":"default"},children:e}),a&&n.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),z&&n.jsx("div",{className:"vtx-header__overlay",onClick:()=>N(!1),"aria-hidden":"true"}),n.jsx("div",{className:"vtx-header__mobile-menu "+(z?"vtx-header__mobile-menu--open":""),children:n.jsxs("div",{className:"vtx-header__mobile-menu-content",children:[c&&n.jsxs("form",{onSubmit:n=>{n.preventDefault(),d&&d(w)},className:"vtx-header__mobile-search",children:[n.jsx(on,{className:"vtx-header__mobile-search-icon",size:18}),n.jsx("input",{type:"search",placeholder:s,value:w,onChange:n=>y(n.target.value),className:"vtx-header__mobile-search-input","aria-label":"Search"})]}),t.length>0&&n.jsx("nav",{className:"vtx-header__mobile-nav","aria-label":"Mobile navigation",children:t.map(n=>M(n))}),a&&n.jsx("div",{className:"vtx-header__mobile-actions",children:a})]})})]})});Fr.displayName="HeaderMobile";const Wr=({desktopProps:e,mobileProps:t,breakpoint:a=768})=>{const[o,l]=r.useState(!1);return i.default.useEffect(()=>{const n=()=>{l(window.innerWidth<a)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)},[a]),o?n.jsx(Fr,{...t}):n.jsx(Or,{...e})};Wr.displayName="HeaderResponsive";const Pr={Desktop:y(Or),Mobile:y(Fr),Responsive:Wr};exports.Accordion=zn,exports.AccordionItem=_n,exports.Alert=Sn,exports.Avatar=Kn,exports.Badge=Zn,exports.Button=_,exports.Card=nr,exports.Checkbox=N,exports.CheckboxGroup=S,exports.Chip=hn,exports.Divider=er,exports.Flex=Tn,exports.Grid=gr,exports.Header=or,exports.HomeHeader=Pr,exports.InfoCard=wr,exports.InfoListCard=Ar,exports.InfoText=Nr,exports.Input=pn,exports.Menu=Rn,exports.MenuItem=An,exports.Modal=Bn,exports.MultiSelect=gn,exports.OrderCard=Ir,exports.OrderConfirmation=Rr,exports.OrderDetails=Br,exports.ProductCard=Tr,exports.Radio=bn,exports.RadioGroup=yn,exports.Select=jn,exports.SideMenu=vr,exports.Table=mr,exports.Text=In,exports.ThemeProvider=m,exports.Timeline=hr,exports.Toast=Wn,exports.ToastContainer=({children:r,...e})=>n.jsxs(Hn,{children:[r,n.jsx(Xn,{...e})]}),exports.Tooltip=Un,exports.generateCSSVariables=x,exports.injectCSSVariables=v,exports.toast=qn,exports.tokens=d,exports.useBodyScrollLock=sn,exports.useClickOutside=(n,e)=>{r.useEffect(()=>{const r=r=>{const t=null==n?void 0:n.current;t&&!t.contains(r.target)&&e(r)};return document.addEventListener("mousedown",r),document.addEventListener("touchstart",r),()=>{document.removeEventListener("mousedown",r),document.removeEventListener("touchstart",r)}},[n,e])},exports.useDebounce=(n,e)=>{const[t,a]=r.useState(n);return r.useEffect(()=>{const r=setTimeout(()=>{a(n)},e);return()=>{clearTimeout(r)}},[n,e]),t},exports.useEscapeKey=cn,exports.useFocusTrap=ln,exports.useId=xn,exports.useThemeContext=h,exports.useToast=Vn;
 //# sourceMappingURL=index.cjs.js.map