@vtx-ui/react 0.0.1-beta.7 → 0.0.1-beta.9

package/dist/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("react/jsx-runtime"),n=require("react"),e=require("react-icons/fi"),t=require("react-dom");function a(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}function o(r){if(r&&r.__esModule)return r;var n=Object.create(null);return r&&Object.keys(r).forEach(function(e){if("default"!==e){var t=Object.getOwnPropertyDescriptor(r,e);Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return r[e]}})}}),n.default=r,Object.freeze(n)}var i=a(n),l=o(n);function s(r){const n=r.replace("#",""),e=parseInt(n.substring(0,2),16),t=parseInt(n.substring(2,4),16),a=parseInt(n.substring(4,6),16),o={},i={50:.95,100:.9,200:.75,300:.6,400:.3,500:0,600:-.15,700:-.3,800:-.45,900:-.6};for(const[n,l]of Object.entries(i))if(0===l)o[Number(n)]=r.startsWith("#")?r:`#${r}`;else{let r,i,s;l>0?(r=Math.round(e+(255-e)*l),i=Math.round(t+(255-t)*l),s=Math.round(a+(255-a)*l)):(r=Math.round(e*(1+l)),i=Math.round(t*(1+l)),s=Math.round(a*(1+l))),r=Math.max(0,Math.min(255,r)),i=Math.max(0,Math.min(255,i)),s=Math.max(0,Math.min(255,s));const c=`#${r.toString(16).padStart(2,"0")}${i.toString(16).padStart(2,"0")}${s.toString(16).padStart(2,"0")}`;o[Number(n)]=c}return o}function c(r){const n={};for(const[e,t]of Object.entries(r))if("string"==typeof t)n[e]=s(t);else if("object"==typeof t&&null!==t)if(t[500]){const r=s(t[500]);n[e]={...r,...t}}else n[e]=t;return n}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 r=[];return Object.entries(d.colors).forEach(([n,e])=>{"object"==typeof e?Object.entries(e).forEach(([e,t])=>{r.push(`  --vtx-color-${n}-${e}: ${t};`)}):r.push(`  --vtx-color-${n}: ${e};`)}),Object.entries(d.spacing).forEach(([n,e])=>{r.push(`  --vtx-spacing-${n}: ${e};`)}),Object.entries(d.typography.fontFamily).forEach(([n,e])=>{r.push(`  --vtx-font-family-${n}: ${e};`)}),Object.entries(d.typography.fontSize).forEach(([n,e])=>{r.push(`  --vtx-font-size-${n}: ${e};`)}),Object.entries(d.typography.fontWeight).forEach(([n,e])=>{r.push(`  --vtx-font-weight-${n}: ${e};`)}),Object.entries(d.typography.lineHeight).forEach(([n,e])=>{r.push(`  --vtx-line-height-${n}: ${e};`)}),Object.entries(d.typography.letterSpacing).forEach(([n,e])=>{r.push(`  --vtx-letter-spacing-${n}: ${e};`)}),Object.entries(d.typography.textVariants).forEach(([n,e])=>{Object.entries(e).forEach(([e,t])=>{const a=e.replace(/([A-Z])/g,"-$1").toLowerCase();r.push(`  --vtx-text-${n}-${a}: ${t};`)})}),Object.entries(d.borderRadius).forEach(([n,e])=>{r.push(`  --vtx-radius-${n}: ${e};`)}),Object.entries(d.shadows).forEach(([n,e])=>{r.push(`  --vtx-shadow-${n}: ${e};`)}),Object.entries(d.transitions).forEach(([n,e])=>{r.push(`  --vtx-transition-${n}: ${e};`)}),Object.entries(d.zIndex).forEach(([n,e])=>{r.push(`  --vtx-z-${n}: ${e};`)}),r.join("\n")}function v(){if("undefined"==typeof document)return;const r="vtx-ui-variables";let n=document.getElementById(r);n||(n=document.createElement("style"),n.id=r,document.head.appendChild(n));const e=x();n.textContent=`:root {\n${e}\n}`}const p=i.default.createContext(void 0),m=i.default.forwardRef(({children:n,initialMode:e="light",customTokens:t,defaultSize:a="md",...o},l)=>{const[s,x]=i.default.useState(e),[m,h]=i.default.useState(a),g=i.default.useMemo(()=>{if(!t)return{tokens:d,mode:s,defaultSize:m};let r={...d,...t};return t.colors&&(r.colors={...d.colors,...c(t.colors)}),{tokens:r,mode:s,defaultSize:m}},[t,s,m]);i.default.useEffect(()=>{document.documentElement.setAttribute("data-theme",s),t&&v()},[s,t]);const u=i.default.useMemo(()=>({theme:g,setMode:x,setDefaultSize:h}),[g]);return r.jsx(p.Provider,{value:u,children:r.jsx("div",{ref:l,...o,children:n})})});m.displayName="ThemeProvider";const h=()=>{const r=i.default.useContext(p);if(!r)throw new Error("useThemeContext must be used within a ThemeProvider");return r},g="dynamic-styles";function u(){let r=document.getElementById(g);return r||(r=document.createElement("style"),r.id=g,document.head.appendChild(r)),r}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(n){const e=e=>{const t=(e.className||"").split(" ").map(r=>function(r){let n=r.match(/^([a-z]+)-\[(.+)\]$/);if(n){const r=n[1],e=n[2],t=`${r}-${e.replace(/[^a-z0-9]/gi,"")}`,a=w[r];if(a){let n;return n="mx"===r?`.${t} { margin-left: ${e}; margin-right: ${e}; }`:"my"===r?`.${t} { margin-top: ${e}; margin-bottom: ${e}; }`:"px"===r?`.${t} { padding-left: ${e}; padding-right: ${e}; }`:"py"===r?`.${t} { padding-top: ${e}; padding-bottom: ${e}; }`:`.${t} { ${a}: ${e}; }`,f.has(n)||(u().appendChild(document.createTextNode(n)),f.add(n)),t}}if(n=r.match(/^([a-z]+)-(.+)$/),n){const r=n[1],e=n[2],t=w[r],a=b[e];if(t&&a){const n=`${r}-${e.replace(/[^a-z0-9]/gi,"")}`;let o;return o="mx"===r?`.${n} { margin-left: ${a}; margin-right: ${a}; }`:"my"===r?`.${n} { margin-top: ${a}; margin-bottom: ${a}; }`:"px"===r?`.${n} { padding-left: ${a}; padding-right: ${a}; }`:"py"===r?`.${n} { padding-top: ${a}; padding-bottom: ${a}; }`:`.${n} { ${t}: ${a}; }`,f.has(o)||(u().appendChild(document.createTextNode(o)),f.add(o)),n}}return r}(r)).join(" ");return r.jsx(n,{...e,className:t})};return e.displayName=n.displayName||n.name||"Component",e}function k(r,n){void 0===n&&(n={});var e=n.insertAt;if(r&&"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=r:a.appendChild(document.createTextNode(r))}}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:n,variant:e="primary",size:t,fullWidth:a=!1,loading:o=!1,disabled:i=!1,leftIcon:l,rightIcon:s,iconOnly:c=!1,loadingText:d,asLink:x=!1,href:v,target:p,rel:m,className:g="",type:u="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",c&&"vtx-button--icon-only",!0===f.darkText&&"vtx-button--dark-text",!1===f.darkText&&"vtx-button--light-text",g].filter(Boolean).join(" "),k=f.style?{...f.style}:{};f.textColor&&(k.color=f.textColor);const j=r.jsxs(r.Fragment,{children:[o&&r.jsx("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:r.jsx("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:r.jsx("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!o&&l&&r.jsx("span",{className:"vtx-button__icon-left",children:l}),!c&&r.jsx("span",{className:"vtx-button__content",children:o&&d?d:n}),c&&!o&&n,!o&&s&&r.jsx("span",{className:"vtx-button__icon-right",children:s})]});return x&&v?r.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}):r.jsx("button",{ref:b,type:u,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:s=!1,helperText:c,onChange:d,className:x="",inputClassName:v="",id:p,...m},g)=>{const{theme:u}=h(),f=i||u.defaultSize||"md",b=n.useId(),w=p||b,y=["vtx-checkbox",`vtx-checkbox--${f}`,`vtx-checkbox--${l}`,a&&"vtx-checkbox--disabled",s&&"vtx-checkbox--error",x].filter(Boolean).join(" "),k=["vtx-checkbox-input",v].filter(Boolean).join(" "),j=n.useRef(null);return n.useImperativeHandle(g,()=>j.current),n.useEffect(()=>{j.current&&(j.current.indeterminate=t)},[t]),r.jsxs("div",{className:y,children:[r.jsxs("label",{className:"vtx-checkbox-label",htmlFor:w,children:[r.jsxs("span",{className:"vtx-checkbox-wrapper",children:[r.jsx("input",{ref:j,type:"checkbox",id:w,className:k,checked:e,disabled:a,onChange:d,...m}),r.jsxs("span",{className:"vtx-checkbox-box",children:[r.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),r.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r.jsx("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),o&&r.jsx("span",{className:"vtx-checkbox-label-text",children:o})]}),c&&r.jsx("div",{className:"vtx-checkbox-helper-text",children:c})]})});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:s=!1,helperText:c,orientation:d="vertical",size:x,className:v="",...p},m)=>{const{theme:g}=h(),u=x||g.defaultSize||"md",[f,b]=n.useState(o||[]),w=void 0!==a,y=w?a:f,k=["vtx-checkbox-group",`vtx-checkbox-group--${d}`,s&&"vtx-checkbox-group--error",l&&"vtx-checkbox-group--disabled",v].filter(Boolean).join(" ");return r.jsxs("div",{ref:m,className:k,...p,children:[e&&r.jsx("div",{className:"vtx-checkbox-group-label",children:e}),r.jsx("div",{className:"vtx-checkbox-group-options",children:t.map(n=>{const e=y.includes(n.value),t=l||n.disabled;return r.jsx(N,{label:n.label,checked:e,disabled:t,error:s,size:u,onChange:r=>((r,n)=>{const e=n?[...y,r]:y.filter(n=>n!==r);w||b(e),null==i||i(e)})(n.value,r.target.checked)},n.value)})}),c&&r.jsx("div",{className:"vtx-checkbox-group-helper-text",children:c})]})});C.displayName="CheckboxGroup";const S=y(C),M=n=>r.jsxs("svg",{className:"vtx-multiselect-icon-spinner",width:n.size||16,height:n.size||16,viewBox:"0 0 16 16",fill:"none",children:[r.jsx("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r.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,$=n=>r.jsx(e.FiX,{size:n.size||12,"aria-hidden":"true"}),I=e.FiChevronDown,A=e.FiPlus,F=e.FiMinus,D=e.FiBell,E=e.FiMenu,R=e.FiChevronUp,L=e.FiChevronLeft,B=e.FiChevronRight,O=e.FiCheckCircle,W=e.FiAlertCircle,P=e.FiAlertTriangle,V=e.FiInfo,H=e.FiMinusCircle,Y=e.FiDownload,q=e.FiPackage,X=e.FiShoppingBag,G=e.FiShare2,U=e.FiEye,K=e.FiCreditCard,Q=e.FiMessageCircle,Z=e.FiMapPin,J=e.FiPhone,rr=e.FiTruck,nr=e.FiX,er=e.FiCornerUpLeft,tr=e.FiRefreshCw,ar=e.FiStar,or=e.FiSearch,ir=e.FiArrowUp,lr=e.FiArrowDown,sr=e.FiChevronsLeft,cr=e.FiChevronsRight,dr=(r,e)=>{n.useEffect(()=>{if(!e)return;const n=r.current;if(!n)return;const t=n.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=r=>{"Tab"===r.key&&(r.shiftKey?document.activeElement===a&&(null==o||o.focus(),r.preventDefault()):document.activeElement===o&&(null==a||a.focus(),r.preventDefault()))};return null==a||a.focus(),n.addEventListener("keydown",i),()=>{n.removeEventListener("keydown",i)}},[r,e])},xr=r=>{n.useEffect(()=>{const n=n=>{"Escape"===n.key&&r()};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[r])},vr=r=>{n.useEffect(()=>{if(!r)return;const n=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=n}},[r])};let pr=0;const mr=(r="vtx")=>{const[e]=n.useState(()=>`${r}-${++pr}`);return e};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(".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--sm {\n  min-height: 32px;\n}\n\n.vtx-input-container--md {\n  min-height: 40px;\n}\n\n.vtx-input-container--lg {\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--sm .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--lg .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 hr=i.default.forwardRef(({label:n,helperText:e,error:t,success:a,size:o,fullWidth:i=!1,leftIcon:l,rightIcon:s,clearable:c=!1,onClear:d,showCount:x=!1,className:v="",wrapperClassName:p="",labelClassName:m="",inputClassName:g="",prefix:u,suffix:f,id:b,disabled:w=!1,required:y=!1,value:k,maxLength:j,..._},z)=>{const{theme:N}=h(),C=o||N.defaultSize,S=mr("input"),M=b||S,T=`${M}-helper`,I=`${M}-error`,A=`${M}-success`,F=Boolean(t),D=Boolean(a)&&!F,E=c&&k&&String(k).length>0&&!w,R=[e&&!t&&!a&&T,t&&I,a&&A].filter(Boolean).join(" "),L=["vtx-input-wrapper",i&&"vtx-input-wrapper--full-width",p].filter(Boolean).join(" "),B=["vtx-input-container",`vtx-input-container--${C}`,F&&"vtx-input-container--error",D&&"vtx-input-container--success",w&&"vtx-input-container--disabled",(l||u)&&"vtx-input-container--with-left-element",(s||f||E)&&"vtx-input-container--with-right-element",v].filter(Boolean).join(" "),O=k?String(k).length:0,W=x&&j;return r.jsxs("div",{className:L,children:[n&&r.jsxs("label",{htmlFor:M,className:`vtx-input-label ${m}`.trim(),children:[n,y&&r.jsxs("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{className:B,children:[l&&r.jsx("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:l}),u&&r.jsx("span",{className:"vtx-input-prefix","aria-hidden":"true",children:u}),r.jsx("input",{ref:z,id:M,className:`vtx-input ${g}`.trim(),disabled:w,required:y,value:k,maxLength:j,"aria-invalid":F,"aria-describedby":R||void 0,..._}),f&&r.jsx("span",{className:"vtx-input-suffix","aria-hidden":"true",children:f}),E&&r.jsx("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==d||d()},"aria-label":"Clear input",tabIndex:-1,children:r.jsx($,{size:16})}),s&&!E&&r.jsx("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:s})]}),e&&!t&&!a&&r.jsx("p",{id:T,className:"vtx-input-helper",children:e}),t&&r.jsx("p",{id:I,className:"vtx-input-error",role:"alert",children:t}),a&&r.jsx("p",{id:A,className:"vtx-input-success",role:"status",children:a}),W&&r.jsxs("p",{className:"vtx-input-counter","aria-live":"polite",children:[O," / ",j]})]})});hr.displayName="Input";const gr=y(hr);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 ur=i.default.forwardRef(({label:n,size:e="md",variant:t="filled",color:a="default",icon:o,avatar:i,onDelete:l,onClick:s,disabled:c=!1,className:d="","aria-label":x,"data-testid":v},p)=>{const m=["vtx-chip",`vtx-chip--${e}`,`vtx-chip--${t}`,`vtx-chip--${a}`,s&&!c&&"vtx-chip--clickable",c&&"vtx-chip--disabled",d].filter(Boolean).join(" ");return r.jsxs("div",{ref:p,className:m,onClick:r=>{!c&&s&&s(r)},onKeyDown:r=>{c||!s||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),s(r))},role:s?"button":void 0,tabIndex:s&&!c?0:void 0,"aria-label":x||n,"aria-disabled":c,"data-testid":v,children:[i&&r.jsx("img",{src:i,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),o&&!i&&r.jsx("span",{className:"vtx-chip__icon","aria-hidden":"true",children:o}),r.jsx("span",{className:"vtx-chip__label",children:n}),l&&r.jsx("button",{type:"button",className:"vtx-chip__delete",onClick:r=>{r.stopPropagation(),!c&&l&&l(r)},onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),r.stopPropagation(),!c&&l&&l(r))},disabled:c,"aria-label":`Remove ${n}`,tabIndex:-1,children:r.jsx($,{size:16})})]})});ur.displayName="Chip";const fr=y(ur);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 br=i.default.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,options:s,value:c,defaultValue:d=[],placeholder:x="Select...",className:v="",grouped:p=!1,getOptionLabel:m="label",getOptionValue:g="value",getOptionDisabled:u="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:A=!1},F)=>{const{theme:D}=h(),E=mr("multiselect"),R=k||E,L=`${R}-helper`,B=`${R}-error`,O=`${R}-success`,[W,P]=n.useState(!1),[V,H]=n.useState(""),[Y,q]=n.useState(d),X=n.useRef(null),G=n.useRef(null),U=void 0!==c?c:Y,K=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,Q=Boolean(a),Z=Boolean(o)&&!Q,J=[t&&!a&&!o&&L,a&&B,o&&O].filter(Boolean).join(" ");n.useEffect(()=>{const r=r=>{X.current&&!X.current.contains(r.target)&&G.current&&!G.current.contains(r.target)&&(P(!1),H(""))};if(W)return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[W]);const rr=r=>{if(w)return;const n=U.includes(r)?U.filter(n=>n!==r):[...U,r];if(void 0===c&&q(n),b){const r=s.filter(r=>n.includes(K(r,g)));b(n,r)}},nr=V?s.filter(r=>K(r,m).toLowerCase().includes(V.toLowerCase())):s,er=p?nr.reduce((r,n)=>{const e=K(n,f)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{}):{"":nr},tr=s.filter(r=>U.includes(K(r,g))),ar=C?tr.slice(0,C):tr,or=C?tr.length-C:0,ir=["vtx-multiselect-wrapper",l&&"vtx-multiselect-wrapper--full-width",v].filter(Boolean).join(" "),lr=i||(null==D?void 0:D.defaultSize)||"md",sr=["vtx-multiselect-container",`vtx-multiselect-container--${lr}`,Q&&"vtx-multiselect-container--error",Z&&"vtx-multiselect-container--success",w&&"vtx-multiselect-container--disabled",W&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),cr=lr;return r.jsxs("div",{className:ir,ref:F,children:[e&&r.jsxs("label",{htmlFor:R,className:"vtx-multiselect-label",children:[e,y&&r.jsxs("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{ref:X,className:sr,"aria-expanded":W,"aria-haspopup":"listbox","aria-labelledby":e?`${R}-label`:void 0,"aria-describedby":J||void 0,"aria-disabled":w,children:[r.jsx("div",{className:"vtx-multiselect-input-area",onClick:()=>!w&&P(!W),role:"button",tabIndex:w?-1:0,onKeyDown:r=>{w||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),P(!W))},children:0===tr.length?r.jsx("span",{className:"vtx-multiselect-placeholder",children:x}):r.jsxs("div",{className:"vtx-multiselect-chips",children:[ar.map(n=>{const e=K(n,g),t=K(n,m);return r.jsx(fr,{label:t,size:cr,color:S,variant:$,onDelete:r=>{r.stopPropagation(),(r=>{if(w)return;const n=U.filter(n=>n!==r);if(void 0===c&&q(n),b){const r=s.filter(r=>n.includes(K(r,g)));b(n,r)}})(e)}},e)}),or>0&&r.jsx(fr,{label:`+${or} more`,size:cr,color:"default",variant:"outlined"})]})}),r.jsx("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:A?r.jsx(M,{size:16}):r.jsx(I,{size:16})}),W&&r.jsxs("div",{ref:G,className:"vtx-multiselect-dropdown",role:"listbox",children:[z&&r.jsx("div",{className:"vtx-multiselect-search",children:r.jsx("input",{type:"text",placeholder:"Search...",value:V,onChange:r=>H(r.target.value),onClick:r=>r.stopPropagation()})}),N&&r.jsxs("div",{className:"vtx-multiselect-actions",children:[r.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),(()=>{const r=s.filter(r=>!K(r,u)).map(r=>K(r,g));void 0===c&&q(r),b&&b(r,s.filter(r=>!K(r,u)))})()},children:"Select All"}),r.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),void 0===c&&q([]),b&&b([],[])},children:"Clear All"})]}),r.jsx("div",{className:"vtx-multiselect-options",children:0===nr.length?r.jsx("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(er).map(([n,e])=>r.jsxs("div",{children:[p&&n&&r.jsx("div",{className:"vtx-multiselect-optgroup",children:n}),e.map(n=>{const e=K(n,g),t=K(n,m),a=K(n,u),o=U.includes(e),i=["vtx-multiselect-option",o&&"vtx-multiselect-option--selected",a&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return r.jsxs("div",{className:i,onClick:()=>!a&&rr(e),role:"option","aria-selected":o,"aria-disabled":a,tabIndex:a?-1:0,onKeyDown:r=>{a||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),rr(e))},children:["checkbox"===_&&r.jsx("div",{className:"vtx-multiselect-checkbox "+(o?"vtx-multiselect-checkbox--checked":""),children:o&&r.jsx(T,{size:16})}),r.jsx("span",{className:"vtx-multiselect-option-label",children:t}),"checkmark"===_&&r.jsx("div",{className:"vtx-multiselect-checkmark",children:o&&r.jsx(T,{size:20})})]},e)})]},n))})]})]}),j&&r.jsx("select",{multiple:!0,name:j,value:U.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:y,disabled:w,tabIndex:-1,"aria-hidden":"true",children:s.map(n=>{const e=K(n,g);return r.jsx("option",{value:String(e),children:K(n,m)},e)})}),t&&!a&&!o&&r.jsx("p",{id:L,className:"vtx-multiselect-helper",children:t}),a&&r.jsx("p",{id:B,className:"vtx-multiselect-error",role:"alert",children:a}),o&&r.jsx("p",{id:O,className:"vtx-multiselect-success",role:"status",children:o})]})});br.displayName="MultiSelect";const wr=y(br);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--sm {\n  --vtx-radio-size: 16px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--sm .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-radio--md {\n  --vtx-radio-size: 20px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--lg {\n  --vtx-radio-size: 24px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--lg .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 yr=i.default.forwardRef(({checked:e,disabled:t=!1,label:a,size:o,variant:i="primary",error:l=!1,helperText:s,onChange:c,className:d="",inputClassName:x="",id:v,...p},m)=>{const{theme:g}=h(),u=o||g.defaultSize,f=n.useId(),b=v||f,w=s?`${b}-helper-text`:void 0,y=["vtx-radio",`vtx-radio--${u}`,`vtx-radio--${i}`,t&&"vtx-radio--disabled",l&&"vtx-radio--error",d].filter(Boolean).join(" "),k=["vtx-radio-input",x].filter(Boolean).join(" "),j=r.jsxs("div",{className:"vtx-radio-wrapper",children:[r.jsx("input",{ref:m,type:"radio",id:b,className:k,checked:e,disabled:t,onChange:c,"aria-describedby":w,...p}),r.jsx("span",{className:"vtx-radio-circle",children:r.jsx("span",{className:"vtx-radio-dot"})})]});return a?r.jsxs("div",{className:y,children:[r.jsxs("label",{htmlFor:b,className:"vtx-radio-label",children:[j,r.jsx("span",{className:"vtx-radio-label-text",children:a})]}),s&&r.jsx("span",{id:w,className:"vtx-radio-helper-text",children:s})]}):r.jsxs("div",{className:y,children:[j,s&&r.jsx("span",{id:w,className:"vtx-radio-helper-text",children:s})]})});yr.displayName="Radio";const kr=y(yr);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 jr=i.default.forwardRef(({name:e,label:t,options:a,value:o,defaultValue:i,onChange:l,disabled:s=!1,error:c=!1,helperText:d,orientation:x="vertical",size:v,variant:p="primary",className:m="",...g},u)=>{const{theme:f}=h(),b=v||f.defaultSize,[w,y]=n.useState(i),k=void 0!==o,j=k?o:w,_=["vtx-radio-group",`vtx-radio-group--${x}`,c&&"vtx-radio-group--error",s&&"vtx-radio-group--disabled",m].filter(Boolean).join(" ");return r.jsxs("div",{ref:u,className:_,role:"radiogroup","aria-label":"string"==typeof t?t:void 0,...g,children:[t&&r.jsx("div",{className:"vtx-radio-group-label",children:t}),r.jsx("div",{className:"vtx-radio-group-options",children:a.map(n=>{const t=j===n.value,a=s||n.disabled;return r.jsx(kr,{name:e,value:n.value,label:n.label,checked:t,disabled:a,error:c,size:b,variant:p,onChange:()=>{return r=n.value,k||y(r),void(null==l||l(r));var r}},n.value)})}),d&&r.jsx("div",{className:"vtx-radio-group-helper-text",children:d})]})});jr.displayName="RadioGroup";const _r=y(jr);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--sm {\n  min-height: 32px;\n}\n\n.vtx-select-container--md {\n  min-height: 40px;\n}\n\n.vtx-select-container--lg {\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--sm .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--lg .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 zr=i.default.forwardRef(({label:n,helperText:e,error:t,success:a,size:o,fullWidth:i=!1,options:l,placeholder:s,className:c="",wrapperClassName:d="",id:x,disabled:v=!1,required:p=!1,grouped:m=!1,getOptionLabel:g="label",getOptionValue:u="value",getOptionDisabled:f="disabled",getOptionGroup:b="group",onSelectChange:w,onChange:y,loading:k=!1,...j},_)=>{const{theme:z}=h(),N=o||z.defaultSize,C=mr("select"),S=x||C,M=`${S}-helper`,T=`${S}-error`,$=`${S}-success`,I=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,A=Boolean(t),F=Boolean(a)&&!A,D=[e&&!t&&!a&&M,t&&T,a&&$].filter(Boolean).join(" "),E=["vtx-select-wrapper",i&&"vtx-select-wrapper--full-width",d].filter(Boolean).join(" "),R=["vtx-select-container",`vtx-select-container--${N}`,A&&"vtx-select-container--error",F&&"vtx-select-container--success",v&&"vtx-select-container--disabled",c].filter(Boolean).join(" ");return r.jsxs("div",{className:E,children:[n&&r.jsxs("label",{htmlFor:S,className:"vtx-select-label",children:[n,p&&r.jsxs("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{className:R,children:[r.jsxs("select",{ref:_,id:S,className:"vtx-select",disabled:v,required:p,"aria-invalid":A,"aria-describedby":D||void 0,onChange:r=>{if(null==y||y(r),w){const n=l.find(n=>String(I(n,u))===r.target.value);w(r.target.value,n)}},...j,children:[s&&r.jsx("option",{value:"",disabled:!0,children:s}),(()=>{if(!m)return l.map((n,e)=>{const t=I(n,u),a=I(n,g),o=I(n,f);return r.jsx("option",{value:t,disabled:o,children:a},t||e)});const n=l.reduce((r,n)=>{const e=I(n,b)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{});return Object.entries(n).map(([n,e])=>r.jsx("optgroup",{label:n,children:e.map((n,e)=>{const t=I(n,u),a=I(n,g),o=I(n,f);return r.jsx("option",{value:t,disabled:o,children:a},t||e)})},n))})()]}),r.jsx("span",{className:"vtx-select-icon","aria-hidden":"true",children:k?r.jsxs("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[r.jsx("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r.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"})]}):r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:r.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),e&&!t&&!a&&r.jsx("p",{id:M,className:"vtx-select-helper",children:e}),t&&r.jsx("p",{id:T,className:"vtx-select-error",role:"alert",children:t}),a&&r.jsx("p",{id:$,className:"vtx-select-success",role:"status",children:a})]})});zr.displayName="Select";const Nr=y(zr),Cr=i.default.forwardRef(({item:e,isOpen:t,onToggle:a,variant:o="default",size:i="md",showChevron:l=!0,chevronPosition:s="right",expandedIcon:c,collapsedIcon:d,iconType:x="chevron",loading:v=!1,disabled:p=!1,disableAnimations:m=!1},h)=>{const g=n.useRef(null),{id:u,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=()=>_?r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||u}-custom-icon`,children:t?_.expanded:_.collapsed}):"custom"===x&&c&&d?r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||u}-custom-icon`,children:t?c:d}):"plus-minus"===x?r.jsx("div",{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(t?"open":""),"data-testid":`${z||u}-plus-minus-icon`,children:t?r.jsx(F,{size:16,"aria-hidden":"true"}):r.jsx(r.Fragment,{children:r.jsx(A,{size:16,"aria-hidden":"true"})})}):r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${z||u}-chevron-icon`,children:r.jsx(I,{size:16,"aria-hidden":"true",style:{transform:t?"rotate(180deg)":void 0,transition:"transform 0.2s"}})});return r.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:[r.jsxs("div",{className:"accordion-item-header",role:"button",tabIndex:N||C?-1:0,"aria-expanded":t,"aria-controls":`accordion-content-${u}`,"aria-disabled":N,"aria-busy":C,"aria-describedby":"default"!==j?`accordion-status-${u}`:void 0,onClick:S,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),S())},"data-testid":`${z||u}-header`,children:["left"===s&&l&&M(),r.jsx("div",{className:"accordion-item-header-content",children:f}),"right"===s&&l&&M()]}),r.jsx("div",{id:`accordion-content-${u}`,className:"accordion-item-content "+(t?"accordion-item-content--open":""),role:"region","aria-labelledby":`accordion-header-${u}`,ref:g,style:{maxHeight:m?t?"none":"0":t?"500px":"0",transition:m?"none":void 0},"data-testid":`${z||u}-content`,children:r.jsxs("div",{className:"accordion-item-body",children:["default"!==j&&r.jsx("div",{id:`accordion-status-${u}`,className:`accordion-status accordion-status--${j}`,"aria-live":"polite",children:r.jsxs("span",{className:"visually-hidden",children:["Status: ",j]})}),b]})})]})});Cr.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 Sr=i.default.forwardRef(({items:e,children:t,allowMultiple:a=!1,defaultOpenItems:o=[],openItems:i,onToggle:l,variant:s="default",size:c="md",className:d="",style:x,showChevron:v=!0,chevronPosition:p="right",expandedIcon:m,collapsedIcon:h,iconType:g="chevron",showDivider:u=!0,collapsible:f=!0,loading:b=!1,disabled:w=!1,spacing:y="default",disableAnimations:k=!1,...j},_)=>{const[z,N]=n.useState(o),C=void 0!==i?i:z,S=void 0!==i,M=e||n.Children.toArray(t).filter(r=>n.isValidElement(r)).map((r,e)=>{if(n.isValidElement(r)&&r.props){const n=r;return{id:n.props.id||`accordion-item-${e}`,header:n.props.header||`Item ${e+1}`,children:n.props.children,disabled:n.props.disabled,className:n.props.className}}return{id:`accordion-item-${e}`,header:`Item ${e+1}`,children:r}}),T=n.useCallback(r=>{let n;n=a?C.includes(r)?C.filter(n=>n!==r):[...C,r]:C.includes(r)?f?[]:C:[r],S||N(n),null==l||l(n)},[a,f,C,S,l]);return r.jsx("div",{ref:_,className:`\n          accordion\n          accordion--${s}\n          accordion--${c}\n          ${u?"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(n=>r.jsx(Cr,{item:n,isOpen:C.includes(n.id),onToggle:()=>T(n.id),variant:s,size:c,showChevron:v,chevronPosition:p,expandedIcon:m,collapsedIcon:h,iconType:g,loading:b,disabled:w,spacing:y,disableAnimations:k},n.id))})});Sr.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 Mr={success:r.jsx(O,{size:20}),error:r.jsx(W,{size:20}),warning:r.jsx(P,{size:20}),info:r.jsx(V,{size:20}),neutral:r.jsx(H,{size:20})},Tr=i.default.forwardRef(({children:e,title:t,description:a,variant:o="info",alertStyle:i="subtle",size:l,icon:s,dismissible:c=!1,onClose:d,action:x,fullWidth:v=!1,className:p="",style:m,role:g="alert",...u},f)=>{const{theme:b}=h(),w=l||(null==b?void 0:b.defaultSize)||"md",[y,k]=n.useState(!0);if(!y)return null;const j=!1!==s,_=void 0===s?Mr[o]:s,z=e||a;return r.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:g,...u,children:[j&&r.jsx("div",{className:"alert-icon",children:_}),r.jsxs("div",{className:"alert-content",children:[t&&r.jsx("div",{className:"alert-title",children:t}),z&&r.jsx("div",{className:"alert-message",children:null!=e?e:a})]}),x&&r.jsx("div",{className:"alert-action",children:x}),c&&r.jsx("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==d||d()},"aria-label":"Close alert",children:r.jsx(nr,{size:16})})]})});Tr.displayName="Alert";const $r=y(Tr);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 Ir=i.default.forwardRef(({children:n,direction:e="row",wrap:t="nowrap",justify:a="start",align:o="stretch",alignContent:i,gap:l,rowGap:s,columnGap:c,inline:d=!1,fullWidth:x=!1,grow:v,shrink:p,basis:m,className:h="",as:g="div",style:u,...f},b)=>{const w=g,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={...u};return void 0!==l&&(k["--vtx-flex-gap"]="number"==typeof l?`${l}px`:l),void 0!==s&&(k["--vtx-flex-row-gap"]="number"==typeof s?`${s}px`:s),void 0!==c&&(k["--vtx-flex-column-gap"]="number"==typeof c?`${c}px`:c),void 0!==v&&(k.flexGrow=v),void 0!==p&&(k.flexShrink=p),void 0!==m&&(k.flexBasis="number"==typeof m?`${m}px`:m),r.jsx(w,{ref:b,className:y,style:k,...f,children:n})});Ir.displayName="Flex";const Ar=y(Ir);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 Fr=l.forwardRef(({variant:r="body1",as:n,align:e,color:t,weight:a,transform:o,decoration:i,truncate:s=!1,lineClamp:c,breakWord:d=!1,italic:x=!1,underline:v=!1,strikethrough:p=!1,gradient:m,noSelect:h=!1,size:g,lineHeight:u,letterSpacing:f,noMargin:b=!1,noPadding:w=!1,className:y="",style:k,children:j,..._},z)=>{const N=n||(r=>({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"}[r]))(r),C=["vtx-text",`vtx-text--${r}`,e&&`vtx-text--align-${e}`,a&&"string"==typeof a&&`vtx-text--weight-${a}`,o&&`vtx-text--transform-${o}`,i&&`vtx-text--decoration-${i}`,s&&"vtx-text--truncate",c&&"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[r,n]=t.split(".");S.color=`var(--vtx-color-${r}-${n})`}else S.color=t;if(a&&"number"==typeof a&&(S.fontWeight=a),c&&(S.WebkitLineClamp=c),m&&m.length>0){const r=1===m.length?m[0]:`linear-gradient(135deg, ${m.join(", ")})`;S.backgroundImage=r}return g&&(S.fontSize="number"==typeof g?`${g}px`:g),u&&(S.lineHeight="number"==typeof u?`${u}`:u),f&&(S.letterSpacing="number"==typeof f?`${f}px`:f),l.createElement(N,{ref:z,className:C,style:S,..._},j)});Fr.displayName="Text";const Dr=y(Fr);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 Er=({isOpen:n})=>n?r.jsx(R,{size:16}):r.jsx(I,{size:16}),Rr=i.default.forwardRef(({label:e,onClick:t,icon:a,rightIcon:o,disabled:i=!1,active:l=!1,variant:s="default",shortcut:c,divider:d=!1,items:x},v)=>{const[p,m]=n.useState(!1),h=n.useRef(null),g=x&&x.length>0,u=o||(g?r.jsx(Er,{isOpen:p}):null);return r.jsxs(r.Fragment,{children:[r.jsx("div",{ref:v||h,className:["vtx-menu-item",l&&"vtx-menu-item--active",i&&"vtx-menu-item--disabled","default"!==s&&`vtx-menu-item--${s}`,g&&"vtx-menu-item--has-submenu",p&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{i||(g?m(!p):t&&t())},onKeyDown:r=>{i||("Enter"===r.key||" "===r.key?(r.preventDefault(),g?m(!p):null==t||t()):"ArrowDown"===r.key&&g&&!p?(r.preventDefault(),m(!0)):"ArrowUp"===r.key&&g&&p&&(r.preventDefault(),m(!1)))},role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-haspopup":g?"menu":void 0,"aria-expanded":g?p:void 0,children:r.jsxs(Ar,{align:"center",gap:8,style:{flex:1},children:[a&&r.jsx("span",{className:"vtx-menu-item-icon",children:a}),r.jsx(Dr,{variant:"body2",noMargin:!0,style:{flex:1},children:e}),c&&r.jsx(Dr,{variant:"caption",color:"neutral.500",noMargin:!0,className:"vtx-menu-item-shortcut",children:c}),u&&r.jsx("span",{className:"vtx-menu-item-right-icon",children:u})]})}),g&&p&&r.jsx("div",{className:"vtx-submenu",role:"menu",children:x.map((n,e)=>r.jsx(Rr,{...n},e))}),d&&r.jsx("div",{className:"vtx-menu-divider",role:"separator"})]})});Rr.displayName="MenuItem";const Lr=i.default.forwardRef(({items:e,children:t,orientation:a="vertical",responsive:o=!0,className:i="",width:l},s)=>{const[c,d]=n.useState(!1),x=n.useRef(null);n.useEffect(()=>{if(!o||!c)return;const r=r=>{x.current&&!x.current.contains(r.target)&&d(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[o,c]),n.useEffect(()=>{if(!o||!c)return;const r=r=>{"Escape"===r.key&&d(!1)};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[o,c]);const v=e?e.map((n,e)=>r.jsx(Rr,{...n},e)):t,p=["vtx-menu",`vtx-menu--${a}`,o&&"vtx-menu--responsive",c&&"vtx-menu--mobile-open",i].filter(Boolean).join(" "),m={width:"vertical"===a&&l?"number"==typeof l?`${l}px`:l:void 0};return r.jsxs("div",{ref:x,className:"vtx-menu-container",children:[o&&r.jsx("button",{className:"vtx-menu-toggle",onClick:()=>d(!c),"aria-label":"Toggle menu","aria-expanded":c,children:c?r.jsx(nr,{size:24}):r.jsx(E,{size:24})}),r.jsx("div",{ref:s,className:p,role:"menu",style:m,children:v})]})});Lr.displayName="Menu";const Br=y(Lr);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 Or=i.default.forwardRef(({isOpen:e,onClose:a,title:o,description:i,children:l,header:s,footer:c,footerButtons:d,size:x,closeOnBackdropClick:v=!0,closeOnEscape:p=!0,showCloseButton:m=!0,transparentBackdrop:g=!1,className:u="",backdropClassName:f="",preventScroll:b=!0,animation:w="fade",onAfterOpen:y,onAfterClose:k,scrollable:j=!1,centered:z=!0},N)=>{const C=n.useRef(null),S=n.useRef(null),{theme:M}=h();let T="md";if(x?T=x:(null==M?void 0:M.defaultSize)&&(T=M.defaultSize),dr(C,e),vr(b&&e),xr(()=>{p&&e&&a()}),n.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",g&&"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}`,u].filter(Boolean).join(" "),A=r.jsx("div",{className:$,onClick:r=>{v&&r.target===r.currentTarget&&a()},role:"presentation",children:r.jsxs("div",{ref:r=>{C.current=r,"function"==typeof N?N(r):N&&(N.current=r)},className:I,role:"dialog","aria-modal":"true","aria-labelledby":o?"vtx-modal-title":void 0,"aria-describedby":i?"vtx-modal-description":void 0,children:[s?r.jsx("div",{className:"vtx-modal-header",children:s}):o||m?r.jsxs(Ar,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[o&&r.jsxs(Ar,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[r.jsx(Dr,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:o}),i&&r.jsx(Dr,{variant:"body2",color:"neutral.600",id:"vtx-modal-description",noMargin:!0,children:i})]}),m&&r.jsx(_,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:a,"aria-label":"Close modal",children:r.jsx(nr,{size:20})})]}):null,r.jsx(Ar,{direction:"column",className:"vtx-modal-body",children:l}),(c||d)&&r.jsx(Ar,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:d?d.map((n,e)=>r.jsx(_,{variant:n.variant||"secondary",size:n.size||(null==M?void 0:M.defaultSize)||"md",loading:n.loading,disabled:n.disabled,onClick:n.onClick,children:n.label},e)):c})]})});return t.createPortal(A,document.body)});Or.displayName="Modal";const Wr=y(Or);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 Pr={success:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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"})})},Vr=i.default.forwardRef(({children:e,onDismiss:t,id:a,variant:o="default",autoClose:l=5e3,closeButton:s=!0,progressBar:c=!0,pauseOnHover:d=!0,pauseOnFocusLoss:x=!0,icon:v,action:p,className:m="",style:h,title:g,description:u,animationDuration:f=300,isVisible:b,createdAt:w,onClose:y,onOpen:k,toastId:j,..._},z)=>{const[N,C]=n.useState(!1),[S,M]=n.useState(!1),[T,I]=n.useState(100),A=n.useRef(null),F=n.useRef(Date.now()),D=n.useRef(0),E=i.default.useCallback(()=>{C(!0),setTimeout(()=>{t()},f)},[t,f]);n.useEffect(()=>{if(!1===l||S)return;return A.current=setInterval(()=>{const r=Date.now()-F.current-D.current,n=Math.max(0,l-r);I(n/l*100),n<=0&&E()},16),()=>{A.current&&clearInterval(A.current)}},[l,S,E]);const R=["vtx-toast",`vtx-toast--${o}`,N&&"vtx-toast--exiting",m].filter(Boolean).join(" ");return r.jsxs("div",{ref:z,className:R,style:{...h,"--vtx-toast-animation-duration":`${f}ms`},onMouseEnter:()=>{d&&!S&&(M(!0),D.current=Date.now())},onMouseLeave:()=>{if(d&&S){M(!1);const r=Date.now()-D.current;F.current+=r}},onFocus:()=>{if(x&&S){M(!1);const r=Date.now()-D.current;F.current+=r}},onBlur:()=>{x&&!S&&(M(!0),D.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":a,..._,children:[r.jsxs("div",{className:"vtx-toast__wrapper",children:[!1===v?null:v?r.jsx("div",{className:"vtx-toast__icon",children:v}):r.jsx("div",{className:"vtx-toast__icon",children:Pr[o]}),g||u?r.jsxs("div",{className:"vtx-toast__content",children:[g&&r.jsx("div",{className:"vtx-toast__title",children:g}),u&&r.jsx("div",{className:"vtx-toast__description",children:u}),e&&r.jsx("div",{className:"vtx-toast__body",children:e})]}):r.jsx("div",{className:"vtx-toast__content",children:e}),r.jsxs("div",{className:"vtx-toast__actions",children:[p&&r.jsx("button",{className:"vtx-toast__action",onClick:p.onClick,type:"button",children:p.label}),s&&r.jsx("button",{className:"vtx-toast__close",onClick:E,type:"button","aria-label":"Close notification",children:r.jsx($,{size:16})})]})]}),c&&!1!==l&&r.jsx("div",{className:"vtx-toast__progress-container",children:r.jsx("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${T/100})`,animationPlayState:S?"paused":"running"}})})]})});Vr.displayName="Toast";const Hr=y(Vr),Yr=n.createContext(null),qr=()=>{const r=n.useContext(Yr);if(!r)throw new Error("useToast must be used within a ToastProvider");return r},Xr=({children:e})=>{const[t,a]=n.useState([]),o=n.useCallback(r=>{a(n=>{var e;const t=n.find(n=>n.id===r);return t&&(null===(e=t.onClose)||void 0===e||e.call(t)),n.filter(n=>n.id!==r)})},[]),i=n.useCallback((r,n={})=>{var e;const t=n.toastId||Date.now()+Math.random(),i={id:t,content:r,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...n};return a(r=>{const n=r.filter(r=>r.id!==t);return[i,...n]}),!1!==i.autoClose&&setTimeout(()=>{o(t)},i.autoClose),null===(e=n.onOpen)||void 0===e||e.call(n),t},[o]),l=n.useCallback(()=>{a([])},[]),s=n.useCallback((r,n)=>{a(e=>e.map(e=>e.id===r?{...e,...n}:e))},[]),c={toasts:t,addToast:i,removeToast:o,clearAllToasts:l,updateToast:s};return r.jsx(Yr.Provider,{value:c,children:e})};class Gr{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return Gr.instance||(Gr.instance=new Gr),Gr.instance}setMethods(r,n,e,t){this.addToastFn=r,this.removeToastFn=n,this.clearAllToastsFn=e,this.updateToastFn=t}show(r,n){return this.addToastFn?this.addToastFn(r,n):(console.warn("Toast system not initialized. Make sure ToastContainer is mounted."),"")}success(r,n){return this.show(r,{...n,variant:"success"})}error(r,n){return this.show(r,{...n,variant:"error"})}warning(r,n){return this.show(r,{...n,variant:"warning"})}info(r,n){return this.show(r,{...n,variant:"info"})}primary(r,n){return this.show(r,{...n,variant:"primary"})}dismiss(r){this.removeToastFn?this.removeToastFn(r):console.warn("Toast system not initialized.")}dismissAll(){this.clearAllToastsFn?this.clearAllToastsFn():console.warn("Toast system not initialized.")}update(r,n){this.updateToastFn?this.updateToastFn(r,n):console.warn("Toast system not initialized.")}}const Ur=Gr.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 Kr=({position:e="top-right",limit:a=5,gap:o=12,margin:i=16,className:l="",style:s,stacked:c=!0,theme:d="auto"})=>{const{toasts:x,removeToast:v,addToast:p,clearAllToasts:m,updateToast:h}=qr(),g=n.useRef(null);n.useEffect(()=>{Ur.setMethods(p,v,m,h)},[p,v,m,h]),n.useEffect(()=>{if("auto"===d){const r=window.matchMedia("(prefers-color-scheme: dark)"),n=()=>{document.documentElement.setAttribute("data-vtx-toast-theme",r.matches?"dark":"light")};return n(),r.addEventListener("change",n),()=>r.removeEventListener("change",n)}document.documentElement.setAttribute("data-vtx-toast-theme",d)},[d]);const u=x.slice(0,a),f=Math.max(0,x.length-a),b=["vtx-toast-container",`vtx-toast-container--${e}`,c&&"vtx-toast-container--stacked",l].filter(Boolean).join(" ");return 0===u.length?null:t.createPortal(r.jsxs("div",{ref:g,className:b,style:{...(r=>{const n={position:"fixed",zIndex:"var(--vtx-z-notification, 1400)",pointerEvents:"none"};switch(r){case"top-left":return{...n,top:i,left:i};case"top-center":return{...n,top:i,left:"50%",transform:"translateX(-50%)"};case"top-right":default:return{...n,top:i,right:i};case"bottom-left":return{...n,bottom:i,left:i};case"bottom-center":return{...n,bottom:i,left:"50%",transform:"translateX(-50%)"};case"bottom-right":return{...n,bottom:i,right:i}}})(e),"--vtx-toast-gap":`${o}px`,...s},"aria-live":"polite","aria-label":"Notifications",children:[f>0&&r.jsxs("div",{className:"vtx-toast-container__hidden-count",children:["+",f," more"]}),r.jsx("div",{className:"vtx-toast-container__list",children:u.map((n,e)=>r.jsx(Hr,{id:n.id,isVisible:n.isVisible,onDismiss:()=>v(n.id),variant:n.variant,autoClose:n.autoClose,closeButton:n.closeButton,progressBar:n.progressBar,pauseOnHover:n.pauseOnHover,pauseOnFocusLoss:n.pauseOnFocusLoss,icon:n.icon,action:n.action,className:n.className,style:n.style,title:n.title,description:n.description,animationDuration:n.animationDuration,createdAt:n.createdAt,onClose:n.onClose,onOpen:n.onOpen,"data-toast-index":e,children:n.content},n.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 Qr=i.default.forwardRef(({content:e,placement:a="top",delay:o=200,hideDelay:i=0,children:l,open:s,disabled:c=!1,arrow:d=!1,maxWidth:x="300px",variant:v="dark",dismissible:p=!1,onShow:m,onHide:h,onDismiss:g,className:u="",...f},b)=>{const[w,y]=n.useState(s||!1),[k,j]=n.useState(!1),[_,z]=n.useState({top:0,left:0}),N=n.useRef(null),C=n.useRef(null),S=n.useRef(null),M=n.useRef(null),T=n.useRef(!1),I=()=>{c||(T.current=!0,S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current),C.current=setTimeout(()=>{if(N.current&&T.current){const r=N.current.getBoundingClientRect(),n=F(r,a);z(n),j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0),null==m||m()})})}},o))},A=()=>{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)},F=(r,n)=>{const e=d?12:8;let t=0,a=0;return n.startsWith("top")?(t=r.top-e+window.scrollY,a=r.left+r.width/2+window.scrollX,"top-start"===n&&(a=r.left+window.scrollX),"top-end"===n&&(a=r.right+window.scrollX)):n.startsWith("bottom")?(t=r.bottom+e+window.scrollY,a=r.left+r.width/2+window.scrollX,"bottom-start"===n&&(a=r.left+window.scrollX),"bottom-end"===n&&(a=r.right+window.scrollX)):n.startsWith("left")?(t=r.top+r.height/2+window.scrollY,a=r.left-e+window.scrollX,"left-start"===n&&(t=r.top+window.scrollY),"left-end"===n&&(t=r.bottom+window.scrollY)):n.startsWith("right")&&(t=r.top+r.height/2+window.scrollY,a=r.right+e+window.scrollX,"right-start"===n&&(t=r.top+window.scrollY),"right-end"===n&&(t=r.bottom+window.scrollY)),{top:t,left:a}};n.useEffect(()=>{void 0!==s&&(s?(j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0)})})):(y(!1),M.current=setTimeout(()=>{j(!1)},150)))},[s]),n.useEffect(()=>()=>{C.current&&clearTimeout(C.current),S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current)},[]);const D=["vtx-tooltip",`vtx-tooltip--${a}`,`vtx-tooltip--${v}`,d&&"vtx-tooltip--with-arrow",w&&"vtx-tooltip--visible",u].filter(Boolean).join(" "),E=void 0!==s&&s||k,R=n.cloneElement(l,{ref:r=>{N.current=r;const n=l.ref;"function"==typeof n?n(r):n&&"object"==typeof n&&"current"in n&&(n.current=r)},onMouseEnter:r=>{var n,e;void 0===s&&I(),null===(e=(n=l.props).onMouseEnter)||void 0===e||e.call(n,r)},onMouseLeave:r=>{var n,e;void 0===s&&A(),null===(e=(n=l.props).onMouseLeave)||void 0===e||e.call(n,r)},onFocus:r=>{var n,e;void 0===s&&I(),null===(e=(n=l.props).onFocus)||void 0===e||e.call(n,r)},onBlur:r=>{var n,e;void 0===s&&A(),null===(e=(n=l.props).onBlur)||void 0===e||e.call(n,r)},"aria-describedby":w?"vtx-tooltip-content":void 0});return r.jsxs(r.Fragment,{children:[R,E&&t.createPortal(r.jsxs("div",{ref:b,id:"vtx-tooltip-content",role:"tooltip",className:D,style:{top:`${_.top}px`,left:`${_.left}px`,maxWidth:x},onMouseEnter:()=>{c||void 0!==s||(T.current=!0,S.current&&clearTimeout(S.current))},onMouseLeave:()=>{c||void 0!==s||A()},...f,children:[d&&r.jsx("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),r.jsxs("div",{className:"vtx-tooltip-inner",children:[r.jsx("span",{className:"vtx-tooltip-content",children:e}),p&&r.jsx("button",{type:"button",className:"vtx-tooltip-close",onClick:()=>{T.current=!1,y(!1),null==g||g(),null==h||h(),M.current=setTimeout(()=>{j(!1)},150)},"aria-label":"Dismiss tooltip",children:r.jsx($,{size:14})})]})]}),document.body)]})});Qr.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 Zr=i.default.forwardRef(({src:e,alt:t="",size:a,shape:o="circle",fallback:i="?",onImageError:l,onImageLoad:s,imgProps:c,statusIndicator:d,statusPosition:x="bottom-right",className:v="",...p},m)=>{const{theme:g}=h(),u=a||g.defaultSize||"md",[f,b]=n.useState(!1),w=["vtx-avatar",`vtx-avatar--${u}`,`vtx-avatar--${o}`,d&&"vtx-avatar--with-status",v].filter(Boolean).join(" "),y=e&&!f,k=i.slice(0,2).toUpperCase();return r.jsxs("div",{ref:m,className:w,role:"img","aria-label":t||i||"Avatar",...p,children:[y?r.jsx("img",{src:e,alt:t,className:"vtx-avatar-image",onError:r=>{b(!0),null==l||l(r)},onLoad:r=>{null==s||s(r)},loading:"lazy",...c}):r.jsx("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),d&&r.jsx("span",{className:`vtx-avatar-status vtx-avatar-status--${x}`,"aria-label":"Status indicator",children:d})]})});Zr.displayName="Avatar";const Jr=y(Zr);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--sm {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-xs);\n}\n\n.vtx-badge--md {\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--lg {\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 rn=i.default.forwardRef(({variant:e="neutral",size:t,pill:a=!1,dot:o=!1,outline:i=!1,maxLength:l,icon:s,children:c,className:d="",onRemove:x,...v},p)=>{const{theme:m}=h(),g=["vtx-badge",`vtx-badge--${e}`,`vtx-badge--${t||m.defaultSize}`,a&&"vtx-badge--pill",o&&"vtx-badge--with-dot",i&&"vtx-badge--outline",x&&"vtx-badge--removable",d].filter(Boolean).join(" "),u=n.useMemo(()=>l&&"string"==typeof c&&c.length>l?`${c.slice(0,l)}...`:c,[c,l]);return r.jsxs("span",{ref:p,className:g,...v,children:[o&&r.jsx("span",{className:"vtx-badge-dot","aria-hidden":"true"}),s&&r.jsx("span",{className:"vtx-badge-icon","aria-hidden":"true",children:s}),r.jsx("span",{className:"vtx-badge-content",children:u}),x&&r.jsx("button",{type:"button",className:"vtx-badge-remove",onClick:x,"aria-label":"Remove badge",children:r.jsx($,{})})]})});rn.displayName="Badge";const nn=y(rn);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 en=i.default.forwardRef(({children:n,variant:e="elevated",size:t,noPadding:a=!1,padding:o,hoverable:i=!1,clickable:l=!1,className:s="",header:c,footer:d,divider:x=!1,style:v,onClick:p,tabIndex:m,...g},u)=>{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":"",s].filter(Boolean).join(" "),w={...v||{},...o?{"--vtx-card-padding":o}:{}},y=l?"number"==typeof m?m:0:m;return r.jsxs("div",{ref:u,className:b,style:w,onClick:p,tabIndex:y,...g,children:[c&&r.jsx("div",{className:"vtx-card-header"+(x?" vtx-card-header--divider":""),children:c}),r.jsx("div",{className:"vtx-card-content",children:n}),d&&r.jsx("div",{className:"vtx-card-footer"+(x?" vtx-card-footer--divider":""),children:d})]})});en.displayName="Card";const tn=y(en);k('/* ==========================================\r\n   DataGrid - Professional MUI-inspired Design\r\n   ========================================== */\r\n\r\n.vertex-datagrid {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n  border: 1px solid rgba(224, 224, 224, 1);\r\n  border-radius: 4px;\r\n  background: #fff;\r\n  overflow: hidden;\r\n  font-family: "Roboto", "Helvetica", "Arial", sans-serif;\r\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vertex-datagrid--auto-height {\r\n  height: auto;\r\n}\r\n\r\n/* ==========================================\r\n   Density Variants\r\n   ========================================== */\r\n\r\n.vertex-datagrid--compact .vertex-datagrid-th,\r\n.vertex-datagrid--compact .vertex-datagrid-td {\r\n  padding: 4px 16px;\r\n  font-size: 0.8125rem;\r\n}\r\n\r\n.vertex-datagrid--standard .vertex-datagrid-th,\r\n.vertex-datagrid--standard .vertex-datagrid-td {\r\n  padding: 8px 16px;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vertex-datagrid--comfortable .vertex-datagrid-th,\r\n.vertex-datagrid--comfortable .vertex-datagrid-td {\r\n  padding: 12px 20px;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n/* ==========================================\r\n   Size Variants\r\n   ========================================== */\r\n\r\n.vertex-datagrid--sm .vertex-datagrid-th,\r\n.vertex-datagrid--sm .vertex-datagrid-td {\r\n  font-size: 0.75rem;\r\n}\r\n\r\n.vertex-datagrid--md .vertex-datagrid-th,\r\n.vertex-datagrid--md .vertex-datagrid-td {\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vertex-datagrid--lg .vertex-datagrid-th,\r\n.vertex-datagrid--lg .vertex-datagrid-td {\r\n  font-size: 1rem;\r\n}\r\n\r\n/* ==========================================\r\n   Table Container\r\n   ========================================== */\r\n\r\n.vertex-datagrid-container {\r\n  overflow: auto;\r\n  flex: 1;\r\n  background: #fff;\r\n}\r\n\r\n.vertex-datagrid-table {\r\n  width: 100%;\r\n  border-collapse: collapse;\r\n  border-spacing: 0;\r\n}\r\n\r\n/* ==========================================\r\n   Table Header\r\n   ========================================== */\r\n\r\n.vertex-datagrid-thead {\r\n  background: #fafafa;\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n}\r\n\r\n.vertex-datagrid-th {\r\n  text-align: left;\r\n  font-weight: 600;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  user-select: none;\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n  position: sticky;\r\n  top: 0;\r\n  background: #fafafa;\r\n  z-index: 100;\r\n}\r\n\r\n.vertex-datagrid-th-content {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 4px;\r\n  min-height: 40px;\r\n}\r\n\r\n.vertex-datagrid-th-label {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  flex: 1;\r\n  cursor: default;\r\n  transition: color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th--sortable .vertex-datagrid-th-label {\r\n  cursor: pointer;\r\n}\r\n\r\n.vertex-datagrid-th--sortable:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-th-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 600;\r\n  line-height: 1.5rem;\r\n  letter-spacing: 0.01071em;\r\n}\r\n\r\n.vertex-datagrid-sort-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  color: rgba(0, 0, 0, 0.26);\r\n  transition: color 0.2s, opacity 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th--sortable .vertex-datagrid-sort-icon {\r\n  opacity: 0;\r\n}\r\n\r\n.vertex-datagrid-th--sortable:hover .vertex-datagrid-sort-icon {\r\n  opacity: 1;\r\n}\r\n\r\n.vertex-datagrid-sort-icon--active {\r\n  opacity: 1 !important;\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n/* ==========================================\r\n   Column Menu Button\r\n   ========================================== */\r\n\r\n.vertex-datagrid-column-menu-btn {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 24px;\r\n  height: 24px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  opacity: 0;\r\n  transition: opacity 0.2s, background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th:hover .vertex-datagrid-column-menu-btn {\r\n  opacity: 1;\r\n}\r\n\r\n.vertex-datagrid-column-menu-btn:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-column-menu-btn--filtered {\r\n  opacity: 1;\r\n  color: #1976d2;\r\n}\r\n\r\n.vertex-datagrid-filter-badge {\r\n  position: absolute;\r\n  top: 2px;\r\n  right: 2px;\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 50%;\r\n  background: #1976d2;\r\n}\r\n\r\n/* ==========================================\r\n   Column Menu Dropdown\r\n   ========================================== */\r\n\r\n.vertex-datagrid-column-menu {\r\n  min-width: 200px;\r\n  background: #fff;\r\n  border-radius: 4px;\r\n  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2), \r\n              0px 8px 10px 1px rgba(0,0,0,0.14), \r\n              0px 3px 14px 2px rgba(0,0,0,0.12);\r\n  padding: 8px 0;\r\n}\r\n\r\n.vertex-datagrid-column-menu-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  width: 100%;\r\n  padding: 8px 16px;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  text-align: left;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  position: relative;\r\n}\r\n\r\n.vertex-datagrid-column-menu-item:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-column-menu-item svg {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vertex-datagrid-column-menu-divider {\r\n  height: 1px;\r\n  margin: 8px 0;\r\n  background: rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.vertex-datagrid-menu-check {\r\n  margin-left: auto;\r\n  color: #1976d2;\r\n  font-weight: 600;\r\n}\r\n\r\n.vertex-datagrid-menu-badge {\r\n  margin-left: auto;\r\n  color: #1976d2;\r\n  font-size: 1.2rem;\r\n}\r\n\r\n/* ==========================================\r\n   Filter Panel Overlay\r\n   ========================================== */\r\n\r\n.vertex-datagrid-filter-panel-overlay {\r\n  position: fixed;\r\n  inset: 0;\r\n  background: rgba(0, 0, 0, 0.2);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1400;\r\n  backdrop-filter: blur(2px);\r\n}\r\n\r\n.vertex-datagrid-filter-panel {\r\n  width: 90%;\r\n  max-width: 600px;\r\n  max-height: 80vh;\r\n  background: #fff;\r\n  border-radius: 8px;\r\n  box-shadow: 0px 11px 15px -7px rgba(0,0,0,0.2), \r\n              0px 24px 38px 3px rgba(0,0,0,0.14), \r\n              0px 9px 46px 8px rgba(0,0,0,0.12);\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow: hidden;\r\n}\r\n\r\n.vertex-datagrid-filter-panel-header {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 16px 20px;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.vertex-datagrid-filter-close {\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  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-close:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-filter-panel-body {\r\n  flex: 1;\r\n  padding: 20px;\r\n  overflow-y: auto;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 16px;\r\n}\r\n\r\n.vertex-datagrid-filter-empty {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 16px;\r\n  padding: 40px 20px;\r\n  text-align: center;\r\n  color: rgba(0, 0, 0, 0.38);\r\n}\r\n\r\n.vertex-datagrid-filter-row {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n}\r\n\r\n.vertex-datagrid-filter-logic-btn {\r\n  align-self: flex-start;\r\n  padding: 4px 12px;\r\n  border: 1px solid #1976d2;\r\n  background: transparent;\r\n  color: #1976d2;\r\n  font-size: 0.75rem;\r\n  font-weight: 600;\r\n  border-radius: 16px;\r\n  cursor: pointer;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-logic-btn:hover {\r\n  background: rgba(25, 118, 210, 0.04);\r\n}\r\n\r\n.vertex-datagrid-filter-controls {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr 1fr auto;\r\n  gap: 8px;\r\n  align-items: start;\r\n}\r\n\r\n.vertex-datagrid-filter-select {\r\n  padding: 8px 12px;\r\n  border: 1px solid rgba(0, 0, 0, 0.23);\r\n  border-radius: 4px;\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  background: #fff;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  cursor: pointer;\r\n  transition: border-color 0.2s, box-shadow 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-select:hover {\r\n  border-color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-filter-select:focus {\r\n  outline: none;\r\n  border-color: #1976d2;\r\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.2);\r\n}\r\n\r\n.vertex-datagrid-filter-remove {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 36px;\r\n  height: 36px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-remove:hover {\r\n  background: rgba(211, 47, 47, 0.04);\r\n  color: #d32f2f;\r\n}\r\n\r\n.vertex-datagrid-filter-actions {\r\n  display: flex;\r\n  gap: 8px;\r\n  padding-top: 8px;\r\n}\r\n\r\n.vertex-datagrid-filter-panel-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-end;\r\n  padding: 12px 20px;\r\n  border-top: 1px solid rgba(0, 0, 0, 0.12);\r\n  gap: 12px;\r\n}\r\n\r\n/* ==========================================\r\n   Table Body\r\n   ========================================== */\r\n\r\n.vertex-datagrid-tbody {\r\n  background: #fff;\r\n}\r\n\r\n.vertex-datagrid-row {\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n  transition: background 0.15s;\r\n}\r\n\r\n.vertex-datagrid-row:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-row--selected {\r\n  background: rgba(25, 118, 210, 0.08);\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover {\r\n  background: rgba(25, 118, 210, 0.12);\r\n}\r\n\r\n.vertex-datagrid-td {\r\n  color: rgba(0, 0, 0, 0.87);\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n}\r\n\r\n.vertex-datagrid-checkbox-cell {\r\n  width: 58px;\r\n  padding-left: 16px !important;\r\n  padding-right: 0 !important;\r\n  position: sticky !important;\r\n  left: 0 !important;\r\n  z-index: 102 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-tbody .vertex-datagrid-checkbox-cell {\r\n  background: #fff !important;\r\n  z-index: 101 !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-checkbox-cell {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-checkbox-cell {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-checkbox-cell {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n/* ==========================================\r\n   Pinned/Frozen Columns\r\n   ========================================== */\r\n\r\n.vertex-datagrid-th--pinned-left,\r\n.vertex-datagrid-td--pinned-left {\r\n  position: sticky !important;\r\n  z-index: 100 !important;\r\n  box-shadow: 2px 0 5px -1px rgba(0, 0, 0, 0.15) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-left {\r\n  z-index: 101 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-td--pinned-left {\r\n  background: #fff !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-td--pinned-left {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-td--pinned-left {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-td--pinned-left {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-right,\r\n.vertex-datagrid-td--pinned-right {\r\n  position: sticky !important;\r\n  z-index: 100 !important;\r\n  box-shadow: -2px 0 5px -1px rgba(0, 0, 0, 0.15) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-right {\r\n  z-index: 101 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-td--pinned-right {\r\n  background: #fff !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-td--pinned-right {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-td--pinned-right {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-td--pinned-right {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n/* ==========================================\r\n   Loading & Empty States\r\n   ========================================== */\r\n\r\n.vertex-datagrid-loading,\r\n.vertex-datagrid-empty {\r\n  padding: 0;\r\n  text-align: center;\r\n  border: none;\r\n}\r\n\r\n.vertex-datagrid-loading-content,\r\n.vertex-datagrid-empty-content {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 16px;\r\n  padding: 64px 24px;\r\n  color: rgba(0, 0, 0, 0.38);\r\n}\r\n\r\n.vertex-datagrid-spinner {\r\n  width: 40px;\r\n  height: 40px;\r\n  border: 3px solid rgba(25, 118, 210, 0.1);\r\n  border-top-color: #1976d2;\r\n  border-radius: 50%;\r\n  animation: vertex-spinner-rotate 0.8s linear infinite;\r\n}\r\n\r\n@keyframes vertex-spinner-rotate {\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/* ==========================================\r\n   Footer / Pagination\r\n   ========================================== */\r\n\r\n.vertex-datagrid-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  min-height: 52px;\r\n  padding: 0 16px;\r\n  border-top: 1px solid rgba(224, 224, 224, 1);\r\n  background: #fff;\r\n  gap: 16px;\r\n}\r\n\r\n.vertex-datagrid-footer-left,\r\n.vertex-datagrid-footer-center,\r\n.vertex-datagrid-footer-right {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n}\r\n\r\n.vertex-datagrid-footer-center {\r\n  flex: 1;\r\n  justify-content: center;\r\n}\r\n\r\n.vertex-datagrid-filter-chip {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  padding: 4px 12px;\r\n  border: 1px solid #1976d2;\r\n  background: rgba(25, 118, 210, 0.08);\r\n  color: #1976d2;\r\n  font-size: 0.8125rem;\r\n  font-weight: 500;\r\n  border-radius: 16px;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-chip:hover {\r\n  background: rgba(25, 118, 210, 0.16);\r\n}\r\n\r\n.vertex-datagrid-pagesize-label {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: default;\r\n}\r\n\r\n.vertex-datagrid-pagesize-select {\r\n  padding: 4px 28px 4px 8px;\r\n  border: 1px solid rgba(0, 0, 0, 0.23);\r\n  border-radius: 4px;\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  background: #fff url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="rgba(0,0,0,0.54)" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>\') no-repeat right 4px center;\r\n  background-size: 16px;\r\n  cursor: pointer;\r\n  appearance: none;\r\n  transition: border-color 0.2s;\r\n  min-width: 70px;\r\n}\r\n\r\n.vertex-datagrid-pagesize-select:hover {\r\n  border-color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-pagesize-select:focus {\r\n  outline: none;\r\n  border-color: #1976d2;\r\n}\r\n\r\n.vertex-datagrid-pagination {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n}\r\n\r\n.vertex-datagrid-pagination-btn {\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  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-pagination-btn:hover:not(:disabled) {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-pagination-btn:disabled {\r\n  color: rgba(0, 0, 0, 0.26);\r\n  cursor: default;\r\n}\r\n\r\n/* ==========================================\r\n   Scrollbar Styling\r\n   ========================================== */\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar {\r\n  width: 12px;\r\n  height: 12px;\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-track {\r\n  background: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-thumb {\r\n  background: rgba(0, 0, 0, 0.2);\r\n  border-radius: 6px;\r\n  border: 2px solid transparent;\r\n  background-clip: padding-box;\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-thumb:hover {\r\n  background: rgba(0, 0, 0, 0.3);\r\n  background-clip: padding-box;\r\n}\r\n\r\n/* ==========================================\r\n   Responsive\r\n   ========================================== */\r\n\r\n@media (max-width: 768px) {\r\n  .vertex-datagrid-footer {\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n  }\r\n  \r\n  .vertex-datagrid-footer-left,\r\n  .vertex-datagrid-footer-center,\r\n  .vertex-datagrid-footer-right {\r\n    width: 100%;\r\n    justify-content: center;\r\n  }\r\n  \r\n  .vertex-datagrid-filter-controls {\r\n    grid-template-columns: 1fr;\r\n  }\r\n  \r\n  .vertex-datagrid-filter-panel {\r\n    width: 95%;\r\n    max-height: 90vh;\r\n  }\r\n}\r\n');const an=(r="string")=>{switch(r){case"number":return[{label:"=",value:"=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)===n}},{label:"!=",value:"!=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)!==n}},{label:">",value:">",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)>n}},{label:">=",value:">=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)>=n}},{label:"<",value:"<",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)<n}},{label:"<=",value:"<=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)<=n}},{label:"is empty",value:"isEmpty",getApplyFilterFn:()=>r=>null==r||""===r},{label:"is not empty",value:"isNotEmpty",getApplyFilterFn:()=>r=>null!=r&&""!==r}];case"boolean":return[{label:"is",value:"is",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n="true"===r.value;return r=>Boolean(r)===n}}];case"date":return[{label:"is",value:"is",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value).toDateString();return r=>!!r&&new Date(r).toDateString()===n}},{label:"after",value:"after",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value);return r=>!!r&&new Date(r)>n}},{label:"before",value:"before",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value);return r=>!!r&&new Date(r)<n}}];default:return[{label:"contains",value:"contains",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().includes(r.value.toLowerCase()):()=>!0},{label:"equals",value:"equals",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase()===r.value.toLowerCase():()=>!0},{label:"starts with",value:"startsWith",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().startsWith(r.value.toLowerCase()):()=>!0},{label:"ends with",value:"endsWith",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().endsWith(r.value.toLowerCase()):()=>!0},{label:"is empty",value:"isEmpty",getApplyFilterFn:()=>r=>null==r||""===String(r).trim()},{label:"is not empty",value:"isNotEmpty",getApplyFilterFn:()=>r=>null!=r&&""!==String(r).trim()}]}},on=({column:e,anchorEl:t,onClose:a,onSort:o,onFilter:i,currentSort:l,hasFilter:s})=>{const c=n.useRef(null);if(n.useEffect(()=>{const r=r=>{c.current&&!c.current.contains(r.target)&&t&&!t.contains(r.target)&&a()};return t&&document.addEventListener("mousedown",r),()=>{document.removeEventListener("mousedown",r)}},[t,a]),!t)return null;const d=t.getBoundingClientRect();return r.jsxs("div",{ref:c,className:"vertex-datagrid-column-menu",style:{position:"fixed",top:d.bottom+4,left:d.left,zIndex:1300},children:[e.sortable&&r.jsxs(r.Fragment,{children:[r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o("asc"),a()},children:[r.jsx(ir,{size:16}),r.jsx("span",{children:"Sort ascending"}),"asc"===l&&r.jsx("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o("desc"),a()},children:[r.jsx(lr,{size:16}),r.jsx("span",{children:"Sort descending"}),"desc"===l&&r.jsx("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),l&&r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o(null),a()},children:[r.jsx("span",{style:{width:16}}),r.jsx("span",{children:"Unsort"})]}),e.filterable&&r.jsx("div",{className:"vertex-datagrid-column-menu-divider"})]}),e.filterable&&r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{i(),a()},children:[r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsx("span",{children:s?"Edit filter":"Filter"}),s&&r.jsx("span",{className:"vertex-datagrid-menu-badge",children:"●"})]})]})},ln=({columns:e,filterModel:t,onFilterModelChange:a,onClose:o,targetColumn:i})=>{const l=e.filter(r=>!1!==r.filterable),s=n.useRef(null);n.useEffect(()=>{const r=r=>{s.current&&!s.current.contains(r.target)&&o()};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[o]),n.useEffect(()=>{i&&0===t.items.length&&c(i)},[i]);const c=r=>{var n,o;const i=r||(null===(n=l[0])||void 0===n?void 0:n.field)||"",s=e.find(r=>r.field===i),c=(null==s?void 0:s.filterOperators)||an(null==s?void 0:s.type),d={id:Date.now(),field:i,operator:(null===(o=c[0])||void 0===o?void 0:o.value)||"contains",value:""};a({...t,items:[...t.items,d]})},d=(r,n)=>{var o;const i=[...t.items],l=i[r];if(i[r]={...l,...n},n.field&&n.field!==l.field){const t=e.find(r=>r.field===n.field),a=(null==t?void 0:t.filterOperators)||an(null==t?void 0:t.type);i[r].operator=(null===(o=a[0])||void 0===o?void 0:o.value)||"contains"}a({...t,items:i})},x=()=>{a({...t,logicOperator:"and"===t.logicOperator?"or":"and"})};return r.jsx("div",{className:"vertex-datagrid-filter-panel-overlay",children:r.jsxs("div",{ref:s,className:"vertex-datagrid-filter-panel",children:[r.jsxs("div",{className:"vertex-datagrid-filter-panel-header",children:[r.jsx(Dr,{weight:"semibold",size:"sm",children:"Filters"}),r.jsx("button",{className:"vertex-datagrid-filter-close",onClick:o,children:r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),r.jsx("div",{className:"vertex-datagrid-filter-panel-body",children:0===t.items.length?r.jsxs("div",{className:"vertex-datagrid-filter-empty",children:[r.jsx("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsx(Dr,{size:"sm",color:"secondary",children:"No filters applied"}),r.jsx(_,{variant:"outline",size:"sm",onClick:()=>c(),children:"Add filter"})]}):r.jsxs(r.Fragment,{children:[t.items.map((n,o)=>{var i;const s=e.find(r=>r.field===n.field),c=(null==s?void 0:s.filterOperators)||an(null==s?void 0:s.type),v=!["isEmpty","isNotEmpty"].includes(n.operator);return r.jsxs("div",{className:"vertex-datagrid-filter-row",children:[o>0&&r.jsx("button",{className:"vertex-datagrid-filter-logic-btn",onClick:x,title:"Toggle AND/OR",children:(null===(i=t.logicOperator)||void 0===i?void 0:i.toUpperCase())||"OR"}),r.jsxs("div",{className:"vertex-datagrid-filter-controls",children:[r.jsx("select",{value:n.field,onChange:r=>d(o,{field:r.target.value}),className:"vertex-datagrid-filter-select",children:l.map(n=>r.jsx("option",{value:n.field,children:n.headerName},n.field))}),r.jsx("select",{value:n.operator,onChange:r=>d(o,{operator:r.target.value}),className:"vertex-datagrid-filter-select",children:c.map(n=>r.jsx("option",{value:n.value,children:n.label},n.value))}),v&&r.jsx(gr,{value:n.value||"",onChange:r=>d(o,{value:r.target.value}),placeholder:"Value",size:"sm"}),r.jsx("button",{className:"vertex-datagrid-filter-remove",onClick:()=>(r=>{const n=t.items.filter((n,e)=>e!==r);a({...t,items:n})})(o),title:"Remove filter",children:r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]})]},n.id||o)}),r.jsx("div",{className:"vertex-datagrid-filter-actions",children:r.jsx(_,{variant:"ghost",size:"sm",onClick:()=>c(),children:"+ Add filter"})})]})}),t.items.length>0&&r.jsx("div",{className:"vertex-datagrid-filter-panel-footer",children:r.jsx(_,{variant:"ghost",size:"sm",onClick:()=>a({items:[],logicOperator:"or"}),children:"Clear all"})})]})})},sn=({columns:e,rows:t,getRowId:a=(r,n)=>{var e;return null!==(e=r.id)&&void 0!==e?e:n},filterModel:o,onFilterModelChange:i,initialState:l,disableColumnFilter:s=!1,ignoreDiacritics:c=!1,sortModel:d,onSortModelChange:x,checkboxSelection:v=!1,rowSelectionModel:p,onRowSelectionModelChange:m,pagination:g=!0,pageSize:u=10,pageSizeOptions:f=[5,10,25,50,100],loading:b=!1,autoHeight:w=!1,density:y="standard",disableColumnMenu:k=!1,hideFooter:j=!1,size:_,className:z,...C})=>{var S,M;const{theme:T}=h(),$=_||T.defaultSize,[I,A]=n.useState((null===(S=null==l?void 0:l.filter)||void 0===S?void 0:S.filterModel)||{items:[],logicOperator:"or"}),[F,D]=n.useState([]),[E,R]=n.useState([]),[L,B]=n.useState(0),[O,W]=n.useState(u),[P,V]=n.useState(!1),[H,Y]=n.useState(null),[q,X]=n.useState(),G=null!=o?o:I,U=null!=d?d:F,K=null!=p?p:E,Q=n.useCallback(r=>{i?i(r):A(r)},[i]),Z=n.useCallback(r=>{x?x(r):D(r)},[x]),J=n.useCallback(r=>{m?m(r):R(r)},[m]),rr=n.useMemo(()=>s||0===G.items.length?t:t.filter(r=>{const n=G.items.map(n=>{const t=e.find(r=>r.field===n.field);if(!t)return!0;const a=t.valueGetter?t.valueGetter(r):r[n.field],o=(t.filterOperators||an(t.type)).find(r=>r.value===n.operator);if(!o)return!0;return o.getApplyFilterFn(n)(a)});return"and"===G.logicOperator?n.every(r=>r):n.some(r=>r)}),[t,G,e,s]),nr=n.useMemo(()=>{if(0===U.length)return rr;const r=[...rr],n=U[0],t=e.find(r=>r.field===n.field);return t?(r.sort((r,e)=>{const a=t.valueGetter?t.valueGetter(r):r[n.field],o=t.valueGetter?t.valueGetter(e):e[n.field];if(null==a&&null==o)return 0;if(null==a)return 1;if(null==o)return-1;let i=0;return i="number"===t.type?Number(a)-Number(o):"date"===t.type?new Date(a).getTime()-new Date(o).getTime():String(a).localeCompare(String(o)),"asc"===n.sort?i:-i}),r):r},[rr,U,e]),er=n.useMemo(()=>{if(!g)return nr;const r=L*O,n=r+O;return nr.slice(r,n)},[nr,L,O,g]),tr=n.useCallback((r,n)=>{if(!r.sortable)return;let e;e=null===n?[]:[{field:r.field,sort:n}],Z(e)},[Z]),ar=n.useCallback(r=>{const n=K.includes(r)?K.filter(n=>n!==r):[...K,r];J(n)},[K,J]),or=n.useCallback(()=>{if(K.length===er.length)J([]);else{const r=er.map((r,n)=>a(r,n));J(r)}},[K,er,J,a]),sr=Math.ceil(nr.length/O),cr=G.items.length>0,dr=`vertex-datagrid--${y}`,xr=`vertex-datagrid--${$}`,vr=(r,n,t=!1)=>{if(!r.pinned)return{};const a={position:"sticky",zIndex:t?101:100,background:t?"#fafafa":"inherit"};if("left"===r.pinned){let r=v?58:0;for(let t=0;t<n;t++)"left"===e[t].pinned&&(r+=e[t].width||150);a.left=r}else if("right"===r.pinned){let n=0;for(let t=e.indexOf(r)+1;t<e.length;t++)"right"===e[t].pinned&&(n+=e[t].width||150);a.right=n}return a};return r.jsxs("div",{className:`vertex-datagrid ${dr} ${xr} ${w?"vertex-datagrid--auto-height":""} ${z||""}`,...C,children:[r.jsx("div",{className:"vertex-datagrid-container",children:r.jsxs("table",{className:"vertex-datagrid-table",children:[r.jsx("thead",{className:"vertex-datagrid-thead",children:r.jsxs("tr",{children:[v&&r.jsx("th",{className:"vertex-datagrid-th vertex-datagrid-checkbox-cell",children:r.jsx(N,{checked:K.length===er.length&&er.length>0,indeterminate:K.length>0&&K.length<er.length,onChange:or})}),e.map((n,e)=>{const t=U.find(r=>r.field===n.field),a=!!t,o=null==t?void 0:t.sort,i=G.items.some(r=>r.field===n.field),l=vr(n,e,!0);return r.jsx("th",{className:`vertex-datagrid-th ${n.sortable?"vertex-datagrid-th--sortable":""} ${n.pinned?`vertex-datagrid-th--pinned-${n.pinned}`:""}`,style:{width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth,textAlign:n.headerAlign||n.align||"left",flex:n.flex,...l},children:r.jsxs("div",{className:"vertex-datagrid-th-content",children:[r.jsxs("div",{className:"vertex-datagrid-th-label",onClick:()=>n.sortable&&tr(n,a?"asc"===o?"desc":null:"asc"),children:[r.jsx("span",{className:"vertex-datagrid-th-text",children:n.headerName}),n.sortable&&r.jsx("div",{className:"vertex-datagrid-sort-icon "+(a?"vertex-datagrid-sort-icon--active":""),children:a?"asc"===o?r.jsx(ir,{size:18}):r.jsx(lr,{size:18}):r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",opacity:"0.4",children:r.jsx("path",{d:"M12 5v14M5 12l7 7 7-7"})})})]}),!k&&(n.sortable||n.filterable)&&r.jsxs("button",{className:"vertex-datagrid-column-menu-btn "+(i?"vertex-datagrid-column-menu-btn--filtered":""),onClick:r=>{r.stopPropagation(),Y({column:n,anchorEl:r.currentTarget})},title:"Column options",children:[r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"currentColor",children:[r.jsx("circle",{cx:"12",cy:"5",r:"2"}),r.jsx("circle",{cx:"12",cy:"12",r:"2"}),r.jsx("circle",{cx:"12",cy:"19",r:"2"})]}),i&&r.jsx("span",{className:"vertex-datagrid-filter-badge"})]})]})},n.field)})]})}),r.jsx("tbody",{className:"vertex-datagrid-tbody",children:b?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(v?1:0),className:"vertex-datagrid-loading",children:r.jsxs("div",{className:"vertex-datagrid-loading-content",children:[r.jsx("div",{className:"vertex-datagrid-spinner"}),r.jsx(Dr,{size:"sm",color:"secondary",children:"Loading..."})]})})}):0===er.length?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(v?1:0),className:"vertex-datagrid-empty",children:r.jsxs("div",{className:"vertex-datagrid-empty-content",children:[r.jsxs("svg",{width:"64",height:"64",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1",opacity:"0.3",children:[r.jsx("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2"}),r.jsx("line",{x1:"3",y1:"9",x2:"21",y2:"9"}),r.jsx("line",{x1:"9",y1:"21",x2:"9",y2:"9"})]}),r.jsx(Dr,{size:"sm",color:"secondary",children:"No rows"})]})})}):er.map((n,t)=>{const o=a(n,t),i=K.includes(o);return r.jsxs("tr",{className:"vertex-datagrid-row "+(i?"vertex-datagrid-row--selected":""),children:[v&&r.jsx("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r.jsx(N,{checked:i,onChange:()=>ar(o)})}),e.map((e,t)=>{const a=e.valueGetter?e.valueGetter(n):n[e.field],o=e.valueFormatter?e.valueFormatter(a):a,i=e.renderCell?e.renderCell({row:n,value:a,field:e.field}):o,l=vr(e,t,!1);return r.jsx("td",{className:"vertex-datagrid-td "+(e.pinned?`vertex-datagrid-td--pinned-${e.pinned}`:""),style:{textAlign:e.align||"left",...l},children:i},e.field)})]},o)})})]})}),!j&&g&&r.jsxs("div",{className:"vertex-datagrid-footer",children:[r.jsx("div",{className:"vertex-datagrid-footer-left",children:cr&&r.jsxs("button",{className:"vertex-datagrid-filter-chip",onClick:()=>V(!0),children:[r.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsxs("span",{children:[G.items.length," ",1===G.items.length?"filter":"filters"]})]})}),r.jsx("div",{className:"vertex-datagrid-footer-center",children:r.jsx(Dr,{size:"sm",color:"secondary",children:0===nr.length?"0 rows":`${L*O+1}–${Math.min((L+1)*O,nr.length)} of ${nr.length}`})}),r.jsxs("div",{className:"vertex-datagrid-footer-right",children:[r.jsxs("label",{className:"vertex-datagrid-pagesize-label",children:[r.jsx(Dr,{size:"sm",color:"secondary",children:"Rows per page:"}),r.jsx("select",{value:O,onChange:r=>{W(Number(r.target.value)),B(0)},className:"vertex-datagrid-pagesize-select",children:f.map(n=>r.jsx("option",{value:n,children:n},n))})]}),r.jsxs("div",{className:"vertex-datagrid-pagination",children:[r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(0),disabled:0===L,title:"First page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M11 17l-5-5 5-5M18 17l-5-5 5-5"})})}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(r=>Math.max(0,r-1)),disabled:0===L,title:"Previous page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M15 18l-6-6 6-6"})})}),r.jsxs(Dr,{size:"sm",color:"secondary",children:["Page ",L+1," of ",sr||1]}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(r=>Math.min(sr-1,r+1)),disabled:L>=sr-1,title:"Next page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M9 18l6-6-6-6"})})}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(sr-1),disabled:L>=sr-1,title:"Last page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M13 17l5-5-5-5M6 17l5-5-5-5"})})})]})]})]}),H&&r.jsx(on,{column:H.column,anchorEl:H.anchorEl,onClose:()=>Y(null),onSort:r=>tr(H.column,r),onFilter:()=>{X(H.column.field),V(!0)},currentSort:null===(M=U.find(r=>r.field===H.column.field))||void 0===M?void 0:M.sort,hasFilter:G.items.some(r=>r.field===H.column.field)}),P&&r.jsx(ln,{columns:e,filterModel:G,onFilterModelChange:Q,onClose:()=>{V(!1),X(void 0)},targetColumn:q})]})};sn.displayName="DataGrid";const cn=y(sn);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 dn=i.default.forwardRef(({textAlign:n="center",orientation:e="horizontal",variant:t="fullWidth",light:a=!1,flexItem:o=!1,children:i,component:l,className:s="",role:c,...d},x)=>{const v=l||(i||"vertical"===e?"div":"hr"),p=c||("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-${n}`,s].filter(Boolean).join(" "),h="vertical"===e&&"hr"!==v?{"aria-orientation":"vertical"}:{};return r.jsx(v,{ref:x,className:m,role:p,...h,...d,children:i&&r.jsx("span",{className:"vtx-divider-wrapper",children:i})})});dn.displayName="Divider";const xn=y(dn);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 vn=i.default.forwardRef(({notifications:n,onNotificationClick:e,onMarkAllAsRead:t,onClose:a},o)=>{const i=n.filter(r=>!r.read).length;return r.jsxs("div",{ref:o,className:"vtx-header-notifications-panel",children:[r.jsx("div",{className:"vtx-header-notifications-header",children:r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"subtitle2",noMargin:!0,children:"Notifications"}),i>0&&t&&r.jsx("button",{className:"vtx-header-notifications-mark-read",onClick:()=>{t(),a()},children:"Mark all as read"})]})}),r.jsx("div",{className:"vtx-header-notifications-list",children:0===n.length?r.jsxs("div",{className:"vtx-header-notifications-empty",children:[r.jsx(D,{}),r.jsx(Dr,{variant:"body2",color:"neutral.500",noMargin:!0,children:"No notifications"})]}):n.map(n=>r.jsxs("div",{className:`vtx-header-notification-item ${n.read?"":"vtx-header-notification-item--unread"} ${n.type?`vtx-header-notification-item--${n.type}`:""}`,onClick:()=>{null==e||e(n),a()},children:[n.icon&&r.jsx("div",{className:"vtx-header-notification-icon",children:n.icon}),r.jsxs("div",{className:"vtx-header-notification-content",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,style:{fontWeight:n.read?400:600},children:n.title}),n.description&&r.jsx(Dr,{variant:"caption",color:"neutral.600",noMargin:!0,children:n.description}),r.jsx(Dr,{variant:"caption",color:"neutral.500",noMargin:!0,style:{marginTop:"4px"},children:n.time})]}),!n.read&&r.jsx("div",{className:"vtx-header-notification-dot"})]},n.id))})]})});vn.displayName="NotificationPanel";const pn=i.default.forwardRef(({logo:e,title:t,onToggleSidebar:a,showToggle:o=!0,notifications:i=[],onNotificationClick:l,onMarkAllAsRead:s,userName:c,userSubtitle:d,userAvatar:x,userMenuItems:v=[],actions:p,className:m="",sticky:h=!0},g)=>{const[u,f]=n.useState(!1),[b,w]=n.useState(!1),y=n.useRef(null),k=n.useRef(null),j=n.useRef(null),_=i.filter(r=>!r.read).length;n.useEffect(()=>{const r=r=>{y.current&&!y.current.contains(r.target)&&j.current&&!j.current.contains(r.target)&&f(!1),k.current&&!k.current.contains(r.target)&&w(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);const z=["vtx-header",h&&"vtx-header--sticky",m].filter(Boolean).join(" ");return r.jsxs("header",{ref:g,className:z,children:[r.jsxs(Ar,{align:"center",gap:16,style:{flex:1},children:[o&&a&&r.jsx("button",{className:"vtx-header-toggle",onClick:a,"aria-label":"Toggle sidebar",children:r.jsx(E,{})}),e&&r.jsx("div",{className:"vtx-header-logo",children:e}),t&&r.jsx(Dr,{variant:"h6",noMargin:!0,className:"vtx-header-title",children:t})]}),p&&r.jsx("div",{className:"vtx-header-actions",children:p}),r.jsxs("div",{className:"vtx-header-right",children:[i&&i.length>0&&r.jsxs("div",{className:"vtx-header-notifications",ref:y,children:[r.jsxs("button",{className:"vtx-header-icon-button "+(u?"vtx-header-icon-button--active":""),onClick:()=>f(!u),"aria-label":"Notifications",children:[r.jsx(D,{}),_>0&&r.jsx(nn,{variant:"error",size:"sm",style:{position:"absolute",top:"4px",right:"4px",minWidth:"18px",height:"18px",padding:"0 4px"},children:_>9?"9+":_})]}),u&&r.jsx(vn,{ref:j,notifications:i,onNotificationClick:l,onMarkAllAsRead:s,onClose:()=>f(!1)})]}),c&&r.jsxs("div",{className:"vtx-header-user-menu",ref:k,children:[r.jsxs("button",{className:"vtx-header-user-button "+(b?"vtx-header-user-button--active":""),onClick:()=>w(!b),"aria-label":"User menu",children:[r.jsx(Jr,{src:x,alt:c,size:"sm"}),!x&&r.jsx("span",{className:"vtx-header-avatar-fallback",children:c.split(" ").map(r=>r[0]).join("").slice(0,2)}),r.jsxs("div",{className:"vtx-header-user-info",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,style:{fontWeight:600},children:c}),d&&r.jsx(Dr,{variant:"caption",color:"neutral.600",noMargin:!0,children:d})]}),r.jsx(I,{})]}),b&&r.jsx("div",{className:"vtx-header-user-dropdown",children:r.jsx(Br,{items:v,responsive:!1})})]})]})]})});pn.displayName="Header";const mn=y(pn);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: 72px;\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: 12px 12px;\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: 12px 8px;\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 12px;\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 - Professional Style (Same as Menu component)\n   =================================== */\n\n.vtx-sidemenu-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  text-decoration: none;\n  outline: none;\n  border-right: none;\n  border-top: none;\n  border-bottom: none;\n  text-align: left;\n  width: 100%;\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:active:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.98);\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 Menu Item - Professional Style */\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--active:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n/* Disabled Menu Item */\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  gap: 0;\n}\n\n/* Icon Styling - Professional (Same as Menu) */\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-color-neutral-600);\n  transition: color 0.15s ease-in-out;\n}\n\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item-icon svg {\n  width: 100%;\n  height: 100%;\n  transition: inherit;\n}\n\n/* Text Content */\n.vtx-sidemenu-item-label {\n  flex: 1;\n  color: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Badge */\n.vtx-sidemenu-item-badge {\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-semibold);\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-error-500);\n  color: white;\n  line-height: 1;\n  top: 8px;\n  right: 8px;\n  box-shadow: 0 0 0 2px var(--vtx-sidemenu-bg);\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n\n/* Chevron Icon */\n.vtx-sidemenu-chevron {\n  display: flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-400);\n  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.vtx-sidemenu-chevron--open {\n  transform: rotate(180deg);\n}\n\n/* ===================================\n   Submenu - Professional Style (Same as Menu)\n   =================================== */\n\n.vtx-sidemenu-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-sidemenu-submenu .vtx-sidemenu-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-sidemenu-submenu .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-submenu .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-submenu .vtx-sidemenu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n.vtx-sidemenu-submenu .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Nested submenu - additional indentation */\n.vtx-sidemenu-submenu .vtx-sidemenu-submenu {\n  padding-left: var(--vtx-spacing-4);\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-4px);\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 hn=({isOpen:n})=>r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",className:"vtx-sidemenu-chevron "+(n?"vtx-sidemenu-chevron--open":""),children:r.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),gn=i.default.forwardRef(({label:e,onClick:t,icon:a,disabled:o=!1,active:i=!1,items:l,badge:s,href:c,collapsed:d=!1,level:x=0},v)=>{const[p,m]=n.useState(!1),h=l&&l.length>0,g=r.jsx(r.Fragment,{children:r.jsxs(Ar,{align:"center",gap:d?0:12,style:{flex:1,minWidth:0},children:[a&&r.jsx("span",{className:"vtx-sidemenu-item-icon",children:a}),!d&&r.jsxs(r.Fragment,{children:[r.jsx(Dr,{variant:"body2",noMargin:!0,style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e}),s&&r.jsx("span",{className:"vtx-sidemenu-item-badge",children:s}),h&&r.jsx(hn,{isOpen:p})]})]})}),u=["vtx-sidemenu-item",i&&"vtx-sidemenu-item--active",o&&"vtx-sidemenu-item--disabled",h&&"vtx-sidemenu-item--has-submenu",d&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" "),f=c?"a":"div";return r.jsxs(r.Fragment,{children:[r.jsx(f,{ref:v,className:u,onClick:r=>{o||(h?(r.preventDefault(),m(!p)):t&&(r.preventDefault(),t()))},onKeyDown:r=>{o||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),h?m(!p):null==t||t())},role:"menuitem",tabIndex:o?-1:0,"aria-disabled":o,"aria-expanded":h?p:void 0,href:c,title:d?e:void 0,"data-label":d?e:void 0,children:g}),h&&p&&!d&&r.jsx("div",{className:"vtx-sidemenu-submenu",children:l.map((n,e)=>r.jsx(gn,{...n,collapsed:d,level:x+1},e))})]})});gn.displayName="SideMenuItem";const un=i.default.forwardRef(({items:n,collapsed:e=!1,onCollapseToggle:t,className:a="",width:o="260px",collapsedWidth:i="80px",header:l,footer:s},c)=>{const d=e?"number"==typeof i?`${i}px`:i:"number"==typeof o?`${o}px`:o,x=["vtx-sidemenu",e&&"vtx-sidemenu--collapsed",a].filter(Boolean).join(" ");return r.jsxs("aside",{ref:c,className:x,style:{width:d},role:"navigation",children:[l&&r.jsx("div",{className:"vtx-sidemenu-header",children:l}),r.jsx("div",{className:"vtx-sidemenu-content",children:n.map((n,t)=>r.jsx(gn,{...n,collapsed:e},t))}),s&&r.jsx("div",{className:"vtx-sidemenu-footer",children:s})]})});un.displayName="SideMenu";const fn=y(un);function bn({columns:e,data:t,getRowKey:a,striped:o=!1,hoverable:l=!0,bordered:s=!1,size:c,caption:d,emptyMessage:x="No data available",loading:v=!1,loadingContent:p,scrollable:m=!0,maxHeight:g,onRowClick:u,isRowSelected:f,onRowSelect:b,sortable:w=!1,sortConfig:y,onSortChange:k,className:j="",containerClassName:_="",selectable:z=!1,selectedRows:C=[],onSelectionChange:S,pagination:M=!1,page:T=0,rowsPerPage:$=10,rowsPerPageOptions:A=[5,10,25,50],onPageChange:F,onRowsPerPageChange:D,dense:E=!1,expandableRows:O=!1,renderExpandedRow:W,expandedRows:P=[],onExpandRow:V,stickyHeader:H=!1,toolbar:Y,filterable:q=!1,filters:X={},onFiltersChange:G,...U}){const{theme:K}=h(),Q=c||K.defaultSize,[Z,J]=n.useState(y||null),[rr,nr]=n.useState(C),[er,tr]=n.useState(P),[ar,or]=n.useState(T),[dr,xr]=n.useState($),[vr,pr]=n.useState(X),mr=y||Z,hr=C.length>0?C:rr,ur=P.length>0?P:er,fr=F?T:ar,br=D?$:dr,wr=Object.keys(X).length>0?X:vr,yr=r=>{if(!w)return;const n=(null==mr?void 0:mr.key)===r&&"asc"===mr.direction?"desc":"asc",e={key:r,direction:n};k?k(r,n):J(e)},kr=n.useMemo(()=>{if(!mr||!w)return t;const r=e.find(r=>r.key===mr.key),n=null==r?void 0:r.sortFn;return[...t].sort((r,e)=>{if(n)return"asc"===mr.direction?n(r,e):n(e,r);const t=r[mr.key],a=e[mr.key];if("string"==typeof t&&"string"==typeof a)return"asc"===mr.direction?t.localeCompare(a):a.localeCompare(t);if("number"==typeof t&&"number"==typeof a)return"asc"===mr.direction?t-a:a-t;const o=String(t),i=String(a);return"asc"===mr.direction?o.localeCompare(i):i.localeCompare(o)})},[t,mr,e,w]),jr=n.useMemo(()=>q&&0!==Object.keys(wr).length?kr.filter(r=>Object.entries(wr).every(([n,t])=>{if(!t)return!0;const a=e.find(r=>r.key===n);if(null==a?void 0:a.filterFn)return a.filterFn(r,t);const o=r[n];return String(o||"").toLowerCase().includes(t.toLowerCase())})):kr,[kr,q,wr,e]),_r=n.useMemo(()=>{if(!M)return jr;const r=fr*br;return jr.slice(r,r+br)},[jr,M,fr,br]),zr=M?_r:jr,Nr=n.useCallback(r=>{if(!z)return;const n=r?zr.map((r,n)=>a(r,n)):[];S?S(n):nr(n)},[z,zr,a,S]),Cr=n.useCallback((r,n)=>{if(!z)return;const e=n?[...hr,r]:hr.filter(n=>n!==r);S?S(e):nr(e)},[z,hr,S]),Sr=z&&zr.length>0&&zr.every((r,n)=>hr.includes(a(r,n))),Mr=z&&hr.length>0&&!Sr,Tr=n.useCallback(r=>{if(!O)return;const n=ur.includes(r)?ur.filter(n=>n!==r):[...ur,r];V?V(r):tr(n)},[O,ur,V]),$r=n.useCallback(r=>{F?F(r):or(r)},[F]),Ir=n.useCallback(r=>{D?D(r):(xr(r),or(0))},[D]),Fr=n.useCallback((r,n)=>{const e={...wr,[r]:n};n||delete e[r],G?G(e):pr(e),M&&(F?F(0):or(0))},[wr,G,M,F]),Er=["vtx-table-container",m&&"vtx-table-container--scrollable",g&&"vtx-table-container--fixed-header",H&&"vtx-table-container--sticky-header",_].filter(Boolean).join(" "),Rr=["vtx-table",`vtx-table--${Q}`,E&&"vtx-table--dense",o&&"vtx-table--striped",l&&"vtx-table--hoverable",s&&"vtx-table--bordered",(u||z)&&"vtx-table--clickable",H&&"vtx-table--sticky-header",j].filter(Boolean).join(" "),Lr=(r,n,e)=>{b&&b(r,n),null==u||u(r,n,e)},Br=n=>{if(!w)return null;const e=(null==mr?void 0:mr.key)===n,t=null==mr?void 0:mr.direction;return e?r.jsx("span",{className:"vtx-table-sort-icon vtx-table-sort-icon--active",children:"asc"===t?r.jsx(ir,{size:14}):r.jsx(lr,{size:14})}):r.jsx("span",{className:"vtx-table-sort-icon vtx-table-sort-icon--inactive",children:r.jsx(ir,{size:14})})};return r.jsxs("div",{className:"vtx-table-wrapper",children:[Y&&r.jsx("div",{className:"vtx-table-toolbar",children:"object"==typeof Y&&null!==Y&&!i.default.isValidElement(Y)&&"title"in Y?r.jsxs(Ar,{justify:"between",align:"center",style:{width:"100%"},children:[Y.title&&r.jsx(Dr,{variant:"h6",noMargin:!0,children:Y.title}),Y.actions&&r.jsx("div",{className:"vtx-table-toolbar-actions",children:Y.actions})]}):r.jsx(r.Fragment,{children:Y})}),z&&hr.length>0&&r.jsx("div",{className:"vtx-table-selection-toolbar",children:r.jsx(Ar,{align:"center",gap:16,children:r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[hr.length," selected"]})})}),r.jsx("div",{className:Er,style:{maxHeight:g},children:r.jsxs("table",{className:Rr,...U,children:[d&&r.jsx("caption",{className:"vtx-table-caption",children:d}),r.jsx("thead",{className:"vtx-table-header",children:r.jsxs("tr",{children:[z&&r.jsx("th",{className:"vtx-table-header-cell vtx-table-cell--checkbox",children:r.jsx(N,{checked:Sr,indeterminate:Mr,onChange:r=>Nr(r.target.checked),"aria-label":"Select all rows"})}),O&&r.jsx("th",{className:"vtx-table-header-cell vtx-table-cell--expand"}),e.map(n=>{const e=w&&!1!==n.sortable,t=q&&!1!==n.filterable,a=["vtx-table-header-cell",e&&"vtx-table-header-cell--sortable",n.sticky&&`vtx-table-header-cell--sticky-${n.sticky}`,n.headerClassName].filter(Boolean).join(" ");return r.jsx("th",{className:a,style:{width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth,textAlign:n.align||"left"},"aria-sort":(null==mr?void 0:mr.key)===n.key?"asc"===mr.direction?"ascending":"descending":void 0,children:r.jsxs("div",{className:"vtx-table-header-content",children:[r.jsxs("div",{className:"vtx-table-header-label",onClick:()=>e&&yr(n.key),onKeyDown:r=>{!e||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),yr(n.key))},role:e?"button":void 0,tabIndex:e?0:void 0,style:{cursor:e?"pointer":"default"},children:[r.jsx("span",{children:n.header}),e&&Br(n.key)]}),t&&r.jsx("div",{className:"vtx-table-filter",children:r.jsx(gr,{size:"sm",placeholder:n.filterPlaceholder||`Filter ${n.header}...`,value:wr[n.key]||"",onChange:r=>Fr(n.key,r.target.value),className:"vtx-table-filter-input"})})]})},n.key)})]})}),r.jsx("tbody",{className:"vtx-table-body",children:v?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(z?1:0)+(O?1:0),className:"vtx-table-loading",children:p||r.jsx("span",{className:"vtx-table-loading-spinner",children:"Loading..."})})}):0===zr.length?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(z?1:0)+(O?1:0),className:"vtx-table-empty",children:x})}):zr.map((n,t)=>{const o=a(n,t),l=hr.includes(o),s=ur.includes(o),c=["vtx-table-row",l&&"vtx-table-row--selected",s&&"vtx-table-row--expanded"].filter(Boolean).join(" ");return r.jsxs(i.default.Fragment,{children:[r.jsxs("tr",{className:c,onClick:r=>{z&&!r.target.closest("input, button")||Lr(n,t,r)},role:u?"button":void 0,tabIndex:u?0:void 0,"aria-selected":l,onKeyDown:r=>{!u||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),Lr(n,t,r))},children:[z&&r.jsx("td",{className:"vtx-table-cell vtx-table-cell--checkbox",children:r.jsx(N,{checked:l,onChange:r=>{r.stopPropagation(),Cr(o,r.target.checked)},"aria-label":`Select row ${t+1}`})}),O&&r.jsx("td",{className:"vtx-table-cell vtx-table-cell--expand",children:r.jsx("button",{className:"vtx-table-expand-button",onClick:r=>{r.stopPropagation(),Tr(o)},"aria-label":s?"Collapse row":"Expand row","aria-expanded":s,children:s?r.jsx(R,{size:16}):r.jsx(I,{size:16})})}),e.map(e=>{const a=["vtx-table-cell",e.sticky&&`vtx-table-cell--sticky-${e.sticky}`,e.className].filter(Boolean).join(" ");return r.jsx("td",{className:a,style:{textAlign:e.align||"left",width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth},children:e.render?e.render(n,t):n[e.key]},e.key)})]}),O&&s&&W&&r.jsx("tr",{className:"vtx-table-row-expanded",children:r.jsx("td",{colSpan:e.length+(z?1:0)+1,className:"vtx-table-cell-expanded",children:W(n,t)})})]},o)})})]})}),M&&r.jsx("div",{className:"vtx-table-pagination",children:r.jsxs(Ar,{align:"center",justify:"between",style:{width:"100%"},children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Dr,{variant:"body2",color:"neutral.600",noMargin:!0,children:"Rows per page:"}),r.jsx("select",{className:"vtx-table-pagination-select",value:br,onChange:r=>Ir(Number(r.target.value)),"aria-label":"Rows per page",children:A.map(n=>r.jsx("option",{value:n,children:n},n))})]}),r.jsxs(Ar,{align:"center",gap:16,children:[r.jsxs(Dr,{variant:"body2",color:"neutral.600",noMargin:!0,children:[fr*br+1,"–",Math.min((fr+1)*br,jr.length)," of"," ",jr.length]}),r.jsxs(Ar,{align:"center",gap:4,children:[r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(0),disabled:0===fr,"aria-label":"First page",title:"First page",children:r.jsx(sr,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(fr-1),disabled:0===fr,"aria-label":"Previous page",title:"Previous page",children:r.jsx(L,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(fr+1),disabled:(fr+1)*br>=jr.length,"aria-label":"Next page",title:"Next page",children:r.jsx(B,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(Math.ceil(jr.length/br)-1),disabled:(fr+1)*br>=jr.length,"aria-label":"Last page",title:"Last page",children:r.jsx(cr,{size:18})})]})]})]})})]})}k("/* Table Wrapper & Toolbar */\n.vtx-table-wrapper {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  background-color: white;\n  border-radius: var(--vtx-radius-lg);\n  border: 1px solid var(--vtx-color-neutral-200);\n  overflow: hidden;\n}\n\n.vtx-table-toolbar {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n  background-color: white;\n}\n\n.vtx-table-toolbar-actions {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n}\n\n.vtx-table-selection-toolbar {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-6);\n  background-color: var(--vtx-color-primary-50);\n  border-bottom: 1px solid var(--vtx-color-primary-100);\n}\n\n.vtx-table-container {\n  width: 100%;\n  overflow-x: auto;\n}\n\n.vtx-table-container--fixed-header,\n.vtx-table-container--sticky-header {\n  overflow-y: auto;\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--sticky-header .vtx-table-header {\n  position: sticky;\n  top: 0;\n  z-index: 10;\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  background-color: var(--vtx-color-neutral-50);\n}\n\n.vtx-table-header-cell--sortable {\n  cursor: pointer;\n  user-select: none;\n  transition: background-color var(--vtx-transition-fast);\n}\n\n.vtx-table-header-cell--sortable:hover {\n  background-color: var(--vtx-color-neutral-100);\n}\n\n.vtx-table-header-content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n  width: 100%;\n}\n\n.vtx-table-header-label {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--vtx-spacing-2);\n  width: 100%;\n}\n\n.vtx-table-header-label > span {\n  flex: 1;\n}\n\n.vtx-table-sort-icon {\n  display: flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-400);\n  transition: color var(--vtx-transition-fast);\n  flex-shrink: 0;\n}\n\n.vtx-table-sort-icon--active {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-table-sort-icon--inactive {\n  opacity: 0.4;\n}\n\n.vtx-table-header-cell--sortable:hover .vtx-table-sort-icon--inactive {\n  opacity: 0.7;\n  color: var(--vtx-color-neutral-600);\n}\n\n/* Filter Input */\n.vtx-table-filter {\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-table-filter-input {\n  width: 100%;\n  font-size: var(--vtx-font-size-sm);\n  min-width: 0;\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-row--selected {\n  background-color: var(--vtx-color-primary-50);\n}\n\n.vtx-table-row--expanded {\n  border-bottom: none;\n}\n\n.vtx-table-row-expanded {\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table-row-expanded:last-child {\n  border-bottom: none;\n}\n\n.vtx-table-cell-expanded {\n  padding: var(--vtx-spacing-4);\n  background-color: var(--vtx-color-neutral-50);\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.vtx-table-cell--checkbox {\n  width: 48px;\n  padding: var(--vtx-spacing-2);\n}\n\n.vtx-table-cell--expand {\n  width: 48px;\n  padding: var(--vtx-spacing-2);\n}\n\n.vtx-table-expand-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  border-radius: var(--vtx-radius-md);\n  cursor: pointer;\n  color: var(--vtx-color-neutral-600);\n  transition: all var(--vtx-transition-fast);\n}\n\n.vtx-table-expand-button:hover {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Sizes */\n.vtx-table--sm .vtx-table-header-cell,\n.vtx-table--sm .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--lg .vtx-table-header-cell,\n.vtx-table--lg .vtx-table-cell {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-lg);\n}\n\n.vtx-table--dense .vtx-table-header-cell,\n.vtx-table--dense .vtx-table-cell {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\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.vtx-table--hoverable .vtx-table-row--selected:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n/* Clickable */\n.vtx-table--clickable .vtx-table-row {\n  cursor: pointer;\n}\n\n/* Bordered */\n.vtx-table--bordered .vtx-table-cell,\n.vtx-table--bordered .vtx-table-header-cell {\n  border-right: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table--bordered .vtx-table-cell:last-child,\n.vtx-table--bordered .vtx-table-header-cell:last-child {\n  border-right: none;\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\n/* Loading state */\n.vtx-table-loading {\n  padding: var(--vtx-spacing-12) var(--vtx-spacing-4);\n  text-align: center;\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-table-loading-spinner {\n  display: inline-block;\n  animation: vtx-spin 1s linear infinite;\n}\n\n@keyframes vtx-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Pagination */\n.vtx-table-pagination {\n  display: flex;\n  align-items: center;\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  border-top: 1px solid var(--vtx-color-neutral-200);\n  background-color: white;\n}\n\n.vtx-table-pagination-select {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  font-size: var(--vtx-font-size-sm);\n  color: var(--vtx-color-neutral-900);\n  background-color: white;\n  cursor: pointer;\n  transition: border-color var(--vtx-transition-fast);\n}\n\n.vtx-table-pagination-select:hover {\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-table-pagination-select:focus {\n  outline: none;\n  border-color: var(--vtx-color-primary-500);\n  box-shadow: 0 0 0 3px var(--vtx-color-primary-100);\n}\n\n.vtx-table-pagination-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-color-neutral-600);\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n}\n\n.vtx-table-pagination-button:hover:not(:disabled) {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-table-pagination-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n/* Sticky columns */\n.vtx-table-cell--sticky-left,\n.vtx-table-header-cell--sticky-left {\n  position: sticky;\n  left: 0;\n  z-index: 2;\n  background-color: white;\n  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);\n}\n\n.vtx-table-cell--sticky-right,\n.vtx-table-header-cell--sticky-right {\n  position: sticky;\n  right: 0;\n  z-index: 2;\n  background-color: white;\n  box-shadow: -2px 0 4px rgba(0, 0, 0, 0.05);\n}\n\n.vtx-table-header-cell--sticky-left,\n.vtx-table-header-cell--sticky-right {\n  z-index: 11;\n  background-color: var(--vtx-color-neutral-50);\n}\n"),bn.displayName="Table";const wn=y(bn);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 yn=({steps:n,currentStep:e,orientation:t="horizontal",variant:a="default",showCheckmarks:o=!0,color:i="success",size:l="md",className:s="",style:c})=>{const d=n.map(r=>"string"==typeof r?{label:r}:r),x=(n,e,t)=>n.icon?r.jsx("span",{className:"timeline-step-custom-icon",children:n.icon}):"completed"===t&&o?r.jsx("svg",{className:"timeline-step-checkmark",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})}):"numbered"===a?r.jsx("span",{className:"timeline-step-number",children:e+1}):r.jsx("span",{className:"timeline-step-dot"});return r.jsx("div",{className:`timeline timeline--${t} timeline--${a} timeline--${i} timeline--${l} ${s}`,style:c,children:d.map((n,t)=>{const a=(r=>r<e?"completed":r===e?"active":"pending")(t),o=t===d.length-1,i=!!n.onClick,l=(r=>r<e)(t);return r.jsxs("div",{className:`timeline-step timeline-step--${a} ${i?"timeline-step--clickable":""}`,onClick:()=>(r=>{r.onClick&&r.onClick()})(n),children:[r.jsx("div",{className:"timeline-step-indicator",children:r.jsx("div",{className:"timeline-step-icon-wrapper",children:x(n,t,a)})}),!o&&r.jsx("div",{className:"timeline-connector "+(l?"timeline-connector--filled":"")}),r.jsxs("div",{className:"timeline-step-content",children:[r.jsx(Dr,{variant:"body2",weight:"active"===a?"semibold":"medium",noMargin:!0,className:"timeline-step-label",children:n.label}),n.description&&r.jsx(Dr,{variant:"caption",noMargin:!0,className:"timeline-step-description",children:n.description})]})]},t)})})};yn.displayName="Timeline";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 kn=i.default.forwardRef(({container:n=!1,item:e=!1,spacing:t,rowSpacing:a,columnSpacing:o,xs:i,sm:l,md:s,lg:c,xl:d,justifyContent:x,alignItems:v,alignContent:p,direction:m="row",wrap:h="wrap",className:g="",children:u,style:f,...b},w)=>{const y=["vtx-grid",n&&"vtx-grid-container",e&&"vtx-grid-item",n&&void 0!==t&&`vtx-grid-spacing-${t}`,n&&void 0!==a&&`vtx-grid-row-spacing-${a}`,n&&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!==s&&"vtx-grid-md"+(!0===s?"":"auto"===s?"-auto":`-${s}`),void 0!==c&&"vtx-grid-lg"+(!0===c?"":"auto"===c?"-auto":`-${c}`),void 0!==d&&"vtx-grid-xl"+(!0===d?"":"auto"===d?"-auto":`-${d}`),n&&"row"!==m&&`vtx-grid-direction-${m}`,n&&"wrap"!==h&&`vtx-grid-wrap-${h}`,g].filter(Boolean).join(" "),k={...f};return n&&(x&&(k.justifyContent=x),v&&(k.alignItems=v),p&&(k.alignContent=p)),r.jsx("div",{ref:w,className:y,style:Object.keys(k).length>0?k:void 0,...b,children:u})});kn.displayName="Grid";const jn=y(kn);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 _n=i.default.forwardRef(({icon:n,iconVariant:e="primary",text:t,subText:a,className:o="",style:i,...l},s)=>r.jsx(tn,{variant:"outlined",className:o,style:i,ref:s,...l,children:r.jsxs(jn,{container:!0,spacing:2,alignItems:"center",wrap:"nowrap",justifyContent:"center",children:[r.jsx(jn,{item:!0,xs:"auto",children:r.jsx(Ar,{align:"center",justify:"center",children:r.jsx("span",{className:`infocard-icon infocard-icon--${e}`,children:n})})}),r.jsxs(jn,{item:!0,xs:!0,children:[r.jsx(Dr,{variant:"caption",children:t}),a&&r.jsx(Dr,{variant:"subtitle2",children:a})]})]})}));_n.displayName="InfoCardBase";const zn=i.default.forwardRef(({value:n,label:e,className:t="",style:a,...o},i)=>r.jsx(tn,{variant:"outlined",className:t,style:a,ref:i,...o,children:r.jsxs(Ar,{direction:"column",align:"center",justify:"center",style:{minHeight:80},children:[r.jsx(Dr,{variant:"h4",children:n}),e&&r.jsx(Dr,{variant:"caption",children:e})]})}));zn.displayName="InfoCardMetric";const Nn={Base:y(_n),Metric:y(zn)};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 Cn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...s},c)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-base ${i}`,style:l,ref:c,...s,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Dr,{variant:"body1",weight:"medium",noMargin:!0,children:a}),o&&r.jsx(Dr,{variant:"caption",color:"text-secondary",noMargin:!0,children:o})]})]}));Cn.displayName="InfoTextBase";const Sn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,value:a,label:o,subText:i,className:l="",style:s,...c},d)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-stat ${l}`,style:s,ref:d,...c,children:[n&&r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Dr,{variant:"h5",weight:"bold",noMargin:!0,children:a}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:o}),i&&r.jsx(Dr,{variant:"caption",color:"text-secondary",noMargin:!0,children:i})]})]}));Sn.displayName="InfoTextStat";const Mn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,title:a,description:o,badge:i,className:l="",style:s,...c},d)=>r.jsxs(Ar,{direction:"row",align:"start",gap:8,className:`infotext-feature ${l}`,style:s,ref:d,...c,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:6,style:{flex:1},children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:a}),i&&r.jsx("span",{className:"infotext-badge",children:i})]}),r.jsx(Dr,{variant:"body2",color:"text-secondary",noMargin:!0,children:o})]})]}));Mn.displayName="InfoTextFeature";const Tn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,text:a,className:o="",style:i,...l},s)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-compact ${o}`,style:i,ref:s,...l,children:[t?r.jsx("span",{className:`infotext-icon-small infotext-icon-small--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-small-plain",children:n}),r.jsx(Dr,{variant:"body2",noMargin:!0,children:a})]}));Tn.displayName="InfoTextCompact";const $n=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...s},c)=>r.jsxs(Ar,{direction:"column",align:"center",gap:10,className:`infotext-vertical ${i}`,style:l,ref:c,...s,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,align:"center",children:[r.jsx(Dr,{variant:"body1",weight:"medium",align:"center",noMargin:!0,children:a}),o&&r.jsx(Dr,{variant:"caption",color:"text-secondary",align:"center",noMargin:!0,children:o})]})]}));$n.displayName="InfoTextVertical";const In={Base:y(Cn),Stat:y(Sn),Feature:y(Mn),Compact:y(Tn),Vertical:y($n)};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 An=i.default.forwardRef(({id:e,image:t,imageAlt:a="Product",category:o,name:i,weight:l,units:s,price:c,originalPrice:d,discount:x,rating:v,initialQuantity:p=0,featured:m=!1,featuredText:h="Featured",showWishlist:g=!1,isWishlisted:u=!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},A)=>{const[F,D]=n.useState(p),[E,R]=n.useState(!1),L=E||M;return r.jsx(tn,{variant:"outlined",className:`productcard ${T}`,style:{padding:0,...$},ref:A,...I,children:r.jsxs(Ar,{direction:"column",children:[r.jsxs("div",{className:"productcard-image-wrapper",onClick:S,style:{cursor:S?"pointer":"default"},children:[r.jsx("img",{src:t,alt:a,className:"productcard-image"}),r.jsxs("div",{className:"productcard-badges",children:[m&&r.jsx("span",{className:"productcard-featured-badge",children:h}),x&&r.jsx("span",{className:"productcard-discount-badge",children:x})]}),g&&N&&r.jsx("button",{className:"productcard-wishlist-btn "+(u?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),N()},"aria-label":u?"Remove from wishlist":"Add to wishlist",children:u?w||b||"♥":b||"♡"}),C&&r.jsx("div",{className:"productcard-hover-overlay",children:r.jsx(_,{variant:"secondary",size:"sm",leftIcon:y||"👁",onClick:r=>{r.stopPropagation(),C()},children:"Quick View"})})]}),r.jsxs(Ar,{direction:"column",gap:5,style:{padding:"12px"},children:[o&&r.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r.jsx(fr,{label:o,variant:"outlined",className:"productcard-category"})}),r.jsx(Dr,{variant:"body1",noMargin:!0,onClick:S,style:{cursor:S?"pointer":"default"},children:i}),(void 0!==l||s)&&r.jsx(Dr,{variant:"body1",noMargin:!0,className:"productcard-weight",children:void 0!==l&&s?`${l} ${s}`:void 0!==l?l:"-"}),void 0!==v&&r.jsxs(Ar,{align:"center",gap:5,className:"productcard-rating-wrapper",children:[r.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(v)),"☆".repeat(5-Math.floor(v))]}),r.jsx(Dr,{variant:"caption",noMargin:!0,children:v})]}),r.jsxs(Ar,{align:"center",gap:8,children:[r.jsxs(Dr,{variant:"h5",noMargin:!0,className:"productcard-price",children:["$",Number(c).toFixed(2)]}),d&&d>c&&r.jsxs(Dr,{variant:"body2",noMargin:!0,className:"productcard-original-price",children:["$",Number(d).toFixed(2)]})]}),L?r.jsx(_,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===F?r.jsx(_,{fullWidth:!0,variant:"primary",leftIcon:f,onClick:async()=>{if(k){R(!0);try{await k(e,1),D(1)}catch(r){console.error("Add to cart error:",r)}finally{R(!1)}}},children:"Add to cart"}):r.jsxs(Ar,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r.jsx(_,{variant:"secondary",onClick:async()=>{if(z&&!(F<=0)){R(!0);try{await z(e,F),D(F-1)}catch(r){console.error("Decrement error:",r)}finally{R(!1)}}},children:"-"}),r.jsx(Dr,{noMargin:!0,className:"productcard-quantity-value",children:F}),r.jsx(_,{variant:"secondary",onClick:async()=>{if(j){R(!0);try{await j(e,F),D(F+1)}catch(r){console.error("Increment error:",r)}finally{R(!1)}}},children:"+"})]})]})]})})});An.displayName="ProductCardBase";const Fn=i.default.forwardRef(({imagePosition:e="left",...t},a)=>{const{id:o,image:i,imageAlt:l="Product",category:s,name:c,weight:d,units:x,price:v,originalPrice:p,discount:m,rating:h,initialQuantity:g=0,featured:u=!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:A="",style:F}=t,[D,E]=n.useState(g),[R,L]=n.useState(!1),B=R||I;return r.jsx(tn,{variant:"outlined",className:`productcard-wide ${A}`,style:{padding:0,...F},ref:a,children:r.jsxs(Ar,{direction:"left"===e?"row":"row-reverse",children:[r.jsxs("div",{className:"productcard-wide-image-wrapper",onClick:$,style:{cursor:$?"pointer":"default"},children:[r.jsx("img",{src:i,alt:l,className:"productcard-wide-image"}),r.jsxs("div",{className:"productcard-badges",children:[u&&r.jsx("span",{className:"productcard-featured-badge",children:f}),m&&r.jsx("span",{className:"productcard-discount-badge",children:m})]}),b&&M&&r.jsx("button",{className:"productcard-wishlist-btn "+(w?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),M()},children:w?j||k||"♥":k||"♡"})]}),r.jsxs(Ar,{direction:"column",gap:12,style:{padding:"16px 20px",flex:1,minWidth:0},children:[s&&r.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r.jsx(fr,{label:s,variant:"outlined",className:"productcard-category"})}),r.jsxs(Ar,{direction:"column",gap:6,children:[r.jsx(Dr,{variant:"h5",weight:"bold",noMargin:!0,onClick:$,style:{cursor:$?"pointer":"default",wordBreak:"break-word"},children:c}),(void 0!==d||x)&&r.jsx(Dr,{variant:"body2",noMargin:!0,className:"productcard-weight",children:void 0!==d&&x?`${d} ${x}`:void 0!==d?d:"-"})]}),void 0!==h&&r.jsxs(Ar,{align:"center",gap:6,children:[r.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(h)),"☆".repeat(5-Math.floor(h))]}),r.jsx(Dr,{variant:"caption",noMargin:!0,children:h})]}),r.jsxs(Ar,{align:"center",gap:8,wrap:"wrap",style:{marginTop:"auto"},children:[r.jsxs(Dr,{variant:"h4",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(v).toFixed(2)]}),p&&p>v&&r.jsxs(Dr,{variant:"body1",noMargin:!0,className:"productcard-original-price",children:["$",Number(p).toFixed(2)]})]}),r.jsxs(Ar,{gap:12,align:"center",direction:"row",wrap:"wrap",children:[r.jsx("div",{style:{flex:"1 1 auto",minWidth:"140px"},children:B?r.jsx(_,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===D?r.jsx(_,{fullWidth:!0,variant:"primary",leftIcon:y,onClick:async()=>{if(N){L(!0);try{await N(o,1),E(1)}catch(r){console.error("Add to cart error:",r)}finally{L(!1)}}},children:"Add to cart"}):r.jsxs(Ar,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r.jsx(_,{variant:"secondary",onClick:async()=>{if(S&&!(D<=0)){L(!0);try{await S(o,D),E(D-1)}catch(r){console.error("Decrement error:",r)}finally{L(!1)}}},children:"-"}),r.jsx(Dr,{noMargin:!0,className:"productcard-quantity-value",children:D}),r.jsx(_,{variant:"primary",onClick:async()=>{if(C){L(!0);try{await C(o,D),E(D+1)}catch(r){console.error("Increment error:",r)}finally{L(!1)}}},children:"+"})]})}),T&&r.jsx(_,{variant:"outline",size:"md",leftIcon:z||"👁",onClick:T,children:"View"})]})]})]})})});Fn.displayName="ProductCardWide";const Dn=i.default.forwardRef((e,t)=>{const{id:a,image:o,imageAlt:i="Product",name:l,price:s,originalPrice:c,discount:d,rating:x,initialQuantity:v=0,showWishlist:p=!1,isWishlisted:m=!1,cartIcon:h,wishlistIcon:g,wishlistFilledIcon:u,onAddToCart:f,onIncrementCart:b,onDecrementCart:w,onWishlist:y,onClick:k,loading:j=!1,className:z="",style:N}=e,[C,S]=n.useState(v),[M,T]=n.useState(!1),$=M||j;return r.jsxs("div",{className:`productcard-minimal ${z}`,style:N,ref:t,children:[r.jsxs("div",{className:"productcard-minimal-image-wrapper",onClick:k,style:{cursor:k?"pointer":"default"},children:[r.jsx("img",{src:o,alt:i,className:"productcard-minimal-image"}),d&&r.jsx("span",{className:"productcard-minimal-discount",children:d}),p&&y&&r.jsx("button",{className:"productcard-minimal-wishlist "+(m?"productcard-minimal-wishlist--active":""),onClick:r=>{r.stopPropagation(),y()},children:m?u||g||"♥":g||"♡"})]}),r.jsxs(Ar,{direction:"column",gap:8,style:{padding:"12px 0"},children:[r.jsx(Dr,{variant:"body1",weight:"medium",noMargin:!0,onClick:k,style:{cursor:k?"pointer":"default"},children:l}),r.jsxs(Ar,{align:"center",gap:8,children:[r.jsxs(Dr,{variant:"h6",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(s).toFixed(2)]}),c&&c>s&&r.jsxs(Dr,{variant:"caption",noMargin:!0,className:"productcard-original-price",children:["$",Number(c).toFixed(2)]})]}),void 0!==x&&r.jsxs("div",{className:"productcard-rating-minimal",children:["★".repeat(Math.floor(x)),"☆".repeat(5-Math.floor(x))]}),$?r.jsx(_,{loading:!0,variant:"primary",size:"sm",children:"Loading"}):0===C?r.jsx(_,{variant:"primary",size:"sm",leftIcon:h,onClick:async()=>{if(f){T(!0);try{await f(a,1),S(1)}catch(r){console.error("Add to cart error:",r)}finally{T(!1)}}},fullWidth:!0,children:"Add"}):r.jsxs(Ar,{align:"center",justify:"between",className:"productcard-quantity-selector-minimal",children:[r.jsx(_,{variant:"secondary",size:"sm",onClick:async()=>{if(w&&!(C<=0)){T(!0);try{await w(a,C),S(C-1)}catch(r){console.error("Decrement error:",r)}finally{T(!1)}}},children:"-"}),r.jsx(Dr,{variant:"body2",noMargin:!0,weight:"medium",children:C}),r.jsx(_,{variant:"primary",size:"sm",onClick:async()=>{if(b){T(!0);try{await b(a,C),S(C+1)}catch(r){console.error("Increment error:",r)}finally{T(!1)}}},children:"+"})]})]})]})});Dn.displayName="ProductCardMinimal";const En={Base:y(An),Wide:y(Fn),Minimal:y(Dn)};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 Rn=i.default.forwardRef(({orderId:n,orderNumber:e,status:t="pending",statusText:a,items:o,deliveryDate:i,deliveryLabel:l="Delivered on",totalAmount:s,currency:c="₹",onTrackOrder:d,onViewDetails:x,trackButtonText:v="Track Order",className:p="",style:m,...h},g)=>{const u=o[0],f=o.length-1;return r.jsx(tn,{variant:"outlined",className:`ordercard ${p}`,style:m,onClick:x?()=>x(n):void 0,ref:g,...h,children:r.jsxs(Ar,{direction:"column",gap:0,children:[r.jsxs(Ar,{align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-header",children:[r.jsx(Dr,{variant:"body1",weight:"semibold",noMargin:!0,children:e||`Order #${n}`}),r.jsx(nn,{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)})]}),r.jsxs(Ar,{direction:"row",gap:10,className:"ordercard-content",children:[u.image&&r.jsx("div",{className:"ordercard-image-wrapper",children:r.jsx("img",{src:u.image,alt:u.name,className:"ordercard-image"})}),r.jsxs(Ar,{direction:"column",gap:2,style:{flex:1,minWidth:0},children:[r.jsxs(Dr,{variant:"body2",weight:"medium",noMargin:!0,className:"ordercard-product-name",children:[u.name,u.quantity&&u.quantity>1&&` × ${u.quantity}`]}),f>0&&r.jsxs(Dr,{variant:"caption",noMargin:!0,className:"ordercard-more-items",children:["+ ",f," more ",1===f?"item":"items"]})]})]}),r.jsxs(Ar,{direction:"row",align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-footer",children:[r.jsxs(Ar,{direction:"column",gap:2,style:{flex:"1 1 auto",minWidth:"140px"},children:[i&&r.jsxs(Dr,{variant:"caption",noMargin:!0,className:"ordercard-delivery",children:[l,": ",i]}),r.jsxs(Dr,{variant:"body1",weight:"bold",noMargin:!0,className:"ordercard-price",children:[c,s.toLocaleString()]})]}),d&&r.jsx(_,{variant:"primary",size:"sm",onClick:r=>{null==r||r.stopPropagation(),d(n)},className:"ordercard-track-btn",children:v})]})]})})});Rn.displayName="OrderCard";const Ln=y(Rn);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 Bn=i.default.forwardRef(({heading:n,items:e,showDividers:t=!1,compact:a=!1,variant:o="outlined",className:l="",style:s,...c},d)=>{const x=e.filter(r=>!r.hidden);return r.jsxs(tn,{variant:"flat"===o?"filled":o,className:`info-list-card ${a?"info-list-card--compact":""} ${l}`,style:s,ref:d,...c,children:[n&&r.jsxs(r.Fragment,{children:[r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,className:"info-list-card-heading",children:n}),r.jsx(xn,{style:{margin:"12px 0 16px 0"}})]}),r.jsx("div",{className:"info-list-card-items",children:x.map((n,e)=>r.jsxs(i.default.Fragment,{children:[r.jsxs("div",{className:"info-list-card-item",children:[r.jsx("div",{className:`info-list-card-label ${n.labelClass||""}`,children:"string"==typeof n.label?r.jsx(Dr,{variant:"body2",noMargin:!0,children:n.label}):n.label}),r.jsx("div",{className:`info-list-card-value ${n.valueClass||""}`,children:"string"==typeof n.value||"number"==typeof n.value?r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:n.value}):n.value})]}),t&&e<x.length-1&&r.jsx(xn,{style:{margin:a?"8px 0":"12px 0"}})]},e))})]})});Bn.displayName="InfoListCard";const On=y(Bn);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 Wn=i.default.forwardRef(({orderId:n,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:s,customerPhone:c,shippingAddress:d,billingAddress:x,items:v,subtotal:p,shippingCost:m=0,tax:h=0,discount:g=0,total:u,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:A="View Details",contactSupportText:F="Contact Support",shareOrderText:D="Share",showActions:E=!0,hideDownloadInvoice:R=!1,hideContinueShopping:L=!1,hideTrackOrder:B=!1,hideContactSupport:W=!1,className:P="",style:V,...H},rr)=>{const nr=n=>r.jsxs("div",{className:"orderconfirmation-address",children:[r.jsx("div",{className:"orderconfirmation-address-name",children:n.name}),r.jsx("div",{children:n.addressLine1}),n.addressLine2&&r.jsx("div",{children:n.addressLine2}),r.jsxs("div",{children:[n.city,", ",n.state," ",n.zipCode]}),n.phone&&r.jsxs("div",{children:["Phone: ",n.phone]})]}),er=[{label:"Order Number",value:e||`#${n}`,valueClass:"value-bold"},t?{label:"Order Date",value:t}:{label:"",value:"",hidden:!0},{label:"Status",value:r.jsx(nn,{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(r=>!r.hidden),tr=[s?{label:"Email",value:s}:{label:"",value:"",hidden:!0},c?{label:"Phone",value:c}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),ar=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Transaction ID",value:w,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r.jsx("div",{className:`orderconfirmation ${P}`,style:V,ref:rr,...H,children:r.jsxs(Ar,{direction:"column",gap:20,children:[r.jsx(tn,{variant:"filled",className:"orderconfirmation-header",children:r.jsxs(Ar,{direction:"column",align:"center",gap:12,children:[r.jsx("span",{className:"orderconfirmation-success-icon",children:r.jsx(O,{size:32})}),r.jsx(Dr,{variant:"h4",weight:"bold",align:"center",noMargin:!0,children:i}),r.jsx(Dr,{variant:"body1",align:"center",noMargin:!0,className:"orderconfirmation-subtitle",children:l}),r.jsxs(nn,{variant:"success",style:{padding:"8px 20px",borderRadius:"20px",fontWeight:600,marginTop:"8px"},children:["Order ",e||`#${n}`]})]})}),r.jsx(On,{heading:"Order Details",items:er,variant:"outlined",showDividers:!0}),tr.length>0&&r.jsx(On,{heading:"Customer Information",items:tr,variant:"outlined",showDividers:!0}),r.jsxs(tn,{variant:"outlined",className:"orderconfirmation-items-card",children:[r.jsxs(Dr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Order Items (",v.length,")"]}),r.jsx(Ar,{direction:"column",gap:12,children:v.map((n,e)=>r.jsxs("div",{children:[r.jsxs(Ar,{direction:"row",gap:12,className:"orderconfirmation-item",children:[n.image&&r.jsx("div",{className:"orderconfirmation-item-image-wrapper",children:r.jsx("img",{src:n.image,alt:n.name,className:"orderconfirmation-item-image"})}),r.jsxs(Ar,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,className:"orderconfirmation-item-name",children:n.name}),n.variant&&r.jsx(Dr,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-variant",children:n.variant}),r.jsxs(Dr,{variant:"caption",noMargin:!0,children:["Qty: ",n.quantity]})]}),r.jsxs(Ar,{direction:"column",align:"end",gap:2,children:[r.jsxs(Dr,{variant:"body2",weight:"semibold",noMargin:!0,children:[f,(n.price*n.quantity).toLocaleString()]}),r.jsxs(Dr,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-unit-price",children:[f,n.price.toLocaleString()," each"]})]})]}),e<v.length-1&&r.jsx(xn,{style:{margin:"12px 0"}})]},n.id))})]}),r.jsxs(tn,{variant:"outlined",className:"orderconfirmation-summary-card",children:[r.jsx(Dr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Payment Summary"}),r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Subtotal"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[f,p.toLocaleString()]})]}),m>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Shipping"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[f,m.toLocaleString()]})]}),h>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Tax"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[f,h.toLocaleString()]})]}),g>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:"Discount"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:["-",f,g.toLocaleString()]})]}),r.jsx(xn,{style:{margin:"8px 0"}}),r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),r.jsxs(Dr,{variant:"body1",weight:"bold",noMargin:!0,className:"orderconfirmation-total",children:[f,u.toLocaleString()]})]})]}),ar.length>0&&r.jsxs(r.Fragment,{children:[r.jsx(xn,{style:{margin:"12px 0"}}),r.jsx(Ar,{direction:"column",gap:8,children:ar.map((n,e)=>r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:n.label}),r.jsx(Dr,{variant:"body2",noMargin:!0,className:n.valueClass,children:n.value})]},e))})]})]}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(tn,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Z,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r.jsx(xn,{}),nr(d)]})}),x&&r.jsx(tn,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(K,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r.jsx(xn,{}),nr(x)]})})]}),E&&r.jsx(tn,{variant:"outlined",className:"orderconfirmation-actions-card",children:r.jsxs(Ar,{direction:"column",gap:16,children:[r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"What's Next?"}),r.jsx(xn,{}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[!R&&j&&r.jsx(_,{variant:"primary",size:"md",onClick:()=>j(n),leftIcon:r.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:T}),!B&&N&&k&&r.jsx(_,{variant:"primary",size:"md",onClick:()=>N(n),leftIcon:r.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:I})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[!L&&z&&r.jsx(_,{variant:"outline",size:"md",onClick:z,leftIcon:r.jsx(X,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:$}),C&&r.jsx(_,{variant:"outline",size:"md",onClick:()=>C(n),leftIcon:r.jsx(U,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:A})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",justify:"center",children:[!W&&S&&r.jsx(_,{variant:"ghost",size:"md",onClick:()=>S(n),leftIcon:r.jsx(Q,{size:18}),children:F}),M&&r.jsx(_,{variant:"ghost",size:"md",onClick:()=>M(n),leftIcon:r.jsx(G,{size:18}),children:D})]})]})}),r.jsx(tn,{variant:"filled",className:"orderconfirmation-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:r.jsxs(Ar,{direction:"column",gap:12,align:"center",children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Q,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r.jsx(Dr,{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"}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(Q,{size:16}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(J,{size:16}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Wn.displayName="OrderConfirmation";const Pn=y(Wn);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 Vn=i.default.forwardRef(({orderId:n,orderNumber:e,orderDate:t,status:a,statusText:o,customerName:i,customerEmail:l,customerPhone:s,shippingAddress:c,billingAddress:d,items:x,subtotal:v,shippingCost:p=0,tax:m=0,discount:h=0,total:g,currency:u="₹",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:A,onWriteReview:F,downloadInvoiceText:D="Download Invoice",trackOrderText:E="Track Package",cancelOrderText:R="Cancel Order",returnOrderText:L="Return Items",reorderText:B="Reorder",contactSupportText:O="Contact Support",writeReviewText:W="Write Review",showActions:P=!0,allowCancel:V=!0,allowReturn:H=!0,allowReorder:X=!0,className:G="",style:U,...or},ir)=>{const lr=()=>{switch(w){case"paid":return"success";case"failed":return"error";case"pending":return"warning";case"refunded":return"info";default:return"neutral"}},sr=n=>r.jsxs("div",{className:"orderdetails-address",children:[r.jsx("div",{className:"orderdetails-address-name",children:n.name}),r.jsx("div",{children:n.addressLine1}),n.addressLine2&&r.jsx("div",{children:n.addressLine2}),r.jsxs("div",{children:[n.city,", ",n.state," ",n.zipCode]}),n.phone&&r.jsxs("div",{children:["Phone: ",n.phone]})]}),cr=V&&("pending"===a||"processing"===a),dr=H&&"delivered"===a,xr=z&&("shipped"===a||"delivered"===a),vr=[i?{label:"Name",value:i}:{label:"",value:"",hidden:!0},l?{label:"Email",value:l}:{label:"",value:"",hidden:!0},s?{label:"Phone",value:s}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),pr=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Payment Status",value:r.jsx(nn,{variant:lr(),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(r=>!r.hidden);return r.jsx("div",{className:`orderdetails ${G}`,style:U,ref:ir,...or,children:r.jsxs(Ar,{direction:"column",gap:24,children:[r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Dr,{variant:"h3",weight:"bold",noMargin:!0,children:"Order Details"}),r.jsxs(Dr,{variant:"body1",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:["Placed on ",t]})]}),r.jsx(tn,{variant:"outlined",style:{padding:"32px 24px"},children:r.jsx(yn,{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"})}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(tn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Order Number"}),r.jsx(Dr,{variant:"h6",weight:"bold",noMargin:!0,children:e||`#${n}`})]})}),r.jsx(tn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Status"}),r.jsx(nn,{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)&&r.jsx(tn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:j?"Delivered On":"Estimated Delivery"}),r.jsx(Dr,{variant:"h6",weight:"bold",noMargin:!0,style:{color:j?"var(--vtx-color-success-600)":"inherit"},children:j||k})]})}),w&&r.jsx(tn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Payment"}),r.jsx(nn,{variant:lr(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:w.charAt(0).toUpperCase()+w.slice(1)})]})})]}),P&&(S||xr&&M)&&r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[S&&r.jsx(_,{variant:"outline",size:"md",onClick:()=>S(n),leftIcon:r.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:D}),xr&&M&&r.jsx(_,{variant:"primary",size:"md",onClick:()=>M(n),leftIcon:r.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:E})]}),(z||C)&&r.jsx(tn,{variant:"outlined",children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(rr,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Information"})]}),r.jsx(xn,{}),r.jsxs(Ar,{direction:"column",gap:12,children:[z&&r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Tracking Number"}),N?r.jsx("a",{href:N,target:"_blank",rel:"noopener noreferrer",style:{color:"var(--vtx-color-primary-600)",fontWeight:600,textDecoration:"none"},children:z}):r.jsx(Dr,{variant:"body2",weight:"semibold",noMargin:!0,children:z})]}),C&&r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Dr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Carrier"}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:C})]})]})]})}),r.jsxs(tn,{variant:"outlined",className:"orderdetails-items-card",children:[r.jsxs(Dr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Items (",x.length,")"]}),r.jsx(Ar,{direction:"column",gap:12,children:x.map((n,e)=>r.jsxs("div",{children:[r.jsxs(Ar,{direction:"row",gap:12,className:"orderdetails-item",children:[n.image&&r.jsx("div",{className:"orderdetails-item-image-wrapper",children:r.jsx("img",{src:n.image,alt:n.name,className:"orderdetails-item-image"})}),r.jsxs(Ar,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,className:"orderdetails-item-name",children:n.name}),n.variant&&r.jsx(Dr,{variant:"caption",noMargin:!0,className:"orderdetails-item-variant",children:n.variant}),r.jsxs(Dr,{variant:"caption",noMargin:!0,children:["Qty: ",n.quantity]})]}),r.jsxs(Ar,{direction:"column",align:"end",gap:2,children:[r.jsxs(Dr,{variant:"body2",weight:"semibold",noMargin:!0,children:[u,(n.price*n.quantity).toLocaleString()]}),r.jsxs(Dr,{variant:"caption",noMargin:!0,className:"orderdetails-item-unit-price",children:[u,n.price.toLocaleString()," each"]})]})]}),e<x.length-1&&r.jsx(xn,{style:{margin:"12px 0"}})]},n.id))})]}),r.jsxs(tn,{variant:"outlined",className:"orderdetails-summary-card",children:[r.jsx(Dr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Order Summary"}),r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Subtotal"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[u,v.toLocaleString()]})]}),p>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Shipping"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[u,p.toLocaleString()]})]}),m>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:"Tax"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,children:[u,m.toLocaleString()]})]}),f&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:"Coupon Applied"}),r.jsx(Dr,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:f})]}),h>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:"Discount"}),r.jsxs(Dr,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:["-",u,h.toLocaleString()]})]}),r.jsx(xn,{style:{margin:"8px 0"}}),r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),r.jsxs(Dr,{variant:"body1",weight:"bold",noMargin:!0,className:"orderdetails-total",children:[u,g.toLocaleString()]})]})]}),pr.length>0&&r.jsxs(r.Fragment,{children:[r.jsx(xn,{style:{margin:"12px 0"}}),r.jsx(Ar,{direction:"column",gap:8,children:pr.map((n,e)=>r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Dr,{variant:"body2",noMargin:!0,children:n.label}),r.jsx(Dr,{variant:"body2",noMargin:!0,className:n.valueClass,children:n.value})]},e))})]})]}),vr.length>0&&r.jsx(On,{heading:"Customer Information",items:vr,variant:"outlined",showDividers:!0}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(tn,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Z,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r.jsx(xn,{}),sr(c)]})}),d&&r.jsx(tn,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(K,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r.jsx(xn,{}),sr(d)]})})]}),P&&r.jsx(tn,{variant:"outlined",className:"orderdetails-actions-card",children:r.jsxs(Ar,{direction:"column",gap:16,children:[r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Order Actions"}),r.jsx(xn,{}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[cr&&T&&r.jsx(_,{variant:"outline",size:"md",onClick:()=>T(n),leftIcon:r.jsx(nr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px",borderColor:"var(--vtx-color-error-500)",color:"var(--vtx-color-error-600)"},children:R}),dr&&$&&r.jsx(_,{variant:"outline",size:"md",onClick:()=>$(n),leftIcon:r.jsx(er,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:L}),X&&I&&r.jsx(_,{variant:"outline",size:"md",onClick:()=>I(n),leftIcon:r.jsx(tr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:B})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:["delivered"===a&&F&&r.jsx(_,{variant:"ghost",size:"md",onClick:()=>F(n),leftIcon:r.jsx(ar,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:W}),A&&r.jsx(_,{variant:"ghost",size:"md",onClick:()=>A(n),leftIcon:r.jsx(Q,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:O})]})]})}),r.jsx(tn,{variant:"filled",className:"orderdetails-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:r.jsxs(Ar,{direction:"column",gap:12,align:"center",children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Q,{size:20}),r.jsx(Dr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r.jsx(Dr,{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"}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(Q,{size:16}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(J,{size:16}),r.jsx(Dr,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Vn.displayName="OrderDetails";const Hn=y(Vn);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 Yn=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:l=!1,sticky:s=!1,fullWidth:c=!1,searchEnabled:d=!1,searchPlaceholder:x="Search...",onSearch:v,onLogoClick:p,layout:m="single-row",twoRowBottomStyle:h="default",topBar:g,scrollBehavior:u,scrollThreshold:f=50,onScrollStateChange:b,className:w="",style:y,...k},j)=>{const[_,z]=n.useState(""),[N,C]=n.useState(null),[S,M]=n.useState(!1),[T,$]=n.useState(!1);i.default.useEffect(()=>{if(!u)return;const r=()=>{const r=window.scrollY>f;$(n=>(n!==r&&(null==b||b(r)),r))};return window.addEventListener("scroll",r,{passive:!0}),()=>window.removeEventListener("scroll",r)},[u,f,b]);const A=["vtx-header","vtx-header--desktop",`vtx-header--${o}`,`vtx-header--layout-${m}`,"two-row"===m&&"default"!==h&&`vtx-header--${h}`,l&&"vtx-header--elevated",s&&"vtx-header--sticky",c&&"vtx-header--full-width",g&&!S&&"vtx-header--has-topbar",u&&"vtx-header--scroll-behavior",u&&T&&"vtx-header--scrolled",w].filter(Boolean).join(" "),F=r=>{r.preventDefault(),v&&v(_)},D=n=>{const e=n.children&&n.children.length>0,t=n.megaMenu&&n.megaMenuColumns&&n.megaMenuColumns.length>0,a=N===n.id;return r.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(n.id),onMouseLeave:()=>(e||t)&&C(null),children:[r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:`vtx-header__nav-link ${n.active?"vtx-header__nav-link--active":""} ${n.disabled?"vtx-header__nav-link--disabled":""}`,"aria-current":n.active?"page":void 0,"aria-disabled":n.disabled,children:[n.icon&&r.jsx("span",{className:"vtx-header__nav-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__nav-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__nav-badge",children:n.badge}),(e||t)&&r.jsx(I,{className:"vtx-header__nav-chevron",size:16})]}),t&&a&&r.jsx("div",{className:"vtx-header__mega-menu",children:r.jsx("div",{className:"vtx-header__mega-menu-container",children:n.megaMenuColumns.map((n,e)=>r.jsxs("div",{className:"vtx-header__mega-menu-column",children:[n.title&&r.jsx(Dr,{variant:"overline",weight:"bold",className:"vtx-header__mega-menu-column-title",children:n.title}),r.jsx("div",{className:"vtx-header__mega-menu-items",children:n.items.map(n=>r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:"vtx-header__mega-menu-item "+(n.active?"vtx-header__mega-menu-item--active":""),children:[n.icon&&r.jsx("span",{className:"vtx-header__mega-menu-icon",children:n.icon}),r.jsxs("div",{className:"vtx-header__mega-menu-item-content",children:[r.jsx(Dr,{variant:"body2",weight:"semibold",className:"vtx-header__mega-menu-item-label",children:n.label}),n.description&&r.jsx(Dr,{variant:"caption",color:"#6b7280",className:"vtx-header__mega-menu-item-description",children:n.description})]}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__mega-menu-badge",children:n.badge})]},n.id))})]},e))})}),e&&!t&&a&&r.jsx("div",{className:"vtx-header__dropdown",children:n.children.map(n=>r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:`vtx-header__dropdown-item ${n.active?"vtx-header__dropdown-item--active":""} ${n.disabled?"vtx-header__dropdown-item--disabled":""}`,children:[n.icon&&r.jsx("span",{className:"vtx-header__dropdown-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__dropdown-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__dropdown-badge",children:n.badge})]},n.id))})]},n.id)},E=()=>{if(!g||S)return null;const n=g.variant||"subtle";return r.jsx("div",{className:`vtx-header__topbar vtx-header__topbar--${n}`,children:r.jsxs("div",{className:"vtx-header__topbar-container",children:[g.leftContent&&r.jsx("div",{className:"vtx-header__topbar-left",children:g.leftContent}),g.content&&r.jsx("div",{className:"vtx-header__topbar-content",children:g.content}),g.rightContent&&r.jsx("div",{className:"vtx-header__topbar-right",children:g.rightContent}),g.dismissible&&r.jsx("button",{className:"vtx-header__topbar-dismiss",onClick:()=>{var r;M(!0),null===(r=g.onDismiss)||void 0===r||r.call(g)},"aria-label":"Dismiss",children:r.jsx(nr,{size:14})})]})})};return"single-row"===m?r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(D)}),r.jsxs("div",{className:"vtx-header__actions",children:[d&&r.jsxs("form",{onSubmit:F,className:"vtx-header__search",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:_,onChange:r=>z(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]}):"two-row"===m?r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsx("div",{className:"vtx-header__top-row",children:r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),d&&r.jsxs("form",{onSubmit:F,className:"vtx-header__search vtx-header__search--expanded",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:_,onChange:r=>z(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),t.length>0&&r.jsx("div",{className:"vtx-header__bottom-row",children:r.jsx("div",{className:"vtx-header__container",children:r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(D)})})})]}):r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(D)}),r.jsxs("div",{className:"vtx-header__actions",children:[d&&r.jsxs("form",{onSubmit:F,className:"vtx-header__search",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:_,onChange:r=>z(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]})});Yn.displayName="HeaderDesktop";const qn=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:i=!1,sticky:l=!1,searchEnabled:s=!1,searchPlaceholder:c="Search...",onSearch:d,onLogoClick:x,menuOpen:v,onMenuOpenChange:p,className:m="",style:h,...g},u)=>{const[f,b]=n.useState(!1),[w,y]=n.useState(""),[k,j]=n.useState(new Set),_=void 0!==v,z=_?v:f,N=r=>{_?null==p||p(r):b(r)},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=r=>{const n=new Set(k);n.has(r)?n.delete(r):n.add(r),j(n)},M=(n,e=0)=>{const t=n.children&&n.children.length>0,a=k.has(n.id);return r.jsxs("div",{className:`vtx-header__mobile-nav-item vtx-header__mobile-nav-item--level-${e}`,children:[r.jsxs("div",{className:"vtx-header__mobile-nav-link-wrapper",children:[r.jsxs("a",{href:n.href,onClick:r=>{t?(r.preventDefault(),S(n.id)):n.onClick?(r.preventDefault(),n.onClick(),N(!1)):N(!1)},className:`vtx-header__mobile-nav-link ${n.active?"vtx-header__mobile-nav-link--active":""} ${n.disabled?"vtx-header__mobile-nav-link--disabled":""}`,"aria-current":n.active?"page":void 0,"aria-disabled":n.disabled,children:[n.icon&&r.jsx("span",{className:"vtx-header__mobile-nav-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__mobile-nav-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__mobile-nav-badge",children:n.badge})]}),t&&r.jsx("button",{className:"vtx-header__mobile-nav-toggle "+(a?"vtx-header__mobile-nav-toggle--expanded":""),onClick:()=>S(n.id),"aria-label":`Toggle ${n.label} submenu`,"aria-expanded":a,children:r.jsx(I,{size:16})})]}),t&&a&&r.jsx("div",{className:"vtx-header__mobile-nav-children",children:n.children.map(r=>M(r,e+1))})]},n.id)};return r.jsxs(r.Fragment,{children:[r.jsx("header",{ref:u,className:C,style:h,...g,children:r.jsxs("div",{className:"vtx-header__container",children:[r.jsx("button",{className:"vtx-header__menu-toggle",onClick:()=>N(!z),"aria-label":"Toggle menu","aria-expanded":z,children:z?r.jsx(nr,{size:24}):r.jsx(E,{size:24})}),e&&r.jsx("div",{className:"vtx-header__logo",onClick:x,style:{cursor:x?"pointer":"default"},children:e}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),z&&r.jsx("div",{className:"vtx-header__overlay",onClick:()=>N(!1),"aria-hidden":"true"}),r.jsx("div",{className:"vtx-header__mobile-menu "+(z?"vtx-header__mobile-menu--open":""),children:r.jsxs("div",{className:"vtx-header__mobile-menu-content",children:[s&&r.jsxs("form",{onSubmit:r=>{r.preventDefault(),d&&d(w)},className:"vtx-header__mobile-search",children:[r.jsx(or,{className:"vtx-header__mobile-search-icon",size:18}),r.jsx("input",{type:"search",placeholder:c,value:w,onChange:r=>y(r.target.value),className:"vtx-header__mobile-search-input","aria-label":"Search"})]}),t.length>0&&r.jsx("nav",{className:"vtx-header__mobile-nav","aria-label":"Mobile navigation",children:t.map(r=>M(r))}),a&&r.jsx("div",{className:"vtx-header__mobile-actions",children:a})]})})]})});qn.displayName="HeaderMobile";const Xn=({desktopProps:e,mobileProps:t,breakpoint:a=768})=>{const[o,l]=n.useState(!1);return i.default.useEffect(()=>{const r=()=>{l(window.innerWidth<a)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[a]),o?r.jsx(qn,{...t}):r.jsx(Yn,{...e})};Xn.displayName="HeaderResponsive";const Gn={Desktop:y(Yn),Mobile:y(qn),Responsive:Xn};exports.Accordion=Sr,exports.AccordionItem=Cr,exports.Alert=$r,exports.Avatar=Jr,exports.Badge=nn,exports.Button=_,exports.Card=tn,exports.Checkbox=N,exports.CheckboxGroup=S,exports.Chip=fr,exports.DataGrid=cn,exports.Divider=xn,exports.Flex=Ar,exports.Grid=jn,exports.Header=mn,exports.HomeHeader=Gn,exports.InfoCard=Nn,exports.InfoListCard=On,exports.InfoText=In,exports.Input=gr,exports.Menu=Br,exports.MenuItem=Rr,exports.Modal=Wr,exports.MultiSelect=wr,exports.OrderCard=Ln,exports.OrderConfirmation=Pn,exports.OrderDetails=Hn,exports.ProductCard=En,exports.Radio=kr,exports.RadioGroup=_r,exports.Select=Nr,exports.SideMenu=fn,exports.Table=wn,exports.Text=Dr,exports.ThemeProvider=m,exports.Timeline=yn,exports.Toast=Hr,exports.ToastContainer=({children:n,...e})=>r.jsxs(Xr,{children:[n,r.jsx(Kr,{...e})]}),exports.Tooltip=Qr,exports.generateCSSVariables=x,exports.injectCSSVariables=v,exports.toast=Ur,exports.tokens=d,exports.useBodyScrollLock=vr,exports.useClickOutside=(r,e)=>{n.useEffect(()=>{const n=n=>{const t=null==r?void 0:r.current;t&&!t.contains(n.target)&&e(n)};return document.addEventListener("mousedown",n),document.addEventListener("touchstart",n),()=>{document.removeEventListener("mousedown",n),document.removeEventListener("touchstart",n)}},[r,e])},exports.useDebounce=(r,e)=>{const[t,a]=n.useState(r);return n.useEffect(()=>{const n=setTimeout(()=>{a(r)},e);return()=>{clearTimeout(n)}},[r,e]),t},exports.useEscapeKey=xr,exports.useFocusTrap=dr,exports.useId=mr,exports.useThemeContext=h,exports.useToast=qr;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("react/jsx-runtime"),n=require("react"),e=require("react-icons/fi"),t=require("react-dom");function a(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}function o(r){if(r&&r.__esModule)return r;var n=Object.create(null);return r&&Object.keys(r).forEach(function(e){if("default"!==e){var t=Object.getOwnPropertyDescriptor(r,e);Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return r[e]}})}}),n.default=r,Object.freeze(n)}var i=a(n),l=o(n);function d(r){const n=r.replace("#",""),e=parseInt(n.substring(0,2),16),t=parseInt(n.substring(2,4),16),a=parseInt(n.substring(4,6),16),o={},i={50:.95,100:.9,200:.75,300:.6,400:.3,500:0,600:-.15,700:-.3,800:-.45,900:-.6};for(const[n,l]of Object.entries(i))if(0===l)o[Number(n)]=r.startsWith("#")?r:`#${r}`;else{let r,i,d;l>0?(r=Math.round(e+(255-e)*l),i=Math.round(t+(255-t)*l),d=Math.round(a+(255-a)*l)):(r=Math.round(e*(1+l)),i=Math.round(t*(1+l)),d=Math.round(a*(1+l))),r=Math.max(0,Math.min(255,r)),i=Math.max(0,Math.min(255,i)),d=Math.max(0,Math.min(255,d));const s=`#${r.toString(16).padStart(2,"0")}${i.toString(16).padStart(2,"0")}${d.toString(16).padStart(2,"0")}`;o[Number(n)]=s}return o}function s(r){const n={};for(const[e,t]of Object.entries(r))if("string"==typeof t)n[e]=d(t);else if("object"==typeof t&&null!==t)if(t[500]){const r=d(t[500]);n[e]={...r,...t}}else n[e]=t;return n}const c={colors:{primary:d("#0c6b58"),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 r=[];return Object.entries(c.colors).forEach(([n,e])=>{"object"==typeof e?Object.entries(e).forEach(([e,t])=>{r.push(`  --vtx-color-${n}-${e}: ${t};`)}):r.push(`  --vtx-color-${n}: ${e};`)}),Object.entries(c.spacing).forEach(([n,e])=>{r.push(`  --vtx-spacing-${n}: ${e};`)}),Object.entries(c.typography.fontFamily).forEach(([n,e])=>{r.push(`  --vtx-font-family-${n}: ${e};`)}),Object.entries(c.typography.fontSize).forEach(([n,e])=>{r.push(`  --vtx-font-size-${n}: ${e};`)}),Object.entries(c.typography.fontWeight).forEach(([n,e])=>{r.push(`  --vtx-font-weight-${n}: ${e};`)}),Object.entries(c.typography.lineHeight).forEach(([n,e])=>{r.push(`  --vtx-line-height-${n}: ${e};`)}),Object.entries(c.typography.letterSpacing).forEach(([n,e])=>{r.push(`  --vtx-letter-spacing-${n}: ${e};`)}),Object.entries(c.typography.textVariants).forEach(([n,e])=>{Object.entries(e).forEach(([e,t])=>{const a=e.replace(/([A-Z])/g,"-$1").toLowerCase();r.push(`  --vtx-text-${n}-${a}: ${t};`)})}),Object.entries(c.borderRadius).forEach(([n,e])=>{r.push(`  --vtx-radius-${n}: ${e};`)}),Object.entries(c.shadows).forEach(([n,e])=>{r.push(`  --vtx-shadow-${n}: ${e};`)}),Object.entries(c.transitions).forEach(([n,e])=>{r.push(`  --vtx-transition-${n}: ${e};`)}),Object.entries(c.zIndex).forEach(([n,e])=>{r.push(`  --vtx-z-${n}: ${e};`)}),r.join("\n")}function v(){if("undefined"==typeof document)return;const r="vtx-ui-variables";let n=document.getElementById(r);n||(n=document.createElement("style"),n.id=r,document.head.appendChild(n));const e=x();n.textContent=`:root {\n${e}\n}`}const m=i.default.createContext(void 0),p=i.default.forwardRef(({children:n,initialMode:e="light",customTokens:t,defaultSize:a="md",...o},l)=>{const[d,x]=i.default.useState(e),[p,h]=i.default.useState(a),u=i.default.useMemo(()=>{if(!t)return{tokens:c,mode:d,defaultSize:p};let r={...c,...t};return t.colors&&(r.colors={...c.colors,...s(t.colors)}),{tokens:r,mode:d,defaultSize:p}},[t,d,p]);i.default.useEffect(()=>{document.documentElement.setAttribute("data-theme",d),t&&v()},[d,t]);const g=i.default.useMemo(()=>({theme:u,setMode:x,setDefaultSize:h}),[u]);return r.jsx(m.Provider,{value:g,children:r.jsx("div",{ref:l,...o,children:n})})});p.displayName="ThemeProvider";const h=()=>{const r=i.default.useContext(m);if(!r)throw new Error("useThemeContext must be used within a ThemeProvider");return r},u="dynamic-styles";function g(){let r=document.getElementById(u);return r||(r=document.createElement("style"),r.id=u,document.head.appendChild(r)),r}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(n){const e=e=>{const t=(e.className||"").split(" ").map(r=>function(r){let n=r.match(/^([a-z]+)-\[(.+)\]$/);if(n){const r=n[1],e=n[2],t=`${r}-${e.replace(/[^a-z0-9]/gi,"")}`,a=w[r];if(a){let n;return n="mx"===r?`.${t} { margin-left: ${e}; margin-right: ${e}; }`:"my"===r?`.${t} { margin-top: ${e}; margin-bottom: ${e}; }`:"px"===r?`.${t} { padding-left: ${e}; padding-right: ${e}; }`:"py"===r?`.${t} { padding-top: ${e}; padding-bottom: ${e}; }`:`.${t} { ${a}: ${e}; }`,f.has(n)||(g().appendChild(document.createTextNode(n)),f.add(n)),t}}if(n=r.match(/^([a-z]+)-(.+)$/),n){const r=n[1],e=n[2],t=w[r],a=b[e];if(t&&a){const n=`${r}-${e.replace(/[^a-z0-9]/gi,"")}`;let o;return o="mx"===r?`.${n} { margin-left: ${a}; margin-right: ${a}; }`:"my"===r?`.${n} { margin-top: ${a}; margin-bottom: ${a}; }`:"px"===r?`.${n} { padding-left: ${a}; padding-right: ${a}; }`:"py"===r?`.${n} { padding-top: ${a}; padding-bottom: ${a}; }`:`.${n} { ${t}: ${a}; }`,f.has(o)||(g().appendChild(document.createTextNode(o)),f.add(o)),n}}return r}(r)).join(" ");return r.jsx(n,{...e,className:t})};return e.displayName=n.displayName||n.name||"Component",e}function k(r,n){void 0===n&&(n={});var e=n.insertAt;if(r&&"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=r:a.appendChild(document.createTextNode(r))}}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:n,variant:e="primary",size:t,fullWidth:a=!1,loading:o=!1,disabled:i=!1,leftIcon:l,rightIcon:d,iconOnly:s=!1,loadingText:c,asLink:x=!1,href:v,target:m,rel:p,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=r.jsxs(r.Fragment,{children:[o&&r.jsx("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:r.jsx("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:r.jsx("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!o&&l&&r.jsx("span",{className:"vtx-button__icon-left",children:l}),!s&&r.jsx("span",{className:"vtx-button__content",children:o&&c?c:n}),s&&!o&&n,!o&&d&&r.jsx("span",{className:"vtx-button__icon-right",children:d})]});return x&&v?r.jsx("a",{ref:b,href:v,target:m,rel:"_blank"===m?"noopener noreferrer":p,className:y,"aria-disabled":i||o,style:k,...f,children:j}):r.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 z=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 N=i.default.forwardRef(({checked:e,indeterminate:t=!1,disabled:a=!1,label:o,size:i,variant:l="primary",error:d=!1,helperText:s,onChange:c,className:x="",inputClassName:v="",id:m,...p},u)=>{const{theme:g}=h(),f=i||g.defaultSize||"md",b=n.useId(),w=m||b,y=["vtx-checkbox",`vtx-checkbox--${f}`,`vtx-checkbox--${l}`,a&&"vtx-checkbox--disabled",d&&"vtx-checkbox--error",x].filter(Boolean).join(" "),k=["vtx-checkbox-input",v].filter(Boolean).join(" "),j=n.useRef(null);return n.useImperativeHandle(u,()=>j.current),n.useEffect(()=>{j.current&&(j.current.indeterminate=t)},[t]),r.jsxs("div",{className:y,children:[r.jsxs("label",{className:"vtx-checkbox-label",htmlFor:w,children:[r.jsxs("span",{className:"vtx-checkbox-wrapper",children:[r.jsx("input",{ref:j,type:"checkbox",id:w,className:k,checked:e,disabled:a,onChange:c,...p}),r.jsxs("span",{className:"vtx-checkbox-box",children:[r.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),r.jsx("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r.jsx("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),o&&r.jsx("span",{className:"vtx-checkbox-label-text",children:o})]}),s&&r.jsx("div",{className:"vtx-checkbox-helper-text",children:s})]})});N.displayName="Checkbox";const _=y(N);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:d=!1,helperText:s,orientation:c="vertical",size:x,className:v="",...m},p)=>{const{theme:u}=h(),g=x||u.defaultSize||"md",[f,b]=n.useState(o||[]),w=void 0!==a,y=w?a:f,k=["vtx-checkbox-group",`vtx-checkbox-group--${c}`,d&&"vtx-checkbox-group--error",l&&"vtx-checkbox-group--disabled",v].filter(Boolean).join(" ");return r.jsxs("div",{ref:p,className:k,...m,children:[e&&r.jsx("div",{className:"vtx-checkbox-group-label",children:e}),r.jsx("div",{className:"vtx-checkbox-group-options",children:t.map(n=>{const e=y.includes(n.value),t=l||n.disabled;return r.jsx(_,{label:n.label,checked:e,disabled:t,error:d,size:g,onChange:r=>((r,n)=>{const e=n?[...y,r]:y.filter(n=>n!==r);w||b(e),null==i||i(e)})(n.value,r.target.checked)},n.value)})}),s&&r.jsx("div",{className:"vtx-checkbox-group-helper-text",children:s})]})});C.displayName="CheckboxGroup";const S=y(C),M=n=>r.jsxs("svg",{className:"vtx-multiselect-icon-spinner",width:n.size||16,height:n.size||16,viewBox:"0 0 16 16",fill:"none",children:[r.jsx("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r.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,$=n=>r.jsx(e.FiX,{size:n.size||12,"aria-hidden":"true"}),I=e.FiChevronDown,A=e.FiPlus,D=e.FiMinus,F=e.FiBell,E=e.FiMenu,R=e.FiChevronUp,L=e.FiChevronLeft,B=e.FiChevronRight,O=e.FiCheckCircle,W=e.FiAlertCircle,P=e.FiAlertTriangle,V=e.FiInfo,H=e.FiMinusCircle,Y=e.FiDownload,q=e.FiPackage,U=e.FiShoppingBag,G=e.FiShare2,X=e.FiEye,K=e.FiCreditCard,Q=e.FiMessageCircle,Z=e.FiMapPin,J=e.FiPhone,rr=e.FiTruck,nr=e.FiX,er=e.FiCornerUpLeft,tr=e.FiRefreshCw,ar=e.FiStar,or=e.FiSearch,ir=e.FiArrowUp,lr=e.FiArrowDown,dr=e.FiChevronsLeft,sr=e.FiChevronsRight,cr=(r,e)=>{n.useEffect(()=>{if(!e)return;const n=r.current;if(!n)return;const t=n.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=r=>{"Tab"===r.key&&(r.shiftKey?document.activeElement===a&&(null==o||o.focus(),r.preventDefault()):document.activeElement===o&&(null==a||a.focus(),r.preventDefault()))};return null==a||a.focus(),n.addEventListener("keydown",i),()=>{n.removeEventListener("keydown",i)}},[r,e])},xr=r=>{n.useEffect(()=>{const n=n=>{"Escape"===n.key&&r()};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[r])},vr=r=>{n.useEffect(()=>{if(!r)return;const n=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=n}},[r])};let mr=0;const pr=(r="vtx")=>{const[e]=n.useState(()=>`${r}-${++mr}`);return e};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(".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--sm {\n  min-height: 32px;\n}\n\n.vtx-input-container--md {\n  min-height: 40px;\n}\n\n.vtx-input-container--lg {\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--sm .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--lg .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 hr=i.default.forwardRef(({label:n,helperText:e,error:t,success:a,size:o,fullWidth:i=!1,leftIcon:l,rightIcon:d,clearable:s=!1,onClear:c,showCount:x=!1,className:v="",wrapperClassName:m="",labelClassName:p="",inputClassName:u="",prefix:g,suffix:f,id:b,disabled:w=!1,required:y=!1,value:k,maxLength:j,...z},N)=>{const{theme:_}=h(),C=o||_.defaultSize,S=pr("input"),M=b||S,T=`${M}-helper`,I=`${M}-error`,A=`${M}-success`,D=Boolean(t),F=Boolean(a)&&!D,E=s&&k&&String(k).length>0&&!w,R=[e&&!t&&!a&&T,t&&I,a&&A].filter(Boolean).join(" "),L=["vtx-input-wrapper",i&&"vtx-input-wrapper--full-width",m].filter(Boolean).join(" "),B=["vtx-input-container",`vtx-input-container--${C}`,D&&"vtx-input-container--error",F&&"vtx-input-container--success",w&&"vtx-input-container--disabled",(l||g)&&"vtx-input-container--with-left-element",(d||f||E)&&"vtx-input-container--with-right-element",v].filter(Boolean).join(" "),O=k?String(k).length:0,W=x&&j;return r.jsxs("div",{className:L,children:[n&&r.jsxs("label",{htmlFor:M,className:`vtx-input-label ${p}`.trim(),children:[n,y&&r.jsxs("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{className:B,children:[l&&r.jsx("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:l}),g&&r.jsx("span",{className:"vtx-input-prefix","aria-hidden":"true",children:g}),r.jsx("input",{ref:N,id:M,className:`vtx-input ${u}`.trim(),disabled:w,required:y,value:k,maxLength:j,"aria-invalid":D,"aria-describedby":R||void 0,...z}),f&&r.jsx("span",{className:"vtx-input-suffix","aria-hidden":"true",children:f}),E&&r.jsx("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==c||c()},"aria-label":"Clear input",tabIndex:-1,children:r.jsx($,{size:16})}),d&&!E&&r.jsx("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:d})]}),e&&!t&&!a&&r.jsx("p",{id:T,className:"vtx-input-helper",children:e}),t&&r.jsx("p",{id:I,className:"vtx-input-error",role:"alert",children:t}),a&&r.jsx("p",{id:A,className:"vtx-input-success",role:"status",children:a}),W&&r.jsxs("p",{className:"vtx-input-counter","aria-live":"polite",children:[O," / ",j]})]})});hr.displayName="Input";const ur=y(hr);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 gr=i.default.forwardRef(({label:n,size:e="md",variant:t="filled",color:a="default",icon:o,avatar:i,onDelete:l,onClick:d,disabled:s=!1,className:c="","aria-label":x,"data-testid":v},m)=>{const p=["vtx-chip",`vtx-chip--${e}`,`vtx-chip--${t}`,`vtx-chip--${a}`,d&&!s&&"vtx-chip--clickable",s&&"vtx-chip--disabled",c].filter(Boolean).join(" ");return r.jsxs("div",{ref:m,className:p,onClick:r=>{!s&&d&&d(r)},onKeyDown:r=>{s||!d||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),d(r))},role:d?"button":void 0,tabIndex:d&&!s?0:void 0,"aria-label":x||n,"aria-disabled":s,"data-testid":v,children:[i&&r.jsx("img",{src:i,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),o&&!i&&r.jsx("span",{className:"vtx-chip__icon","aria-hidden":"true",children:o}),r.jsx("span",{className:"vtx-chip__label",children:n}),l&&r.jsx("button",{type:"button",className:"vtx-chip__delete",onClick:r=>{r.stopPropagation(),!s&&l&&l(r)},onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),r.stopPropagation(),!s&&l&&l(r))},disabled:s,"aria-label":`Remove ${n}`,tabIndex:-1,children:r.jsx($,{size:16})})]})});gr.displayName="Chip";const fr=y(gr);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 br=i.default.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,options:d,value:s,defaultValue:c=[],placeholder:x="Select...",className:v="",grouped:m=!1,getOptionLabel:p="label",getOptionValue:u="value",getOptionDisabled:g="disabled",getOptionGroup:f="group",onChange:b,disabled:w=!1,required:y=!1,id:k,name:j,selectionStyle:z="checkbox",searchable:N=!1,showSelectAll:_=!1,maxChipsDisplay:C,chipColor:S="primary",chipVariant:$="light",loading:A=!1},D)=>{const{theme:F}=h(),E=pr("multiselect"),R=k||E,L=`${R}-helper`,B=`${R}-error`,O=`${R}-success`,[W,P]=n.useState(!1),[V,H]=n.useState(""),[Y,q]=n.useState(c),U=n.useRef(null),G=n.useRef(null),X=void 0!==s?s:Y,K=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,Q=Boolean(a),Z=Boolean(o)&&!Q,J=[t&&!a&&!o&&L,a&&B,o&&O].filter(Boolean).join(" ");n.useEffect(()=>{const r=r=>{U.current&&!U.current.contains(r.target)&&G.current&&!G.current.contains(r.target)&&(P(!1),H(""))};if(W)return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[W]);const rr=r=>{if(w)return;const n=X.includes(r)?X.filter(n=>n!==r):[...X,r];if(void 0===s&&q(n),b){const r=d.filter(r=>n.includes(K(r,u)));b(n,r)}},nr=V?d.filter(r=>K(r,p).toLowerCase().includes(V.toLowerCase())):d,er=m?nr.reduce((r,n)=>{const e=K(n,f)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{}):{"":nr},tr=d.filter(r=>X.includes(K(r,u))),ar=C?tr.slice(0,C):tr,or=C?tr.length-C:0,ir=["vtx-multiselect-wrapper",l&&"vtx-multiselect-wrapper--full-width",v].filter(Boolean).join(" "),lr=i||(null==F?void 0:F.defaultSize)||"md",dr=["vtx-multiselect-container",`vtx-multiselect-container--${lr}`,Q&&"vtx-multiselect-container--error",Z&&"vtx-multiselect-container--success",w&&"vtx-multiselect-container--disabled",W&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),sr=lr;return r.jsxs("div",{className:ir,ref:D,children:[e&&r.jsxs("label",{htmlFor:R,className:"vtx-multiselect-label",children:[e,y&&r.jsxs("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{ref:U,className:dr,"aria-expanded":W,"aria-haspopup":"listbox","aria-labelledby":e?`${R}-label`:void 0,"aria-describedby":J||void 0,"aria-disabled":w,children:[r.jsx("div",{className:"vtx-multiselect-input-area",onClick:()=>!w&&P(!W),role:"button",tabIndex:w?-1:0,onKeyDown:r=>{w||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),P(!W))},children:0===tr.length?r.jsx("span",{className:"vtx-multiselect-placeholder",children:x}):r.jsxs("div",{className:"vtx-multiselect-chips",children:[ar.map(n=>{const e=K(n,u),t=K(n,p);return r.jsx(fr,{label:t,size:sr,color:S,variant:$,onDelete:r=>{r.stopPropagation(),(r=>{if(w)return;const n=X.filter(n=>n!==r);if(void 0===s&&q(n),b){const r=d.filter(r=>n.includes(K(r,u)));b(n,r)}})(e)}},e)}),or>0&&r.jsx(fr,{label:`+${or} more`,size:sr,color:"default",variant:"outlined"})]})}),r.jsx("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:A?r.jsx(M,{size:16}):r.jsx(I,{size:16})}),W&&r.jsxs("div",{ref:G,className:"vtx-multiselect-dropdown",role:"listbox",children:[N&&r.jsx("div",{className:"vtx-multiselect-search",children:r.jsx("input",{type:"text",placeholder:"Search...",value:V,onChange:r=>H(r.target.value),onClick:r=>r.stopPropagation()})}),_&&r.jsxs("div",{className:"vtx-multiselect-actions",children:[r.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),(()=>{const r=d.filter(r=>!K(r,g)).map(r=>K(r,u));void 0===s&&q(r),b&&b(r,d.filter(r=>!K(r,g)))})()},children:"Select All"}),r.jsx("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),void 0===s&&q([]),b&&b([],[])},children:"Clear All"})]}),r.jsx("div",{className:"vtx-multiselect-options",children:0===nr.length?r.jsx("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(er).map(([n,e])=>r.jsxs("div",{children:[m&&n&&r.jsx("div",{className:"vtx-multiselect-optgroup",children:n}),e.map(n=>{const e=K(n,u),t=K(n,p),a=K(n,g),o=X.includes(e),i=["vtx-multiselect-option",o&&"vtx-multiselect-option--selected",a&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return r.jsxs("div",{className:i,onClick:()=>!a&&rr(e),role:"option","aria-selected":o,"aria-disabled":a,tabIndex:a?-1:0,onKeyDown:r=>{a||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),rr(e))},children:["checkbox"===z&&r.jsx("div",{className:"vtx-multiselect-checkbox "+(o?"vtx-multiselect-checkbox--checked":""),children:o&&r.jsx(T,{size:16})}),r.jsx("span",{className:"vtx-multiselect-option-label",children:t}),"checkmark"===z&&r.jsx("div",{className:"vtx-multiselect-checkmark",children:o&&r.jsx(T,{size:20})})]},e)})]},n))})]})]}),j&&r.jsx("select",{multiple:!0,name:j,value:X.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:y,disabled:w,tabIndex:-1,"aria-hidden":"true",children:d.map(n=>{const e=K(n,u);return r.jsx("option",{value:String(e),children:K(n,p)},e)})}),t&&!a&&!o&&r.jsx("p",{id:L,className:"vtx-multiselect-helper",children:t}),a&&r.jsx("p",{id:B,className:"vtx-multiselect-error",role:"alert",children:a}),o&&r.jsx("p",{id:O,className:"vtx-multiselect-success",role:"status",children:o})]})});br.displayName="MultiSelect";const wr=y(br);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--sm {\n  --vtx-radio-size: 16px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--sm .vtx-radio-label-text {\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-radio--md {\n  --vtx-radio-size: 20px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--lg {\n  --vtx-radio-size: 24px;\n  --vtx-radio-border-width: 2px;\n}\n\n.vtx-radio--lg .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 yr=i.default.forwardRef(({checked:e,disabled:t=!1,label:a,size:o,variant:i="primary",error:l=!1,helperText:d,onChange:s,className:c="",inputClassName:x="",id:v,...m},p)=>{const{theme:u}=h(),g=o||u.defaultSize,f=n.useId(),b=v||f,w=d?`${b}-helper-text`:void 0,y=["vtx-radio",`vtx-radio--${g}`,`vtx-radio--${i}`,t&&"vtx-radio--disabled",l&&"vtx-radio--error",c].filter(Boolean).join(" "),k=["vtx-radio-input",x].filter(Boolean).join(" "),j=r.jsxs("div",{className:"vtx-radio-wrapper",children:[r.jsx("input",{ref:p,type:"radio",id:b,className:k,checked:e,disabled:t,onChange:s,"aria-describedby":w,...m}),r.jsx("span",{className:"vtx-radio-circle",children:r.jsx("span",{className:"vtx-radio-dot"})})]});return a?r.jsxs("div",{className:y,children:[r.jsxs("label",{htmlFor:b,className:"vtx-radio-label",children:[j,r.jsx("span",{className:"vtx-radio-label-text",children:a})]}),d&&r.jsx("span",{id:w,className:"vtx-radio-helper-text",children:d})]}):r.jsxs("div",{className:y,children:[j,d&&r.jsx("span",{id:w,className:"vtx-radio-helper-text",children:d})]})});yr.displayName="Radio";const kr=y(yr);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 jr=i.default.forwardRef(({name:e,label:t,options:a,value:o,defaultValue:i,onChange:l,disabled:d=!1,error:s=!1,helperText:c,orientation:x="vertical",size:v,variant:m="primary",className:p="",...u},g)=>{const{theme:f}=h(),b=v||f.defaultSize,[w,y]=n.useState(i),k=void 0!==o,j=k?o:w,z=["vtx-radio-group",`vtx-radio-group--${x}`,s&&"vtx-radio-group--error",d&&"vtx-radio-group--disabled",p].filter(Boolean).join(" ");return r.jsxs("div",{ref:g,className:z,role:"radiogroup","aria-label":"string"==typeof t?t:void 0,...u,children:[t&&r.jsx("div",{className:"vtx-radio-group-label",children:t}),r.jsx("div",{className:"vtx-radio-group-options",children:a.map(n=>{const t=j===n.value,a=d||n.disabled;return r.jsx(kr,{name:e,value:n.value,label:n.label,checked:t,disabled:a,error:s,size:b,variant:m,onChange:()=>{return r=n.value,k||y(r),void(null==l||l(r));var r}},n.value)})}),c&&r.jsx("div",{className:"vtx-radio-group-helper-text",children:c})]})});jr.displayName="RadioGroup";const zr=y(jr);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--sm {\n  min-height: 32px;\n}\n\n.vtx-select-container--md {\n  min-height: 40px;\n}\n\n.vtx-select-container--lg {\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--sm .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--lg .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 Nr=i.default.forwardRef(({label:n,helperText:e,error:t,success:a,size:o,fullWidth:i=!1,options:l,placeholder:d,className:s="",wrapperClassName:c="",id:x,disabled:v=!1,required:m=!1,grouped:p=!1,getOptionLabel:u="label",getOptionValue:g="value",getOptionDisabled:f="disabled",getOptionGroup:b="group",onSelectChange:w,onChange:y,loading:k=!1,...j},z)=>{const{theme:N}=h(),_=o||N.defaultSize,C=pr("select"),S=x||C,M=`${S}-helper`,T=`${S}-error`,$=`${S}-success`,I=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,A=Boolean(t),D=Boolean(a)&&!A,F=[e&&!t&&!a&&M,t&&T,a&&$].filter(Boolean).join(" "),E=["vtx-select-wrapper",i&&"vtx-select-wrapper--full-width",c].filter(Boolean).join(" "),R=["vtx-select-container",`vtx-select-container--${_}`,A&&"vtx-select-container--error",D&&"vtx-select-container--success",v&&"vtx-select-container--disabled",s].filter(Boolean).join(" ");return r.jsxs("div",{className:E,children:[n&&r.jsxs("label",{htmlFor:S,className:"vtx-select-label",children:[n,m&&r.jsxs("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),r.jsxs("div",{className:R,children:[r.jsxs("select",{ref:z,id:S,className:"vtx-select",disabled:v,required:m,"aria-invalid":A,"aria-describedby":F||void 0,onChange:r=>{if(null==y||y(r),w){const n=l.find(n=>String(I(n,g))===r.target.value);w(r.target.value,n)}},...j,children:[d&&r.jsx("option",{value:"",disabled:!0,children:d}),(()=>{if(!p)return l.map((n,e)=>{const t=I(n,g),a=I(n,u),o=I(n,f);return r.jsx("option",{value:t,disabled:o,children:a},t||e)});const n=l.reduce((r,n)=>{const e=I(n,b)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{});return Object.entries(n).map(([n,e])=>r.jsx("optgroup",{label:n,children:e.map((n,e)=>{const t=I(n,g),a=I(n,u),o=I(n,f);return r.jsx("option",{value:t,disabled:o,children:a},t||e)})},n))})()]}),r.jsx("span",{className:"vtx-select-icon","aria-hidden":"true",children:k?r.jsxs("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[r.jsx("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r.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"})]}):r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:r.jsx("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),e&&!t&&!a&&r.jsx("p",{id:M,className:"vtx-select-helper",children:e}),t&&r.jsx("p",{id:T,className:"vtx-select-error",role:"alert",children:t}),a&&r.jsx("p",{id:$,className:"vtx-select-success",role:"status",children:a})]})});Nr.displayName="Select";const _r=y(Nr),Cr=i.default.forwardRef(({item:e,isOpen:t,onToggle:a,variant:o="default",size:i="md",showChevron:l=!0,chevronPosition:d="right",expandedIcon:s,collapsedIcon:c,iconType:x="chevron",loading:v=!1,disabled:m=!1,disableAnimations:p=!1},h)=>{const u=n.useRef(null),{id:g,header:f,children:b,disabled:w,className:y,loading:k,status:j="default",icon:z,dataTestId:N}=e,_=m||w,C=v||k,S=()=>{_||C||a()},M=()=>z?r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${N||g}-custom-icon`,children:t?z.expanded:z.collapsed}):"custom"===x&&s&&c?r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${N||g}-custom-icon`,children:t?s:c}):"plus-minus"===x?r.jsx("div",{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(t?"open":""),"data-testid":`${N||g}-plus-minus-icon`,children:t?r.jsx(D,{size:16,"aria-hidden":"true"}):r.jsx(r.Fragment,{children:r.jsx(A,{size:16,"aria-hidden":"true"})})}):r.jsx("div",{className:"accordion-item-chevron "+(t?"open":""),"data-testid":`${N||g}-chevron-icon`,children:r.jsx(I,{size:16,"aria-hidden":"true",style:{transform:t?"rotate(180deg)":void 0,transition:"transform 0.2s"}})});return r.jsxs("div",{ref:h,className:`\n          accordion-item\n          accordion-item--${o}\n          accordion-item--${i}\n          ${t?"accordion-item--open":""}\n          ${_?"accordion-item--disabled":""}\n          ${C?"accordion-item--loading":""}\n          ${"default"!==j?`accordion-item--${j}`:""}\n          ${y||""}\n        `.trim(),"data-testid":N,"aria-expanded":t,"aria-disabled":_,"aria-busy":C,children:[r.jsxs("div",{className:"accordion-item-header",role:"button",tabIndex:_||C?-1:0,"aria-expanded":t,"aria-controls":`accordion-content-${g}`,"aria-disabled":_,"aria-busy":C,"aria-describedby":"default"!==j?`accordion-status-${g}`:void 0,onClick:S,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),S())},"data-testid":`${N||g}-header`,children:["left"===d&&l&&M(),r.jsx("div",{className:"accordion-item-header-content",children:f}),"right"===d&&l&&M()]}),r.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:p?t?"none":"0":t?"500px":"0",transition:p?"none":void 0},"data-testid":`${N||g}-content`,children:r.jsxs("div",{className:"accordion-item-body",children:["default"!==j&&r.jsx("div",{id:`accordion-status-${g}`,className:`accordion-status accordion-status--${j}`,"aria-live":"polite",children:r.jsxs("span",{className:"visually-hidden",children:["Status: ",j]})}),b]})})]})});Cr.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 Sr=i.default.forwardRef(({items:e,children:t,allowMultiple:a=!1,defaultOpenItems:o=[],openItems:i,onToggle:l,variant:d="default",size:s="md",className:c="",style:x,showChevron:v=!0,chevronPosition:m="right",expandedIcon:p,collapsedIcon:h,iconType:u="chevron",showDivider:g=!0,collapsible:f=!0,loading:b=!1,disabled:w=!1,spacing:y="default",disableAnimations:k=!1,...j},z)=>{const[N,_]=n.useState(o),C=void 0!==i?i:N,S=void 0!==i,M=e||n.Children.toArray(t).filter(r=>n.isValidElement(r)).map((r,e)=>{if(n.isValidElement(r)&&r.props){const n=r;return{id:n.props.id||`accordion-item-${e}`,header:n.props.header||`Item ${e+1}`,children:n.props.children,disabled:n.props.disabled,className:n.props.className}}return{id:`accordion-item-${e}`,header:`Item ${e+1}`,children:r}}),T=n.useCallback(r=>{let n;n=a?C.includes(r)?C.filter(n=>n!==r):[...C,r]:C.includes(r)?f?[]:C:[r],S||_(n),null==l||l(n)},[a,f,C,S,l]);return r.jsx("div",{ref:z,className:`\n          accordion\n          accordion--${d}\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          ${c}\n        `.trim(),style:x,role:"presentation","aria-busy":b,...j,children:M.map(n=>r.jsx(Cr,{item:n,isOpen:C.includes(n.id),onToggle:()=>T(n.id),variant:d,size:s,showChevron:v,chevronPosition:m,expandedIcon:p,collapsedIcon:h,iconType:u,loading:b,disabled:w,spacing:y,disableAnimations:k},n.id))})});Sr.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 Mr={success:r.jsx(O,{size:20}),error:r.jsx(W,{size:20}),warning:r.jsx(P,{size:20}),info:r.jsx(V,{size:20}),neutral:r.jsx(H,{size:20})},Tr=i.default.forwardRef(({children:e,title:t,description:a,variant:o="info",alertStyle:i="subtle",size:l,icon:d,dismissible:s=!1,onClose:c,action:x,fullWidth:v=!1,className:m="",style:p,role:u="alert",...g},f)=>{const{theme:b}=h(),w=l||(null==b?void 0:b.defaultSize)||"md",[y,k]=n.useState(!0);if(!y)return null;const j=!1!==d,z=void 0===d?Mr[o]:d,N=e||a;return r.jsxs("div",{ref:f,className:`\n          alert\n          alert--${o}\n          alert--${i}\n          alert--${w}\n          ${v?"alert--full-width":""}\n          ${m}\n        `.trim(),style:p,role:u,...g,children:[j&&r.jsx("div",{className:"alert-icon",children:z}),r.jsxs("div",{className:"alert-content",children:[t&&r.jsx("div",{className:"alert-title",children:t}),N&&r.jsx("div",{className:"alert-message",children:null!=e?e:a})]}),x&&r.jsx("div",{className:"alert-action",children:x}),s&&r.jsx("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==c||c()},"aria-label":"Close alert",children:r.jsx(nr,{size:16})})]})});Tr.displayName="Alert";const $r=y(Tr);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 Ir=i.default.forwardRef(({children:n,direction:e="row",wrap:t="nowrap",justify:a="start",align:o="stretch",alignContent:i,gap:l,rowGap:d,columnGap:s,inline:c=!1,fullWidth:x=!1,grow:v,shrink:m,basis:p,className:h="",as:u="div",style:g,...f},b)=>{const w=u,y=["vtx-flex",c&&"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!==d&&(k["--vtx-flex-row-gap"]="number"==typeof d?`${d}px`:d),void 0!==s&&(k["--vtx-flex-column-gap"]="number"==typeof s?`${s}px`:s),void 0!==v&&(k.flexGrow=v),void 0!==m&&(k.flexShrink=m),void 0!==p&&(k.flexBasis="number"==typeof p?`${p}px`:p),r.jsx(w,{ref:b,className:y,style:k,...f,children:n})});Ir.displayName="Flex";const Ar=y(Ir);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 Dr=l.forwardRef(({variant:r="body1",as:n,align:e,color:t,weight:a,transform:o,decoration:i,truncate:d=!1,lineClamp:s,breakWord:c=!1,italic:x=!1,underline:v=!1,strikethrough:m=!1,gradient:p,noSelect:h=!1,size:u,lineHeight:g,letterSpacing:f,noMargin:b=!1,noPadding:w=!1,className:y="",style:k,children:j,...z},N)=>{const _=n||(r=>({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"}[r]))(r),C=["vtx-text",`vtx-text--${r}`,e&&`vtx-text--align-${e}`,a&&"string"==typeof a&&`vtx-text--weight-${a}`,o&&`vtx-text--transform-${o}`,i&&`vtx-text--decoration-${i}`,d&&"vtx-text--truncate",s&&"vtx-text--line-clamp",c&&"vtx-text--break-word",x&&"vtx-text--italic",v&&"vtx-text--underline",m&&"vtx-text--strikethrough",p&&"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[r,n]=t.split(".");S.color=`var(--vtx-color-${r}-${n})`}else S.color=t;if(a&&"number"==typeof a&&(S.fontWeight=a),s&&(S.WebkitLineClamp=s),p&&p.length>0){const r=1===p.length?p[0]:`linear-gradient(135deg, ${p.join(", ")})`;S.backgroundImage=r}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(_,{ref:N,className:C,style:S,...z},j)});Dr.displayName="Text";const Fr=y(Dr);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 Er=({isOpen:n})=>n?r.jsx(R,{size:16}):r.jsx(I,{size:16}),Rr=i.default.forwardRef(({label:e,onClick:t,icon:a,rightIcon:o,disabled:i=!1,active:l=!1,variant:d="default",shortcut:s,divider:c=!1,items:x},v)=>{const[m,p]=n.useState(!1),h=n.useRef(null),u=x&&x.length>0,g=o||(u?r.jsx(Er,{isOpen:m}):null);return r.jsxs(r.Fragment,{children:[r.jsx("div",{ref:v||h,className:["vtx-menu-item",l&&"vtx-menu-item--active",i&&"vtx-menu-item--disabled","default"!==d&&`vtx-menu-item--${d}`,u&&"vtx-menu-item--has-submenu",m&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{i||(u?p(!m):t&&t())},onKeyDown:r=>{i||("Enter"===r.key||" "===r.key?(r.preventDefault(),u?p(!m):null==t||t()):"ArrowDown"===r.key&&u&&!m?(r.preventDefault(),p(!0)):"ArrowUp"===r.key&&u&&m&&(r.preventDefault(),p(!1)))},role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-haspopup":u?"menu":void 0,"aria-expanded":u?m:void 0,children:r.jsxs(Ar,{align:"center",gap:8,style:{flex:1},children:[a&&r.jsx("span",{className:"vtx-menu-item-icon",children:a}),r.jsx(Fr,{variant:"body2",noMargin:!0,style:{flex:1},children:e}),s&&r.jsx(Fr,{variant:"caption",color:"neutral.500",noMargin:!0,className:"vtx-menu-item-shortcut",children:s}),g&&r.jsx("span",{className:"vtx-menu-item-right-icon",children:g})]})}),u&&m&&r.jsx("div",{className:"vtx-submenu",role:"menu",children:x.map((n,e)=>r.jsx(Rr,{...n},e))}),c&&r.jsx("div",{className:"vtx-menu-divider",role:"separator"})]})});Rr.displayName="MenuItem";const Lr=i.default.forwardRef(({items:e,children:t,orientation:a="vertical",responsive:o=!0,className:i="",width:l},d)=>{const[s,c]=n.useState(!1),x=n.useRef(null);n.useEffect(()=>{if(!o||!s)return;const r=r=>{x.current&&!x.current.contains(r.target)&&c(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[o,s]),n.useEffect(()=>{if(!o||!s)return;const r=r=>{"Escape"===r.key&&c(!1)};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[o,s]);const v=e?e.map((n,e)=>r.jsx(Rr,{...n},e)):t,m=["vtx-menu",`vtx-menu--${a}`,o&&"vtx-menu--responsive",s&&"vtx-menu--mobile-open",i].filter(Boolean).join(" "),p={width:"vertical"===a&&l?"number"==typeof l?`${l}px`:l:void 0};return r.jsxs("div",{ref:x,className:"vtx-menu-container",children:[o&&r.jsx("button",{className:"vtx-menu-toggle",onClick:()=>c(!s),"aria-label":"Toggle menu","aria-expanded":s,children:s?r.jsx(nr,{size:24}):r.jsx(E,{size:24})}),r.jsx("div",{ref:d,className:m,role:"menu",style:p,children:v})]})});Lr.displayName="Menu";const Br=y(Lr);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 Or=i.default.forwardRef(({isOpen:e,onClose:a,title:o,description:i,children:l,header:d,footer:s,footerButtons:c,size:x,closeOnBackdropClick:v=!0,closeOnEscape:m=!0,showCloseButton:p=!0,transparentBackdrop:u=!1,className:g="",backdropClassName:f="",preventScroll:b=!0,animation:w="fade",onAfterOpen:y,onAfterClose:k,scrollable:j=!1,centered:N=!0},_)=>{const C=n.useRef(null),S=n.useRef(null),{theme:M}=h();let T="md";if(x?T=x:(null==M?void 0:M.defaultSize)&&(T=M.defaultSize),cr(C,e),vr(b&&e),xr(()=>{m&&e&&a()}),n.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",N&&"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(" "),A=r.jsx("div",{className:$,onClick:r=>{v&&r.target===r.currentTarget&&a()},role:"presentation",children:r.jsxs("div",{ref:r=>{C.current=r,"function"==typeof _?_(r):_&&(_.current=r)},className:I,role:"dialog","aria-modal":"true","aria-labelledby":o?"vtx-modal-title":void 0,"aria-describedby":i?"vtx-modal-description":void 0,children:[d?r.jsx("div",{className:"vtx-modal-header",children:d}):o||p?r.jsxs(Ar,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[o&&r.jsxs(Ar,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[r.jsx(Fr,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:o}),i&&r.jsx(Fr,{variant:"body2",color:"neutral.600",id:"vtx-modal-description",noMargin:!0,children:i})]}),p&&r.jsx(z,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:a,"aria-label":"Close modal",children:r.jsx(nr,{size:20})})]}):null,r.jsx(Ar,{direction:"column",className:"vtx-modal-body",children:l}),(s||c)&&r.jsx(Ar,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:c?c.map((n,e)=>r.jsx(z,{variant:n.variant||"secondary",size:n.size||(null==M?void 0:M.defaultSize)||"md",loading:n.loading,disabled:n.disabled,onClick:n.onClick,children:n.label},e)):s})]})});return t.createPortal(A,document.body)});Or.displayName="Modal";const Wr=y(Or);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 Pr={success:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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:r.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.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"})})},Vr=i.default.forwardRef(({children:e,onDismiss:t,id:a,variant:o="default",autoClose:l=5e3,closeButton:d=!0,progressBar:s=!0,pauseOnHover:c=!0,pauseOnFocusLoss:x=!0,icon:v,action:m,className:p="",style:h,title:u,description:g,animationDuration:f=300,isVisible:b,createdAt:w,onClose:y,onOpen:k,toastId:j,...z},N)=>{const[_,C]=n.useState(!1),[S,M]=n.useState(!1),[T,I]=n.useState(100),A=n.useRef(null),D=n.useRef(Date.now()),F=n.useRef(0),E=i.default.useCallback(()=>{C(!0),setTimeout(()=>{t()},f)},[t,f]);n.useEffect(()=>{if(!1===l||S)return;return A.current=setInterval(()=>{const r=Date.now()-D.current-F.current,n=Math.max(0,l-r);I(n/l*100),n<=0&&E()},16),()=>{A.current&&clearInterval(A.current)}},[l,S,E]);const R=["vtx-toast",`vtx-toast--${o}`,_&&"vtx-toast--exiting",p].filter(Boolean).join(" ");return r.jsxs("div",{ref:N,className:R,style:{...h,"--vtx-toast-animation-duration":`${f}ms`},onMouseEnter:()=>{c&&!S&&(M(!0),F.current=Date.now())},onMouseLeave:()=>{if(c&&S){M(!1);const r=Date.now()-F.current;D.current+=r}},onFocus:()=>{if(x&&S){M(!1);const r=Date.now()-F.current;D.current+=r}},onBlur:()=>{x&&!S&&(M(!0),F.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":a,...z,children:[r.jsxs("div",{className:"vtx-toast__wrapper",children:[!1===v?null:v?r.jsx("div",{className:"vtx-toast__icon",children:v}):r.jsx("div",{className:"vtx-toast__icon",children:Pr[o]}),u||g?r.jsxs("div",{className:"vtx-toast__content",children:[u&&r.jsx("div",{className:"vtx-toast__title",children:u}),g&&r.jsx("div",{className:"vtx-toast__description",children:g}),e&&r.jsx("div",{className:"vtx-toast__body",children:e})]}):r.jsx("div",{className:"vtx-toast__content",children:e}),r.jsxs("div",{className:"vtx-toast__actions",children:[m&&r.jsx("button",{className:"vtx-toast__action",onClick:m.onClick,type:"button",children:m.label}),d&&r.jsx("button",{className:"vtx-toast__close",onClick:E,type:"button","aria-label":"Close notification",children:r.jsx($,{size:16})})]})]}),s&&!1!==l&&r.jsx("div",{className:"vtx-toast__progress-container",children:r.jsx("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${T/100})`,animationPlayState:S?"paused":"running"}})})]})});Vr.displayName="Toast";const Hr=y(Vr),Yr=n.createContext(null),qr=()=>{const r=n.useContext(Yr);if(!r)throw new Error("useToast must be used within a ToastProvider");return r},Ur=({children:e})=>{const[t,a]=n.useState([]),o=n.useCallback(r=>{a(n=>{var e;const t=n.find(n=>n.id===r);return t&&(null===(e=t.onClose)||void 0===e||e.call(t)),n.filter(n=>n.id!==r)})},[]),i=n.useCallback((r,n={})=>{var e;const t=n.toastId||Date.now()+Math.random(),i={id:t,content:r,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...n};return a(r=>{const n=r.filter(r=>r.id!==t);return[i,...n]}),!1!==i.autoClose&&setTimeout(()=>{o(t)},i.autoClose),null===(e=n.onOpen)||void 0===e||e.call(n),t},[o]),l=n.useCallback(()=>{a([])},[]),d=n.useCallback((r,n)=>{a(e=>e.map(e=>e.id===r?{...e,...n}:e))},[]),s={toasts:t,addToast:i,removeToast:o,clearAllToasts:l,updateToast:d};return r.jsx(Yr.Provider,{value:s,children:e})};class Gr{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return Gr.instance||(Gr.instance=new Gr),Gr.instance}setMethods(r,n,e,t){this.addToastFn=r,this.removeToastFn=n,this.clearAllToastsFn=e,this.updateToastFn=t}show(r,n){return this.addToastFn?this.addToastFn(r,n):(console.warn("Toast system not initialized. Make sure ToastContainer is mounted."),"")}success(r,n){return this.show(r,{...n,variant:"success"})}error(r,n){return this.show(r,{...n,variant:"error"})}warning(r,n){return this.show(r,{...n,variant:"warning"})}info(r,n){return this.show(r,{...n,variant:"info"})}primary(r,n){return this.show(r,{...n,variant:"primary"})}dismiss(r){this.removeToastFn?this.removeToastFn(r):console.warn("Toast system not initialized.")}dismissAll(){this.clearAllToastsFn?this.clearAllToastsFn():console.warn("Toast system not initialized.")}update(r,n){this.updateToastFn?this.updateToastFn(r,n):console.warn("Toast system not initialized.")}}const Xr=Gr.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 Kr=({position:e="top-right",limit:a=5,gap:o=12,margin:i=16,className:l="",style:d,stacked:s=!0,theme:c="auto"})=>{const{toasts:x,removeToast:v,addToast:m,clearAllToasts:p,updateToast:h}=qr(),u=n.useRef(null);n.useEffect(()=>{Xr.setMethods(m,v,p,h)},[m,v,p,h]),n.useEffect(()=>{if("auto"===c){const r=window.matchMedia("(prefers-color-scheme: dark)"),n=()=>{document.documentElement.setAttribute("data-vtx-toast-theme",r.matches?"dark":"light")};return n(),r.addEventListener("change",n),()=>r.removeEventListener("change",n)}document.documentElement.setAttribute("data-vtx-toast-theme",c)},[c]);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(r.jsxs("div",{ref:u,className:b,style:{...(r=>{const n={position:"fixed",zIndex:"var(--vtx-z-notification, 1400)",pointerEvents:"none"};switch(r){case"top-left":return{...n,top:i,left:i};case"top-center":return{...n,top:i,left:"50%",transform:"translateX(-50%)"};case"top-right":default:return{...n,top:i,right:i};case"bottom-left":return{...n,bottom:i,left:i};case"bottom-center":return{...n,bottom:i,left:"50%",transform:"translateX(-50%)"};case"bottom-right":return{...n,bottom:i,right:i}}})(e),"--vtx-toast-gap":`${o}px`,...d},"aria-live":"polite","aria-label":"Notifications",children:[f>0&&r.jsxs("div",{className:"vtx-toast-container__hidden-count",children:["+",f," more"]}),r.jsx("div",{className:"vtx-toast-container__list",children:g.map((n,e)=>r.jsx(Hr,{id:n.id,isVisible:n.isVisible,onDismiss:()=>v(n.id),variant:n.variant,autoClose:n.autoClose,closeButton:n.closeButton,progressBar:n.progressBar,pauseOnHover:n.pauseOnHover,pauseOnFocusLoss:n.pauseOnFocusLoss,icon:n.icon,action:n.action,className:n.className,style:n.style,title:n.title,description:n.description,animationDuration:n.animationDuration,createdAt:n.createdAt,onClose:n.onClose,onOpen:n.onOpen,"data-toast-index":e,children:n.content},n.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 Qr=i.default.forwardRef(({content:e,placement:a="top",delay:o=200,hideDelay:i=0,children:l,open:d,disabled:s=!1,arrow:c=!1,maxWidth:x="300px",variant:v="dark",dismissible:m=!1,onShow:p,onHide:h,onDismiss:u,className:g="",...f},b)=>{const[w,y]=n.useState(d||!1),[k,j]=n.useState(!1),[z,N]=n.useState({top:0,left:0}),_=n.useRef(null),C=n.useRef(null),S=n.useRef(null),M=n.useRef(null),T=n.useRef(!1),I=()=>{s||(T.current=!0,S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current),C.current=setTimeout(()=>{if(_.current&&T.current){const r=_.current.getBoundingClientRect(),n=D(r,a);N(n),j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0),null==p||p()})})}},o))},A=()=>{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)},D=(r,n)=>{const e=c?12:8;let t=0,a=0;return n.startsWith("top")?(t=r.top-e+window.scrollY,a=r.left+r.width/2+window.scrollX,"top-start"===n&&(a=r.left+window.scrollX),"top-end"===n&&(a=r.right+window.scrollX)):n.startsWith("bottom")?(t=r.bottom+e+window.scrollY,a=r.left+r.width/2+window.scrollX,"bottom-start"===n&&(a=r.left+window.scrollX),"bottom-end"===n&&(a=r.right+window.scrollX)):n.startsWith("left")?(t=r.top+r.height/2+window.scrollY,a=r.left-e+window.scrollX,"left-start"===n&&(t=r.top+window.scrollY),"left-end"===n&&(t=r.bottom+window.scrollY)):n.startsWith("right")&&(t=r.top+r.height/2+window.scrollY,a=r.right+e+window.scrollX,"right-start"===n&&(t=r.top+window.scrollY),"right-end"===n&&(t=r.bottom+window.scrollY)),{top:t,left:a}};n.useEffect(()=>{void 0!==d&&(d?(j(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{y(!0)})})):(y(!1),M.current=setTimeout(()=>{j(!1)},150)))},[d]),n.useEffect(()=>()=>{C.current&&clearTimeout(C.current),S.current&&clearTimeout(S.current),M.current&&clearTimeout(M.current)},[]);const F=["vtx-tooltip",`vtx-tooltip--${a}`,`vtx-tooltip--${v}`,c&&"vtx-tooltip--with-arrow",w&&"vtx-tooltip--visible",g].filter(Boolean).join(" "),E=void 0!==d&&d||k,R=n.cloneElement(l,{ref:r=>{_.current=r;const n=l.ref;"function"==typeof n?n(r):n&&"object"==typeof n&&"current"in n&&(n.current=r)},onMouseEnter:r=>{var n,e;void 0===d&&I(),null===(e=(n=l.props).onMouseEnter)||void 0===e||e.call(n,r)},onMouseLeave:r=>{var n,e;void 0===d&&A(),null===(e=(n=l.props).onMouseLeave)||void 0===e||e.call(n,r)},onFocus:r=>{var n,e;void 0===d&&I(),null===(e=(n=l.props).onFocus)||void 0===e||e.call(n,r)},onBlur:r=>{var n,e;void 0===d&&A(),null===(e=(n=l.props).onBlur)||void 0===e||e.call(n,r)},"aria-describedby":w?"vtx-tooltip-content":void 0});return r.jsxs(r.Fragment,{children:[R,E&&t.createPortal(r.jsxs("div",{ref:b,id:"vtx-tooltip-content",role:"tooltip",className:F,style:{top:`${z.top}px`,left:`${z.left}px`,maxWidth:x},onMouseEnter:()=>{s||void 0!==d||(T.current=!0,S.current&&clearTimeout(S.current))},onMouseLeave:()=>{s||void 0!==d||A()},...f,children:[c&&r.jsx("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),r.jsxs("div",{className:"vtx-tooltip-inner",children:[r.jsx("span",{className:"vtx-tooltip-content",children:e}),m&&r.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:r.jsx($,{size:14})})]})]}),document.body)]})});Qr.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 Zr=i.default.forwardRef(({src:e,alt:t="",size:a,shape:o="circle",fallback:i="?",onImageError:l,onImageLoad:d,imgProps:s,statusIndicator:c,statusPosition:x="bottom-right",className:v="",...m},p)=>{const{theme:u}=h(),g=a||u.defaultSize||"md",[f,b]=n.useState(!1),w=["vtx-avatar",`vtx-avatar--${g}`,`vtx-avatar--${o}`,c&&"vtx-avatar--with-status",v].filter(Boolean).join(" "),y=e&&!f,k=i.slice(0,2).toUpperCase();return r.jsxs("div",{ref:p,className:w,role:"img","aria-label":t||i||"Avatar",...m,children:[y?r.jsx("img",{src:e,alt:t,className:"vtx-avatar-image",onError:r=>{b(!0),null==l||l(r)},onLoad:r=>{null==d||d(r)},loading:"lazy",...s}):r.jsx("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),c&&r.jsx("span",{className:`vtx-avatar-status vtx-avatar-status--${x}`,"aria-label":"Status indicator",children:c})]})});Zr.displayName="Avatar";const Jr=y(Zr);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--sm {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-xs);\n}\n\n.vtx-badge--md {\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--lg {\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 rn=i.default.forwardRef(({variant:e="neutral",size:t,pill:a=!1,dot:o=!1,outline:i=!1,maxLength:l,icon:d,children:s,className:c="",onRemove:x,...v},m)=>{const{theme:p}=h(),u=["vtx-badge",`vtx-badge--${e}`,`vtx-badge--${t||p.defaultSize}`,a&&"vtx-badge--pill",o&&"vtx-badge--with-dot",i&&"vtx-badge--outline",x&&"vtx-badge--removable",c].filter(Boolean).join(" "),g=n.useMemo(()=>l&&"string"==typeof s&&s.length>l?`${s.slice(0,l)}...`:s,[s,l]);return r.jsxs("span",{ref:m,className:u,...v,children:[o&&r.jsx("span",{className:"vtx-badge-dot","aria-hidden":"true"}),d&&r.jsx("span",{className:"vtx-badge-icon","aria-hidden":"true",children:d}),r.jsx("span",{className:"vtx-badge-content",children:g}),x&&r.jsx("button",{type:"button",className:"vtx-badge-remove",onClick:x,"aria-label":"Remove badge",children:r.jsx($,{})})]})});rn.displayName="Badge";const nn=y(rn);k("/* ===================================\r\n   AdminHeader - Professional Admin Panel Header\r\n   =================================== */\r\n\r\n/* CSS Variables for Theming */\r\n:root {\r\n  /* Light Theme (Default) */\r\n  --vtx-admin-header-bg: var(--vtx-color-neutral-50, #fafafa);\r\n  --vtx-admin-header-border: var(--vtx-color-neutral-200, #e5e5e5);\r\n  --vtx-admin-header-shadow: var(--vtx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));\r\n  \r\n  --vtx-admin-header-text: var(--vtx-color-neutral-900, #171717);\r\n  --vtx-admin-header-text-secondary: var(--vtx-color-neutral-600, #525252);\r\n  \r\n  --vtx-admin-header-button-hover: var(--vtx-color-neutral-100, #f5f5f5);\r\n  --vtx-admin-header-button-active: var(--vtx-color-neutral-200, #e5e5e5);\r\n  \r\n  --vtx-admin-header-input-bg: var(--vtx-color-neutral-50, #ffffff);\r\n  --vtx-admin-header-input-border: var(--vtx-color-neutral-300, #d4d4d4);\r\n  --vtx-admin-header-input-focus: var(--vtx-color-primary-500, #3b82f6);\r\n  \r\n  --vtx-admin-header-dropdown-bg: var(--vtx-color-neutral-50, #ffffff);\r\n  --vtx-admin-header-dropdown-shadow: var(--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  \r\n  --vtx-admin-header-transition: var(--vtx-transition-base, 200ms);\r\n}\r\n\r\n/* ===================================\r\n   Base Header Structure\r\n   =================================== */\r\n\r\n.vtx-admin-header {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: var(--vtx-admin-header-bg);\r\n  border-bottom: 1px solid var(--vtx-admin-header-border);\r\n  z-index: var(--vtx-z-index-sticky, 1100);\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header--sticky {\r\n  position: sticky;\r\n  top: 0;\r\n}\r\n\r\n.vtx-admin-header--blur {\r\n  backdrop-filter: blur(8px);\r\n  -webkit-backdrop-filter: blur(8px);\r\n  background-color: rgba(var(--vtx-admin-header-bg-rgb, 250, 250, 250), 0.8);\r\n}\r\n\r\n.vtx-admin-header-container {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-4, 1rem);\r\n  padding: 0 var(--vtx-spacing-6, 1.5rem);\r\n  min-height: 64px;\r\n}\r\n\r\n/* ===================================\r\n   Left Section\r\n   =================================== */\r\n\r\n.vtx-admin-header-left {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-4, 1rem);\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Toggle Button */\r\n.vtx-admin-header-toggle {\r\n  display: none; /* Hidden on desktop, shown on mobile */\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  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background: transparent;\r\n  color: var(--vtx-admin-header-text);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-toggle:hover {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-toggle:active {\r\n  background-color: var(--vtx-admin-header-button-active);\r\n  transform: scale(0.95);\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-admin-header-toggle {\r\n    display: flex;\r\n  }\r\n}\r\n\r\n/* Brand/Logo */\r\n.vtx-admin-header-brand {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3, 0.75rem);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-logo {\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-admin-header-brand-text {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 2px;\r\n}\r\n\r\n.vtx-admin-header-title {\r\n  color: var(--vtx-admin-header-text);\r\n  font-size: var(--vtx-font-size-lg, 1.125rem);\r\n  font-weight: var(--vtx-font-weight-semibold, 600);\r\n  line-height: 1.2;\r\n  white-space: nowrap;\r\n}\r\n\r\n.vtx-admin-header-subtitle {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  font-size: var(--vtx-font-size-xs, 0.75rem);\r\n  line-height: 1;\r\n}\r\n\r\n@media (max-width: 640px) {\r\n  .vtx-admin-header-brand-text {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* ===================================\r\n   Center Section - Search\r\n   =================================== */\r\n\r\n.vtx-admin-header-center {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex: 1;\r\n  max-width: 600px;\r\n  margin: 0 auto;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-admin-header-center {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* Search */\r\n.vtx-admin-header-search {\r\n  position: relative;\r\n  width: 100%;\r\n  max-width: 480px;\r\n}\r\n\r\n.vtx-admin-header-search-form {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-admin-header-search-input {\r\n  width: 100%;\r\n  height: 40px;\r\n  padding: 0 36px 0 38px;\r\n  border: 1px solid var(--vtx-admin-header-input-border);\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background-color: var(--vtx-admin-header-input-bg);\r\n  color: var(--vtx-admin-header-text);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  outline: none;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-search-input::placeholder {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n}\r\n\r\n.vtx-admin-header-search-input:focus {\r\n  border-color: var(--vtx-admin-header-input-focus);\r\n  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\r\n}\r\n\r\n.vtx-admin-header-search-icon {\r\n  position: absolute;\r\n  left: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-admin-header-search-spinner {\r\n  width: 16px;\r\n  height: 16px;\r\n  border: 2px solid var(--vtx-admin-header-text-secondary);\r\n  border-top-color: transparent;\r\n  border-radius: 50%;\r\n  animation: spin 0.6s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n  to {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n.vtx-admin-header-search-clear {\r\n  position: absolute;\r\n  right: 8px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 24px;\r\n  height: 24px;\r\n  padding: 0;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-base, 0.25rem);\r\n  background: transparent;\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-search-clear:hover {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n  color: var(--vtx-admin-header-text);\r\n}\r\n\r\n/* Search Suggestions Dropdown */\r\n.vtx-admin-header-search-suggestions {\r\n  position: absolute;\r\n  top: calc(100% + 8px);\r\n  left: 0;\r\n  right: 0;\r\n  max-height: 400px;\r\n  overflow-y: auto;\r\n  background-color: var(--vtx-admin-header-dropdown-bg);\r\n  border: 1px solid var(--vtx-admin-header-border);\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  box-shadow: var(--vtx-admin-header-dropdown-shadow);\r\n  z-index: 1000;\r\n  animation: slideDown 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n@keyframes slideDown {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(-8px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n.vtx-admin-header-search-suggestion {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3, 0.75rem);\r\n  width: 100%;\r\n  padding: var(--vtx-spacing-3, 0.75rem) var(--vtx-spacing-4, 1rem);\r\n  border: none;\r\n  background: transparent;\r\n  text-align: left;\r\n  cursor: pointer;\r\n  transition: background-color var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-search-suggestion:hover {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-search-suggestion-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  color: var(--vtx-admin-header-text-secondary);\r\n}\r\n\r\n.vtx-admin-header-search-suggestion-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.vtx-admin-header-search-suggestion-label {\r\n  display: block;\r\n  color: var(--vtx-admin-header-text);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n}\r\n\r\n.vtx-admin-header-search-suggestion-category {\r\n  display: block;\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  font-size: var(--vtx-font-size-xs, 0.75rem);\r\n  margin-top: 2px;\r\n}\r\n\r\n/* ===================================\r\n   Right Section\r\n   =================================== */\r\n\r\n.vtx-admin-header-right {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2, 0.5rem);\r\n  margin-left: auto;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-divider {\r\n  width: 1px;\r\n  height: 32px;\r\n  background-color: var(--vtx-admin-header-border);\r\n  margin: 0 var(--vtx-spacing-2, 0.5rem);\r\n}\r\n\r\n/* Quick Actions */\r\n.vtx-admin-header-quick-actions {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1, 0.25rem);\r\n}\r\n\r\n@media (max-width: 640px) {\r\n  .vtx-admin-header-quick-actions {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* Icon Button (Generic) */\r\n.vtx-admin-header-icon-button {\r\n  position: relative;\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  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background: transparent;\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-icon-button:hover:not(.vtx-admin-header-icon-button--disabled) {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n  color: var(--vtx-admin-header-text);\r\n  transform: scale(1.05);\r\n}\r\n\r\n.vtx-admin-header-icon-button:active:not(.vtx-admin-header-icon-button--disabled) {\r\n  background-color: var(--vtx-admin-header-button-active);\r\n  transform: scale(0.98);\r\n}\r\n\r\n.vtx-admin-header-icon-button--active {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n  color: var(--vtx-admin-header-text);\r\n}\r\n\r\n.vtx-admin-header-icon-button--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-admin-header-icon-badge {\r\n  position: absolute;\r\n  top: 4px;\r\n  right: 4px;\r\n  min-width: 18px;\r\n  height: 18px;\r\n  padding: 0 4px;\r\n  pointer-events: none;\r\n}\r\n\r\n/* ===================================\r\n   Notifications\r\n   =================================== */\r\n\r\n.vtx-admin-header-notifications {\r\n  position: relative;\r\n}\r\n\r\n.vtx-admin-header-notifications-panel {\r\n  position: absolute;\r\n  top: calc(100% + 12px);\r\n  right: 0;\r\n  width: 400px;\r\n  max-height: 600px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: var(--vtx-admin-header-dropdown-bg);\r\n  border: 1px solid var(--vtx-admin-header-border);\r\n  border-radius: var(--vtx-border-radius-xl, 0.75rem);\r\n  box-shadow: var(--vtx-admin-header-dropdown-shadow);\r\n  z-index: 1000;\r\n  animation: slideDown 200ms cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .vtx-admin-header-notifications-panel {\r\n    position: fixed;\r\n    top: 64px;\r\n    right: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    max-height: calc(100vh - 64px);\r\n    border-radius: 0;\r\n    border-left: none;\r\n    border-right: none;\r\n  }\r\n}\r\n\r\n.vtx-admin-header-notifications-header {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: var(--vtx-spacing-4, 1rem) var(--vtx-spacing-5, 1.25rem);\r\n  border-bottom: 1px solid var(--vtx-admin-header-border);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-notifications-header-title {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-admin-header-notifications-header-actions {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2, 0.5rem);\r\n}\r\n\r\n.vtx-admin-header-notifications-action-btn {\r\n  padding: 4px 8px;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-base, 0.25rem);\r\n  background: transparent;\r\n  color: var(--vtx-color-primary-600, #2563eb);\r\n  font-size: var(--vtx-font-size-xs, 0.75rem);\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-notifications-action-btn:hover {\r\n  background-color: var(--vtx-color-primary-50, #eff6ff);\r\n}\r\n\r\n.vtx-admin-header-notifications-action-btn--danger {\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n}\r\n\r\n.vtx-admin-header-notifications-action-btn--danger:hover {\r\n  background-color: var(--vtx-color-error-50, #fef2f2);\r\n}\r\n\r\n.vtx-admin-header-notifications-list {\r\n  flex: 1;\r\n  overflow-y: auto;\r\n  overflow-x: hidden;\r\n}\r\n\r\n.vtx-admin-header-notifications-list::-webkit-scrollbar {\r\n  width: 6px;\r\n}\r\n\r\n.vtx-admin-header-notifications-list::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-admin-header-notifications-list::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300, #d4d4d4);\r\n  border-radius: 3px;\r\n}\r\n\r\n.vtx-admin-header-notifications-empty {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: var(--vtx-spacing-10, 2.5rem);\r\n  color: var(--vtx-admin-header-text-secondary);\r\n}\r\n\r\n.vtx-admin-header-notification-item {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-3, 0.75rem);\r\n  padding: var(--vtx-spacing-4, 1rem) var(--vtx-spacing-5, 1.25rem);\r\n  border: none;\r\n  border-bottom: 1px solid var(--vtx-admin-header-border);\r\n  background: transparent;\r\n  width: 100%;\r\n  text-align: left;\r\n  cursor: pointer;\r\n  transition: background-color var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n  position: relative;\r\n  text-decoration: none;\r\n  color: inherit;\r\n}\r\n\r\n.vtx-admin-header-notification-item:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.vtx-admin-header-notification-item:hover {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-notification-item--unread {\r\n  background-color: var(--vtx-color-primary-50, #eff6ff);\r\n}\r\n\r\n.vtx-admin-header-notification-item--unread:hover {\r\n  background-color: var(--vtx-color-primary-100, #dbeafe);\r\n}\r\n\r\n.vtx-admin-header-notification-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  width: 40px;\r\n  height: 40px;\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  color: var(--vtx-admin-header-text-secondary);\r\n}\r\n\r\n.vtx-admin-header-notification-item--info .vtx-admin-header-notification-icon {\r\n  background-color: var(--vtx-color-info-50, #eff6ff);\r\n  color: var(--vtx-color-info-600, #2563eb);\r\n}\r\n\r\n.vtx-admin-header-notification-item--success .vtx-admin-header-notification-icon {\r\n  background-color: var(--vtx-color-success-50, #f0fdf4);\r\n  color: var(--vtx-color-success-600, #16a34a);\r\n}\r\n\r\n.vtx-admin-header-notification-item--warning .vtx-admin-header-notification-icon {\r\n  background-color: var(--vtx-color-warning-50, #fffbeb);\r\n  color: var(--vtx-color-warning-600, #d97706);\r\n}\r\n\r\n.vtx-admin-header-notification-item--error .vtx-admin-header-notification-icon {\r\n  background-color: var(--vtx-color-error-50, #fef2f2);\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n}\r\n\r\n.vtx-admin-header-notification-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.vtx-admin-header-notification-dot {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: 16px;\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  background-color: var(--vtx-color-primary-600, #2563eb);\r\n}\r\n\r\n.vtx-admin-header-notifications-footer {\r\n  padding: var(--vtx-spacing-3, 0.75rem);\r\n  border-top: 1px solid var(--vtx-admin-header-border);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-notifications-view-all {\r\n  width: 100%;\r\n  padding: var(--vtx-spacing-2, 0.5rem);\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-base, 0.25rem);\r\n  background: transparent;\r\n  color: var(--vtx-color-primary-600, #2563eb);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n  cursor: pointer;\r\n  transition: background-color var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-notifications-view-all:hover {\r\n  background-color: var(--vtx-color-primary-50, #eff6ff);\r\n}\r\n\r\n/* ===================================\r\n   User Menu\r\n   =================================== */\r\n\r\n.vtx-admin-header-user {\r\n  position: relative;\r\n}\r\n\r\n.vtx-admin-header-user-button {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2, 0.5rem);\r\n  padding: 4px 8px 4px 4px;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background: transparent;\r\n  cursor: pointer;\r\n  transition: all var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-user-button:hover {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-user-button--active {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-user-avatar {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-user-avatar-fallback {\r\n  width: 32px;\r\n  height: 32px;\r\n  border-radius: 50%;\r\n  background: var(--vtx-color-primary-600, #2563eb);\r\n  color: white;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  font-weight: var(--vtx-font-weight-semibold, 600);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-user-info {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: 2px;\r\n  text-align: left;\r\n}\r\n\r\n@media (max-width: 640px) {\r\n  .vtx-admin-header-user-info {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.vtx-admin-header-user-name {\r\n  color: var(--vtx-admin-header-text);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n  line-height: 1.2;\r\n}\r\n\r\n.vtx-admin-header-user-role {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  font-size: var(--vtx-font-size-xs, 0.75rem);\r\n  line-height: 1;\r\n}\r\n\r\n/* User Dropdown */\r\n.vtx-admin-header-user-dropdown {\r\n  position: absolute;\r\n  top: calc(100% + 8px);\r\n  right: 0;\r\n  min-width: 220px;\r\n  background-color: var(--vtx-admin-header-dropdown-bg);\r\n  border: 1px solid var(--vtx-admin-header-border);\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  box-shadow: var(--vtx-admin-header-dropdown-shadow);\r\n  padding: var(--vtx-spacing-2, 0.5rem);\r\n  z-index: 1000;\r\n  animation: slideDown 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3, 0.75rem);\r\n  width: 100%;\r\n  padding: var(--vtx-spacing-2, 0.5rem) var(--vtx-spacing-3, 0.75rem);\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-base, 0.25rem);\r\n  background: transparent;\r\n  color: var(--vtx-admin-header-text);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  text-align: left;\r\n  cursor: pointer;\r\n  text-decoration: none;\r\n  transition: background-color var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item:hover:not(.vtx-admin-header-user-menu-item--disabled) {\r\n  background-color: var(--vtx-admin-header-button-hover);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item--danger {\r\n  color: var(--vtx-color-error-600, #dc2626);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item--danger:hover:not(.vtx-admin-header-user-menu-item--disabled) {\r\n  background-color: var(--vtx-color-error-50, #fef2f2);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item--success {\r\n  color: var(--vtx-color-success-600, #16a34a);\r\n}\r\n\r\n.vtx-admin-header-user-menu-item--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-admin-header-user-menu-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 18px;\r\n  height: 18px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-admin-header-user-menu-label {\r\n  flex: 1;\r\n}\r\n\r\n.vtx-admin-header-user-menu-shortcut {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  font-size: var(--vtx-font-size-xs, 0.75rem);\r\n  margin-left: auto;\r\n}\r\n\r\n.vtx-admin-header-user-menu-badge {\r\n  margin-left: auto;\r\n}\r\n\r\n.vtx-admin-header-user-menu-divider {\r\n  height: 1px;\r\n  background-color: var(--vtx-admin-header-border);\r\n  margin: var(--vtx-spacing-2, 0.5rem) 0;\r\n}\r\n\r\n/* ===================================\r\n   Breadcrumbs\r\n   =================================== */\r\n\r\n.vtx-admin-header-breadcrumbs {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2, 0.5rem);\r\n  padding: var(--vtx-spacing-2, 0.5rem) var(--vtx-spacing-6, 1.5rem);\r\n  border-top: 1px solid var(--vtx-admin-header-border);\r\n  background-color: var(--vtx-admin-header-bg);\r\n  overflow-x: auto;\r\n}\r\n\r\n.vtx-admin-header-breadcrumb {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  font-size: var(--vtx-font-size-sm, 0.875rem);\r\n  text-decoration: none;\r\n  white-space: nowrap;\r\n  transition: color var(--vtx-admin-header-transition) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-admin-header-breadcrumb:hover {\r\n  color: var(--vtx-admin-header-text);\r\n  text-decoration: underline;\r\n}\r\n\r\n.vtx-admin-header-breadcrumb--current {\r\n  color: var(--vtx-admin-header-text);\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n  cursor: default;\r\n}\r\n\r\n.vtx-admin-header-breadcrumb--current:hover {\r\n  text-decoration: none;\r\n}\r\n\r\n.vtx-admin-header-breadcrumb-separator {\r\n  color: var(--vtx-admin-header-text-secondary);\r\n  user-select: none;\r\n}\r\n\r\n/* ===================================\r\n   VARIANTS\r\n   =================================== */\r\n\r\n.vtx-admin-header--elevated {\r\n  box-shadow: var(--vtx-admin-header-shadow);\r\n}\r\n\r\n.vtx-admin-header--bordered {\r\n  border-bottom-width: 2px;\r\n}\r\n\r\n.vtx-admin-header--minimal {\r\n  background-color: transparent;\r\n  border-bottom: 1px solid transparent;\r\n}\r\n\r\n.vtx-admin-header--transparent {\r\n  background-color: transparent;\r\n  border-bottom-color: transparent;\r\n}\r\n\r\n/* ===================================\r\n   THEMES\r\n   =================================== */\r\n\r\n.vtx-admin-header--dark {\r\n  --vtx-admin-header-bg: var(--vtx-color-neutral-900, #171717);\r\n  --vtx-admin-header-border: var(--vtx-color-neutral-800, #262626);\r\n  --vtx-admin-header-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);\r\n  \r\n  --vtx-admin-header-text: var(--vtx-color-neutral-50, #fafafa);\r\n  --vtx-admin-header-text-secondary: var(--vtx-color-neutral-400, #a3a3a3);\r\n  \r\n  --vtx-admin-header-button-hover: var(--vtx-color-neutral-800, #262626);\r\n  --vtx-admin-header-button-active: var(--vtx-color-neutral-700, #404040);\r\n  \r\n  --vtx-admin-header-input-bg: var(--vtx-color-neutral-800, #262626);\r\n  --vtx-admin-header-input-border: var(--vtx-color-neutral-700, #404040);\r\n  \r\n  --vtx-admin-header-dropdown-bg: var(--vtx-color-neutral-900, #171717);\r\n}\r\n\r\n.vtx-admin-header--primary {\r\n  --vtx-admin-header-bg: var(--vtx-color-primary-600, #2563eb);\r\n  --vtx-admin-header-border: var(--vtx-color-primary-700, #1d4ed8);\r\n  \r\n  --vtx-admin-header-text: var(--vtx-color-neutral-50, #ffffff);\r\n  --vtx-admin-header-text-secondary: var(--vtx-color-primary-100, #dbeafe);\r\n  \r\n  --vtx-admin-header-button-hover: var(--vtx-color-primary-700, #1d4ed8);\r\n  --vtx-admin-header-button-active: var(--vtx-color-primary-800, #1e40af);\r\n  \r\n  --vtx-admin-header-input-bg: var(--vtx-color-primary-700, #1d4ed8);\r\n  --vtx-admin-header-input-border: var(--vtx-color-primary-600, #2563eb);\r\n  \r\n  --vtx-admin-header-dropdown-bg: var(--vtx-color-neutral-50, #ffffff);\r\n}\r\n\r\n.vtx-admin-header--gradient {\r\n  background: linear-gradient(135deg, var(--vtx-color-primary-600, #2563eb) 0%, var(--vtx-color-secondary-600, #7c3aed) 100%);\r\n  --vtx-admin-header-border: rgba(255, 255, 255, 0.1);\r\n  \r\n  --vtx-admin-header-text: var(--vtx-color-neutral-50, #ffffff);\r\n  --vtx-admin-header-text-secondary: rgba(255, 255, 255, 0.8);\r\n  \r\n  --vtx-admin-header-button-hover: rgba(255, 255, 255, 0.1);\r\n  --vtx-admin-header-button-active: rgba(255, 255, 255, 0.2);\r\n  \r\n  --vtx-admin-header-input-bg: rgba(255, 255, 255, 0.1);\r\n  --vtx-admin-header-input-border: rgba(255, 255, 255, 0.2);\r\n  \r\n  --vtx-admin-header-dropdown-bg: var(--vtx-color-neutral-50, #ffffff);\r\n}\r\n\r\n/* ===================================\r\n   Responsive\r\n   =================================== */\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-admin-header-container {\r\n    gap: var(--vtx-spacing-2, 0.5rem);\r\n    padding: 0 var(--vtx-spacing-4, 1rem);\r\n  }\r\n  \r\n  .vtx-admin-header-left {\r\n    gap: var(--vtx-spacing-2, 0.5rem);\r\n  }\r\n  \r\n  .vtx-admin-header-right {\r\n    gap: var(--vtx-spacing-1, 0.25rem);\r\n  }\r\n  \r\n  .vtx-admin-header-divider {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* ===================================\r\n   Accessibility\r\n   =================================== */\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-admin-header,\r\n  .vtx-admin-header * {\r\n    animation: none !important;\r\n    transition: none !important;\r\n  }\r\n}\r\n\r\n@media (prefers-contrast: high) {\r\n  .vtx-admin-header {\r\n    border: 2px solid currentColor;\r\n  }\r\n}\r\n");const en=({value:e="",onChange:t,onSubmit:a,onFocus:o,placeholder:i,loading:l,suggestions:d,icon:s})=>{const[c,x]=n.useState(e),[v,m]=n.useState(!1),p=n.useRef(null);n.useEffect(()=>{x(e)},[e]),n.useEffect(()=>{const r=r=>{p.current&&!p.current.contains(r.target)&&m(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);return r.jsxs("div",{className:"vtx-admin-header-search",ref:p,children:[r.jsxs("form",{onSubmit:r=>{r.preventDefault(),null==a||a(c),m(!1)},className:"vtx-admin-header-search-form",children:[r.jsx("div",{className:"vtx-admin-header-search-icon",children:l?r.jsx("span",{className:"vtx-admin-header-search-spinner"}):s||r.jsx(or,{})}),r.jsx("input",{type:"text",className:"vtx-admin-header-search-input",placeholder:i||"Search...",value:c,onChange:r=>{const n=r.target.value;x(n),null==t||t(n),m(!0)},onFocus:()=>{null==o||o(),d&&d.length>0&&m(!0)}}),c&&r.jsx("button",{type:"button",className:"vtx-admin-header-search-clear",onClick:()=>{x(""),null==t||t("")},"aria-label":"Clear search",children:r.jsx(nr,{})})]}),v&&d&&d.length>0&&r.jsx("div",{className:"vtx-admin-header-search-suggestions",children:d.map(n=>r.jsxs("button",{type:"button",className:"vtx-admin-header-search-suggestion",onClick:()=>{var r;null===(r=n.onClick)||void 0===r||r.call(n),m(!1)},children:[n.icon&&r.jsx("span",{className:"vtx-admin-header-search-suggestion-icon",children:n.icon}),r.jsxs("div",{className:"vtx-admin-header-search-suggestion-content",children:[r.jsx("span",{className:"vtx-admin-header-search-suggestion-label",children:n.label}),n.category&&r.jsx("span",{className:"vtx-admin-header-search-suggestion-category",children:n.category})]})]},n.id))})]})},tn=({notifications:n,onNotificationClick:e,onMarkAllAsRead:t,onClearAll:a,onViewAll:o,onClose:i,maxNotifications:l=5})=>{const d=n.filter(r=>!r.read).length,s=n.slice(0,l);return r.jsxs("div",{className:"vtx-admin-header-notifications-panel",children:[r.jsxs("div",{className:"vtx-admin-header-notifications-header",children:[r.jsxs("div",{className:"vtx-admin-header-notifications-header-title",children:[r.jsx(Fr,{variant:"subtitle2",noMargin:!0,style:{fontWeight:600},children:"Notifications"}),d>0&&r.jsx(nn,{variant:"primary",size:"sm",style:{marginLeft:"8px"},children:d})]}),r.jsxs("div",{className:"vtx-admin-header-notifications-header-actions",children:[d>0&&t&&r.jsx("button",{className:"vtx-admin-header-notifications-action-btn",onClick:t,title:"Mark all as read",children:"Mark all read"}),n.length>0&&a&&r.jsx("button",{className:"vtx-admin-header-notifications-action-btn vtx-admin-header-notifications-action-btn--danger",onClick:a,title:"Clear all",children:"Clear"})]})]}),r.jsx("div",{className:"vtx-admin-header-notifications-list",children:0===n.length?r.jsxs("div",{className:"vtx-admin-header-notifications-empty",children:[r.jsx("div",{style:{fontSize:"48px",opacity:.3},children:r.jsx(F,{})}),r.jsx(Fr,{variant:"body2",noMargin:!0,style:{marginTop:"12px",color:"var(--vtx-color-neutral-500)"},children:"No notifications"})]}):r.jsx(r.Fragment,{children:s.map(n=>{const t=n.href?"a":"button";return r.jsxs(t,{className:`vtx-admin-header-notification-item ${n.read?"":"vtx-admin-header-notification-item--unread"} ${n.type?`vtx-admin-header-notification-item--${n.type}`:""}`,onClick:()=>(r=>{null==e||e(r),i()})(n),href:n.href,type:n.href?void 0:"button",children:[(n.icon||n.avatar)&&r.jsx("div",{className:"vtx-admin-header-notification-icon",children:n.avatar?r.jsx(Jr,{src:n.avatar,size:"sm",alt:"Notification"}):n.icon}),r.jsxs("div",{className:"vtx-admin-header-notification-content",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,style:{fontWeight:n.read?400:600},children:n.title}),n.description&&r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-600)",marginTop:"2px"},children:n.description}),r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-500)",marginTop:"4px"},children:n.time})]}),!n.read&&r.jsx("div",{className:"vtx-admin-header-notification-dot"})]},n.id)})})}),n.length>l&&o&&r.jsx("div",{className:"vtx-admin-header-notifications-footer",children:r.jsxs("button",{className:"vtx-admin-header-notifications-view-all",onClick:()=>{o(),i()},children:["View all ",n.length," notifications"]})})]})},an=({items:n,onClose:e})=>r.jsx("div",{className:"vtx-admin-header-user-dropdown",children:n.map((n,t)=>{const a=n.href?"a":"button";return r.jsxs(i.default.Fragment,{children:[r.jsxs(a,{className:`vtx-admin-header-user-menu-item ${n.variant?`vtx-admin-header-user-menu-item--${n.variant}`:""} ${n.disabled?"vtx-admin-header-user-menu-item--disabled":""}`,onClick:()=>(r=>{var n;r.disabled||(null===(n=r.onClick)||void 0===n||n.call(r),e())})(n),href:n.href,type:n.href?void 0:"button",disabled:n.disabled,children:[n.icon&&r.jsx("span",{className:"vtx-admin-header-user-menu-icon",children:n.icon}),r.jsx("span",{className:"vtx-admin-header-user-menu-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",className:"vtx-admin-header-user-menu-badge",children:n.badge}),n.shortcut&&r.jsx("span",{className:"vtx-admin-header-user-menu-shortcut",children:n.shortcut})]}),n.divider&&r.jsx("div",{className:"vtx-admin-header-user-menu-divider"})]},t)})}),on=i.default.forwardRef(({logo:e,title:t,subtitle:a,onLogoClick:o,onToggleSidebar:l,showToggleButton:d=!0,toggleIcon:s,showSearch:c=!1,searchPlaceholder:x,searchValue:v,onSearchChange:m,onSearchSubmit:p,onSearchFocus:h,searchSuggestions:u,searchLoading:g,searchIcon:f,notifications:b=[],onNotificationClick:w,onMarkAllAsRead:y,onClearAllNotifications:k,onViewAllNotifications:j,showNotifications:z=!0,notificationIcon:N,quickActions:_=[],userName:C,userRole:S,userAvatar:M,userAvatarFallback:T,userMenuItems:$=[],showUserMenu:A=!0,onUserAvatarClick:D,actions:R,leftContent:L,centerContent:B,rightContent:O,className:W="",style:P,variant:V="default",theme:H="light",sticky:Y=!0,height:q="64px",blur:U=!1,maxNotifications:G=5,showBreadcrumbs:X=!1,breadcrumbs:K=[]},Q)=>{const[Z,J]=n.useState(!1),[rr,nr]=n.useState(!1),er=n.useRef(null),tr=n.useRef(null),ar=b.filter(r=>!r.read).length;n.useEffect(()=>{const r=r=>{er.current&&!er.current.contains(r.target)&&J(!1),tr.current&&!tr.current.contains(r.target)&&nr(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]),n.useEffect(()=>{const r=r=>{"Escape"===r.key&&(J(!1),nr(!1))};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[]);const or=["vtx-admin-header",`vtx-admin-header--${V}`,`vtx-admin-header--${H}`,Y&&"vtx-admin-header--sticky",U&&"vtx-admin-header--blur",W].filter(Boolean).join(" "),ir={...P,height:"number"==typeof q?`${q}px`:q};return r.jsxs("header",{ref:Q,className:or,style:ir,children:[r.jsxs("div",{className:"vtx-admin-header-container",children:[r.jsxs("div",{className:"vtx-admin-header-left",children:[d&&l&&r.jsx("button",{className:"vtx-admin-header-toggle",onClick:l,"aria-label":"Toggle sidebar",type:"button",children:s||r.jsx(E,{})}),(e||t)&&r.jsxs("div",{className:"vtx-admin-header-brand",onClick:o,style:{cursor:o?"pointer":"default"},children:[e&&r.jsx("div",{className:"vtx-admin-header-logo",children:e}),t&&r.jsxs("div",{className:"vtx-admin-header-brand-text",children:[r.jsx(Fr,{variant:"h6",noMargin:!0,className:"vtx-admin-header-title",children:t}),a&&r.jsx(Fr,{variant:"caption",noMargin:!0,className:"vtx-admin-header-subtitle",children:a})]})]}),L]}),r.jsxs("div",{className:"vtx-admin-header-center",children:[c&&r.jsx(en,{value:v,onChange:m,onSubmit:p,onFocus:h,placeholder:x,loading:g,suggestions:u,icon:f}),B]}),r.jsxs("div",{className:"vtx-admin-header-right",children:[_.length>0&&r.jsx("div",{className:"vtx-admin-header-quick-actions",children:_.map(n=>r.jsxs("button",{className:"vtx-admin-header-icon-button "+(n.disabled?"vtx-admin-header-icon-button--disabled":""),onClick:n.onClick,title:n.tooltip||n.label,disabled:n.disabled,"aria-label":n.label,type:"button",children:[n.icon,n.badge&&r.jsx(nn,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:n.badge})]},n.id))}),R,O,(z||A)&&r.jsx("div",{className:"vtx-admin-header-divider"}),z&&b.length>0&&r.jsxs("div",{className:"vtx-admin-header-notifications",ref:er,children:[r.jsxs("button",{className:"vtx-admin-header-icon-button "+(Z?"vtx-admin-header-icon-button--active":""),onClick:()=>J(!Z),"aria-label":"Notifications",type:"button",children:[N||r.jsx(F,{}),ar>0&&r.jsx(nn,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:ar>9?"9+":ar})]}),Z&&r.jsx(tn,{notifications:b,onNotificationClick:w,onMarkAllAsRead:y,onClearAll:k,onViewAll:j,onClose:()=>J(!1),maxNotifications:G})]}),A&&C&&r.jsxs("div",{className:"vtx-admin-header-user",ref:tr,children:[r.jsxs("button",{className:"vtx-admin-header-user-button "+(rr?"vtx-admin-header-user-button--active":""),onClick:()=>{$.length>0?nr(!rr):null==D||D()},"aria-label":"User menu",type:"button",children:[M?r.jsx(Jr,{src:M,alt:C,size:"sm",className:"vtx-admin-header-user-avatar"}):r.jsx("div",{className:"vtx-admin-header-user-avatar vtx-admin-header-user-avatar-fallback",children:T||C.charAt(0).toUpperCase()}),r.jsxs("div",{className:"vtx-admin-header-user-info",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,className:"vtx-admin-header-user-name",children:C}),S&&r.jsx(Fr,{variant:"caption",noMargin:!0,className:"vtx-admin-header-user-role",children:S})]}),$.length>0&&r.jsx(I,{})]}),rr&&$.length>0&&r.jsx(an,{items:$,onClose:()=>nr(!1)})]})]})]}),X&&K.length>0&&r.jsx("div",{className:"vtx-admin-header-breadcrumbs",children:K.map((n,e)=>r.jsxs(i.default.Fragment,{children:[e>0&&r.jsx("span",{className:"vtx-admin-header-breadcrumb-separator",children:"/"}),n.href||n.onClick?r.jsx("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:"vtx-admin-header-breadcrumb",children:n.label}):r.jsx("span",{className:"vtx-admin-header-breadcrumb vtx-admin-header-breadcrumb--current",children:n.label})]},e))})]})});on.displayName="AdminHeader";const ln=y(on);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 dn=i.default.forwardRef(({children:n,variant:e="elevated",size:t,noPadding:a=!1,padding:o,hoverable:i=!1,clickable:l=!1,className:d="",header:s,footer:c,divider:x=!1,style:v,onClick:m,tabIndex:p,...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":"",d].filter(Boolean).join(" "),w={...v||{},...o?{"--vtx-card-padding":o}:{}},y=l?"number"==typeof p?p:0:p;return r.jsxs("div",{ref:g,className:b,style:w,onClick:m,tabIndex:y,...u,children:[s&&r.jsx("div",{className:"vtx-card-header"+(x?" vtx-card-header--divider":""),children:s}),r.jsx("div",{className:"vtx-card-content",children:n}),c&&r.jsx("div",{className:"vtx-card-footer"+(x?" vtx-card-footer--divider":""),children:c})]})});dn.displayName="Card";const sn=y(dn);k('/* ==========================================\r\n   DataGrid - Professional MUI-inspired Design\r\n   ========================================== */\r\n\r\n.vertex-datagrid {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n  border: 1px solid rgba(224, 224, 224, 1);\r\n  border-radius: 4px;\r\n  background: #fff;\r\n  overflow: hidden;\r\n  font-family: "Roboto", "Helvetica", "Arial", sans-serif;\r\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vertex-datagrid--auto-height {\r\n  height: auto;\r\n}\r\n\r\n/* ==========================================\r\n   Density Variants\r\n   ========================================== */\r\n\r\n.vertex-datagrid--compact .vertex-datagrid-th,\r\n.vertex-datagrid--compact .vertex-datagrid-td {\r\n  padding: 4px 16px;\r\n  font-size: 0.8125rem;\r\n}\r\n\r\n.vertex-datagrid--standard .vertex-datagrid-th,\r\n.vertex-datagrid--standard .vertex-datagrid-td {\r\n  padding: 8px 16px;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vertex-datagrid--comfortable .vertex-datagrid-th,\r\n.vertex-datagrid--comfortable .vertex-datagrid-td {\r\n  padding: 12px 20px;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n/* ==========================================\r\n   Size Variants\r\n   ========================================== */\r\n\r\n.vertex-datagrid--sm .vertex-datagrid-th,\r\n.vertex-datagrid--sm .vertex-datagrid-td {\r\n  font-size: 0.75rem;\r\n}\r\n\r\n.vertex-datagrid--md .vertex-datagrid-th,\r\n.vertex-datagrid--md .vertex-datagrid-td {\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vertex-datagrid--lg .vertex-datagrid-th,\r\n.vertex-datagrid--lg .vertex-datagrid-td {\r\n  font-size: 1rem;\r\n}\r\n\r\n/* ==========================================\r\n   Table Container\r\n   ========================================== */\r\n\r\n.vertex-datagrid-container {\r\n  overflow: auto;\r\n  flex: 1;\r\n  background: #fff;\r\n}\r\n\r\n.vertex-datagrid-table {\r\n  width: 100%;\r\n  border-collapse: collapse;\r\n  border-spacing: 0;\r\n}\r\n\r\n/* ==========================================\r\n   Table Header\r\n   ========================================== */\r\n\r\n.vertex-datagrid-thead {\r\n  background: #fafafa;\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n}\r\n\r\n.vertex-datagrid-th {\r\n  text-align: left;\r\n  font-weight: 600;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  user-select: none;\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n  position: sticky;\r\n  top: 0;\r\n  background: #fafafa;\r\n  z-index: 100;\r\n}\r\n\r\n.vertex-datagrid-th-content {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 4px;\r\n  min-height: 40px;\r\n}\r\n\r\n.vertex-datagrid-th-label {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  flex: 1;\r\n  cursor: default;\r\n  transition: color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th--sortable .vertex-datagrid-th-label {\r\n  cursor: pointer;\r\n}\r\n\r\n.vertex-datagrid-th--sortable:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-th-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 600;\r\n  line-height: 1.5rem;\r\n  letter-spacing: 0.01071em;\r\n}\r\n\r\n.vertex-datagrid-sort-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  color: rgba(0, 0, 0, 0.26);\r\n  transition: color 0.2s, opacity 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th--sortable .vertex-datagrid-sort-icon {\r\n  opacity: 0;\r\n}\r\n\r\n.vertex-datagrid-th--sortable:hover .vertex-datagrid-sort-icon {\r\n  opacity: 1;\r\n}\r\n\r\n.vertex-datagrid-sort-icon--active {\r\n  opacity: 1 !important;\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n/* ==========================================\r\n   Column Menu Button\r\n   ========================================== */\r\n\r\n.vertex-datagrid-column-menu-btn {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 24px;\r\n  height: 24px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  opacity: 0;\r\n  transition: opacity 0.2s, background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-th:hover .vertex-datagrid-column-menu-btn {\r\n  opacity: 1;\r\n}\r\n\r\n.vertex-datagrid-column-menu-btn:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-column-menu-btn--filtered {\r\n  opacity: 1;\r\n  color: #1976d2;\r\n}\r\n\r\n.vertex-datagrid-filter-badge {\r\n  position: absolute;\r\n  top: 2px;\r\n  right: 2px;\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 50%;\r\n  background: #1976d2;\r\n}\r\n\r\n/* ==========================================\r\n   Column Menu Dropdown\r\n   ========================================== */\r\n\r\n.vertex-datagrid-column-menu {\r\n  min-width: 200px;\r\n  background: #fff;\r\n  border-radius: 4px;\r\n  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2), \r\n              0px 8px 10px 1px rgba(0,0,0,0.14), \r\n              0px 3px 14px 2px rgba(0,0,0,0.12);\r\n  padding: 8px 0;\r\n}\r\n\r\n.vertex-datagrid-column-menu-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  width: 100%;\r\n  padding: 8px 16px;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  text-align: left;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  position: relative;\r\n}\r\n\r\n.vertex-datagrid-column-menu-item:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-column-menu-item svg {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vertex-datagrid-column-menu-divider {\r\n  height: 1px;\r\n  margin: 8px 0;\r\n  background: rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.vertex-datagrid-menu-check {\r\n  margin-left: auto;\r\n  color: #1976d2;\r\n  font-weight: 600;\r\n}\r\n\r\n.vertex-datagrid-menu-badge {\r\n  margin-left: auto;\r\n  color: #1976d2;\r\n  font-size: 1.2rem;\r\n}\r\n\r\n/* ==========================================\r\n   Filter Panel Overlay\r\n   ========================================== */\r\n\r\n.vertex-datagrid-filter-panel-overlay {\r\n  position: fixed;\r\n  inset: 0;\r\n  background: rgba(0, 0, 0, 0.2);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1400;\r\n  backdrop-filter: blur(2px);\r\n}\r\n\r\n.vertex-datagrid-filter-panel {\r\n  width: 90%;\r\n  max-width: 600px;\r\n  max-height: 80vh;\r\n  background: #fff;\r\n  border-radius: 8px;\r\n  box-shadow: 0px 11px 15px -7px rgba(0,0,0,0.2), \r\n              0px 24px 38px 3px rgba(0,0,0,0.14), \r\n              0px 9px 46px 8px rgba(0,0,0,0.12);\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow: hidden;\r\n}\r\n\r\n.vertex-datagrid-filter-panel-header {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 16px 20px;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.vertex-datagrid-filter-close {\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  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-close:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-filter-panel-body {\r\n  flex: 1;\r\n  padding: 20px;\r\n  overflow-y: auto;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 16px;\r\n}\r\n\r\n.vertex-datagrid-filter-empty {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 16px;\r\n  padding: 40px 20px;\r\n  text-align: center;\r\n  color: rgba(0, 0, 0, 0.38);\r\n}\r\n\r\n.vertex-datagrid-filter-row {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n}\r\n\r\n.vertex-datagrid-filter-logic-btn {\r\n  align-self: flex-start;\r\n  padding: 4px 12px;\r\n  border: 1px solid #1976d2;\r\n  background: transparent;\r\n  color: #1976d2;\r\n  font-size: 0.75rem;\r\n  font-weight: 600;\r\n  border-radius: 16px;\r\n  cursor: pointer;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-logic-btn:hover {\r\n  background: rgba(25, 118, 210, 0.04);\r\n}\r\n\r\n.vertex-datagrid-filter-controls {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr 1fr auto;\r\n  gap: 8px;\r\n  align-items: start;\r\n}\r\n\r\n.vertex-datagrid-filter-select {\r\n  padding: 8px 12px;\r\n  border: 1px solid rgba(0, 0, 0, 0.23);\r\n  border-radius: 4px;\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  background: #fff;\r\n  color: rgba(0, 0, 0, 0.87);\r\n  cursor: pointer;\r\n  transition: border-color 0.2s, box-shadow 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-select:hover {\r\n  border-color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-filter-select:focus {\r\n  outline: none;\r\n  border-color: #1976d2;\r\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.2);\r\n}\r\n\r\n.vertex-datagrid-filter-remove {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 36px;\r\n  height: 36px;\r\n  padding: 0;\r\n  border: none;\r\n  background: transparent;\r\n  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-remove:hover {\r\n  background: rgba(211, 47, 47, 0.04);\r\n  color: #d32f2f;\r\n}\r\n\r\n.vertex-datagrid-filter-actions {\r\n  display: flex;\r\n  gap: 8px;\r\n  padding-top: 8px;\r\n}\r\n\r\n.vertex-datagrid-filter-panel-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-end;\r\n  padding: 12px 20px;\r\n  border-top: 1px solid rgba(0, 0, 0, 0.12);\r\n  gap: 12px;\r\n}\r\n\r\n/* ==========================================\r\n   Table Body\r\n   ========================================== */\r\n\r\n.vertex-datagrid-tbody {\r\n  background: #fff;\r\n}\r\n\r\n.vertex-datagrid-row {\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n  transition: background 0.15s;\r\n}\r\n\r\n.vertex-datagrid-row:hover {\r\n  background: rgba(0, 0, 0, 0.04);\r\n}\r\n\r\n.vertex-datagrid-row--selected {\r\n  background: rgba(25, 118, 210, 0.08);\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover {\r\n  background: rgba(25, 118, 210, 0.12);\r\n}\r\n\r\n.vertex-datagrid-td {\r\n  color: rgba(0, 0, 0, 0.87);\r\n  border-bottom: 1px solid rgba(224, 224, 224, 1);\r\n}\r\n\r\n.vertex-datagrid-checkbox-cell {\r\n  width: 58px;\r\n  padding-left: 16px !important;\r\n  padding-right: 0 !important;\r\n  position: sticky !important;\r\n  left: 0 !important;\r\n  z-index: 102 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-tbody .vertex-datagrid-checkbox-cell {\r\n  background: #fff !important;\r\n  z-index: 101 !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-checkbox-cell {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-checkbox-cell {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-checkbox-cell {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n/* ==========================================\r\n   Pinned/Frozen Columns\r\n   ========================================== */\r\n\r\n.vertex-datagrid-th--pinned-left,\r\n.vertex-datagrid-td--pinned-left {\r\n  position: sticky !important;\r\n  z-index: 100 !important;\r\n  box-shadow: 2px 0 5px -1px rgba(0, 0, 0, 0.15) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-left {\r\n  z-index: 101 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-td--pinned-left {\r\n  background: #fff !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-td--pinned-left {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-td--pinned-left {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-td--pinned-left {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-right,\r\n.vertex-datagrid-td--pinned-right {\r\n  position: sticky !important;\r\n  z-index: 100 !important;\r\n  box-shadow: -2px 0 5px -1px rgba(0, 0, 0, 0.15) !important;\r\n}\r\n\r\n.vertex-datagrid-th--pinned-right {\r\n  z-index: 101 !important;\r\n  background: #fafafa !important;\r\n}\r\n\r\n.vertex-datagrid-td--pinned-right {\r\n  background: #fff !important;\r\n}\r\n\r\n.vertex-datagrid-row:hover .vertex-datagrid-td--pinned-right {\r\n  background: rgba(0, 0, 0, 0.04) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected .vertex-datagrid-td--pinned-right {\r\n  background: rgba(25, 118, 210, 0.08) !important;\r\n}\r\n\r\n.vertex-datagrid-row--selected:hover .vertex-datagrid-td--pinned-right {\r\n  background: rgba(25, 118, 210, 0.12) !important;\r\n}\r\n\r\n/* ==========================================\r\n   Loading & Empty States\r\n   ========================================== */\r\n\r\n.vertex-datagrid-loading,\r\n.vertex-datagrid-empty {\r\n  padding: 0;\r\n  text-align: center;\r\n  border: none;\r\n}\r\n\r\n.vertex-datagrid-loading-content,\r\n.vertex-datagrid-empty-content {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 16px;\r\n  padding: 64px 24px;\r\n  color: rgba(0, 0, 0, 0.38);\r\n}\r\n\r\n.vertex-datagrid-spinner {\r\n  width: 40px;\r\n  height: 40px;\r\n  border: 3px solid rgba(25, 118, 210, 0.1);\r\n  border-top-color: #1976d2;\r\n  border-radius: 50%;\r\n  animation: vertex-spinner-rotate 0.8s linear infinite;\r\n}\r\n\r\n@keyframes vertex-spinner-rotate {\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/* ==========================================\r\n   Footer / Pagination\r\n   ========================================== */\r\n\r\n.vertex-datagrid-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  min-height: 52px;\r\n  padding: 0 16px;\r\n  border-top: 1px solid rgba(224, 224, 224, 1);\r\n  background: #fff;\r\n  gap: 16px;\r\n}\r\n\r\n.vertex-datagrid-footer-left,\r\n.vertex-datagrid-footer-center,\r\n.vertex-datagrid-footer-right {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n}\r\n\r\n.vertex-datagrid-footer-center {\r\n  flex: 1;\r\n  justify-content: center;\r\n}\r\n\r\n.vertex-datagrid-filter-chip {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  padding: 4px 12px;\r\n  border: 1px solid #1976d2;\r\n  background: rgba(25, 118, 210, 0.08);\r\n  color: #1976d2;\r\n  font-size: 0.8125rem;\r\n  font-weight: 500;\r\n  border-radius: 16px;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n}\r\n\r\n.vertex-datagrid-filter-chip:hover {\r\n  background: rgba(25, 118, 210, 0.16);\r\n}\r\n\r\n.vertex-datagrid-pagesize-label {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: default;\r\n}\r\n\r\n.vertex-datagrid-pagesize-select {\r\n  padding: 4px 28px 4px 8px;\r\n  border: 1px solid rgba(0, 0, 0, 0.23);\r\n  border-radius: 4px;\r\n  font-size: 0.875rem;\r\n  font-family: inherit;\r\n  background: #fff url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="rgba(0,0,0,0.54)" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>\') no-repeat right 4px center;\r\n  background-size: 16px;\r\n  cursor: pointer;\r\n  appearance: none;\r\n  transition: border-color 0.2s;\r\n  min-width: 70px;\r\n}\r\n\r\n.vertex-datagrid-pagesize-select:hover {\r\n  border-color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-pagesize-select:focus {\r\n  outline: none;\r\n  border-color: #1976d2;\r\n}\r\n\r\n.vertex-datagrid-pagination {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n}\r\n\r\n.vertex-datagrid-pagination-btn {\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  color: rgba(0, 0, 0, 0.54);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: background 0.2s, color 0.2s;\r\n}\r\n\r\n.vertex-datagrid-pagination-btn:hover:not(:disabled) {\r\n  background: rgba(0, 0, 0, 0.04);\r\n  color: rgba(0, 0, 0, 0.87);\r\n}\r\n\r\n.vertex-datagrid-pagination-btn:disabled {\r\n  color: rgba(0, 0, 0, 0.26);\r\n  cursor: default;\r\n}\r\n\r\n/* ==========================================\r\n   Scrollbar Styling\r\n   ========================================== */\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar {\r\n  width: 12px;\r\n  height: 12px;\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-track {\r\n  background: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-thumb {\r\n  background: rgba(0, 0, 0, 0.2);\r\n  border-radius: 6px;\r\n  border: 2px solid transparent;\r\n  background-clip: padding-box;\r\n}\r\n\r\n.vertex-datagrid-container::-webkit-scrollbar-thumb:hover {\r\n  background: rgba(0, 0, 0, 0.3);\r\n  background-clip: padding-box;\r\n}\r\n\r\n/* ==========================================\r\n   Responsive\r\n   ========================================== */\r\n\r\n@media (max-width: 768px) {\r\n  .vertex-datagrid-footer {\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n  }\r\n  \r\n  .vertex-datagrid-footer-left,\r\n  .vertex-datagrid-footer-center,\r\n  .vertex-datagrid-footer-right {\r\n    width: 100%;\r\n    justify-content: center;\r\n  }\r\n  \r\n  .vertex-datagrid-filter-controls {\r\n    grid-template-columns: 1fr;\r\n  }\r\n  \r\n  .vertex-datagrid-filter-panel {\r\n    width: 95%;\r\n    max-height: 90vh;\r\n  }\r\n}\r\n');const cn=(r="string")=>{switch(r){case"number":return[{label:"=",value:"=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)===n}},{label:"!=",value:"!=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)!==n}},{label:">",value:">",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)>n}},{label:">=",value:">=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)>=n}},{label:"<",value:"<",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)<n}},{label:"<=",value:"<=",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n=Number(r.value);return r=>Number(r)<=n}},{label:"is empty",value:"isEmpty",getApplyFilterFn:()=>r=>null==r||""===r},{label:"is not empty",value:"isNotEmpty",getApplyFilterFn:()=>r=>null!=r&&""!==r}];case"boolean":return[{label:"is",value:"is",getApplyFilterFn:r=>{if(null==r.value)return()=>!0;const n="true"===r.value;return r=>Boolean(r)===n}}];case"date":return[{label:"is",value:"is",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value).toDateString();return r=>!!r&&new Date(r).toDateString()===n}},{label:"after",value:"after",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value);return r=>!!r&&new Date(r)>n}},{label:"before",value:"before",getApplyFilterFn:r=>{if(!r.value)return()=>!0;const n=new Date(r.value);return r=>!!r&&new Date(r)<n}}];default:return[{label:"contains",value:"contains",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().includes(r.value.toLowerCase()):()=>!0},{label:"equals",value:"equals",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase()===r.value.toLowerCase():()=>!0},{label:"starts with",value:"startsWith",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().startsWith(r.value.toLowerCase()):()=>!0},{label:"ends with",value:"endsWith",getApplyFilterFn:r=>r.value?n=>null!=n&&String(n).toLowerCase().endsWith(r.value.toLowerCase()):()=>!0},{label:"is empty",value:"isEmpty",getApplyFilterFn:()=>r=>null==r||""===String(r).trim()},{label:"is not empty",value:"isNotEmpty",getApplyFilterFn:()=>r=>null!=r&&""!==String(r).trim()}]}},xn=({column:e,anchorEl:t,onClose:a,onSort:o,onFilter:i,currentSort:l,hasFilter:d})=>{const s=n.useRef(null);if(n.useEffect(()=>{const r=r=>{s.current&&!s.current.contains(r.target)&&t&&!t.contains(r.target)&&a()};return t&&document.addEventListener("mousedown",r),()=>{document.removeEventListener("mousedown",r)}},[t,a]),!t)return null;const c=t.getBoundingClientRect();return r.jsxs("div",{ref:s,className:"vertex-datagrid-column-menu",style:{position:"fixed",top:c.bottom+4,left:c.left,zIndex:1300},children:[e.sortable&&r.jsxs(r.Fragment,{children:[r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o("asc"),a()},children:[r.jsx(ir,{size:16}),r.jsx("span",{children:"Sort ascending"}),"asc"===l&&r.jsx("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o("desc"),a()},children:[r.jsx(lr,{size:16}),r.jsx("span",{children:"Sort descending"}),"desc"===l&&r.jsx("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),l&&r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{o(null),a()},children:[r.jsx("span",{style:{width:16}}),r.jsx("span",{children:"Unsort"})]}),e.filterable&&r.jsx("div",{className:"vertex-datagrid-column-menu-divider"})]}),e.filterable&&r.jsxs("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{i(),a()},children:[r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsx("span",{children:d?"Edit filter":"Filter"}),d&&r.jsx("span",{className:"vertex-datagrid-menu-badge",children:"●"})]})]})},vn=({columns:e,filterModel:t,onFilterModelChange:a,onClose:o,targetColumn:i})=>{const l=e.filter(r=>!1!==r.filterable),d=n.useRef(null);n.useEffect(()=>{const r=r=>{d.current&&!d.current.contains(r.target)&&o()};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[o]),n.useEffect(()=>{i&&0===t.items.length&&s(i)},[i]);const s=r=>{var n,o;const i=r||(null===(n=l[0])||void 0===n?void 0:n.field)||"",d=e.find(r=>r.field===i),s=(null==d?void 0:d.filterOperators)||cn(null==d?void 0:d.type),c={id:Date.now(),field:i,operator:(null===(o=s[0])||void 0===o?void 0:o.value)||"contains",value:""};a({...t,items:[...t.items,c]})},c=(r,n)=>{var o;const i=[...t.items],l=i[r];if(i[r]={...l,...n},n.field&&n.field!==l.field){const t=e.find(r=>r.field===n.field),a=(null==t?void 0:t.filterOperators)||cn(null==t?void 0:t.type);i[r].operator=(null===(o=a[0])||void 0===o?void 0:o.value)||"contains"}a({...t,items:i})},x=()=>{a({...t,logicOperator:"and"===t.logicOperator?"or":"and"})};return r.jsx("div",{className:"vertex-datagrid-filter-panel-overlay",children:r.jsxs("div",{ref:d,className:"vertex-datagrid-filter-panel",children:[r.jsxs("div",{className:"vertex-datagrid-filter-panel-header",children:[r.jsx(Fr,{weight:"semibold",size:"sm",children:"Filters"}),r.jsx("button",{className:"vertex-datagrid-filter-close",onClick:o,children:r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),r.jsx("div",{className:"vertex-datagrid-filter-panel-body",children:0===t.items.length?r.jsxs("div",{className:"vertex-datagrid-filter-empty",children:[r.jsx("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsx(Fr,{size:"sm",color:"secondary",children:"No filters applied"}),r.jsx(z,{variant:"outline",size:"sm",onClick:()=>s(),children:"Add filter"})]}):r.jsxs(r.Fragment,{children:[t.items.map((n,o)=>{var i;const d=e.find(r=>r.field===n.field),s=(null==d?void 0:d.filterOperators)||cn(null==d?void 0:d.type),v=!["isEmpty","isNotEmpty"].includes(n.operator);return r.jsxs("div",{className:"vertex-datagrid-filter-row",children:[o>0&&r.jsx("button",{className:"vertex-datagrid-filter-logic-btn",onClick:x,title:"Toggle AND/OR",children:(null===(i=t.logicOperator)||void 0===i?void 0:i.toUpperCase())||"OR"}),r.jsxs("div",{className:"vertex-datagrid-filter-controls",children:[r.jsx("select",{value:n.field,onChange:r=>c(o,{field:r.target.value}),className:"vertex-datagrid-filter-select",children:l.map(n=>r.jsx("option",{value:n.field,children:n.headerName},n.field))}),r.jsx("select",{value:n.operator,onChange:r=>c(o,{operator:r.target.value}),className:"vertex-datagrid-filter-select",children:s.map(n=>r.jsx("option",{value:n.value,children:n.label},n.value))}),v&&r.jsx(ur,{value:n.value||"",onChange:r=>c(o,{value:r.target.value}),placeholder:"Value",size:"sm"}),r.jsx("button",{className:"vertex-datagrid-filter-remove",onClick:()=>(r=>{const n=t.items.filter((n,e)=>e!==r);a({...t,items:n})})(o),title:"Remove filter",children:r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]})]},n.id||o)}),r.jsx("div",{className:"vertex-datagrid-filter-actions",children:r.jsx(z,{variant:"ghost",size:"sm",onClick:()=>s(),children:"+ Add filter"})})]})}),t.items.length>0&&r.jsx("div",{className:"vertex-datagrid-filter-panel-footer",children:r.jsx(z,{variant:"ghost",size:"sm",onClick:()=>a({items:[],logicOperator:"or"}),children:"Clear all"})})]})})},mn=({columns:e,rows:t,getRowId:a=(r,n)=>{var e;return null!==(e=r.id)&&void 0!==e?e:n},filterModel:o,onFilterModelChange:i,initialState:l,disableColumnFilter:d=!1,ignoreDiacritics:s=!1,sortModel:c,onSortModelChange:x,checkboxSelection:v=!1,rowSelectionModel:m,onRowSelectionModelChange:p,pagination:u=!0,pageSize:g=10,pageSizeOptions:f=[5,10,25,50,100],loading:b=!1,autoHeight:w=!1,density:y="standard",disableColumnMenu:k=!1,hideFooter:j=!1,size:z,className:N,...C})=>{var S,M;const{theme:T}=h(),$=z||T.defaultSize,[I,A]=n.useState((null===(S=null==l?void 0:l.filter)||void 0===S?void 0:S.filterModel)||{items:[],logicOperator:"or"}),[D,F]=n.useState([]),[E,R]=n.useState([]),[L,B]=n.useState(0),[O,W]=n.useState(g),[P,V]=n.useState(!1),[H,Y]=n.useState(null),[q,U]=n.useState(),G=null!=o?o:I,X=null!=c?c:D,K=null!=m?m:E,Q=n.useCallback(r=>{i?i(r):A(r)},[i]),Z=n.useCallback(r=>{x?x(r):F(r)},[x]),J=n.useCallback(r=>{p?p(r):R(r)},[p]),rr=n.useMemo(()=>d||0===G.items.length?t:t.filter(r=>{const n=G.items.map(n=>{const t=e.find(r=>r.field===n.field);if(!t)return!0;const a=t.valueGetter?t.valueGetter(r):r[n.field],o=(t.filterOperators||cn(t.type)).find(r=>r.value===n.operator);if(!o)return!0;return o.getApplyFilterFn(n)(a)});return"and"===G.logicOperator?n.every(r=>r):n.some(r=>r)}),[t,G,e,d]),nr=n.useMemo(()=>{if(0===X.length)return rr;const r=[...rr],n=X[0],t=e.find(r=>r.field===n.field);return t?(r.sort((r,e)=>{const a=t.valueGetter?t.valueGetter(r):r[n.field],o=t.valueGetter?t.valueGetter(e):e[n.field];if(null==a&&null==o)return 0;if(null==a)return 1;if(null==o)return-1;let i=0;return i="number"===t.type?Number(a)-Number(o):"date"===t.type?new Date(a).getTime()-new Date(o).getTime():String(a).localeCompare(String(o)),"asc"===n.sort?i:-i}),r):r},[rr,X,e]),er=n.useMemo(()=>{if(!u)return nr;const r=L*O,n=r+O;return nr.slice(r,n)},[nr,L,O,u]),tr=n.useCallback((r,n)=>{if(!r.sortable)return;let e;e=null===n?[]:[{field:r.field,sort:n}],Z(e)},[Z]),ar=n.useCallback(r=>{const n=K.includes(r)?K.filter(n=>n!==r):[...K,r];J(n)},[K,J]),or=n.useCallback(()=>{if(K.length===er.length)J([]);else{const r=er.map((r,n)=>a(r,n));J(r)}},[K,er,J,a]),dr=Math.ceil(nr.length/O),sr=G.items.length>0,cr=`vertex-datagrid--${y}`,xr=`vertex-datagrid--${$}`,vr=(r,n,t=!1)=>{if(!r.pinned)return{};const a={position:"sticky",zIndex:t?101:100,background:t?"#fafafa":"inherit"};if("left"===r.pinned){let r=v?58:0;for(let t=0;t<n;t++)"left"===e[t].pinned&&(r+=e[t].width||150);a.left=r}else if("right"===r.pinned){let n=0;for(let t=e.indexOf(r)+1;t<e.length;t++)"right"===e[t].pinned&&(n+=e[t].width||150);a.right=n}return a};return r.jsxs("div",{className:`vertex-datagrid ${cr} ${xr} ${w?"vertex-datagrid--auto-height":""} ${N||""}`,...C,children:[r.jsx("div",{className:"vertex-datagrid-container",children:r.jsxs("table",{className:"vertex-datagrid-table",children:[r.jsx("thead",{className:"vertex-datagrid-thead",children:r.jsxs("tr",{children:[v&&r.jsx("th",{className:"vertex-datagrid-th vertex-datagrid-checkbox-cell",children:r.jsx(_,{checked:K.length===er.length&&er.length>0,indeterminate:K.length>0&&K.length<er.length,onChange:or})}),e.map((n,e)=>{const t=X.find(r=>r.field===n.field),a=!!t,o=null==t?void 0:t.sort,i=G.items.some(r=>r.field===n.field),l=vr(n,e,!0);return r.jsx("th",{className:`vertex-datagrid-th ${n.sortable?"vertex-datagrid-th--sortable":""} ${n.pinned?`vertex-datagrid-th--pinned-${n.pinned}`:""}`,style:{width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth,textAlign:n.headerAlign||n.align||"left",flex:n.flex,...l},children:r.jsxs("div",{className:"vertex-datagrid-th-content",children:[r.jsxs("div",{className:"vertex-datagrid-th-label",onClick:()=>n.sortable&&tr(n,a?"asc"===o?"desc":null:"asc"),children:[r.jsx("span",{className:"vertex-datagrid-th-text",children:n.headerName}),n.sortable&&r.jsx("div",{className:"vertex-datagrid-sort-icon "+(a?"vertex-datagrid-sort-icon--active":""),children:a?"asc"===o?r.jsx(ir,{size:18}):r.jsx(lr,{size:18}):r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",opacity:"0.4",children:r.jsx("path",{d:"M12 5v14M5 12l7 7 7-7"})})})]}),!k&&(n.sortable||n.filterable)&&r.jsxs("button",{className:"vertex-datagrid-column-menu-btn "+(i?"vertex-datagrid-column-menu-btn--filtered":""),onClick:r=>{r.stopPropagation(),Y({column:n,anchorEl:r.currentTarget})},title:"Column options",children:[r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"currentColor",children:[r.jsx("circle",{cx:"12",cy:"5",r:"2"}),r.jsx("circle",{cx:"12",cy:"12",r:"2"}),r.jsx("circle",{cx:"12",cy:"19",r:"2"})]}),i&&r.jsx("span",{className:"vertex-datagrid-filter-badge"})]})]})},n.field)})]})}),r.jsx("tbody",{className:"vertex-datagrid-tbody",children:b?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(v?1:0),className:"vertex-datagrid-loading",children:r.jsxs("div",{className:"vertex-datagrid-loading-content",children:[r.jsx("div",{className:"vertex-datagrid-spinner"}),r.jsx(Fr,{size:"sm",color:"secondary",children:"Loading..."})]})})}):0===er.length?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(v?1:0),className:"vertex-datagrid-empty",children:r.jsxs("div",{className:"vertex-datagrid-empty-content",children:[r.jsxs("svg",{width:"64",height:"64",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1",opacity:"0.3",children:[r.jsx("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2"}),r.jsx("line",{x1:"3",y1:"9",x2:"21",y2:"9"}),r.jsx("line",{x1:"9",y1:"21",x2:"9",y2:"9"})]}),r.jsx(Fr,{size:"sm",color:"secondary",children:"No rows"})]})})}):er.map((n,t)=>{const o=a(n,t),i=K.includes(o);return r.jsxs("tr",{className:"vertex-datagrid-row "+(i?"vertex-datagrid-row--selected":""),children:[v&&r.jsx("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r.jsx(_,{checked:i,onChange:()=>ar(o)})}),e.map((e,t)=>{const a=e.valueGetter?e.valueGetter(n):n[e.field],o=e.valueFormatter?e.valueFormatter(a):a,i=e.renderCell?e.renderCell({row:n,value:a,field:e.field}):o,l=vr(e,t,!1);return r.jsx("td",{className:"vertex-datagrid-td "+(e.pinned?`vertex-datagrid-td--pinned-${e.pinned}`:""),style:{textAlign:e.align||"left",...l},children:i},e.field)})]},o)})})]})}),!j&&u&&r.jsxs("div",{className:"vertex-datagrid-footer",children:[r.jsx("div",{className:"vertex-datagrid-footer-left",children:sr&&r.jsxs("button",{className:"vertex-datagrid-filter-chip",onClick:()=>V(!0),children:[r.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r.jsxs("span",{children:[G.items.length," ",1===G.items.length?"filter":"filters"]})]})}),r.jsx("div",{className:"vertex-datagrid-footer-center",children:r.jsx(Fr,{size:"sm",color:"secondary",children:0===nr.length?"0 rows":`${L*O+1}–${Math.min((L+1)*O,nr.length)} of ${nr.length}`})}),r.jsxs("div",{className:"vertex-datagrid-footer-right",children:[r.jsxs("label",{className:"vertex-datagrid-pagesize-label",children:[r.jsx(Fr,{size:"sm",color:"secondary",children:"Rows per page:"}),r.jsx("select",{value:O,onChange:r=>{W(Number(r.target.value)),B(0)},className:"vertex-datagrid-pagesize-select",children:f.map(n=>r.jsx("option",{value:n,children:n},n))})]}),r.jsxs("div",{className:"vertex-datagrid-pagination",children:[r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(0),disabled:0===L,title:"First page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M11 17l-5-5 5-5M18 17l-5-5 5-5"})})}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(r=>Math.max(0,r-1)),disabled:0===L,title:"Previous page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M15 18l-6-6 6-6"})})}),r.jsxs(Fr,{size:"sm",color:"secondary",children:["Page ",L+1," of ",dr||1]}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(r=>Math.min(dr-1,r+1)),disabled:L>=dr-1,title:"Next page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M9 18l6-6-6-6"})})}),r.jsx("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>B(dr-1),disabled:L>=dr-1,title:"Last page",children:r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r.jsx("path",{d:"M13 17l5-5-5-5M6 17l5-5-5-5"})})})]})]})]}),H&&r.jsx(xn,{column:H.column,anchorEl:H.anchorEl,onClose:()=>Y(null),onSort:r=>tr(H.column,r),onFilter:()=>{U(H.column.field),V(!0)},currentSort:null===(M=X.find(r=>r.field===H.column.field))||void 0===M?void 0:M.sort,hasFilter:G.items.some(r=>r.field===H.column.field)}),P&&r.jsx(vn,{columns:e,filterModel:G,onFilterModelChange:Q,onClose:()=>{V(!1),U(void 0)},targetColumn:q})]})};mn.displayName="DataGrid";const pn=y(mn);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 hn=i.default.forwardRef(({textAlign:n="center",orientation:e="horizontal",variant:t="fullWidth",light:a=!1,flexItem:o=!1,children:i,component:l,className:d="",role:s,...c},x)=>{const v=l||(i||"vertical"===e?"div":"hr"),m=s||("hr"!==v?"separator":void 0),p=["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-${n}`,d].filter(Boolean).join(" "),h="vertical"===e&&"hr"!==v?{"aria-orientation":"vertical"}:{};return r.jsx(v,{ref:x,className:p,role:m,...h,...c,children:i&&r.jsx("span",{className:"vtx-divider-wrapper",children:i})})});hn.displayName="Divider";const un=y(hn);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 gn=i.default.forwardRef(({notifications:n,onNotificationClick:e,onMarkAllAsRead:t,onClose:a},o)=>{const i=n.filter(r=>!r.read).length;return r.jsxs("div",{ref:o,className:"vtx-header-notifications-panel",children:[r.jsx("div",{className:"vtx-header-notifications-header",children:r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"subtitle2",noMargin:!0,children:"Notifications"}),i>0&&t&&r.jsx("button",{className:"vtx-header-notifications-mark-read",onClick:()=>{t(),a()},children:"Mark all as read"})]})}),r.jsx("div",{className:"vtx-header-notifications-list",children:0===n.length?r.jsxs("div",{className:"vtx-header-notifications-empty",children:[r.jsx(F,{}),r.jsx(Fr,{variant:"body2",color:"neutral.500",noMargin:!0,children:"No notifications"})]}):n.map(n=>r.jsxs("div",{className:`vtx-header-notification-item ${n.read?"":"vtx-header-notification-item--unread"} ${n.type?`vtx-header-notification-item--${n.type}`:""}`,onClick:()=>{null==e||e(n),a()},children:[n.icon&&r.jsx("div",{className:"vtx-header-notification-icon",children:n.icon}),r.jsxs("div",{className:"vtx-header-notification-content",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,style:{fontWeight:n.read?400:600},children:n.title}),n.description&&r.jsx(Fr,{variant:"caption",color:"neutral.600",noMargin:!0,children:n.description}),r.jsx(Fr,{variant:"caption",color:"neutral.500",noMargin:!0,style:{marginTop:"4px"},children:n.time})]}),!n.read&&r.jsx("div",{className:"vtx-header-notification-dot"})]},n.id))})]})});gn.displayName="NotificationPanel";const fn=i.default.forwardRef(({logo:e,title:t,onToggleSidebar:a,showToggle:o=!0,notifications:i=[],onNotificationClick:l,onMarkAllAsRead:d,userName:s,userSubtitle:c,userAvatar:x,userMenuItems:v=[],actions:m,className:p="",sticky:h=!0},u)=>{const[g,f]=n.useState(!1),[b,w]=n.useState(!1),y=n.useRef(null),k=n.useRef(null),j=n.useRef(null),z=i.filter(r=>!r.read).length;n.useEffect(()=>{const r=r=>{y.current&&!y.current.contains(r.target)&&j.current&&!j.current.contains(r.target)&&f(!1),k.current&&!k.current.contains(r.target)&&w(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);const N=["vtx-header",h&&"vtx-header--sticky",p].filter(Boolean).join(" ");return r.jsxs("header",{ref:u,className:N,children:[r.jsxs(Ar,{align:"center",gap:16,style:{flex:1},children:[o&&a&&r.jsx("button",{className:"vtx-header-toggle",onClick:a,"aria-label":"Toggle sidebar",children:r.jsx(E,{})}),e&&r.jsx("div",{className:"vtx-header-logo",children:e}),t&&r.jsx(Fr,{variant:"h6",noMargin:!0,className:"vtx-header-title",children:t})]}),m&&r.jsx("div",{className:"vtx-header-actions",children:m}),r.jsxs("div",{className:"vtx-header-right",children:[i&&i.length>0&&r.jsxs("div",{className:"vtx-header-notifications",ref:y,children:[r.jsxs("button",{className:"vtx-header-icon-button "+(g?"vtx-header-icon-button--active":""),onClick:()=>f(!g),"aria-label":"Notifications",children:[r.jsx(F,{}),z>0&&r.jsx(nn,{variant:"error",size:"sm",style:{position:"absolute",top:"4px",right:"4px",minWidth:"18px",height:"18px",padding:"0 4px"},children:z>9?"9+":z})]}),g&&r.jsx(gn,{ref:j,notifications:i,onNotificationClick:l,onMarkAllAsRead:d,onClose:()=>f(!1)})]}),s&&r.jsxs("div",{className:"vtx-header-user-menu",ref:k,children:[r.jsxs("button",{className:"vtx-header-user-button "+(b?"vtx-header-user-button--active":""),onClick:()=>w(!b),"aria-label":"User menu",children:[r.jsx(Jr,{src:x,alt:s,size:"sm"}),!x&&r.jsx("span",{className:"vtx-header-avatar-fallback",children:s.split(" ").map(r=>r[0]).join("").slice(0,2)}),r.jsxs("div",{className:"vtx-header-user-info",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,style:{fontWeight:600},children:s}),c&&r.jsx(Fr,{variant:"caption",color:"neutral.600",noMargin:!0,children:c})]}),r.jsx(I,{})]}),b&&r.jsx("div",{className:"vtx-header-user-dropdown",children:r.jsx(Br,{items:v,responsive:!1})})]})]})]})});fn.displayName="Header";const bn=y(fn);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: 72px;\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: 12px 12px;\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: 12px 8px;\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 12px;\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 - Professional Style (Same as Menu component)\n   =================================== */\n\n.vtx-sidemenu-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  text-decoration: none;\n  outline: none;\n  border-right: none;\n  border-top: none;\n  border-bottom: none;\n  text-align: left;\n  width: 100%;\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:active:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\n  background: var(--vtx-color-neutral-200);\n  transform: scale(0.98);\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 Menu Item - Professional Style */\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--active:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n/* Disabled Menu Item */\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  gap: 0;\n}\n\n/* Icon Styling - Professional (Same as Menu) */\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-color-neutral-600);\n  transition: color 0.15s ease-in-out;\n}\n\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-sidemenu-item-icon svg {\n  width: 100%;\n  height: 100%;\n  transition: inherit;\n}\n\n/* Text Content */\n.vtx-sidemenu-item-label {\n  flex: 1;\n  color: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Badge */\n.vtx-sidemenu-item-badge {\n  font-size: var(--vtx-font-size-xs);\n  font-weight: var(--vtx-font-weight-semibold);\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--vtx-radius-full);\n  background: var(--vtx-color-error-500);\n  color: white;\n  line-height: 1;\n  top: 8px;\n  right: 8px;\n  box-shadow: 0 0 0 2px var(--vtx-sidemenu-bg);\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n\n/* Chevron Icon */\n.vtx-sidemenu-chevron {\n  display: flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-400);\n  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.vtx-sidemenu-chevron--open {\n  transform: rotate(180deg);\n}\n\n/* ===================================\n   Submenu - Professional Style (Same as Menu)\n   =================================== */\n\n.vtx-sidemenu-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-sidemenu-submenu .vtx-sidemenu-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-sidemenu-submenu .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-submenu .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-submenu .vtx-sidemenu-item--active:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n.vtx-sidemenu-submenu .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\n  color: var(--vtx-color-primary-600);\n}\n\n/* Nested submenu - additional indentation */\n.vtx-sidemenu-submenu .vtx-sidemenu-submenu {\n  padding-left: var(--vtx-spacing-4);\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-4px);\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 wn=({isOpen:n})=>r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",className:"vtx-sidemenu-chevron "+(n?"vtx-sidemenu-chevron--open":""),children:r.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),yn=i.default.forwardRef(({label:e,onClick:t,icon:a,disabled:o=!1,active:i=!1,items:l,badge:d,href:s,collapsed:c=!1,level:x=0},v)=>{const[m,p]=n.useState(!1),h=l&&l.length>0,u=r.jsx(r.Fragment,{children:r.jsxs(Ar,{align:"center",gap:c?0:12,style:{flex:1,minWidth:0},children:[a&&r.jsx("span",{className:"vtx-sidemenu-item-icon",children:a}),!c&&r.jsxs(r.Fragment,{children:[r.jsx(Fr,{variant:"body2",noMargin:!0,style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e}),d&&r.jsx("span",{className:"vtx-sidemenu-item-badge",children:d}),h&&r.jsx(wn,{isOpen:m})]})]})}),g=["vtx-sidemenu-item",i&&"vtx-sidemenu-item--active",o&&"vtx-sidemenu-item--disabled",h&&"vtx-sidemenu-item--has-submenu",c&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" "),f=s?"a":"div";return r.jsxs(r.Fragment,{children:[r.jsx(f,{ref:v,className:g,onClick:r=>{o||(h?(r.preventDefault(),p(!m)):t&&(r.preventDefault(),t()))},onKeyDown:r=>{o||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),h?p(!m):null==t||t())},role:"menuitem",tabIndex:o?-1:0,"aria-disabled":o,"aria-expanded":h?m:void 0,href:s,title:c?e:void 0,"data-label":c?e:void 0,children:u}),h&&m&&!c&&r.jsx("div",{className:"vtx-sidemenu-submenu",children:l.map((n,e)=>r.jsx(yn,{...n,collapsed:c,level:x+1},e))})]})});yn.displayName="SideMenuItem";const kn=i.default.forwardRef(({items:n,collapsed:e=!1,onCollapseToggle:t,className:a="",width:o="260px",collapsedWidth:i="80px",header:l,footer:d},s)=>{const c=e?"number"==typeof i?`${i}px`:i:"number"==typeof o?`${o}px`:o,x=["vtx-sidemenu",e&&"vtx-sidemenu--collapsed",a].filter(Boolean).join(" ");return r.jsxs("aside",{ref:s,className:x,style:{width:c},role:"navigation",children:[l&&r.jsx("div",{className:"vtx-sidemenu-header",children:l}),r.jsx("div",{className:"vtx-sidemenu-content",children:n.map((n,t)=>r.jsx(yn,{...n,collapsed:e},t))}),d&&r.jsx("div",{className:"vtx-sidemenu-footer",children:d})]})});kn.displayName="SideMenu";const jn=y(kn);function zn({columns:e,data:t,getRowKey:a,striped:o=!1,hoverable:l=!0,bordered:d=!1,size:s,caption:c,emptyMessage:x="No data available",loading:v=!1,loadingContent:m,scrollable:p=!0,maxHeight:u,onRowClick:g,isRowSelected:f,onRowSelect:b,sortable:w=!1,sortConfig:y,onSortChange:k,className:j="",containerClassName:z="",selectable:N=!1,selectedRows:C=[],onSelectionChange:S,pagination:M=!1,page:T=0,rowsPerPage:$=10,rowsPerPageOptions:A=[5,10,25,50],onPageChange:D,onRowsPerPageChange:F,dense:E=!1,expandableRows:O=!1,renderExpandedRow:W,expandedRows:P=[],onExpandRow:V,stickyHeader:H=!1,toolbar:Y,filterable:q=!1,filters:U={},onFiltersChange:G,...X}){const{theme:K}=h(),Q=s||K.defaultSize,[Z,J]=n.useState(y||null),[rr,nr]=n.useState(C),[er,tr]=n.useState(P),[ar,or]=n.useState(T),[cr,xr]=n.useState($),[vr,mr]=n.useState(U),pr=y||Z,hr=C.length>0?C:rr,gr=P.length>0?P:er,fr=D?T:ar,br=F?$:cr,wr=Object.keys(U).length>0?U:vr,yr=r=>{if(!w)return;const n=(null==pr?void 0:pr.key)===r&&"asc"===pr.direction?"desc":"asc",e={key:r,direction:n};k?k(r,n):J(e)},kr=n.useMemo(()=>{if(!pr||!w)return t;const r=e.find(r=>r.key===pr.key),n=null==r?void 0:r.sortFn;return[...t].sort((r,e)=>{if(n)return"asc"===pr.direction?n(r,e):n(e,r);const t=r[pr.key],a=e[pr.key];if("string"==typeof t&&"string"==typeof a)return"asc"===pr.direction?t.localeCompare(a):a.localeCompare(t);if("number"==typeof t&&"number"==typeof a)return"asc"===pr.direction?t-a:a-t;const o=String(t),i=String(a);return"asc"===pr.direction?o.localeCompare(i):i.localeCompare(o)})},[t,pr,e,w]),jr=n.useMemo(()=>q&&0!==Object.keys(wr).length?kr.filter(r=>Object.entries(wr).every(([n,t])=>{if(!t)return!0;const a=e.find(r=>r.key===n);if(null==a?void 0:a.filterFn)return a.filterFn(r,t);const o=r[n];return String(o||"").toLowerCase().includes(t.toLowerCase())})):kr,[kr,q,wr,e]),zr=n.useMemo(()=>{if(!M)return jr;const r=fr*br;return jr.slice(r,r+br)},[jr,M,fr,br]),Nr=M?zr:jr,_r=n.useCallback(r=>{if(!N)return;const n=r?Nr.map((r,n)=>a(r,n)):[];S?S(n):nr(n)},[N,Nr,a,S]),Cr=n.useCallback((r,n)=>{if(!N)return;const e=n?[...hr,r]:hr.filter(n=>n!==r);S?S(e):nr(e)},[N,hr,S]),Sr=N&&Nr.length>0&&Nr.every((r,n)=>hr.includes(a(r,n))),Mr=N&&hr.length>0&&!Sr,Tr=n.useCallback(r=>{if(!O)return;const n=gr.includes(r)?gr.filter(n=>n!==r):[...gr,r];V?V(r):tr(n)},[O,gr,V]),$r=n.useCallback(r=>{D?D(r):or(r)},[D]),Ir=n.useCallback(r=>{F?F(r):(xr(r),or(0))},[F]),Dr=n.useCallback((r,n)=>{const e={...wr,[r]:n};n||delete e[r],G?G(e):mr(e),M&&(D?D(0):or(0))},[wr,G,M,D]),Er=["vtx-table-container",p&&"vtx-table-container--scrollable",u&&"vtx-table-container--fixed-header",H&&"vtx-table-container--sticky-header",z].filter(Boolean).join(" "),Rr=["vtx-table",`vtx-table--${Q}`,E&&"vtx-table--dense",o&&"vtx-table--striped",l&&"vtx-table--hoverable",d&&"vtx-table--bordered",(g||N)&&"vtx-table--clickable",H&&"vtx-table--sticky-header",j].filter(Boolean).join(" "),Lr=(r,n,e)=>{b&&b(r,n),null==g||g(r,n,e)},Br=n=>{if(!w)return null;const e=(null==pr?void 0:pr.key)===n,t=null==pr?void 0:pr.direction;return e?r.jsx("span",{className:"vtx-table-sort-icon vtx-table-sort-icon--active",children:"asc"===t?r.jsx(ir,{size:14}):r.jsx(lr,{size:14})}):r.jsx("span",{className:"vtx-table-sort-icon vtx-table-sort-icon--inactive",children:r.jsx(ir,{size:14})})};return r.jsxs("div",{className:"vtx-table-wrapper",children:[Y&&r.jsx("div",{className:"vtx-table-toolbar",children:"object"==typeof Y&&null!==Y&&!i.default.isValidElement(Y)&&"title"in Y?r.jsxs(Ar,{justify:"between",align:"center",style:{width:"100%"},children:[Y.title&&r.jsx(Fr,{variant:"h6",noMargin:!0,children:Y.title}),Y.actions&&r.jsx("div",{className:"vtx-table-toolbar-actions",children:Y.actions})]}):r.jsx(r.Fragment,{children:Y})}),N&&hr.length>0&&r.jsx("div",{className:"vtx-table-selection-toolbar",children:r.jsx(Ar,{align:"center",gap:16,children:r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[hr.length," selected"]})})}),r.jsx("div",{className:Er,style:{maxHeight:u},children:r.jsxs("table",{className:Rr,...X,children:[c&&r.jsx("caption",{className:"vtx-table-caption",children:c}),r.jsx("thead",{className:"vtx-table-header",children:r.jsxs("tr",{children:[N&&r.jsx("th",{className:"vtx-table-header-cell vtx-table-cell--checkbox",children:r.jsx(_,{checked:Sr,indeterminate:Mr,onChange:r=>_r(r.target.checked),"aria-label":"Select all rows"})}),O&&r.jsx("th",{className:"vtx-table-header-cell vtx-table-cell--expand"}),e.map(n=>{const e=w&&!1!==n.sortable,t=q&&!1!==n.filterable,a=["vtx-table-header-cell",e&&"vtx-table-header-cell--sortable",n.sticky&&`vtx-table-header-cell--sticky-${n.sticky}`,n.headerClassName].filter(Boolean).join(" ");return r.jsx("th",{className:a,style:{width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth,textAlign:n.align||"left"},"aria-sort":(null==pr?void 0:pr.key)===n.key?"asc"===pr.direction?"ascending":"descending":void 0,children:r.jsxs("div",{className:"vtx-table-header-content",children:[r.jsxs("div",{className:"vtx-table-header-label",onClick:()=>e&&yr(n.key),onKeyDown:r=>{!e||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),yr(n.key))},role:e?"button":void 0,tabIndex:e?0:void 0,style:{cursor:e?"pointer":"default"},children:[r.jsx("span",{children:n.header}),e&&Br(n.key)]}),t&&r.jsx("div",{className:"vtx-table-filter",children:r.jsx(ur,{size:"sm",placeholder:n.filterPlaceholder||`Filter ${n.header}...`,value:wr[n.key]||"",onChange:r=>Dr(n.key,r.target.value),className:"vtx-table-filter-input"})})]})},n.key)})]})}),r.jsx("tbody",{className:"vtx-table-body",children:v?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(N?1:0)+(O?1:0),className:"vtx-table-loading",children:m||r.jsx("span",{className:"vtx-table-loading-spinner",children:"Loading..."})})}):0===Nr.length?r.jsx("tr",{children:r.jsx("td",{colSpan:e.length+(N?1:0)+(O?1:0),className:"vtx-table-empty",children:x})}):Nr.map((n,t)=>{const o=a(n,t),l=hr.includes(o),d=gr.includes(o),s=["vtx-table-row",l&&"vtx-table-row--selected",d&&"vtx-table-row--expanded"].filter(Boolean).join(" ");return r.jsxs(i.default.Fragment,{children:[r.jsxs("tr",{className:s,onClick:r=>{N&&!r.target.closest("input, button")||Lr(n,t,r)},role:g?"button":void 0,tabIndex:g?0:void 0,"aria-selected":l,onKeyDown:r=>{!g||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),Lr(n,t,r))},children:[N&&r.jsx("td",{className:"vtx-table-cell vtx-table-cell--checkbox",children:r.jsx(_,{checked:l,onChange:r=>{r.stopPropagation(),Cr(o,r.target.checked)},"aria-label":`Select row ${t+1}`})}),O&&r.jsx("td",{className:"vtx-table-cell vtx-table-cell--expand",children:r.jsx("button",{className:"vtx-table-expand-button",onClick:r=>{r.stopPropagation(),Tr(o)},"aria-label":d?"Collapse row":"Expand row","aria-expanded":d,children:d?r.jsx(R,{size:16}):r.jsx(I,{size:16})})}),e.map(e=>{const a=["vtx-table-cell",e.sticky&&`vtx-table-cell--sticky-${e.sticky}`,e.className].filter(Boolean).join(" ");return r.jsx("td",{className:a,style:{textAlign:e.align||"left",width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth},children:e.render?e.render(n,t):n[e.key]},e.key)})]}),O&&d&&W&&r.jsx("tr",{className:"vtx-table-row-expanded",children:r.jsx("td",{colSpan:e.length+(N?1:0)+1,className:"vtx-table-cell-expanded",children:W(n,t)})})]},o)})})]})}),M&&r.jsx("div",{className:"vtx-table-pagination",children:r.jsxs(Ar,{align:"center",justify:"between",style:{width:"100%"},children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Fr,{variant:"body2",color:"neutral.600",noMargin:!0,children:"Rows per page:"}),r.jsx("select",{className:"vtx-table-pagination-select",value:br,onChange:r=>Ir(Number(r.target.value)),"aria-label":"Rows per page",children:A.map(n=>r.jsx("option",{value:n,children:n},n))})]}),r.jsxs(Ar,{align:"center",gap:16,children:[r.jsxs(Fr,{variant:"body2",color:"neutral.600",noMargin:!0,children:[fr*br+1,"–",Math.min((fr+1)*br,jr.length)," of"," ",jr.length]}),r.jsxs(Ar,{align:"center",gap:4,children:[r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(0),disabled:0===fr,"aria-label":"First page",title:"First page",children:r.jsx(dr,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(fr-1),disabled:0===fr,"aria-label":"Previous page",title:"Previous page",children:r.jsx(L,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(fr+1),disabled:(fr+1)*br>=jr.length,"aria-label":"Next page",title:"Next page",children:r.jsx(B,{size:18})}),r.jsx("button",{className:"vtx-table-pagination-button",onClick:()=>$r(Math.ceil(jr.length/br)-1),disabled:(fr+1)*br>=jr.length,"aria-label":"Last page",title:"Last page",children:r.jsx(sr,{size:18})})]})]})]})})]})}k("/* Table Wrapper & Toolbar */\n.vtx-table-wrapper {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  background-color: white;\n  border-radius: var(--vtx-radius-lg);\n  border: 1px solid var(--vtx-color-neutral-200);\n  overflow: hidden;\n}\n\n.vtx-table-toolbar {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n  background-color: white;\n}\n\n.vtx-table-toolbar-actions {\n  display: flex;\n  align-items: center;\n  gap: var(--vtx-spacing-2);\n}\n\n.vtx-table-selection-toolbar {\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-6);\n  background-color: var(--vtx-color-primary-50);\n  border-bottom: 1px solid var(--vtx-color-primary-100);\n}\n\n.vtx-table-container {\n  width: 100%;\n  overflow-x: auto;\n}\n\n.vtx-table-container--fixed-header,\n.vtx-table-container--sticky-header {\n  overflow-y: auto;\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--sticky-header .vtx-table-header {\n  position: sticky;\n  top: 0;\n  z-index: 10;\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  background-color: var(--vtx-color-neutral-50);\n}\n\n.vtx-table-header-cell--sortable {\n  cursor: pointer;\n  user-select: none;\n  transition: background-color var(--vtx-transition-fast);\n}\n\n.vtx-table-header-cell--sortable:hover {\n  background-color: var(--vtx-color-neutral-100);\n}\n\n.vtx-table-header-content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--vtx-spacing-2);\n  width: 100%;\n}\n\n.vtx-table-header-label {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--vtx-spacing-2);\n  width: 100%;\n}\n\n.vtx-table-header-label > span {\n  flex: 1;\n}\n\n.vtx-table-sort-icon {\n  display: flex;\n  align-items: center;\n  color: var(--vtx-color-neutral-400);\n  transition: color var(--vtx-transition-fast);\n  flex-shrink: 0;\n}\n\n.vtx-table-sort-icon--active {\n  color: var(--vtx-color-primary-600);\n}\n\n.vtx-table-sort-icon--inactive {\n  opacity: 0.4;\n}\n\n.vtx-table-header-cell--sortable:hover .vtx-table-sort-icon--inactive {\n  opacity: 0.7;\n  color: var(--vtx-color-neutral-600);\n}\n\n/* Filter Input */\n.vtx-table-filter {\n  margin-top: var(--vtx-spacing-1);\n}\n\n.vtx-table-filter-input {\n  width: 100%;\n  font-size: var(--vtx-font-size-sm);\n  min-width: 0;\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-row--selected {\n  background-color: var(--vtx-color-primary-50);\n}\n\n.vtx-table-row--expanded {\n  border-bottom: none;\n}\n\n.vtx-table-row-expanded {\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table-row-expanded:last-child {\n  border-bottom: none;\n}\n\n.vtx-table-cell-expanded {\n  padding: var(--vtx-spacing-4);\n  background-color: var(--vtx-color-neutral-50);\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.vtx-table-cell--checkbox {\n  width: 48px;\n  padding: var(--vtx-spacing-2);\n}\n\n.vtx-table-cell--expand {\n  width: 48px;\n  padding: var(--vtx-spacing-2);\n}\n\n.vtx-table-expand-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  border-radius: var(--vtx-radius-md);\n  cursor: pointer;\n  color: var(--vtx-color-neutral-600);\n  transition: all var(--vtx-transition-fast);\n}\n\n.vtx-table-expand-button:hover {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n/* Sizes */\n.vtx-table--sm .vtx-table-header-cell,\n.vtx-table--sm .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--lg .vtx-table-header-cell,\n.vtx-table--lg .vtx-table-cell {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-lg);\n}\n\n.vtx-table--dense .vtx-table-header-cell,\n.vtx-table--dense .vtx-table-cell {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  font-size: var(--vtx-font-size-sm);\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.vtx-table--hoverable .vtx-table-row--selected:hover {\n  background-color: var(--vtx-color-primary-100);\n}\n\n/* Clickable */\n.vtx-table--clickable .vtx-table-row {\n  cursor: pointer;\n}\n\n/* Bordered */\n.vtx-table--bordered .vtx-table-cell,\n.vtx-table--bordered .vtx-table-header-cell {\n  border-right: 1px solid var(--vtx-color-neutral-200);\n}\n\n.vtx-table--bordered .vtx-table-cell:last-child,\n.vtx-table--bordered .vtx-table-header-cell:last-child {\n  border-right: none;\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\n/* Loading state */\n.vtx-table-loading {\n  padding: var(--vtx-spacing-12) var(--vtx-spacing-4);\n  text-align: center;\n  color: var(--vtx-color-neutral-600);\n}\n\n.vtx-table-loading-spinner {\n  display: inline-block;\n  animation: vtx-spin 1s linear infinite;\n}\n\n@keyframes vtx-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Pagination */\n.vtx-table-pagination {\n  display: flex;\n  align-items: center;\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\n  border-top: 1px solid var(--vtx-color-neutral-200);\n  background-color: white;\n}\n\n.vtx-table-pagination-select {\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\n  border: 1px solid var(--vtx-color-neutral-300);\n  border-radius: var(--vtx-radius-md);\n  font-size: var(--vtx-font-size-sm);\n  color: var(--vtx-color-neutral-900);\n  background-color: white;\n  cursor: pointer;\n  transition: border-color var(--vtx-transition-fast);\n}\n\n.vtx-table-pagination-select:hover {\n  border-color: var(--vtx-color-neutral-400);\n}\n\n.vtx-table-pagination-select:focus {\n  outline: none;\n  border-color: var(--vtx-color-primary-500);\n  box-shadow: 0 0 0 3px var(--vtx-color-primary-100);\n}\n\n.vtx-table-pagination-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  border-radius: var(--vtx-radius-md);\n  color: var(--vtx-color-neutral-600);\n  cursor: pointer;\n  transition: all var(--vtx-transition-fast);\n}\n\n.vtx-table-pagination-button:hover:not(:disabled) {\n  background-color: var(--vtx-color-neutral-100);\n  color: var(--vtx-color-neutral-900);\n}\n\n.vtx-table-pagination-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n/* Sticky columns */\n.vtx-table-cell--sticky-left,\n.vtx-table-header-cell--sticky-left {\n  position: sticky;\n  left: 0;\n  z-index: 2;\n  background-color: white;\n  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);\n}\n\n.vtx-table-cell--sticky-right,\n.vtx-table-header-cell--sticky-right {\n  position: sticky;\n  right: 0;\n  z-index: 2;\n  background-color: white;\n  box-shadow: -2px 0 4px rgba(0, 0, 0, 0.05);\n}\n\n.vtx-table-header-cell--sticky-left,\n.vtx-table-header-cell--sticky-right {\n  z-index: 11;\n  background-color: var(--vtx-color-neutral-50);\n}\n"),zn.displayName="Table";const Nn=y(zn);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 _n=({steps:n,currentStep:e,orientation:t="horizontal",variant:a="default",showCheckmarks:o=!0,color:i="success",size:l="md",className:d="",style:s})=>{const c=n.map(r=>"string"==typeof r?{label:r}:r),x=(n,e,t)=>n.icon?r.jsx("span",{className:"timeline-step-custom-icon",children:n.icon}):"completed"===t&&o?r.jsx("svg",{className:"timeline-step-checkmark",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r.jsx("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})}):"numbered"===a?r.jsx("span",{className:"timeline-step-number",children:e+1}):r.jsx("span",{className:"timeline-step-dot"});return r.jsx("div",{className:`timeline timeline--${t} timeline--${a} timeline--${i} timeline--${l} ${d}`,style:s,children:c.map((n,t)=>{const a=(r=>r<e?"completed":r===e?"active":"pending")(t),o=t===c.length-1,i=!!n.onClick,l=(r=>r<e)(t);return r.jsxs("div",{className:`timeline-step timeline-step--${a} ${i?"timeline-step--clickable":""}`,onClick:()=>(r=>{r.onClick&&r.onClick()})(n),children:[r.jsx("div",{className:"timeline-step-indicator",children:r.jsx("div",{className:"timeline-step-icon-wrapper",children:x(n,t,a)})}),!o&&r.jsx("div",{className:"timeline-connector "+(l?"timeline-connector--filled":"")}),r.jsxs("div",{className:"timeline-step-content",children:[r.jsx(Fr,{variant:"body2",weight:"active"===a?"semibold":"medium",noMargin:!0,className:"timeline-step-label",children:n.label}),n.description&&r.jsx(Fr,{variant:"caption",noMargin:!0,className:"timeline-step-description",children:n.description})]})]},t)})})};_n.displayName="Timeline";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 Cn=i.default.forwardRef(({container:n=!1,item:e=!1,spacing:t,rowSpacing:a,columnSpacing:o,xs:i,sm:l,md:d,lg:s,xl:c,justifyContent:x,alignItems:v,alignContent:m,direction:p="row",wrap:h="wrap",className:u="",children:g,style:f,...b},w)=>{const y=["vtx-grid",n&&"vtx-grid-container",e&&"vtx-grid-item",n&&void 0!==t&&`vtx-grid-spacing-${t}`,n&&void 0!==a&&`vtx-grid-row-spacing-${a}`,n&&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!==d&&"vtx-grid-md"+(!0===d?"":"auto"===d?"-auto":`-${d}`),void 0!==s&&"vtx-grid-lg"+(!0===s?"":"auto"===s?"-auto":`-${s}`),void 0!==c&&"vtx-grid-xl"+(!0===c?"":"auto"===c?"-auto":`-${c}`),n&&"row"!==p&&`vtx-grid-direction-${p}`,n&&"wrap"!==h&&`vtx-grid-wrap-${h}`,u].filter(Boolean).join(" "),k={...f};return n&&(x&&(k.justifyContent=x),v&&(k.alignItems=v),m&&(k.alignContent=m)),r.jsx("div",{ref:w,className:y,style:Object.keys(k).length>0?k:void 0,...b,children:g})});Cn.displayName="Grid";const Sn=y(Cn);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 Mn=i.default.forwardRef(({icon:n,iconVariant:e="primary",text:t,subText:a,className:o="",style:i,...l},d)=>r.jsx(sn,{variant:"outlined",className:o,style:i,ref:d,...l,children:r.jsxs(Sn,{container:!0,spacing:2,alignItems:"center",wrap:"nowrap",justifyContent:"center",children:[r.jsx(Sn,{item:!0,xs:"auto",children:r.jsx(Ar,{align:"center",justify:"center",children:r.jsx("span",{className:`infocard-icon infocard-icon--${e}`,children:n})})}),r.jsxs(Sn,{item:!0,xs:!0,children:[r.jsx(Fr,{variant:"caption",children:t}),a&&r.jsx(Fr,{variant:"subtitle2",children:a})]})]})}));Mn.displayName="InfoCardBase";const Tn=i.default.forwardRef(({value:n,label:e,className:t="",style:a,...o},i)=>r.jsx(sn,{variant:"outlined",className:t,style:a,ref:i,...o,children:r.jsxs(Ar,{direction:"column",align:"center",justify:"center",style:{minHeight:80},children:[r.jsx(Fr,{variant:"h4",children:n}),e&&r.jsx(Fr,{variant:"caption",children:e})]})}));Tn.displayName="InfoCardMetric";const $n={Base:y(Mn),Metric:y(Tn)};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 In=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...d},s)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-base ${i}`,style:l,ref:s,...d,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Fr,{variant:"body1",weight:"medium",noMargin:!0,children:a}),o&&r.jsx(Fr,{variant:"caption",color:"text-secondary",noMargin:!0,children:o})]})]}));In.displayName="InfoTextBase";const An=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,value:a,label:o,subText:i,className:l="",style:d,...s},c)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-stat ${l}`,style:d,ref:c,...s,children:[n&&r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Fr,{variant:"h5",weight:"bold",noMargin:!0,children:a}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:o}),i&&r.jsx(Fr,{variant:"caption",color:"text-secondary",noMargin:!0,children:i})]})]}));An.displayName="InfoTextStat";const Dn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,title:a,description:o,badge:i,className:l="",style:d,...s},c)=>r.jsxs(Ar,{direction:"row",align:"start",gap:8,className:`infotext-feature ${l}`,style:d,ref:c,...s,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:6,style:{flex:1},children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:a}),i&&r.jsx("span",{className:"infotext-badge",children:i})]}),r.jsx(Fr,{variant:"body2",color:"text-secondary",noMargin:!0,children:o})]})]}));Dn.displayName="InfoTextFeature";const Fn=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,text:a,className:o="",style:i,...l},d)=>r.jsxs(Ar,{direction:"row",align:"center",gap:8,className:`infotext-compact ${o}`,style:i,ref:d,...l,children:[t?r.jsx("span",{className:`infotext-icon-small infotext-icon-small--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-small-plain",children:n}),r.jsx(Fr,{variant:"body2",noMargin:!0,children:a})]}));Fn.displayName="InfoTextCompact";const En=i.default.forwardRef(({icon:n,iconVariant:e="primary",iconCircle:t=!0,heading:a,subText:o,className:i="",style:l,...d},s)=>r.jsxs(Ar,{direction:"column",align:"center",gap:10,className:`infotext-vertical ${i}`,style:l,ref:s,...d,children:[r.jsx(Ar,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:t?r.jsx("span",{className:`infotext-icon infotext-icon--${e}`,children:n}):r.jsx("span",{className:"infotext-icon-plain",children:n})}),r.jsxs(Ar,{direction:"column",gap:4,align:"center",children:[r.jsx(Fr,{variant:"body1",weight:"medium",align:"center",noMargin:!0,children:a}),o&&r.jsx(Fr,{variant:"caption",color:"text-secondary",align:"center",noMargin:!0,children:o})]})]}));En.displayName="InfoTextVertical";const Rn={Base:y(In),Stat:y(An),Feature:y(Dn),Compact:y(Fn),Vertical:y(En)};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 Ln=i.default.forwardRef(({id:e,image:t,imageAlt:a="Product",category:o,name:i,weight:l,units:d,price:s,originalPrice:c,discount:x,rating:v,initialQuantity:m=0,featured:p=!1,featuredText:h="Featured",showWishlist:u=!1,isWishlisted:g=!1,cartIcon:f,wishlistIcon:b,wishlistFilledIcon:w,quickViewIcon:y,onAddToCart:k,onIncrementCart:j,onDecrementCart:N,onWishlist:_,onQuickView:C,onClick:S,loading:M=!1,className:T="",style:$,...I},A)=>{const[D,F]=n.useState(m),[E,R]=n.useState(!1),L=E||M;return r.jsx(sn,{variant:"outlined",className:`productcard ${T}`,style:{padding:0,...$},ref:A,...I,children:r.jsxs(Ar,{direction:"column",children:[r.jsxs("div",{className:"productcard-image-wrapper",onClick:S,style:{cursor:S?"pointer":"default"},children:[r.jsx("img",{src:t,alt:a,className:"productcard-image"}),r.jsxs("div",{className:"productcard-badges",children:[p&&r.jsx("span",{className:"productcard-featured-badge",children:h}),x&&r.jsx("span",{className:"productcard-discount-badge",children:x})]}),u&&_&&r.jsx("button",{className:"productcard-wishlist-btn "+(g?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),_()},"aria-label":g?"Remove from wishlist":"Add to wishlist",children:g?w||b||"♥":b||"♡"}),C&&r.jsx("div",{className:"productcard-hover-overlay",children:r.jsx(z,{variant:"secondary",size:"sm",leftIcon:y||"👁",onClick:r=>{r.stopPropagation(),C()},children:"Quick View"})})]}),r.jsxs(Ar,{direction:"column",gap:5,style:{padding:"12px"},children:[o&&r.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r.jsx(fr,{label:o,variant:"outlined",className:"productcard-category"})}),r.jsx(Fr,{variant:"body1",noMargin:!0,onClick:S,style:{cursor:S?"pointer":"default"},children:i}),(void 0!==l||d)&&r.jsx(Fr,{variant:"body1",noMargin:!0,className:"productcard-weight",children:void 0!==l&&d?`${l} ${d}`:void 0!==l?l:"-"}),void 0!==v&&r.jsxs(Ar,{align:"center",gap:5,className:"productcard-rating-wrapper",children:[r.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(v)),"☆".repeat(5-Math.floor(v))]}),r.jsx(Fr,{variant:"caption",noMargin:!0,children:v})]}),r.jsxs(Ar,{align:"center",gap:8,children:[r.jsxs(Fr,{variant:"h5",noMargin:!0,className:"productcard-price",children:["$",Number(s).toFixed(2)]}),c&&c>s&&r.jsxs(Fr,{variant:"body2",noMargin:!0,className:"productcard-original-price",children:["$",Number(c).toFixed(2)]})]}),L?r.jsx(z,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===D?r.jsx(z,{fullWidth:!0,variant:"primary",leftIcon:f,onClick:async()=>{if(k){R(!0);try{await k(e,1),F(1)}catch(r){console.error("Add to cart error:",r)}finally{R(!1)}}},children:"Add to cart"}):r.jsxs(Ar,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r.jsx(z,{variant:"secondary",onClick:async()=>{if(N&&!(D<=0)){R(!0);try{await N(e,D),F(D-1)}catch(r){console.error("Decrement error:",r)}finally{R(!1)}}},children:"-"}),r.jsx(Fr,{noMargin:!0,className:"productcard-quantity-value",children:D}),r.jsx(z,{variant:"secondary",onClick:async()=>{if(j){R(!0);try{await j(e,D),F(D+1)}catch(r){console.error("Increment error:",r)}finally{R(!1)}}},children:"+"})]})]})]})})});Ln.displayName="ProductCardBase";const Bn=i.default.forwardRef(({imagePosition:e="left",...t},a)=>{const{id:o,image:i,imageAlt:l="Product",category:d,name:s,weight:c,units:x,price:v,originalPrice:m,discount:p,rating:h,initialQuantity:u=0,featured:g=!1,featuredText:f="Featured",showWishlist:b=!1,isWishlisted:w=!1,cartIcon:y,wishlistIcon:k,wishlistFilledIcon:j,quickViewIcon:N,onAddToCart:_,onIncrementCart:C,onDecrementCart:S,onWishlist:M,onQuickView:T,onClick:$,loading:I=!1,className:A="",style:D}=t,[F,E]=n.useState(u),[R,L]=n.useState(!1),B=R||I;return r.jsx(sn,{variant:"outlined",className:`productcard-wide ${A}`,style:{padding:0,...D},ref:a,children:r.jsxs(Ar,{direction:"left"===e?"row":"row-reverse",children:[r.jsxs("div",{className:"productcard-wide-image-wrapper",onClick:$,style:{cursor:$?"pointer":"default"},children:[r.jsx("img",{src:i,alt:l,className:"productcard-wide-image"}),r.jsxs("div",{className:"productcard-badges",children:[g&&r.jsx("span",{className:"productcard-featured-badge",children:f}),p&&r.jsx("span",{className:"productcard-discount-badge",children:p})]}),b&&M&&r.jsx("button",{className:"productcard-wishlist-btn "+(w?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),M()},children:w?j||k||"♥":k||"♡"})]}),r.jsxs(Ar,{direction:"column",gap:12,style:{padding:"16px 20px",flex:1,minWidth:0},children:[d&&r.jsx("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r.jsx(fr,{label:d,variant:"outlined",className:"productcard-category"})}),r.jsxs(Ar,{direction:"column",gap:6,children:[r.jsx(Fr,{variant:"h5",weight:"bold",noMargin:!0,onClick:$,style:{cursor:$?"pointer":"default",wordBreak:"break-word"},children:s}),(void 0!==c||x)&&r.jsx(Fr,{variant:"body2",noMargin:!0,className:"productcard-weight",children:void 0!==c&&x?`${c} ${x}`:void 0!==c?c:"-"})]}),void 0!==h&&r.jsxs(Ar,{align:"center",gap:6,children:[r.jsxs("div",{className:"productcard-rating",children:["★".repeat(Math.floor(h)),"☆".repeat(5-Math.floor(h))]}),r.jsx(Fr,{variant:"caption",noMargin:!0,children:h})]}),r.jsxs(Ar,{align:"center",gap:8,wrap:"wrap",style:{marginTop:"auto"},children:[r.jsxs(Fr,{variant:"h4",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(v).toFixed(2)]}),m&&m>v&&r.jsxs(Fr,{variant:"body1",noMargin:!0,className:"productcard-original-price",children:["$",Number(m).toFixed(2)]})]}),r.jsxs(Ar,{gap:12,align:"center",direction:"row",wrap:"wrap",children:[r.jsx("div",{style:{flex:"1 1 auto",minWidth:"140px"},children:B?r.jsx(z,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===F?r.jsx(z,{fullWidth:!0,variant:"primary",leftIcon:y,onClick:async()=>{if(_){L(!0);try{await _(o,1),E(1)}catch(r){console.error("Add to cart error:",r)}finally{L(!1)}}},children:"Add to cart"}):r.jsxs(Ar,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r.jsx(z,{variant:"secondary",onClick:async()=>{if(S&&!(F<=0)){L(!0);try{await S(o,F),E(F-1)}catch(r){console.error("Decrement error:",r)}finally{L(!1)}}},children:"-"}),r.jsx(Fr,{noMargin:!0,className:"productcard-quantity-value",children:F}),r.jsx(z,{variant:"primary",onClick:async()=>{if(C){L(!0);try{await C(o,F),E(F+1)}catch(r){console.error("Increment error:",r)}finally{L(!1)}}},children:"+"})]})}),T&&r.jsx(z,{variant:"outline",size:"md",leftIcon:N||"👁",onClick:T,children:"View"})]})]})]})})});Bn.displayName="ProductCardWide";const On=i.default.forwardRef((e,t)=>{const{id:a,image:o,imageAlt:i="Product",name:l,price:d,originalPrice:s,discount:c,rating:x,initialQuantity:v=0,showWishlist:m=!1,isWishlisted:p=!1,cartIcon:h,wishlistIcon:u,wishlistFilledIcon:g,onAddToCart:f,onIncrementCart:b,onDecrementCart:w,onWishlist:y,onClick:k,loading:j=!1,className:N="",style:_}=e,[C,S]=n.useState(v),[M,T]=n.useState(!1),$=M||j;return r.jsxs("div",{className:`productcard-minimal ${N}`,style:_,ref:t,children:[r.jsxs("div",{className:"productcard-minimal-image-wrapper",onClick:k,style:{cursor:k?"pointer":"default"},children:[r.jsx("img",{src:o,alt:i,className:"productcard-minimal-image"}),c&&r.jsx("span",{className:"productcard-minimal-discount",children:c}),m&&y&&r.jsx("button",{className:"productcard-minimal-wishlist "+(p?"productcard-minimal-wishlist--active":""),onClick:r=>{r.stopPropagation(),y()},children:p?g||u||"♥":u||"♡"})]}),r.jsxs(Ar,{direction:"column",gap:8,style:{padding:"12px 0"},children:[r.jsx(Fr,{variant:"body1",weight:"medium",noMargin:!0,onClick:k,style:{cursor:k?"pointer":"default"},children:l}),r.jsxs(Ar,{align:"center",gap:8,children:[r.jsxs(Fr,{variant:"h6",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(d).toFixed(2)]}),s&&s>d&&r.jsxs(Fr,{variant:"caption",noMargin:!0,className:"productcard-original-price",children:["$",Number(s).toFixed(2)]})]}),void 0!==x&&r.jsxs("div",{className:"productcard-rating-minimal",children:["★".repeat(Math.floor(x)),"☆".repeat(5-Math.floor(x))]}),$?r.jsx(z,{loading:!0,variant:"primary",size:"sm",children:"Loading"}):0===C?r.jsx(z,{variant:"primary",size:"sm",leftIcon:h,onClick:async()=>{if(f){T(!0);try{await f(a,1),S(1)}catch(r){console.error("Add to cart error:",r)}finally{T(!1)}}},fullWidth:!0,children:"Add"}):r.jsxs(Ar,{align:"center",justify:"between",className:"productcard-quantity-selector-minimal",children:[r.jsx(z,{variant:"secondary",size:"sm",onClick:async()=>{if(w&&!(C<=0)){T(!0);try{await w(a,C),S(C-1)}catch(r){console.error("Decrement error:",r)}finally{T(!1)}}},children:"-"}),r.jsx(Fr,{variant:"body2",noMargin:!0,weight:"medium",children:C}),r.jsx(z,{variant:"primary",size:"sm",onClick:async()=>{if(b){T(!0);try{await b(a,C),S(C+1)}catch(r){console.error("Increment error:",r)}finally{T(!1)}}},children:"+"})]})]})]})});On.displayName="ProductCardMinimal";const Wn={Base:y(Ln),Wide:y(Bn),Minimal:y(On)};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 Pn=i.default.forwardRef(({orderId:n,orderNumber:e,status:t="pending",statusText:a,items:o,deliveryDate:i,deliveryLabel:l="Delivered on",totalAmount:d,currency:s="₹",onTrackOrder:c,onViewDetails:x,trackButtonText:v="Track Order",className:m="",style:p,...h},u)=>{const g=o[0],f=o.length-1;return r.jsx(sn,{variant:"outlined",className:`ordercard ${m}`,style:p,onClick:x?()=>x(n):void 0,ref:u,...h,children:r.jsxs(Ar,{direction:"column",gap:0,children:[r.jsxs(Ar,{align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-header",children:[r.jsx(Fr,{variant:"body1",weight:"semibold",noMargin:!0,children:e||`Order #${n}`}),r.jsx(nn,{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)})]}),r.jsxs(Ar,{direction:"row",gap:10,className:"ordercard-content",children:[g.image&&r.jsx("div",{className:"ordercard-image-wrapper",children:r.jsx("img",{src:g.image,alt:g.name,className:"ordercard-image"})}),r.jsxs(Ar,{direction:"column",gap:2,style:{flex:1,minWidth:0},children:[r.jsxs(Fr,{variant:"body2",weight:"medium",noMargin:!0,className:"ordercard-product-name",children:[g.name,g.quantity&&g.quantity>1&&` × ${g.quantity}`]}),f>0&&r.jsxs(Fr,{variant:"caption",noMargin:!0,className:"ordercard-more-items",children:["+ ",f," more ",1===f?"item":"items"]})]})]}),r.jsxs(Ar,{direction:"row",align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-footer",children:[r.jsxs(Ar,{direction:"column",gap:2,style:{flex:"1 1 auto",minWidth:"140px"},children:[i&&r.jsxs(Fr,{variant:"caption",noMargin:!0,className:"ordercard-delivery",children:[l,": ",i]}),r.jsxs(Fr,{variant:"body1",weight:"bold",noMargin:!0,className:"ordercard-price",children:[s,d.toLocaleString()]})]}),c&&r.jsx(z,{variant:"primary",size:"sm",onClick:r=>{null==r||r.stopPropagation(),c(n)},className:"ordercard-track-btn",children:v})]})]})})});Pn.displayName="OrderCard";const Vn=y(Pn);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 Hn=i.default.forwardRef(({heading:n,items:e,showDividers:t=!1,compact:a=!1,variant:o="outlined",className:l="",style:d,...s},c)=>{const x=e.filter(r=>!r.hidden);return r.jsxs(sn,{variant:"flat"===o?"filled":o,className:`info-list-card ${a?"info-list-card--compact":""} ${l}`,style:d,ref:c,...s,children:[n&&r.jsxs(r.Fragment,{children:[r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,className:"info-list-card-heading",children:n}),r.jsx(un,{style:{margin:"12px 0 16px 0"}})]}),r.jsx("div",{className:"info-list-card-items",children:x.map((n,e)=>r.jsxs(i.default.Fragment,{children:[r.jsxs("div",{className:"info-list-card-item",children:[r.jsx("div",{className:`info-list-card-label ${n.labelClass||""}`,children:"string"==typeof n.label?r.jsx(Fr,{variant:"body2",noMargin:!0,children:n.label}):n.label}),r.jsx("div",{className:`info-list-card-value ${n.valueClass||""}`,children:"string"==typeof n.value||"number"==typeof n.value?r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:n.value}):n.value})]}),t&&e<x.length-1&&r.jsx(un,{style:{margin:a?"8px 0":"12px 0"}})]},e))})]})});Hn.displayName="InfoListCard";const Yn=y(Hn);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 qn=i.default.forwardRef(({orderId:n,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:d,customerPhone:s,shippingAddress:c,billingAddress:x,items:v,subtotal:m,shippingCost:p=0,tax:h=0,discount:u=0,total:g,currency:f="₹",paymentMethod:b,transactionId:w,estimatedDelivery:y,trackingNumber:k,onDownloadInvoice:j,onContinueShopping:N,onTrackOrder:_,onViewDetails:C,onContactSupport:S,onShareOrder:M,downloadInvoiceText:T="Download Invoice",continueShoppingText:$="Continue Shopping",trackOrderText:I="Track Order",viewDetailsText:A="View Details",contactSupportText:D="Contact Support",shareOrderText:F="Share",showActions:E=!0,hideDownloadInvoice:R=!1,hideContinueShopping:L=!1,hideTrackOrder:B=!1,hideContactSupport:W=!1,className:P="",style:V,...H},rr)=>{const nr=n=>r.jsxs("div",{className:"orderconfirmation-address",children:[r.jsx("div",{className:"orderconfirmation-address-name",children:n.name}),r.jsx("div",{children:n.addressLine1}),n.addressLine2&&r.jsx("div",{children:n.addressLine2}),r.jsxs("div",{children:[n.city,", ",n.state," ",n.zipCode]}),n.phone&&r.jsxs("div",{children:["Phone: ",n.phone]})]}),er=[{label:"Order Number",value:e||`#${n}`,valueClass:"value-bold"},t?{label:"Order Date",value:t}:{label:"",value:"",hidden:!0},{label:"Status",value:r.jsx(nn,{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(r=>!r.hidden),tr=[d?{label:"Email",value:d}:{label:"",value:"",hidden:!0},s?{label:"Phone",value:s}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),ar=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Transaction ID",value:w,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r.jsx("div",{className:`orderconfirmation ${P}`,style:V,ref:rr,...H,children:r.jsxs(Ar,{direction:"column",gap:20,children:[r.jsx(sn,{variant:"filled",className:"orderconfirmation-header",children:r.jsxs(Ar,{direction:"column",align:"center",gap:12,children:[r.jsx("span",{className:"orderconfirmation-success-icon",children:r.jsx(O,{size:32})}),r.jsx(Fr,{variant:"h4",weight:"bold",align:"center",noMargin:!0,children:i}),r.jsx(Fr,{variant:"body1",align:"center",noMargin:!0,className:"orderconfirmation-subtitle",children:l}),r.jsxs(nn,{variant:"success",style:{padding:"8px 20px",borderRadius:"20px",fontWeight:600,marginTop:"8px"},children:["Order ",e||`#${n}`]})]})}),r.jsx(Yn,{heading:"Order Details",items:er,variant:"outlined",showDividers:!0}),tr.length>0&&r.jsx(Yn,{heading:"Customer Information",items:tr,variant:"outlined",showDividers:!0}),r.jsxs(sn,{variant:"outlined",className:"orderconfirmation-items-card",children:[r.jsxs(Fr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Order Items (",v.length,")"]}),r.jsx(Ar,{direction:"column",gap:12,children:v.map((n,e)=>r.jsxs("div",{children:[r.jsxs(Ar,{direction:"row",gap:12,className:"orderconfirmation-item",children:[n.image&&r.jsx("div",{className:"orderconfirmation-item-image-wrapper",children:r.jsx("img",{src:n.image,alt:n.name,className:"orderconfirmation-item-image"})}),r.jsxs(Ar,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,className:"orderconfirmation-item-name",children:n.name}),n.variant&&r.jsx(Fr,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-variant",children:n.variant}),r.jsxs(Fr,{variant:"caption",noMargin:!0,children:["Qty: ",n.quantity]})]}),r.jsxs(Ar,{direction:"column",align:"end",gap:2,children:[r.jsxs(Fr,{variant:"body2",weight:"semibold",noMargin:!0,children:[f,(n.price*n.quantity).toLocaleString()]}),r.jsxs(Fr,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-unit-price",children:[f,n.price.toLocaleString()," each"]})]})]}),e<v.length-1&&r.jsx(un,{style:{margin:"12px 0"}})]},n.id))})]}),r.jsxs(sn,{variant:"outlined",className:"orderconfirmation-summary-card",children:[r.jsx(Fr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Payment Summary"}),r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Subtotal"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[f,m.toLocaleString()]})]}),p>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Shipping"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[f,p.toLocaleString()]})]}),h>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Tax"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[f,h.toLocaleString()]})]}),u>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:"Discount"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:["-",f,u.toLocaleString()]})]}),r.jsx(un,{style:{margin:"8px 0"}}),r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),r.jsxs(Fr,{variant:"body1",weight:"bold",noMargin:!0,className:"orderconfirmation-total",children:[f,g.toLocaleString()]})]})]}),ar.length>0&&r.jsxs(r.Fragment,{children:[r.jsx(un,{style:{margin:"12px 0"}}),r.jsx(Ar,{direction:"column",gap:8,children:ar.map((n,e)=>r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:n.label}),r.jsx(Fr,{variant:"body2",noMargin:!0,className:n.valueClass,children:n.value})]},e))})]})]}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(sn,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Z,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r.jsx(un,{}),nr(c)]})}),x&&r.jsx(sn,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(K,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r.jsx(un,{}),nr(x)]})})]}),E&&r.jsx(sn,{variant:"outlined",className:"orderconfirmation-actions-card",children:r.jsxs(Ar,{direction:"column",gap:16,children:[r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"What's Next?"}),r.jsx(un,{}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[!R&&j&&r.jsx(z,{variant:"primary",size:"md",onClick:()=>j(n),leftIcon:r.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:T}),!B&&_&&k&&r.jsx(z,{variant:"primary",size:"md",onClick:()=>_(n),leftIcon:r.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:I})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[!L&&N&&r.jsx(z,{variant:"outline",size:"md",onClick:N,leftIcon:r.jsx(U,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:$}),C&&r.jsx(z,{variant:"outline",size:"md",onClick:()=>C(n),leftIcon:r.jsx(X,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:A})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",justify:"center",children:[!W&&S&&r.jsx(z,{variant:"ghost",size:"md",onClick:()=>S(n),leftIcon:r.jsx(Q,{size:18}),children:D}),M&&r.jsx(z,{variant:"ghost",size:"md",onClick:()=>M(n),leftIcon:r.jsx(G,{size:18}),children:F})]})]})}),r.jsx(sn,{variant:"filled",className:"orderconfirmation-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:r.jsxs(Ar,{direction:"column",gap:12,align:"center",children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Q,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r.jsx(Fr,{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"}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(Q,{size:16}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(J,{size:16}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});qn.displayName="OrderConfirmation";const Un=y(qn);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 Gn=i.default.forwardRef(({orderId:n,orderNumber:e,orderDate:t,status:a,statusText:o,customerName:i,customerEmail:l,customerPhone:d,shippingAddress:s,billingAddress:c,items:x,subtotal:v,shippingCost:m=0,tax:p=0,discount:h=0,total:u,currency:g="₹",couponCode:f,paymentMethod:b,paymentStatus:w,transactionId:y,estimatedDelivery:k,deliveredDate:j,trackingNumber:N,trackingUrl:_,carrier:C,onDownloadInvoice:S,onTrackOrder:M,onCancelOrder:T,onReturnOrder:$,onReorder:I,onContactSupport:A,onWriteReview:D,downloadInvoiceText:F="Download Invoice",trackOrderText:E="Track Package",cancelOrderText:R="Cancel Order",returnOrderText:L="Return Items",reorderText:B="Reorder",contactSupportText:O="Contact Support",writeReviewText:W="Write Review",showActions:P=!0,allowCancel:V=!0,allowReturn:H=!0,allowReorder:U=!0,className:G="",style:X,...or},ir)=>{const lr=()=>{switch(w){case"paid":return"success";case"failed":return"error";case"pending":return"warning";case"refunded":return"info";default:return"neutral"}},dr=n=>r.jsxs("div",{className:"orderdetails-address",children:[r.jsx("div",{className:"orderdetails-address-name",children:n.name}),r.jsx("div",{children:n.addressLine1}),n.addressLine2&&r.jsx("div",{children:n.addressLine2}),r.jsxs("div",{children:[n.city,", ",n.state," ",n.zipCode]}),n.phone&&r.jsxs("div",{children:["Phone: ",n.phone]})]}),sr=V&&("pending"===a||"processing"===a),cr=H&&"delivered"===a,xr=N&&("shipped"===a||"delivered"===a),vr=[i?{label:"Name",value:i}:{label:"",value:"",hidden:!0},l?{label:"Email",value:l}:{label:"",value:"",hidden:!0},d?{label:"Phone",value:d}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),mr=[b?{label:"Payment Method",value:b}:{label:"",value:"",hidden:!0},w?{label:"Payment Status",value:r.jsx(nn,{variant:lr(),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(r=>!r.hidden);return r.jsx("div",{className:`orderdetails ${G}`,style:X,ref:ir,...or,children:r.jsxs(Ar,{direction:"column",gap:24,children:[r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Fr,{variant:"h3",weight:"bold",noMargin:!0,children:"Order Details"}),r.jsxs(Fr,{variant:"body1",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:["Placed on ",t]})]}),r.jsx(sn,{variant:"outlined",style:{padding:"32px 24px"},children:r.jsx(_n,{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"})}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(sn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Order Number"}),r.jsx(Fr,{variant:"h6",weight:"bold",noMargin:!0,children:e||`#${n}`})]})}),r.jsx(sn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Status"}),r.jsx(nn,{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)&&r.jsx(sn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:j?"Delivered On":"Estimated Delivery"}),r.jsx(Fr,{variant:"h6",weight:"bold",noMargin:!0,style:{color:j?"var(--vtx-color-success-600)":"inherit"},children:j||k})]})}),w&&r.jsx(sn,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Payment"}),r.jsx(nn,{variant:lr(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:w.charAt(0).toUpperCase()+w.slice(1)})]})})]}),P&&(S||xr&&M)&&r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[S&&r.jsx(z,{variant:"outline",size:"md",onClick:()=>S(n),leftIcon:r.jsx(Y,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:F}),xr&&M&&r.jsx(z,{variant:"primary",size:"md",onClick:()=>M(n),leftIcon:r.jsx(q,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:E})]}),(N||C)&&r.jsx(sn,{variant:"outlined",children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(rr,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Information"})]}),r.jsx(un,{}),r.jsxs(Ar,{direction:"column",gap:12,children:[N&&r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Tracking Number"}),_?r.jsx("a",{href:_,target:"_blank",rel:"noopener noreferrer",style:{color:"var(--vtx-color-primary-600)",fontWeight:600,textDecoration:"none"},children:N}):r.jsx(Fr,{variant:"body2",weight:"semibold",noMargin:!0,children:N})]}),C&&r.jsxs(Ar,{direction:"column",gap:4,children:[r.jsx(Fr,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Carrier"}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:C})]})]})]})}),r.jsxs(sn,{variant:"outlined",className:"orderdetails-items-card",children:[r.jsxs(Fr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Items (",x.length,")"]}),r.jsx(Ar,{direction:"column",gap:12,children:x.map((n,e)=>r.jsxs("div",{children:[r.jsxs(Ar,{direction:"row",gap:12,className:"orderdetails-item",children:[n.image&&r.jsx("div",{className:"orderdetails-item-image-wrapper",children:r.jsx("img",{src:n.image,alt:n.name,className:"orderdetails-item-image"})}),r.jsxs(Ar,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,className:"orderdetails-item-name",children:n.name}),n.variant&&r.jsx(Fr,{variant:"caption",noMargin:!0,className:"orderdetails-item-variant",children:n.variant}),r.jsxs(Fr,{variant:"caption",noMargin:!0,children:["Qty: ",n.quantity]})]}),r.jsxs(Ar,{direction:"column",align:"end",gap:2,children:[r.jsxs(Fr,{variant:"body2",weight:"semibold",noMargin:!0,children:[g,(n.price*n.quantity).toLocaleString()]}),r.jsxs(Fr,{variant:"caption",noMargin:!0,className:"orderdetails-item-unit-price",children:[g,n.price.toLocaleString()," each"]})]})]}),e<x.length-1&&r.jsx(un,{style:{margin:"12px 0"}})]},n.id))})]}),r.jsxs(sn,{variant:"outlined",className:"orderdetails-summary-card",children:[r.jsx(Fr,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Order Summary"}),r.jsxs(Ar,{direction:"column",gap:8,children:[r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Subtotal"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[g,v.toLocaleString()]})]}),m>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Shipping"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[g,m.toLocaleString()]})]}),p>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:"Tax"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,children:[g,p.toLocaleString()]})]}),f&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:"Coupon Applied"}),r.jsx(Fr,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:f})]}),h>0&&r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:"Discount"}),r.jsxs(Fr,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:["-",g,h.toLocaleString()]})]}),r.jsx(un,{style:{margin:"8px 0"}}),r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),r.jsxs(Fr,{variant:"body1",weight:"bold",noMargin:!0,className:"orderdetails-total",children:[g,u.toLocaleString()]})]})]}),mr.length>0&&r.jsxs(r.Fragment,{children:[r.jsx(un,{style:{margin:"12px 0"}}),r.jsx(Ar,{direction:"column",gap:8,children:mr.map((n,e)=>r.jsxs(Ar,{justify:"between",align:"center",children:[r.jsx(Fr,{variant:"body2",noMargin:!0,children:n.label}),r.jsx(Fr,{variant:"body2",noMargin:!0,className:n.valueClass,children:n.value})]},e))})]})]}),vr.length>0&&r.jsx(Yn,{heading:"Customer Information",items:vr,variant:"outlined",showDividers:!0}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",children:[r.jsx(sn,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Z,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r.jsx(un,{}),dr(s)]})}),c&&r.jsx(sn,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:r.jsxs(Ar,{direction:"column",gap:12,children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(K,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r.jsx(un,{}),dr(c)]})})]}),P&&r.jsx(sn,{variant:"outlined",className:"orderdetails-actions-card",children:r.jsxs(Ar,{direction:"column",gap:16,children:[r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Order Actions"}),r.jsx(un,{}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:[sr&&T&&r.jsx(z,{variant:"outline",size:"md",onClick:()=>T(n),leftIcon:r.jsx(nr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px",borderColor:"var(--vtx-color-error-500)",color:"var(--vtx-color-error-600)"},children:R}),cr&&$&&r.jsx(z,{variant:"outline",size:"md",onClick:()=>$(n),leftIcon:r.jsx(er,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:L}),U&&I&&r.jsx(z,{variant:"outline",size:"md",onClick:()=>I(n),leftIcon:r.jsx(tr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:B})]}),r.jsxs(Ar,{direction:"row",gap:12,wrap:"wrap",children:["delivered"===a&&D&&r.jsx(z,{variant:"ghost",size:"md",onClick:()=>D(n),leftIcon:r.jsx(ar,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:W}),A&&r.jsx(z,{variant:"ghost",size:"md",onClick:()=>A(n),leftIcon:r.jsx(Q,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:O})]})]})}),r.jsx(sn,{variant:"filled",className:"orderdetails-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:r.jsxs(Ar,{direction:"column",gap:12,align:"center",children:[r.jsxs(Ar,{align:"center",gap:8,children:[r.jsx(Q,{size:20}),r.jsx(Fr,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r.jsx(Fr,{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"}),r.jsxs(Ar,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(Q,{size:16}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),r.jsxs(Ar,{align:"center",gap:6,children:[r.jsx(J,{size:16}),r.jsx(Fr,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Gn.displayName="OrderDetails";const Xn=y(Gn);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 Kn=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:l=!1,sticky:d=!1,fullWidth:s=!1,searchEnabled:c=!1,searchPlaceholder:x="Search...",onSearch:v,onLogoClick:m,layout:p="single-row",twoRowBottomStyle:h="default",topBar:u,scrollBehavior:g,scrollThreshold:f=50,onScrollStateChange:b,className:w="",style:y,...k},j)=>{const[z,N]=n.useState(""),[_,C]=n.useState(null),[S,M]=n.useState(!1),[T,$]=n.useState(!1);i.default.useEffect(()=>{if(!g)return;const r=()=>{const r=window.scrollY>f;$(n=>(n!==r&&(null==b||b(r)),r))};return window.addEventListener("scroll",r,{passive:!0}),()=>window.removeEventListener("scroll",r)},[g,f,b]);const A=["vtx-header","vtx-header--desktop",`vtx-header--${o}`,`vtx-header--layout-${p}`,"two-row"===p&&"default"!==h&&`vtx-header--${h}`,l&&"vtx-header--elevated",d&&"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(" "),D=r=>{r.preventDefault(),v&&v(z)},F=n=>{const e=n.children&&n.children.length>0,t=n.megaMenu&&n.megaMenuColumns&&n.megaMenuColumns.length>0,a=_===n.id;return r.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(n.id),onMouseLeave:()=>(e||t)&&C(null),children:[r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:`vtx-header__nav-link ${n.active?"vtx-header__nav-link--active":""} ${n.disabled?"vtx-header__nav-link--disabled":""}`,"aria-current":n.active?"page":void 0,"aria-disabled":n.disabled,children:[n.icon&&r.jsx("span",{className:"vtx-header__nav-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__nav-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__nav-badge",children:n.badge}),(e||t)&&r.jsx(I,{className:"vtx-header__nav-chevron",size:16})]}),t&&a&&r.jsx("div",{className:"vtx-header__mega-menu",children:r.jsx("div",{className:"vtx-header__mega-menu-container",children:n.megaMenuColumns.map((n,e)=>r.jsxs("div",{className:"vtx-header__mega-menu-column",children:[n.title&&r.jsx(Fr,{variant:"overline",weight:"bold",className:"vtx-header__mega-menu-column-title",children:n.title}),r.jsx("div",{className:"vtx-header__mega-menu-items",children:n.items.map(n=>r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:"vtx-header__mega-menu-item "+(n.active?"vtx-header__mega-menu-item--active":""),children:[n.icon&&r.jsx("span",{className:"vtx-header__mega-menu-icon",children:n.icon}),r.jsxs("div",{className:"vtx-header__mega-menu-item-content",children:[r.jsx(Fr,{variant:"body2",weight:"semibold",className:"vtx-header__mega-menu-item-label",children:n.label}),n.description&&r.jsx(Fr,{variant:"caption",color:"#6b7280",className:"vtx-header__mega-menu-item-description",children:n.description})]}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__mega-menu-badge",children:n.badge})]},n.id))})]},e))})}),e&&!t&&a&&r.jsx("div",{className:"vtx-header__dropdown",children:n.children.map(n=>r.jsxs("a",{href:n.href,onClick:r=>{n.onClick&&(r.preventDefault(),n.onClick())},className:`vtx-header__dropdown-item ${n.active?"vtx-header__dropdown-item--active":""} ${n.disabled?"vtx-header__dropdown-item--disabled":""}`,children:[n.icon&&r.jsx("span",{className:"vtx-header__dropdown-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__dropdown-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__dropdown-badge",children:n.badge})]},n.id))})]},n.id)},E=()=>{if(!u||S)return null;const n=u.variant||"subtle";return r.jsx("div",{className:`vtx-header__topbar vtx-header__topbar--${n}`,children:r.jsxs("div",{className:"vtx-header__topbar-container",children:[u.leftContent&&r.jsx("div",{className:"vtx-header__topbar-left",children:u.leftContent}),u.content&&r.jsx("div",{className:"vtx-header__topbar-content",children:u.content}),u.rightContent&&r.jsx("div",{className:"vtx-header__topbar-right",children:u.rightContent}),u.dismissible&&r.jsx("button",{className:"vtx-header__topbar-dismiss",onClick:()=>{var r;M(!0),null===(r=u.onDismiss)||void 0===r||r.call(u)},"aria-label":"Dismiss",children:r.jsx(nr,{size:14})})]})})};return"single-row"===p?r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:m,style:{cursor:m?"pointer":"default"},children:e}),t.length>0&&r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(F)}),r.jsxs("div",{className:"vtx-header__actions",children:[c&&r.jsxs("form",{onSubmit:D,className:"vtx-header__search",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:z,onChange:r=>N(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]}):"two-row"===p?r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsx("div",{className:"vtx-header__top-row",children:r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:m,style:{cursor:m?"pointer":"default"},children:e}),c&&r.jsxs("form",{onSubmit:D,className:"vtx-header__search vtx-header__search--expanded",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:z,onChange:r=>N(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),t.length>0&&r.jsx("div",{className:"vtx-header__bottom-row",children:r.jsx("div",{className:"vtx-header__container",children:r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(F)})})})]}):r.jsxs("header",{ref:j,className:A,style:y,...k,children:[E(),r.jsxs("div",{className:"vtx-header__container",children:[e&&r.jsx("div",{className:"vtx-header__logo",onClick:m,style:{cursor:m?"pointer":"default"},children:e}),t.length>0&&r.jsx("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(F)}),r.jsxs("div",{className:"vtx-header__actions",children:[c&&r.jsxs("form",{onSubmit:D,className:"vtx-header__search",children:[r.jsx(or,{className:"vtx-header__search-icon",size:18}),r.jsx("input",{type:"search",placeholder:x,value:z,onChange:r=>N(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})]})]})});Kn.displayName="HeaderDesktop";const Qn=i.default.forwardRef(({logo:e,navItems:t=[],actions:a,variant:o="primary",elevated:i=!1,sticky:l=!1,searchEnabled:d=!1,searchPlaceholder:s="Search...",onSearch:c,onLogoClick:x,menuOpen:v,onMenuOpenChange:m,className:p="",style:h,...u},g)=>{const[f,b]=n.useState(!1),[w,y]=n.useState(""),[k,j]=n.useState(new Set),z=void 0!==v,N=z?v:f,_=r=>{z?null==m||m(r):b(r)},C=["vtx-header","vtx-header--mobile",`vtx-header--${o}`,i&&"vtx-header--elevated",l&&"vtx-header--sticky",N&&"vtx-header--menu-open",p].filter(Boolean).join(" "),S=r=>{const n=new Set(k);n.has(r)?n.delete(r):n.add(r),j(n)},M=(n,e=0)=>{const t=n.children&&n.children.length>0,a=k.has(n.id);return r.jsxs("div",{className:`vtx-header__mobile-nav-item vtx-header__mobile-nav-item--level-${e}`,children:[r.jsxs("div",{className:"vtx-header__mobile-nav-link-wrapper",children:[r.jsxs("a",{href:n.href,onClick:r=>{t?(r.preventDefault(),S(n.id)):n.onClick?(r.preventDefault(),n.onClick(),_(!1)):_(!1)},className:`vtx-header__mobile-nav-link ${n.active?"vtx-header__mobile-nav-link--active":""} ${n.disabled?"vtx-header__mobile-nav-link--disabled":""}`,"aria-current":n.active?"page":void 0,"aria-disabled":n.disabled,children:[n.icon&&r.jsx("span",{className:"vtx-header__mobile-nav-icon",children:n.icon}),r.jsx("span",{className:"vtx-header__mobile-nav-label",children:n.label}),n.badge&&r.jsx(nn,{size:"sm",variant:"error",className:"vtx-header__mobile-nav-badge",children:n.badge})]}),t&&r.jsx("button",{className:"vtx-header__mobile-nav-toggle "+(a?"vtx-header__mobile-nav-toggle--expanded":""),onClick:()=>S(n.id),"aria-label":`Toggle ${n.label} submenu`,"aria-expanded":a,children:r.jsx(I,{size:16})})]}),t&&a&&r.jsx("div",{className:"vtx-header__mobile-nav-children",children:n.children.map(r=>M(r,e+1))})]},n.id)};return r.jsxs(r.Fragment,{children:[r.jsx("header",{ref:g,className:C,style:h,...u,children:r.jsxs("div",{className:"vtx-header__container",children:[r.jsx("button",{className:"vtx-header__menu-toggle",onClick:()=>_(!N),"aria-label":"Toggle menu","aria-expanded":N,children:N?r.jsx(nr,{size:24}):r.jsx(E,{size:24})}),e&&r.jsx("div",{className:"vtx-header__logo",onClick:x,style:{cursor:x?"pointer":"default"},children:e}),a&&r.jsx("div",{className:"vtx-header__actions-group",children:a})]})}),N&&r.jsx("div",{className:"vtx-header__overlay",onClick:()=>_(!1),"aria-hidden":"true"}),r.jsx("div",{className:"vtx-header__mobile-menu "+(N?"vtx-header__mobile-menu--open":""),children:r.jsxs("div",{className:"vtx-header__mobile-menu-content",children:[d&&r.jsxs("form",{onSubmit:r=>{r.preventDefault(),c&&c(w)},className:"vtx-header__mobile-search",children:[r.jsx(or,{className:"vtx-header__mobile-search-icon",size:18}),r.jsx("input",{type:"search",placeholder:s,value:w,onChange:r=>y(r.target.value),className:"vtx-header__mobile-search-input","aria-label":"Search"})]}),t.length>0&&r.jsx("nav",{className:"vtx-header__mobile-nav","aria-label":"Mobile navigation",children:t.map(r=>M(r))}),a&&r.jsx("div",{className:"vtx-header__mobile-actions",children:a})]})})]})});Qn.displayName="HeaderMobile";const Zn=({desktopProps:e,mobileProps:t,breakpoint:a=768})=>{const[o,l]=n.useState(!1);return i.default.useEffect(()=>{const r=()=>{l(window.innerWidth<a)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[a]),o?r.jsx(Qn,{...t}):r.jsx(Kn,{...e})};Zn.displayName="HeaderResponsive";const Jn={Desktop:y(Kn),Mobile:y(Qn),Responsive:Zn};exports.Accordion=Sr,exports.AccordionItem=Cr,exports.AdminHeader=ln,exports.Alert=$r,exports.Avatar=Jr,exports.Badge=nn,exports.Button=z,exports.Card=sn,exports.Checkbox=_,exports.CheckboxGroup=S,exports.Chip=fr,exports.DataGrid=pn,exports.Divider=un,exports.Flex=Ar,exports.Grid=Sn,exports.Header=bn,exports.HomeHeader=Jn,exports.InfoCard=$n,exports.InfoListCard=Yn,exports.InfoText=Rn,exports.Input=ur,exports.Menu=Br,exports.MenuItem=Rr,exports.Modal=Wr,exports.MultiSelect=wr,exports.OrderCard=Vn,exports.OrderConfirmation=Un,exports.OrderDetails=Xn,exports.ProductCard=Wn,exports.Radio=kr,exports.RadioGroup=zr,exports.Select=_r,exports.SideMenu=jn,exports.SideMenuItem=yn,exports.Table=Nn,exports.Text=Fr,exports.ThemeProvider=p,exports.Timeline=_n,exports.Toast=Hr,exports.ToastContainer=({children:n,...e})=>r.jsxs(Ur,{children:[n,r.jsx(Kr,{...e})]}),exports.Tooltip=Qr,exports.createCustomTokens=function(r){return r},exports.generateCSSVariables=x,exports.generateColorShades=d,exports.injectCSSVariables=v,exports.normalizeColors=s,exports.toast=Xr,exports.tokens=c,exports.useBodyScrollLock=vr,exports.useClickOutside=(r,e)=>{n.useEffect(()=>{const n=n=>{const t=null==r?void 0:r.current;t&&!t.contains(n.target)&&e(n)};return document.addEventListener("mousedown",n),document.addEventListener("touchstart",n),()=>{document.removeEventListener("mousedown",n),document.removeEventListener("touchstart",n)}},[r,e])},exports.useDebounce=(r,e)=>{const[t,a]=n.useState(r);return n.useEffect(()=>{const n=setTimeout(()=>{a(r)},e);return()=>{clearTimeout(n)}},[r,e]),t},exports.useEscapeKey=xr,exports.useFocusTrap=cr,exports.useId=pr,exports.useThemeContext=h,exports.useToast=qr;
 //# sourceMappingURL=index.cjs.js.map