npm - @vtx-ui/react - Versions diffs - 0.0.1-beta.12 → 0.0.1-beta.14 - Mend

@vtx-ui/react 0.0.1-beta.12 → 0.0.1-beta.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (82) hide show

package/dist/index.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as n,Fragment as e}from"react/jsx-runtime";import*as t from"react";import a,{useId as o,useRef as i,useImperativeHandle as l,useEffect as d,useState as c,Children as s,isValidElement as v,useCallback as x,createContext as m,useContext as p,cloneElement as h,useMemo as g}from"react";import{FiCheck as u,FiX as b,FiChevronDown as f,FiBell as w,FiMenu as y,FiChevronRight as k,FiCheckCircle as N,FiAlertCircle as z,FiAlertTriangle as _,FiInfo as C,FiMinusCircle as S,FiDownload as M,FiPackage as $,FiShoppingBag as T,FiShare2 as j,FiEye as I,FiCreditCard as A,FiMessageCircle as D,FiMapPin as L,FiPhone as B,FiTruck as E,FiCornerUpLeft as R,FiRefreshCw as F,FiStar as O,FiSearch as W,FiPlus as P,FiMinus as V,FiChevronUp as H,FiChevronLeft as Y,FiArrowUp as q,FiArrowDown as U,FiChevronsLeft as G,FiChevronsRight as X}from"react-icons/fi";import{createPortal as K}from"react-dom";function Q(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 c=`#${r.toString(16).padStart(2,"0")}${i.toString(16).padStart(2,"0")}${d.toString(16).padStart(2,"0")}`;o[Number(n)]=c}return o}function Z(r){const n={};for(const[e,t]of Object.entries(r))if("string"==typeof t)n[e]=Q(t);else if("object"==typeof t&&null!==t)if(t[500]){const r=Q(t[500]);n[e]={...r,...t}}else n[e]=t;return n}const J={colors:{primary:Q("#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 rr(r){return r}function nr(r){const n=r||J,e=[];return Object.entries(n.colors).forEach(([r,n])=>{"object"==typeof n?Object.entries(n).forEach(([n,t])=>{e.push(`  --vtx-color-${r}-${n}: ${t};`)}):e.push(`  --vtx-color-${r}: ${n};`)}),Object.entries(n.spacing).forEach(([r,n])=>{e.push(`  --vtx-spacing-${r}: ${n};`)}),Object.entries(n.typography.fontFamily).forEach(([r,n])=>{e.push(`  --vtx-font-family-${r}: ${n};`)}),Object.entries(n.typography.fontSize).forEach(([r,n])=>{e.push(`  --vtx-font-size-${r}: ${n};`)}),Object.entries(n.typography.fontWeight).forEach(([r,n])=>{e.push(`  --vtx-font-weight-${r}: ${n};`)}),Object.entries(n.typography.lineHeight).forEach(([r,n])=>{e.push(`  --vtx-line-height-${r}: ${n};`)}),Object.entries(n.typography.letterSpacing).forEach(([r,n])=>{e.push(`  --vtx-letter-spacing-${r}: ${n};`)}),Object.entries(n.typography.textVariants).forEach(([r,n])=>{Object.entries(n).forEach(([n,t])=>{const a=n.replace(/([A-Z])/g,"-$1").toLowerCase();e.push(`  --vtx-text-${r}-${a}: ${t};`)})}),Object.entries(n.borderRadius).forEach(([r,n])=>{e.push(`  --vtx-radius-${r}: ${n};`)}),Object.entries(n.shadows).forEach(([r,n])=>{e.push(`  --vtx-shadow-${r}: ${n};`)}),Object.entries(n.transitions).forEach(([r,n])=>{e.push(`  --vtx-transition-${r}: ${n};`)}),Object.entries(n.zIndex).forEach(([r,n])=>{e.push(`  --vtx-z-${r}: ${n};`)}),e.join("\n")}function er(r){if("undefined"==typeof document)return;const n="vtx-ui-variables";let e=document.getElementById(n);e||(e=document.createElement("style"),e.id=n,document.head.appendChild(e));const t=nr(r);e.textContent=`:root {\n${t}\n}`}const tr=a.createContext(void 0),ar=a.forwardRef(({children:n,initialMode:e="light",customTokens:t,defaultSize:o="md",colorContrast:i,...l},d)=>{const[c,s]=a.useState(e),[v,x]=a.useState(o),m={primary:"dark",secondary:"dark",outline:"light",ghost:"light",danger:"dark",success:"dark",warning:"dark"},p=a.useMemo(()=>{const r={...m,...i};if(!t)return{tokens:J,mode:c,defaultSize:v,colorContrast:r};let n={...J,...t};return t.colors&&(n.colors={...J.colors,...Z(t.colors)}),{tokens:n,mode:c,defaultSize:v,colorContrast:r}},[t,c,v,i]);a.useEffect(()=>{document.documentElement.setAttribute("data-theme",c),t&&er(p.tokens)},[c,t,p.tokens]);const h=a.useMemo(()=>({theme:p,setMode:s,setDefaultSize:x}),[p]);return r(tr.Provider,{value:h,children:r("div",{ref:d,...l,children:n})})});ar.displayName="ThemeProvider";const or=()=>{const r=a.useContext(tr);if(!r)throw new Error("useThemeContext must be used within a ThemeProvider");return r},ir="dynamic-styles";function lr(){let r=document.getElementById(ir);return r||(r=document.createElement("style"),r.id=ir,document.head.appendChild(r)),r}const dr=new Set,cr={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"},sr={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 vr(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=sr[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}; }`,dr.has(n)||(lr().appendChild(document.createTextNode(n)),dr.add(n)),t}}if(n=r.match(/^([a-z]+)-(.+)$/),n){const r=n[1],e=n[2],t=sr[r],a=cr[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}; }`,dr.has(o)||(lr().appendChild(document.createTextNode(o)),dr.add(o)),n}}return r}(r)).join(" ");return r(n,{...e,className:t})};return e.displayName=n.displayName||n.name||"Component",e}function xr(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))}}xr(".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 mr=a.forwardRef(({children:t,variant:a="primary",size:o,fullWidth:i=!1,loading:l=!1,disabled:d=!1,leftIcon:c,rightIcon:s,iconOnly:v=!1,loadingText:x,asLink:m=!1,href:p,target:h,rel:g,className:u="",type:b="button",...f},w)=>{const{theme:y}=or(),k=o||y.defaultSize||"md",N=["vtx-button",`vtx-button--${a}`,`vtx-button--${k}`,i&&"vtx-button--full-width",l&&"vtx-button--loading",v&&"vtx-button--icon-only",(()=>{if(!0===f.darkText)return"vtx-button--dark-text";if(!1===f.darkText)return"vtx-button--light-text";const r=y.colorContrast[a];return"light"===r?"vtx-button--dark-text":"dark"===r?"vtx-button--light-text":null})(),u].filter(Boolean).join(" "),z=f.style?{...f.style}:{};f.textColor&&(z.color=f.textColor);const _=n(e,{children:[l&&r("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:r("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:r("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!l&&c&&r("span",{className:"vtx-button__icon-left",children:c}),!v&&r("span",{className:"vtx-button__content",children:l&&x?x:t}),v&&!l&&t,!l&&s&&r("span",{className:"vtx-button__icon-right",children:s})]});return m&&p?r("a",{ref:w,href:p,target:h,rel:"_blank"===h?"noopener noreferrer":g,className:N,"aria-disabled":d||l,style:z,...f,children:_}):r("button",{ref:w,type:b,className:N,disabled:d||l,"aria-busy":l,"aria-disabled":d||l,style:z,...f,children:_})});mr.displayName="Button";const pr=vr(mr);xr("/* 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 hr=a.forwardRef(({checked:e,indeterminate:t=!1,disabled:a=!1,label:c,size:s,variant:v="primary",error:x=!1,helperText:m,onChange:p,className:h="",inputClassName:g="",id:u,...b},f)=>{const{theme:w}=or(),y=s||w.defaultSize||"md",k=o(),N=u||k,z=["vtx-checkbox",`vtx-checkbox--${y}`,`vtx-checkbox--${v}`,a&&"vtx-checkbox--disabled",x&&"vtx-checkbox--error",h].filter(Boolean).join(" "),_=["vtx-checkbox-input",g].filter(Boolean).join(" "),C=i(null);return l(f,()=>C.current),d(()=>{C.current&&(C.current.indeterminate=t)},[t]),n("div",{className:z,children:[n("label",{className:"vtx-checkbox-label",htmlFor:N,children:[n("span",{className:"vtx-checkbox-wrapper",children:[r("input",{ref:C,type:"checkbox",id:N,className:_,checked:e,disabled:a,onChange:p,...b}),n("span",{className:"vtx-checkbox-box",children:[r("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),r("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),c&&r("span",{className:"vtx-checkbox-label-text",children:c})]}),m&&r("div",{className:"vtx-checkbox-helper-text",children:m})]})});hr.displayName="Checkbox";const gr=vr(hr);xr("/* 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 ur=a.forwardRef(({label:e,options:t,value:a,defaultValue:o,onChange:i,disabled:l=!1,error:d=!1,helperText:s,orientation:v="vertical",size:x,className:m="",...p},h)=>{const{theme:g}=or(),u=x||g.defaultSize||"md",[b,f]=c(o||[]),w=void 0!==a,y=w?a:b,k=["vtx-checkbox-group",`vtx-checkbox-group--${v}`,d&&"vtx-checkbox-group--error",l&&"vtx-checkbox-group--disabled",m].filter(Boolean).join(" ");return n("div",{ref:h,className:k,...p,children:[e&&r("div",{className:"vtx-checkbox-group-label",children:e}),r("div",{className:"vtx-checkbox-group-options",children:t.map(n=>{const e=y.includes(n.value),t=l||n.disabled;return r(gr,{label:n.label,checked:e,disabled:t,error:d,size:u,onChange:r=>((r,n)=>{const e=n?[...y,r]:y.filter(n=>n!==r);w||f(e),null==i||i(e)})(n.value,r.target.checked)},n.value)})}),s&&r("div",{className:"vtx-checkbox-group-helper-text",children:s})]})});ur.displayName="CheckboxGroup";const br=vr(ur),fr=e=>n("svg",{className:"vtx-multiselect-icon-spinner",width:e.size||16,height:e.size||16,viewBox:"0 0 16 16",fill:"none",children:[r("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r("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"})]}),wr=u,yr=n=>r(b,{size:n.size||12,"aria-hidden":"true"}),kr=f,Nr=P,zr=V,_r=w,Cr=y,Sr=H,Mr=Y,$r=k,Tr=N,jr=z,Ir=_,Ar=C,Dr=S,Lr=M,Br=$,Er=T,Rr=j,Fr=I,Or=A,Wr=D,Pr=L,Vr=B,Hr=E,Yr=b,qr=R,Ur=F,Gr=O,Xr=W,Kr=q,Qr=U,Zr=G,Jr=X,rn=(r,n)=>{d(()=>{const e=e=>{const t=null==r?void 0:r.current;t&&!t.contains(e.target)&&n(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}},[r,n])},nn=(r,n)=>{d(()=>{if(!n)return;const e=r.current;if(!e)return;const t=e.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(),e.addEventListener("keydown",i),()=>{e.removeEventListener("keydown",i)}},[r,n])},en=r=>{d(()=>{const n=n=>{"Escape"===n.key&&r()};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[r])},tn=r=>{d(()=>{if(!r)return;const n=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=n}},[r])};let an=0;const on=(r="vtx")=>{const[n]=c(()=>`${r}-${++an}`);return n},ln=(r,n)=>{const[e,t]=c(r);return d(()=>{const e=setTimeout(()=>{t(r)},n);return()=>{clearTimeout(e)}},[r,n]),e};xr("/**\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");xr(".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 dn=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,leftIcon:d,rightIcon:c,clearable:s=!1,onClear:v,showCount:x=!1,className:m="",wrapperClassName:p="",labelClassName:h="",inputClassName:g="",prefix:u,suffix:b,id:f,disabled:w=!1,required:y=!1,value:k,maxLength:N,...z},_)=>{const{theme:C}=or(),S=i||C.defaultSize,M=on("input"),$=f||M,T=`${$}-helper`,j=`${$}-error`,I=`${$}-success`,A=Boolean(a),D=Boolean(o)&&!A,L=s&&k&&String(k).length>0&&!w,B=[t&&!a&&!o&&T,a&&j,o&&I].filter(Boolean).join(" "),E=["vtx-input-wrapper",l&&"vtx-input-wrapper--full-width",p].filter(Boolean).join(" "),R=["vtx-input-container",`vtx-input-container--${S}`,A&&"vtx-input-container--error",D&&"vtx-input-container--success",w&&"vtx-input-container--disabled",(d||u)&&"vtx-input-container--with-left-element",(c||b||L)&&"vtx-input-container--with-right-element",m].filter(Boolean).join(" "),F=k?String(k).length:0,O=x&&N;return n("div",{className:E,children:[e&&n("label",{htmlFor:$,className:`vtx-input-label ${h}`.trim(),children:[e,y&&n("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:R,children:[d&&r("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:d}),u&&r("span",{className:"vtx-input-prefix","aria-hidden":"true",children:u}),r("input",{ref:_,id:$,className:`vtx-input ${g}`.trim(),disabled:w,required:y,value:k,maxLength:N,"aria-invalid":A,"aria-describedby":B||void 0,...z}),b&&r("span",{className:"vtx-input-suffix","aria-hidden":"true",children:b}),L&&r("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==v||v()},"aria-label":"Clear input",tabIndex:-1,children:r(yr,{size:16})}),c&&!L&&r("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:c})]}),t&&!a&&!o&&r("p",{id:T,className:"vtx-input-helper",children:t}),a&&r("p",{id:j,className:"vtx-input-error",role:"alert",children:a}),o&&r("p",{id:I,className:"vtx-input-success",role:"status",children:o}),O&&n("p",{className:"vtx-input-counter","aria-live":"polite",children:[F," / ",N]})]})});dn.displayName="Input";const cn=vr(dn);xr("/* 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 sn=a.forwardRef(({label:e,size:t="md",variant:a="filled",color:o="default",icon:i,avatar:l,onDelete:d,onClick:c,disabled:s=!1,className:v="","aria-label":x,"data-testid":m},p)=>{const h=["vtx-chip",`vtx-chip--${t}`,`vtx-chip--${a}`,`vtx-chip--${o}`,c&&!s&&"vtx-chip--clickable",s&&"vtx-chip--disabled",v].filter(Boolean).join(" ");return n("div",{ref:p,className:h,onClick:r=>{!s&&c&&c(r)},onKeyDown:r=>{s||!c||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),c(r))},role:c?"button":void 0,tabIndex:c&&!s?0:void 0,"aria-label":x||e,"aria-disabled":s,"data-testid":m,children:[l&&r("img",{src:l,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),i&&!l&&r("span",{className:"vtx-chip__icon","aria-hidden":"true",children:i}),r("span",{className:"vtx-chip__label",children:e}),d&&r("button",{type:"button",className:"vtx-chip__delete",onClick:r=>{r.stopPropagation(),!s&&d&&d(r)},onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),r.stopPropagation(),!s&&d&&d(r))},disabled:s,"aria-label":`Remove ${e}`,tabIndex:-1,children:r(yr,{size:16})})]})});sn.displayName="Chip";const vn=vr(sn);xr("/* 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 xn=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:l,fullWidth:s=!1,options:v,value:x,defaultValue:m=[],placeholder:p="Select...",className:h="",grouped:g=!1,getOptionLabel:u="label",getOptionValue:b="value",getOptionDisabled:f="disabled",getOptionGroup:w="group",onChange:y,disabled:k=!1,required:N=!1,id:z,name:_,selectionStyle:C="checkbox",searchable:S=!1,showSelectAll:M=!1,maxChipsDisplay:$,chipColor:T="primary",chipVariant:j="light",loading:I=!1},A)=>{const{theme:D}=or(),L=on("multiselect"),B=z||L,E=`${B}-helper`,R=`${B}-error`,F=`${B}-success`,[O,W]=c(!1),[P,V]=c(""),[H,Y]=c(m),q=i(null),U=i(null),G=void 0!==x?x:H,X=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,K=Boolean(a),Q=Boolean(o)&&!K,Z=[t&&!a&&!o&&E,a&&R,o&&F].filter(Boolean).join(" ");d(()=>{const r=r=>{q.current&&!q.current.contains(r.target)&&U.current&&!U.current.contains(r.target)&&(W(!1),V(""))};if(O)return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[O]);const J=r=>{if(k)return;const n=G.includes(r)?G.filter(n=>n!==r):[...G,r];if(void 0===x&&Y(n),y){const r=v.filter(r=>n.includes(X(r,b)));y(n,r)}},rr=P?v.filter(r=>X(r,u).toLowerCase().includes(P.toLowerCase())):v,nr=g?rr.reduce((r,n)=>{const e=X(n,w)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{}):{"":rr},er=v.filter(r=>G.includes(X(r,b))),tr=$?er.slice(0,$):er,ar=$?er.length-$:0,ir=["vtx-multiselect-wrapper",s&&"vtx-multiselect-wrapper--full-width",h].filter(Boolean).join(" "),lr=l||(null==D?void 0:D.defaultSize)||"md",dr=["vtx-multiselect-container",`vtx-multiselect-container--${lr}`,K&&"vtx-multiselect-container--error",Q&&"vtx-multiselect-container--success",k&&"vtx-multiselect-container--disabled",O&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),cr=lr;return n("div",{className:ir,ref:A,children:[e&&n("label",{htmlFor:B,className:"vtx-multiselect-label",children:[e,N&&n("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{ref:q,className:dr,"aria-expanded":O,"aria-haspopup":"listbox","aria-labelledby":e?`${B}-label`:void 0,"aria-describedby":Z||void 0,"aria-disabled":k,children:[r("div",{className:"vtx-multiselect-input-area",onClick:()=>!k&&W(!O),role:"button",tabIndex:k?-1:0,onKeyDown:r=>{k||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),W(!O))},children:0===er.length?r("span",{className:"vtx-multiselect-placeholder",children:p}):n("div",{className:"vtx-multiselect-chips",children:[tr.map(n=>{const e=X(n,b),t=X(n,u);return r(vn,{label:t,size:cr,color:T,variant:j,onDelete:r=>{r.stopPropagation(),(r=>{if(k)return;const n=G.filter(n=>n!==r);if(void 0===x&&Y(n),y){const r=v.filter(r=>n.includes(X(r,b)));y(n,r)}})(e)}},e)}),ar>0&&r(vn,{label:`+${ar} more`,size:cr,color:"default",variant:"outlined"})]})}),r("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:r(I?fr:kr,{size:16})}),O&&n("div",{ref:U,className:"vtx-multiselect-dropdown",role:"listbox",children:[S&&r("div",{className:"vtx-multiselect-search",children:r("input",{type:"text",placeholder:"Search...",value:P,onChange:r=>V(r.target.value),onClick:r=>r.stopPropagation()})}),M&&n("div",{className:"vtx-multiselect-actions",children:[r("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),(()=>{const r=v.filter(r=>!X(r,f)).map(r=>X(r,b));void 0===x&&Y(r),y&&y(r,v.filter(r=>!X(r,f)))})()},children:"Select All"}),r("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),void 0===x&&Y([]),y&&y([],[])},children:"Clear All"})]}),r("div",{className:"vtx-multiselect-options",children:0===rr.length?r("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(nr).map(([e,t])=>n("div",{children:[g&&e&&r("div",{className:"vtx-multiselect-optgroup",children:e}),t.map(e=>{const t=X(e,b),a=X(e,u),o=X(e,f),i=G.includes(t),l=["vtx-multiselect-option",i&&"vtx-multiselect-option--selected",o&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return n("div",{className:l,onClick:()=>!o&&J(t),role:"option","aria-selected":i,"aria-disabled":o,tabIndex:o?-1:0,onKeyDown:r=>{o||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),J(t))},children:["checkbox"===C&&r("div",{className:"vtx-multiselect-checkbox "+(i?"vtx-multiselect-checkbox--checked":""),children:i&&r(wr,{size:16})}),r("span",{className:"vtx-multiselect-option-label",children:a}),"checkmark"===C&&r("div",{className:"vtx-multiselect-checkmark",children:i&&r(wr,{size:20})})]},t)})]},e))})]})]}),_&&r("select",{multiple:!0,name:_,value:G.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:N,disabled:k,tabIndex:-1,"aria-hidden":"true",children:v.map(n=>{const e=X(n,b);return r("option",{value:String(e),children:X(n,u)},e)})}),t&&!a&&!o&&r("p",{id:E,className:"vtx-multiselect-helper",children:t}),a&&r("p",{id:R,className:"vtx-multiselect-error",role:"alert",children:a}),o&&r("p",{id:F,className:"vtx-multiselect-success",role:"status",children:o})]})});xn.displayName="MultiSelect";const mn=vr(xn);xr("/* 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 pn=a.forwardRef(({checked:e,disabled:t=!1,label:a,size:i,variant:l="primary",error:d=!1,helperText:c,onChange:s,className:v="",inputClassName:x="",id:m,...p},h)=>{const{theme:g}=or(),u=i||g.defaultSize,b=o(),f=m||b,w=c?`${f}-helper-text`:void 0,y=["vtx-radio",`vtx-radio--${u}`,`vtx-radio--${l}`,t&&"vtx-radio--disabled",d&&"vtx-radio--error",v].filter(Boolean).join(" "),k=["vtx-radio-input",x].filter(Boolean).join(" "),N=n("div",{className:"vtx-radio-wrapper",children:[r("input",{ref:h,type:"radio",id:f,className:k,checked:e,disabled:t,onChange:s,"aria-describedby":w,...p}),r("span",{className:"vtx-radio-circle",children:r("span",{className:"vtx-radio-dot"})})]});return n("div",a?{className:y,children:[n("label",{htmlFor:f,className:"vtx-radio-label",children:[N,r("span",{className:"vtx-radio-label-text",children:a})]}),c&&r("span",{id:w,className:"vtx-radio-helper-text",children:c})]}:{className:y,children:[N,c&&r("span",{id:w,className:"vtx-radio-helper-text",children:c})]})});pn.displayName="Radio";const hn=vr(pn);xr("/* 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 gn=a.forwardRef(({name:e,label:t,options:a,value:o,defaultValue:i,onChange:l,disabled:d=!1,error:s=!1,helperText:v,orientation:x="vertical",size:m,variant:p="primary",className:h="",...g},u)=>{const{theme:b}=or(),f=m||b.defaultSize,[w,y]=c(i),k=void 0!==o,N=k?o:w,z=["vtx-radio-group",`vtx-radio-group--${x}`,s&&"vtx-radio-group--error",d&&"vtx-radio-group--disabled",h].filter(Boolean).join(" ");return n("div",{ref:u,className:z,role:"radiogroup","aria-label":"string"==typeof t?t:void 0,...g,children:[t&&r("div",{className:"vtx-radio-group-label",children:t}),r("div",{className:"vtx-radio-group-options",children:a.map(n=>{const t=N===n.value,a=d||n.disabled;return r(hn,{name:e,value:n.value,label:n.label,checked:t,disabled:a,error:s,size:f,variant:p,onChange:()=>{return r=n.value,k||y(r),void(null==l||l(r));var r}},n.value)})}),v&&r("div",{className:"vtx-radio-group-helper-text",children:v})]})});gn.displayName="RadioGroup";const un=vr(gn);xr(".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 bn=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,options:d,placeholder:c,className:s="",wrapperClassName:v="",id:x,disabled:m=!1,required:p=!1,grouped:h=!1,getOptionLabel:g="label",getOptionValue:u="value",getOptionDisabled:b="disabled",getOptionGroup:f="group",onSelectChange:w,onChange:y,loading:k=!1,...N},z)=>{const{theme:_}=or(),C=i||_.defaultSize,S=on("select"),M=x||S,$=`${M}-helper`,T=`${M}-error`,j=`${M}-success`,I=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,A=Boolean(a),D=Boolean(o)&&!A,L=[t&&!a&&!o&&$,a&&T,o&&j].filter(Boolean).join(" "),B=["vtx-select-wrapper",l&&"vtx-select-wrapper--full-width",v].filter(Boolean).join(" "),E=["vtx-select-container",`vtx-select-container--${C}`,A&&"vtx-select-container--error",D&&"vtx-select-container--success",m&&"vtx-select-container--disabled",s].filter(Boolean).join(" ");return n("div",{className:B,children:[e&&n("label",{htmlFor:M,className:"vtx-select-label",children:[e,p&&n("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:E,children:[n("select",{ref:z,id:M,className:"vtx-select",disabled:m,required:p,"aria-invalid":A,"aria-describedby":L||void 0,onChange:r=>{if(null==y||y(r),w){const n=d.find(n=>String(I(n,u))===r.target.value);w(r.target.value,n)}},...N,children:[c&&r("option",{value:"",disabled:!0,children:c}),(()=>{if(!h)return d.map((n,e)=>{const t=I(n,u),a=I(n,g),o=I(n,b);return r("option",{value:t,disabled:o,children:a},t||e)});const n=d.reduce((r,n)=>{const e=I(n,f)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{});return Object.entries(n).map(([n,e])=>r("optgroup",{label:n,children:e.map((n,e)=>{const t=I(n,u),a=I(n,g),o=I(n,b);return r("option",{value:t,disabled:o,children:a},t||e)})},n))})()]}),r("span",{className:"vtx-select-icon","aria-hidden":"true",children:k?n("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[r("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r("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("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:r("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),t&&!a&&!o&&r("p",{id:$,className:"vtx-select-helper",children:t}),a&&r("p",{id:T,className:"vtx-select-error",role:"alert",children:a}),o&&r("p",{id:j,className:"vtx-select-success",role:"status",children:o})]})});bn.displayName="Select";const fn=vr(bn),wn=a.forwardRef(({item:t,isOpen:a,onToggle:o,variant:l="default",size:d="md",showChevron:c=!0,chevronPosition:s="right",expandedIcon:v,collapsedIcon:x,iconType:m="chevron",loading:p=!1,disabled:h=!1,disableAnimations:g=!1},u)=>{const b=i(null),{id:f,header:w,children:y,disabled:k,className:N,loading:z,status:_="default",icon:C,dataTestId:S}=t,M=h||k,$=p||z,T=()=>{M||$||o()},j=()=>r("div",C?{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-custom-icon`,children:a?C.expanded:C.collapsed}:"custom"===m&&v&&x?{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-custom-icon`,children:a?v:x}:"plus-minus"===m?{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(a?"open":""),"data-testid":`${S||f}-plus-minus-icon`,children:a?r(zr,{size:16,"aria-hidden":"true"}):r(e,{children:r(Nr,{size:16,"aria-hidden":"true"})})}:{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-chevron-icon`,children:r(kr,{size:16,"aria-hidden":"true",style:{transform:a?"rotate(180deg)":void 0,transition:"transform 0.2s"}})});return n("div",{ref:u,className:`\n          accordion-item\n          accordion-item--${l}\n          accordion-item--${d}\n          ${a?"accordion-item--open":""}\n          ${M?"accordion-item--disabled":""}\n          ${$?"accordion-item--loading":""}\n          ${"default"!==_?`accordion-item--${_}`:""}\n          ${N||""}\n        `.trim(),"data-testid":S,"aria-expanded":a,"aria-disabled":M,"aria-busy":$,children:[n("div",{className:"accordion-item-header",role:"button",tabIndex:M||$?-1:0,"aria-expanded":a,"aria-controls":`accordion-content-${f}`,"aria-disabled":M,"aria-busy":$,"aria-describedby":"default"!==_?`accordion-status-${f}`:void 0,onClick:T,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),T())},"data-testid":`${S||f}-header`,children:["left"===s&&c&&j(),r("div",{className:"accordion-item-header-content",children:w}),"right"===s&&c&&j()]}),r("div",{id:`accordion-content-${f}`,className:"accordion-item-content "+(a?"accordion-item-content--open":""),role:"region","aria-labelledby":`accordion-header-${f}`,ref:b,style:{maxHeight:g?a?"none":"0":a?"500px":"0",transition:g?"none":void 0},"data-testid":`${S||f}-content`,children:n("div",{className:"accordion-item-body",children:["default"!==_&&r("div",{id:`accordion-status-${f}`,className:`accordion-status accordion-status--${_}`,"aria-live":"polite",children:n("span",{className:"visually-hidden",children:["Status: ",_]})}),y]})})]})});wn.displayName="AccordionItem";xr("/* =============================================================================\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 yn=a.forwardRef(({items:n,children:e,allowMultiple:t=!1,defaultOpenItems:a=[],openItems:o,onToggle:i,variant:l="default",size:d="md",className:m="",style:p,showChevron:h=!0,chevronPosition:g="right",expandedIcon:u,collapsedIcon:b,iconType:f="chevron",showDivider:w=!0,collapsible:y=!0,loading:k=!1,disabled:N=!1,spacing:z="default",disableAnimations:_=!1,...C},S)=>{const[M,$]=c(a),T=void 0!==o?o:M,j=void 0!==o,I=n||s.toArray(e).filter(r=>v(r)).map((r,n)=>{if(v(r)&&r.props){const e=r;return{id:e.props.id||`accordion-item-${n}`,header:e.props.header||`Item ${n+1}`,children:e.props.children,disabled:e.props.disabled,className:e.props.className}}return{id:`accordion-item-${n}`,header:`Item ${n+1}`,children:r}}),A=x(r=>{let n;n=t?T.includes(r)?T.filter(n=>n!==r):[...T,r]:T.includes(r)?y?[]:T:[r],j||$(n),null==i||i(n)},[t,y,T,j,i]);return r("div",{ref:S,className:`\n          accordion\n          accordion--${l}\n          accordion--${d}\n          ${w?"accordion--divider":""}\n          ${"compact"===z?"accordion--compact":""}\n          ${"spacious"===z?"accordion--spacious":""}\n          ${_?"accordion--no-animation":""}\n          ${k?"accordion--loading":""}\n          ${N?"accordion--disabled":""}\n          ${m}\n        `.trim(),style:p,role:"presentation","aria-busy":k,...C,children:I.map(n=>r(wn,{item:n,isOpen:T.includes(n.id),onToggle:()=>A(n.id),variant:l,size:d,showChevron:h,chevronPosition:g,expandedIcon:u,collapsedIcon:b,iconType:f,loading:k,disabled:N,spacing:z,disableAnimations:_},n.id))})});yn.displayName="Accordion";xr("/* 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 kn=a.forwardRef(({children:n,direction:e="row",wrap:t="nowrap",justify:a="start",align:o="stretch",alignContent:i,gap:l,rowGap:d,columnGap:c,inline:s=!1,fullWidth:v=!1,grow:x,shrink:m,basis:p,className:h="",as:g="div",style:u,...b},f)=>{const w=g,y=["vtx-flex",s&&"vtx-flex--inline",v&&"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!==d&&(k["--vtx-flex-row-gap"]="number"==typeof d?`${d}px`:d),void 0!==c&&(k["--vtx-flex-column-gap"]="number"==typeof c?`${c}px`:c),void 0!==x&&(k.flexGrow=x),void 0!==m&&(k.flexShrink=m),void 0!==p&&(k.flexBasis="number"==typeof p?`${p}px`:p),r(w,{ref:f,className:y,style:k,...b,children:n})});kn.displayName="Flex";const Nn=vr(kn);xr("/* ===== 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 zn=t.forwardRef(({variant:r="body1",as:n,align:e,color:a,weight:o,transform:i,decoration:l,truncate:d=!1,lineClamp:c,breakWord:s=!1,italic:v=!1,underline:x=!1,strikethrough:m=!1,gradient:p,noSelect:h=!1,size:g,lineHeight:u,letterSpacing:b,noMargin:f=!1,noPadding:w=!1,className:y="",style:k,children:N,...z},_)=>{const C=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),S=["vtx-text",`vtx-text--${r}`,e&&`vtx-text--align-${e}`,o&&"string"==typeof o&&`vtx-text--weight-${o}`,i&&`vtx-text--transform-${i}`,l&&`vtx-text--decoration-${l}`,d&&"vtx-text--truncate",c&&"vtx-text--line-clamp",s&&"vtx-text--break-word",v&&"vtx-text--italic",x&&"vtx-text--underline",m&&"vtx-text--strikethrough",p&&"vtx-text--gradient",h&&"vtx-text--no-select",f&&"vtx-text--no-margin",w&&"vtx-text--no-padding",y].filter(Boolean).join(" "),M={...k};if(a)if(a.includes(".")){const[r,n]=a.split(".");M.color=`var(--vtx-color-${r}-${n})`}else M.color=a;if(o&&"number"==typeof o&&(M.fontWeight=o),c&&(M.WebkitLineClamp=c),p&&p.length>0){const r=1===p.length?p[0]:`linear-gradient(135deg, ${p.join(", ")})`;M.backgroundImage=r}return g&&(M.fontSize="number"==typeof g?`${g}px`:g),u&&(M.lineHeight="number"==typeof u?`${u}`:u),b&&(M.letterSpacing="number"==typeof b?`${b}px`:b),t.createElement(C,{ref:_,className:S,style:M,...z},N)});zn.displayName="Text";const _n=vr(zn);xr("/* 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 Cn=({isOpen:n})=>r(n?Sr:kr,{size:16}),Sn=a.forwardRef(({label:t,onClick:a,icon:o,rightIcon:l,disabled:d=!1,active:s=!1,variant:v="default",shortcut:x,divider:m=!1,items:p},h)=>{const[g,u]=c(!1),b=i(null),f=p&&p.length>0,w=l||(f?r(Cn,{isOpen:g}):null);return n(e,{children:[r("div",{ref:h||b,className:["vtx-menu-item",s&&"vtx-menu-item--active",d&&"vtx-menu-item--disabled","default"!==v&&`vtx-menu-item--${v}`,f&&"vtx-menu-item--has-submenu",g&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{d||(f?u(!g):a&&a())},onKeyDown:r=>{d||("Enter"===r.key||" "===r.key?(r.preventDefault(),f?u(!g):null==a||a()):"ArrowDown"===r.key&&f&&!g?(r.preventDefault(),u(!0)):"ArrowUp"===r.key&&f&&g&&(r.preventDefault(),u(!1)))},role:"menuitem",tabIndex:d?-1:0,"aria-disabled":d,"aria-haspopup":f?"menu":void 0,"aria-expanded":f?g:void 0,children:n(Nn,{align:"center",gap:8,style:{flex:1},children:[o&&r("span",{className:"vtx-menu-item-icon",children:o}),r(_n,{variant:"body2",noMargin:!0,style:{flex:1},children:t}),x&&r(_n,{variant:"caption",color:"neutral.500",noMargin:!0,className:"vtx-menu-item-shortcut",children:x}),w&&r("span",{className:"vtx-menu-item-right-icon",children:w})]})}),f&&g&&r("div",{className:"vtx-submenu",role:"menu",children:p.map((n,e)=>r(Sn,{...n},e))}),m&&r("div",{className:"vtx-menu-divider",role:"separator"})]})});Sn.displayName="MenuItem";const Mn=a.forwardRef(({items:e,children:t,orientation:a="vertical",responsive:o=!0,className:l="",width:s},v)=>{const[x,m]=c(!1),p=i(null);d(()=>{if(!o||!x)return;const r=r=>{p.current&&!p.current.contains(r.target)&&m(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[o,x]),d(()=>{if(!o||!x)return;const r=r=>{"Escape"===r.key&&m(!1)};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[o,x]);const h=e?e.map((n,e)=>r(Sn,{...n},e)):t,g=["vtx-menu",`vtx-menu--${a}`,o&&"vtx-menu--responsive",x&&"vtx-menu--mobile-open",l].filter(Boolean).join(" "),u={width:"vertical"===a&&s?"number"==typeof s?`${s}px`:s:void 0};return n("div",{ref:p,className:"vtx-menu-container",children:[o&&r("button",{className:"vtx-menu-toggle",onClick:()=>m(!x),"aria-label":"Toggle menu","aria-expanded":x,children:r(x?Yr:Cr,{size:24})}),r("div",{ref:v,className:g,role:"menu",style:u,children:h})]})});Mn.displayName="Menu";const $n=vr(Mn);xr("/* ActionMenu Component Styles */\r\n\r\n.vtx-action-menu-container {\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.vtx-action-menu-trigger-wrapper {\r\n  display: inline-block;\r\n}\r\n\r\n/* Trigger Button */\r\n.vtx-action-menu-trigger {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  background: var(--vtx-background-primary);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-text-primary);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-normal);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-action-menu-trigger:hover {\r\n  background: var(--vtx-background-hover);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-action-menu-trigger:active {\r\n  background: var(--vtx-background-active);\r\n}\r\n\r\n.vtx-action-menu-trigger:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-action-menu-trigger--open {\r\n  background: var(--vtx-background-active);\r\n  border-color: var(--vtx-color-primary-500);\r\n  box-shadow: 0 0 0 1px var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-action-menu-trigger--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-action-menu-trigger-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-text-secondary);\r\n}\r\n\r\n/* Dropdown Menu */\r\n.vtx-action-menu {\r\n  position: absolute;\r\n  z-index: 1000;\r\n  min-width: 200px;\r\n  margin-top: var(--vtx-spacing-1);\r\n  padding: var(--vtx-spacing-2);\r\n  background: var(--vtx-background-primary);\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-lg);\r\n  animation: slideDown 0.15s ease-out;\r\n}\r\n\r\n/* Position variants */\r\n.vtx-action-menu--bottom-start {\r\n  top: 100%;\r\n  left: 0;\r\n}\r\n\r\n.vtx-action-menu--bottom-end {\r\n  top: 100%;\r\n  right: 0;\r\n}\r\n\r\n.vtx-action-menu--top-start {\r\n  bottom: 100%;\r\n  left: 0;\r\n  margin-top: 0;\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  animation: slideUp 0.15s ease-out;\r\n}\r\n\r\n.vtx-action-menu--top-end {\r\n  bottom: 100%;\r\n  right: 0;\r\n  margin-top: 0;\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  animation: slideUp 0.15s ease-out;\r\n}\r\n\r\n/* Animations */\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@keyframes slideUp {\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/* Dark Mode */\r\n[data-theme='dark'] .vtx-action-menu-trigger {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-600);\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger:hover {\r\n  background: var(--vtx-color-neutral-700);\r\n  border-color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger:active {\r\n  background: var(--vtx-color-neutral-600);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger--open {\r\n  background: var(--vtx-color-neutral-700);\r\n  border-color: var(--vtx-color-primary-400);\r\n  box-shadow: 0 0 0 1px var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n/* Reduced Motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-action-menu {\r\n    animation: none;\r\n  }\r\n}\r\n");const Tn=({isOpen:n})=>r(n?Sr:kr,{size:16}),jn=a.forwardRef(({items:e,trigger:t,triggerLabel:o="Actions",triggerIcon:l,position:s="bottom-start",className:v="",triggerClassName:x="",disabled:m=!1,onOpen:p,onClose:h},g)=>{const[u,b]=c(!1),f=i(null),w=i(null),y=()=>{if(m)return;const r=!u;b(r),r&&p?p():!r&&h&&h()};d(()=>{if(!u)return;const r=r=>{f.current&&!f.current.contains(r.target)&&(b(!1),null==h||h())};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[u,h]),d(()=>{if(!u)return;const r=r=>{"Escape"===r.key&&(b(!1),null==h||h())};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[u,h]);const k=e.map(r=>({...r,onClick:r.onClick?()=>{var n;null===(n=r.onClick)||void 0===n||n.call(r),b(!1),null==h||h()}:void 0})),N=`vtx-action-menu--${s}`,z="function"==typeof t?t({isOpen:u,toggle:y,disabled:m}):t||n(Nn,{align:"center",gap:8,children:[l&&r("span",{className:"vtx-action-menu-trigger-icon",children:l}),r(_n,{variant:"body2",noMargin:!0,children:o}),r(Tn,{isOpen:u})]}),_="function"==typeof t||a.isValidElement(t);return n("div",{ref:f,className:"vtx-action-menu-container",children:[r("div",_?{className:"vtx-action-menu-trigger-wrapper",children:"function"==typeof t?z:r("div",{onClick:y,children:z})}:{className:["vtx-action-menu-trigger",m&&"vtx-action-menu-trigger--disabled",u&&"vtx-action-menu-trigger--open",x].filter(Boolean).join(" "),onClick:y,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),y())},role:"button",tabIndex:m?-1:0,"aria-haspopup":"menu","aria-expanded":u,"aria-disabled":m,children:z}),u&&r("div",{ref:g||w,className:["vtx-action-menu",N,v].filter(Boolean).join(" "),role:"menu",children:k.map((n,e)=>r(Sn,{...n},e))})]})});jn.displayName="ActionMenu";const In=vr(jn);xr("/* 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 An={success:r(Tr,{size:20}),error:r(jr,{size:20}),warning:r(Ir,{size:20}),info:r(Ar,{size:20}),neutral:r(Dr,{size:20})},Dn=a.forwardRef(({children:e,title:t,description:a,variant:o="info",alertStyle:i="subtle",size:l,icon:d,dismissible:s=!1,onClose:v,action:x,fullWidth:m=!1,className:p="",style:h,role:g="alert",...u},b)=>{const{theme:f}=or(),w=l||(null==f?void 0:f.defaultSize)||"md",[y,k]=c(!0);if(!y)return null;const N=!1!==d,z=void 0===d?An[o]:d,_=e||a;return n("div",{ref:b,className:`\n          alert\n          alert--${o}\n          alert--${i}\n          alert--${w}\n          ${m?"alert--full-width":""}\n          ${p}\n        `.trim(),style:h,role:g,...u,children:[N&&r("div",{className:"alert-icon",children:z}),n("div",{className:"alert-content",children:[t&&r("div",{className:"alert-title",children:t}),_&&r("div",{className:"alert-message",children:null!=e?e:a})]}),x&&r("div",{className:"alert-action",children:x}),s&&r("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==v||v()},"aria-label":"Close alert",children:r(Yr,{size:16})})]})});Dn.displayName="Alert";const Ln=vr(Dn);xr("/* ===== 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 Bn=a.forwardRef(({isOpen:e,onClose:t,title:a,description:o,children:l,header:c,footer:s,footerButtons:v,size:x,closeOnBackdropClick:m=!0,closeOnEscape:p=!0,showCloseButton:h=!0,transparentBackdrop:g=!1,className:u="",backdropClassName:b="",preventScroll:f=!0,animation:w="fade",onAfterOpen:y,onAfterClose:k,scrollable:N=!1,centered:z=!0},_)=>{const C=i(null),S=i(null),{theme:M}=or();let $="md";if(x?$=x:(null==M?void 0:M.defaultSize)&&($=M.defaultSize),nn(C,e),tn(f&&e),en(()=>{p&&e&&t()}),d(()=>{e?(S.current=document.activeElement,null==y||y()):S.current&&(S.current.focus(),null==k||k())},[e,y,k]),!e)return null;const T=["vtx-modal-backdrop",g&&"vtx-modal-backdrop--transparent",z&&"vtx-modal-backdrop--centered",`vtx-modal-backdrop--${w}`,b].filter(Boolean).join(" "),j=["vtx-modal",`vtx-modal--${$}`,N&&"vtx-modal--scrollable",`vtx-modal--${w}`,u].filter(Boolean).join(" "),I=r("div",{className:T,onClick:r=>{m&&r.target===r.currentTarget&&t()},role:"presentation",children:n("div",{ref:r=>{C.current=r,"function"==typeof _?_(r):_&&(_.current=r)},className:j,role:"dialog","aria-modal":"true","aria-labelledby":a?"vtx-modal-title":void 0,"aria-describedby":o?"vtx-modal-description":void 0,children:[c?r("div",{className:"vtx-modal-header",children:c}):a||h?n(Nn,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[a&&n(Nn,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[r(_n,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:a}),o&&r(_n,{variant:"body2",color:"neutral.600",id:"vtx-modal-description",noMargin:!0,children:o})]}),h&&r(pr,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:t,"aria-label":"Close modal",children:r(Yr,{size:20})})]}):null,r(Nn,{direction:"column",className:"vtx-modal-body",children:l}),(s||v)&&r(Nn,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:v?v.map((n,e)=>r(pr,{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 K(I,document.body)});Bn.displayName="Modal";const En=vr(Bn);xr("/* ===== 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 Rn={success:r("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("path",{d:"M10 0C4.486 0 0 4.486 0 10s4.486 10 10 10 10-4.486 10-10S15.514 0 10 0zm1 15H9v-6h2v6zm0-8H9V5h2v2z",fill:"currentColor"})})},Fn=a.forwardRef(({children:e,onDismiss:t,id:o,variant:l="default",autoClose:s=5e3,closeButton:v=!0,progressBar:x=!0,pauseOnHover:m=!0,pauseOnFocusLoss:p=!0,icon:h,action:g,className:u="",style:b,title:f,description:w,animationDuration:y=300,isVisible:k,createdAt:N,onClose:z,onOpen:_,toastId:C,...S},M)=>{const[$,T]=c(!1),[j,I]=c(!1),[A,D]=c(100),L=i(null),B=i(Date.now()),E=i(0),R=a.useCallback(()=>{T(!0),setTimeout(()=>{t()},y)},[t,y]);d(()=>{if(!1===s||j)return;return L.current=setInterval(()=>{const r=Date.now()-B.current-E.current,n=Math.max(0,s-r);D(n/s*100),n<=0&&R()},16),()=>{L.current&&clearInterval(L.current)}},[s,j,R]);const F=["vtx-toast",`vtx-toast--${l}`,$&&"vtx-toast--exiting",u].filter(Boolean).join(" ");return n("div",{ref:M,className:F,style:{...b,"--vtx-toast-animation-duration":`${y}ms`},onMouseEnter:()=>{m&&!j&&(I(!0),E.current=Date.now())},onMouseLeave:()=>{if(m&&j){I(!1);const r=Date.now()-E.current;B.current+=r}},onFocus:()=>{if(p&&j){I(!1);const r=Date.now()-E.current;B.current+=r}},onBlur:()=>{p&&!j&&(I(!0),E.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":o,...S,children:[n("div",{className:"vtx-toast__wrapper",children:[!1===h?null:r("div",h?{className:"vtx-toast__icon",children:h}:{className:"vtx-toast__icon",children:Rn[l]}),f||w?n("div",{className:"vtx-toast__content",children:[f&&r("div",{className:"vtx-toast__title",children:f}),w&&r("div",{className:"vtx-toast__description",children:w}),e&&r("div",{className:"vtx-toast__body",children:e})]}):r("div",{className:"vtx-toast__content",children:e}),n("div",{className:"vtx-toast__actions",children:[g&&r("button",{className:"vtx-toast__action",onClick:g.onClick,type:"button",children:g.label}),v&&r("button",{className:"vtx-toast__close",onClick:R,type:"button","aria-label":"Close notification",children:r(yr,{size:16})})]})]}),x&&!1!==s&&r("div",{className:"vtx-toast__progress-container",children:r("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${A/100})`,animationPlayState:j?"paused":"running"}})})]})});Fn.displayName="Toast";const On=vr(Fn),Wn=m(null),Pn=()=>{const r=p(Wn);if(!r)throw new Error("useToast must be used within a ToastProvider");return r},Vn=({children:n})=>{const[e,t]=c([]),a=x(r=>{t(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)})},[]),o=x((r,n={})=>{var e;const o=n.toastId||Date.now()+Math.random(),i={id:o,content:r,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...n};return t(r=>{const n=r.filter(r=>r.id!==o);return[i,...n]}),!1!==i.autoClose&&setTimeout(()=>{a(o)},i.autoClose),null===(e=n.onOpen)||void 0===e||e.call(n),o},[a]),i=x(()=>{t([])},[]),l=x((r,n)=>{t(e=>e.map(e=>e.id===r?{...e,...n}:e))},[]),d={toasts:e,addToast:o,removeToast:a,clearAllToasts:i,updateToast:l};return r(Wn.Provider,{value:d,children:n})};class Hn{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return Hn.instance||(Hn.instance=new Hn),Hn.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 Yn=Hn.getInstance();xr("/* ===== 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 qn=({position:e="top-right",limit:t=5,gap:a=12,margin:o=16,className:l="",style:c,stacked:s=!0,theme:v="auto"})=>{const{toasts:x,removeToast:m,addToast:p,clearAllToasts:h,updateToast:g}=Pn(),u=i(null);d(()=>{Yn.setMethods(p,m,h,g)},[p,m,h,g]),d(()=>{if("auto"===v){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",v)},[v]);const b=x.slice(0,t),f=Math.max(0,x.length-t),w=["vtx-toast-container",`vtx-toast-container--${e}`,s&&"vtx-toast-container--stacked",l].filter(Boolean).join(" ");return 0===b.length?null:K(n("div",{ref:u,className:w,style:{...(r=>{const n={position:"fixed",zIndex:"var(--vtx-z-notification, 1400)",pointerEvents:"none"};switch(r){case"top-left":return{...n,top:o,left:o};case"top-center":return{...n,top:o,left:"50%",transform:"translateX(-50%)"};case"top-right":default:return{...n,top:o,right:o};case"bottom-left":return{...n,bottom:o,left:o};case"bottom-center":return{...n,bottom:o,left:"50%",transform:"translateX(-50%)"};case"bottom-right":return{...n,bottom:o,right:o}}})(e),"--vtx-toast-gap":`${a}px`,...c},"aria-live":"polite","aria-label":"Notifications",children:[f>0&&n("div",{className:"vtx-toast-container__hidden-count",children:["+",f," more"]}),r("div",{className:"vtx-toast-container__list",children:b.map((n,e)=>r(On,{id:n.id,isVisible:n.isVisible,onDismiss:()=>m(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)},Un=({children:e,...t})=>n(Vn,{children:[e,r(qn,{...t})]});xr(".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 Gn=a.forwardRef(({content:t,placement:a="top",delay:o=200,hideDelay:l=0,children:s,open:v,disabled:x=!1,arrow:m=!1,maxWidth:p="300px",variant:g="dark",dismissible:u=!1,onShow:b,onHide:f,onDismiss:w,className:y="",...k},N)=>{const[z,_]=c(v||!1),[C,S]=c(!1),[M,$]=c({top:0,left:0}),T=i(null),j=i(null),I=i(null),A=i(null),D=i(!1),L=()=>{x||(D.current=!0,I.current&&clearTimeout(I.current),A.current&&clearTimeout(A.current),j.current=setTimeout(()=>{if(T.current&&D.current){const r=T.current.getBoundingClientRect(),n=E(r,a);$(n),S(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{_(!0),null==b||b()})})}},o))},B=()=>{D.current=!1,j.current&&clearTimeout(j.current),I.current=setTimeout(()=>{D.current||(_(!1),null==f||f(),A.current=setTimeout(()=>{S(!1)},150))},l)},E=(r,n)=>{const e=m?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}};d(()=>{void 0!==v&&(v?(S(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{_(!0)})})):(_(!1),A.current=setTimeout(()=>{S(!1)},150)))},[v]),d(()=>()=>{j.current&&clearTimeout(j.current),I.current&&clearTimeout(I.current),A.current&&clearTimeout(A.current)},[]);const R=["vtx-tooltip",`vtx-tooltip--${a}`,`vtx-tooltip--${g}`,m&&"vtx-tooltip--with-arrow",z&&"vtx-tooltip--visible",y].filter(Boolean).join(" "),F=void 0!==v&&v||C,O=h(s,{ref:r=>{T.current=r;const n=s.ref;"function"==typeof n?n(r):n&&"object"==typeof n&&"current"in n&&(n.current=r)},onMouseEnter:r=>{var n,e;void 0===v&&L(),null===(e=(n=s.props).onMouseEnter)||void 0===e||e.call(n,r)},onMouseLeave:r=>{var n,e;void 0===v&&B(),null===(e=(n=s.props).onMouseLeave)||void 0===e||e.call(n,r)},onFocus:r=>{var n,e;void 0===v&&L(),null===(e=(n=s.props).onFocus)||void 0===e||e.call(n,r)},onBlur:r=>{var n,e;void 0===v&&B(),null===(e=(n=s.props).onBlur)||void 0===e||e.call(n,r)},"aria-describedby":z?"vtx-tooltip-content":void 0});return n(e,{children:[O,F&&K(n("div",{ref:N,id:"vtx-tooltip-content",role:"tooltip",className:R,style:{top:`${M.top}px`,left:`${M.left}px`,maxWidth:p},onMouseEnter:()=>{x||void 0!==v||(D.current=!0,I.current&&clearTimeout(I.current))},onMouseLeave:()=>{x||void 0!==v||B()},...k,children:[m&&r("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),n("div",{className:"vtx-tooltip-inner",children:[r("span",{className:"vtx-tooltip-content",children:t}),u&&r("button",{type:"button",className:"vtx-tooltip-close",onClick:()=>{D.current=!1,_(!1),null==w||w(),null==f||f(),A.current=setTimeout(()=>{S(!1)},150)},"aria-label":"Dismiss tooltip",children:r(yr,{size:14})})]})]}),document.body)]})});Gn.displayName="Tooltip";xr(".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 Xn=a.forwardRef(({src:e,alt:t="",size:a,shape:o="circle",fallback:i="?",onImageError:l,onImageLoad:d,imgProps:s,statusIndicator:v,statusPosition:x="bottom-right",className:m="",...p},h)=>{const{theme:g}=or(),u=a||g.defaultSize||"md",[b,f]=c(!1),w=["vtx-avatar",`vtx-avatar--${u}`,`vtx-avatar--${o}`,v&&"vtx-avatar--with-status",m].filter(Boolean).join(" "),y=e&&!b,k=i.slice(0,2).toUpperCase();return n("div",{ref:h,className:w,role:"img","aria-label":t||i||"Avatar",...p,children:[y?r("img",{src:e,alt:t,className:"vtx-avatar-image",onError:r=>{f(!0),null==l||l(r)},onLoad:r=>{null==d||d(r)},loading:"lazy",...s}):r("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),v&&r("span",{className:`vtx-avatar-status vtx-avatar-status--${x}`,"aria-label":"Status indicator",children:v})]})});Xn.displayName="Avatar";const Kn=vr(Xn);xr(".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 Qn=a.forwardRef(({variant:e="neutral",size:t,pill:a=!1,dot:o=!1,outline:i=!1,maxLength:l,icon:d,children:c,className:s="",onRemove:v,...x},m)=>{const{theme:p}=or(),h=["vtx-badge",`vtx-badge--${e}`,`vtx-badge--${t||p.defaultSize}`,a&&"vtx-badge--pill",o&&"vtx-badge--with-dot",i&&"vtx-badge--outline",v&&"vtx-badge--removable",s].filter(Boolean).join(" "),u=g(()=>l&&"string"==typeof c&&c.length>l?`${c.slice(0,l)}...`:c,[c,l]);return n("span",{ref:m,className:h,...x,children:[o&&r("span",{className:"vtx-badge-dot","aria-hidden":"true"}),d&&r("span",{className:"vtx-badge-icon","aria-hidden":"true",children:d}),r("span",{className:"vtx-badge-content",children:u}),v&&r("button",{type:"button",className:"vtx-badge-remove",onClick:v,"aria-label":"Remove badge",children:r(yr,{})})]})});Qn.displayName="Badge";const Zn=vr(Qn);xr("/* ===================================\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 Jn=({value:e="",onChange:t,onSubmit:a,onFocus:o,placeholder:l,loading:s,suggestions:v,icon:x})=>{const[m,p]=c(e),[h,g]=c(!1),u=i(null);d(()=>{p(e)},[e]),d(()=>{const r=r=>{u.current&&!u.current.contains(r.target)&&g(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);return n("div",{className:"vtx-admin-header-search",ref:u,children:[n("form",{onSubmit:r=>{r.preventDefault(),null==a||a(m),g(!1)},className:"vtx-admin-header-search-form",children:[r("div",{className:"vtx-admin-header-search-icon",children:s?r("span",{className:"vtx-admin-header-search-spinner"}):x||r(Xr,{})}),r("input",{type:"text",className:"vtx-admin-header-search-input",placeholder:l||"Search...",value:m,onChange:r=>{const n=r.target.value;p(n),null==t||t(n),g(!0)},onFocus:()=>{null==o||o(),v&&v.length>0&&g(!0)}}),m&&r("button",{type:"button",className:"vtx-admin-header-search-clear",onClick:()=>{p(""),null==t||t("")},"aria-label":"Clear search",children:r(Yr,{})})]}),h&&v&&v.length>0&&r("div",{className:"vtx-admin-header-search-suggestions",children:v.map(e=>n("button",{type:"button",className:"vtx-admin-header-search-suggestion",onClick:()=>{var r;null===(r=e.onClick)||void 0===r||r.call(e),g(!1)},children:[e.icon&&r("span",{className:"vtx-admin-header-search-suggestion-icon",children:e.icon}),n("div",{className:"vtx-admin-header-search-suggestion-content",children:[r("span",{className:"vtx-admin-header-search-suggestion-label",children:e.label}),e.category&&r("span",{className:"vtx-admin-header-search-suggestion-category",children:e.category})]})]},e.id))})]})},re=({notifications:t,onNotificationClick:a,onMarkAllAsRead:o,onClearAll:i,onViewAll:l,onClose:d,maxNotifications:c=5})=>{const s=t.filter(r=>!r.read).length,v=t.slice(0,c);return n("div",{className:"vtx-admin-header-notifications-panel",children:[n("div",{className:"vtx-admin-header-notifications-header",children:[n("div",{className:"vtx-admin-header-notifications-header-title",children:[r(_n,{variant:"subtitle2",noMargin:!0,style:{fontWeight:600},children:"Notifications"}),s>0&&r(Zn,{variant:"primary",size:"sm",style:{marginLeft:"8px"},children:s})]}),n("div",{className:"vtx-admin-header-notifications-header-actions",children:[s>0&&o&&r("button",{className:"vtx-admin-header-notifications-action-btn",onClick:o,title:"Mark all as read",children:"Mark all read"}),t.length>0&&i&&r("button",{className:"vtx-admin-header-notifications-action-btn vtx-admin-header-notifications-action-btn--danger",onClick:i,title:"Clear all",children:"Clear"})]})]}),r("div",{className:"vtx-admin-header-notifications-list",children:0===t.length?n("div",{className:"vtx-admin-header-notifications-empty",children:[r("div",{style:{fontSize:"48px",opacity:.3},children:r(_r,{})}),r(_n,{variant:"body2",noMargin:!0,style:{marginTop:"12px",color:"var(--vtx-color-neutral-500)"},children:"No notifications"})]}):r(e,{children:v.map(e=>{const t=e.href?"a":"button";return n(t,{className:`vtx-admin-header-notification-item ${e.read?"":"vtx-admin-header-notification-item--unread"} ${e.type?`vtx-admin-header-notification-item--${e.type}`:""}`,onClick:()=>(r=>{null==a||a(r),d()})(e),href:e.href,type:e.href?void 0:"button",children:[(e.icon||e.avatar)&&r("div",{className:"vtx-admin-header-notification-icon",children:e.avatar?r(Kn,{src:e.avatar,size:"sm",alt:"Notification"}):e.icon}),n("div",{className:"vtx-admin-header-notification-content",children:[r(_n,{variant:"body2",noMargin:!0,style:{fontWeight:e.read?400:600},children:e.title}),e.description&&r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-600)",marginTop:"2px"},children:e.description}),r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-500)",marginTop:"4px"},children:e.time})]}),!e.read&&r("div",{className:"vtx-admin-header-notification-dot"})]},e.id)})})}),t.length>c&&l&&r("div",{className:"vtx-admin-header-notifications-footer",children:n("button",{className:"vtx-admin-header-notifications-view-all",onClick:()=>{l(),d()},children:["View all ",t.length," notifications"]})})]})},ne=({items:e,onClose:t})=>r("div",{className:"vtx-admin-header-user-dropdown",children:e.map((e,o)=>{const i=e.href?"a":"button";return n(a.Fragment,{children:[n(i,{className:`vtx-admin-header-user-menu-item ${e.variant?`vtx-admin-header-user-menu-item--${e.variant}`:""} ${e.disabled?"vtx-admin-header-user-menu-item--disabled":""}`,onClick:()=>(r=>{var n;r.disabled||(null===(n=r.onClick)||void 0===n||n.call(r),t())})(e),href:e.href,type:e.href?void 0:"button",disabled:e.disabled,children:[e.icon&&r("span",{className:"vtx-admin-header-user-menu-icon",children:e.icon}),r("span",{className:"vtx-admin-header-user-menu-label",children:e.label}),e.badge&&r(Zn,{size:"sm",className:"vtx-admin-header-user-menu-badge",children:e.badge}),e.shortcut&&r("span",{className:"vtx-admin-header-user-menu-shortcut",children:e.shortcut})]}),e.divider&&r("div",{className:"vtx-admin-header-user-menu-divider"})]},o)})}),ee=a.forwardRef(({logo:e,title:t,subtitle:o,onLogoClick:l,onToggleSidebar:s,showToggleButton:v=!0,toggleIcon:x,showSearch:m=!1,searchPlaceholder:p,searchValue:h,onSearchChange:g,onSearchSubmit:u,onSearchFocus:b,searchSuggestions:f,searchLoading:w,searchIcon:y,notifications:k=[],onNotificationClick:N,onMarkAllAsRead:z,onClearAllNotifications:_,onViewAllNotifications:C,showNotifications:S=!0,notificationIcon:M,quickActions:$=[],userName:T,userRole:j,userAvatar:I,userAvatarFallback:A,userMenuItems:D=[],showUserMenu:L=!0,onUserAvatarClick:B,actions:E,leftContent:R,centerContent:F,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]=c(!1),[rr,nr]=c(!1),er=i(null),tr=i(null),ar=k.filter(r=>!r.read).length;d(()=>{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)},[]),d(()=>{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 n("header",{ref:Q,className:or,style:ir,children:[n("div",{className:"vtx-admin-header-container",children:[n("div",{className:"vtx-admin-header-left",children:[v&&s&&r("button",{className:"vtx-admin-header-toggle",onClick:s,"aria-label":"Toggle sidebar",type:"button",children:x||r(Cr,{})}),(e||t)&&n("div",{className:"vtx-admin-header-brand",onClick:l,style:{cursor:l?"pointer":"default"},children:[e&&r("div",{className:"vtx-admin-header-logo",children:e}),t&&n("div",{className:"vtx-admin-header-brand-text",children:[r(_n,{variant:"h6",noMargin:!0,className:"vtx-admin-header-title",children:t}),o&&r(_n,{variant:"caption",noMargin:!0,className:"vtx-admin-header-subtitle",children:o})]})]}),R]}),n("div",{className:"vtx-admin-header-center",children:[m&&r(Jn,{value:h,onChange:g,onSubmit:u,onFocus:b,placeholder:p,loading:w,suggestions:f,icon:y}),F]}),n("div",{className:"vtx-admin-header-right",children:[$.length>0&&r("div",{className:"vtx-admin-header-quick-actions",children:$.map(e=>n("button",{className:"vtx-admin-header-icon-button "+(e.disabled?"vtx-admin-header-icon-button--disabled":""),onClick:e.onClick,title:e.tooltip||e.label,disabled:e.disabled,"aria-label":e.label,type:"button",children:[e.icon,e.badge&&r(Zn,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:e.badge})]},e.id))}),E,O,(S||L)&&r("div",{className:"vtx-admin-header-divider"}),S&&k.length>0&&n("div",{className:"vtx-admin-header-notifications",ref:er,children:[n("button",{className:"vtx-admin-header-icon-button "+(Z?"vtx-admin-header-icon-button--active":""),onClick:()=>J(!Z),"aria-label":"Notifications",type:"button",children:[M||r(_r,{}),ar>0&&r(Zn,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:ar>9?"9+":ar})]}),Z&&r(re,{notifications:k,onNotificationClick:N,onMarkAllAsRead:z,onClearAll:_,onViewAll:C,onClose:()=>J(!1),maxNotifications:G})]}),L&&T&&n("div",{className:"vtx-admin-header-user",ref:tr,children:[n("button",{className:"vtx-admin-header-user-button "+(rr?"vtx-admin-header-user-button--active":""),onClick:()=>{D.length>0?nr(!rr):null==B||B()},"aria-label":"User menu",type:"button",children:[I?r(Kn,{src:I,alt:T,size:"sm",className:"vtx-admin-header-user-avatar"}):r("div",{className:"vtx-admin-header-user-avatar vtx-admin-header-user-avatar-fallback",children:A||T.charAt(0).toUpperCase()}),n("div",{className:"vtx-admin-header-user-info",children:[r(_n,{variant:"body2",noMargin:!0,className:"vtx-admin-header-user-name",children:T}),j&&r(_n,{variant:"caption",noMargin:!0,className:"vtx-admin-header-user-role",children:j})]}),D.length>0&&r(kr,{})]}),rr&&D.length>0&&r(ne,{items:D,onClose:()=>nr(!1)})]})]})]}),X&&K.length>0&&r("div",{className:"vtx-admin-header-breadcrumbs",children:K.map((e,t)=>n(a.Fragment,{children:[t>0&&r("span",{className:"vtx-admin-header-breadcrumb-separator",children:"/"}),e.href||e.onClick?r("a",{href:e.href,onClick:r=>{e.onClick&&(r.preventDefault(),e.onClick())},className:"vtx-admin-header-breadcrumb",children:e.label}):r("span",{className:"vtx-admin-header-breadcrumb vtx-admin-header-breadcrumb--current",children:e.label})]},t))})]})});ee.displayName="AdminHeader";const te=vr(ee);xr("/* Link Component Styles */\r\n\r\n.vtx-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  font-family: var(--vtx-font-family-sans);\r\n  text-decoration: none;\r\n  cursor: pointer;\r\n  transition: color var(--vtx-transition-base), opacity var(--vtx-transition-base);\r\n  position: relative;\r\n}\r\n\r\n.vtx-link:hover {\r\n  opacity: 0.8;\r\n  text-decoration: underline;\r\n  text-underline-offset: 2px;\r\n}\r\n\r\n.vtx-link:active {\r\n  opacity: 0.6;\r\n}\r\n\r\n.vtx-link:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: 2px;\r\n}\r\n\r\n/* Disabled state */\r\n.vtx-link--disabled {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n  pointer-events: none;\r\n}\r\n\r\n/* No underline variant */\r\n.vtx-link--no-underline {\r\n  text-decoration: none;\r\n}\r\n\r\n.vtx-link--no-underline:hover {\r\n  text-decoration: underline;\r\n}\r\n\r\n/* Color variants */\r\n.vtx-link--primary {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-link--primary:hover {\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-link--secondary {\r\n  color: var(--vtx-color-secondary-600);\r\n}\r\n\r\n.vtx-link--secondary:hover {\r\n  color: var(--vtx-color-secondary-700);\r\n}\r\n\r\n.vtx-link--neutral {\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-link--neutral:hover {\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-link--inherit {\r\n  color: inherit;\r\n}\r\n\r\n/* Text variants (sizes) */\r\n.vtx-link--h1 {\r\n  font-size: var(--vtx-font-size-4xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h2 {\r\n  font-size: var(--vtx-font-size-3xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h3 {\r\n  font-size: var(--vtx-font-size-2xl);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h4 {\r\n  font-size: var(--vtx-font-size-xl);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-snug);\r\n}\r\n\r\n.vtx-link--h5 {\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-snug);\r\n}\r\n\r\n.vtx-link--h6 {\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-link--body1 {\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n}\r\n\r\n.vtx-link--body2 {\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n}\r\n\r\n.vtx-link--caption {\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-link--small {\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n/* Icons */\r\n.vtx-link__icon-left,\r\n.vtx-link__icon-right {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-link__content {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n/* Dark mode support */\r\n[data-theme='dark'] .vtx-link--primary {\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--primary:hover {\r\n  color: var(--vtx-color-primary-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--secondary {\r\n  color: var(--vtx-color-secondary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--secondary:hover {\r\n  color: var(--vtx-color-secondary-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--neutral {\r\n  color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--neutral:hover {\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n/* Reduced motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-link {\r\n    transition: none;\r\n  }\r\n}\r\n");const ae=a.forwardRef(({children:t,href:a,component:o,componentProps:i={},variant:l="body1",noUnderline:d=!1,disabled:c=!1,color:s="primary",leftIcon:v,rightIcon:x,external:m=!1,className:p="",target:h,rel:g,...u},b)=>{const f=["vtx-link",`vtx-link--${l}`,`vtx-link--${s}`,d&&"vtx-link--no-underline",c&&"vtx-link--disabled",p].filter(Boolean).join(" "),w=n(e,{children:[v&&r("span",{className:"vtx-link__icon-left",children:v}),r("span",{className:"vtx-link__content",children:t}),x&&r("span",{className:"vtx-link__icon-right",children:x})]});if(o){return r(o,{ref:b,className:f,"aria-disabled":c,...i,...u,children:w})}return r("a",{ref:b,href:c?void 0:a,target:m?"_blank":h,rel:m?"noopener noreferrer":g,className:f,"aria-disabled":c,onClick:c?r=>r.preventDefault():u.onClick,...u,children:w})});ae.displayName="Link";const oe=vr(ae);xr("/* Breadcrumb Component Styles */\r\n\r\n.vtx-breadcrumb {\r\n  display: block;\r\n}\r\n\r\n.vtx-breadcrumb-list {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n/* Responsive display */\r\n.vtx-breadcrumb-list--mobile {\r\n  display: none;\r\n}\r\n\r\n.vtx-breadcrumb-list--desktop {\r\n  display: flex;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-breadcrumb-list--desktop {\r\n    display: none;\r\n  }\r\n  \r\n  .vtx-breadcrumb-list--mobile {\r\n    display: flex;\r\n  }\r\n}\r\n\r\n/* Breadcrumb Item */\r\n.vtx-breadcrumb-item {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-breadcrumb-item-content,\r\n.vtx-breadcrumb-item-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-0-5);\r\n  color: var(--vtx-color-neutral-600);\r\n  text-decoration: none !important;\r\n  transition: color var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-breadcrumb-item-link {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-breadcrumb-item-link:hover {\r\n  color: var(--vtx-color-primary-600);\r\n  text-decoration: none !important;\r\n}\r\n\r\n.vtx-breadcrumb-item-link:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: 2px;\r\n}\r\n\r\n/* Active item */\r\n.vtx-breadcrumb-item--active .vtx-breadcrumb-item-content {\r\n  color: var(--vtx-color-neutral-900);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n/* Ellipsis */\r\n.vtx-breadcrumb-item--ellipsis .vtx-breadcrumb-item-content {\r\n  color: var(--vtx-color-neutral-500);\r\n  cursor: default;\r\n  user-select: none;\r\n}\r\n\r\n/* Icon */\r\n.vtx-breadcrumb-item-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  line-height: 1;\r\n  margin-right: 5px;\r\n}\r\n\r\n/* Label - ensure proper alignment with Text component */\r\n.vtx-breadcrumb-item-label {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  line-height: 1 !important;\r\n  margin: 0 !important;\r\n}\r\n\r\n/* Separator */\r\n.vtx-breadcrumb-separator {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-color-neutral-400);\r\n  user-select: none;\r\n  line-height: 1;\r\n}\r\n");const ie=a.forwardRef(({items:t,separator:o=r($r,{size:16}),linkComponent:i,maxItems:l,size:d,className:c="",separatorClassName:s=""},v)=>{const{theme:x}=or(),m=d||x.defaultSize,p=a.useMemo(()=>{if(!l||t.length<=l)return t;return[t[0],{label:"...",active:!1},...t.slice(-(l-2))]},[t,l]),h=a.useMemo(()=>{if(t.length<=2)return t;return[t[0],{label:"...",active:!1},t[t.length-1]]},[t]),g=["vtx-breadcrumb",`vtx-breadcrumb--${m}`,c].filter(Boolean).join(" "),u=["vtx-breadcrumb-separator",s].filter(Boolean).join(" "),b=(t,a)=>{const o=a===p.length-1,l=t.active||o,d="..."===t.label,c=["vtx-breadcrumb-item",l&&"vtx-breadcrumb-item--active",d&&"vtx-breadcrumb-item--ellipsis"].filter(Boolean).join(" "),s=n(e,{children:[t.icon&&r("span",{className:"vtx-breadcrumb-item-icon",children:t.icon}),t.label&&r(_n,{as:"span",variant:"body2",className:"vtx-breadcrumb-item-label",children:t.label})]});if(d)return r("li",{className:c,children:r("span",{className:"vtx-breadcrumb-item-content",children:t.label})},a);if(l)return r("li",{className:c,"aria-current":"page",children:r("span",{className:"vtx-breadcrumb-item-content",children:s})},a);const v=t.href||t.linkProps;return r("li",v?{className:c,children:r(oe,{href:t.href,component:i,componentProps:t.linkProps,className:"vtx-breadcrumb-item-link",color:"inherit",children:s})}:{className:c,children:r("span",{className:"vtx-breadcrumb-item-content",children:s})},a)};return n("nav",{ref:v,className:g,"aria-label":"Breadcrumb",children:[r("ol",{className:"vtx-breadcrumb-list vtx-breadcrumb-list--desktop",children:p.map((e,t)=>n(a.Fragment,{children:[b(e,t),t<p.length-1&&r("li",{className:u,"aria-hidden":"true",children:o})]},t))}),r("ol",{className:"vtx-breadcrumb-list vtx-breadcrumb-list--mobile",children:h.map((e,t)=>n(a.Fragment,{children:[b(e,t),t<h.length-1&&r("li",{className:u,"aria-hidden":"true",children:o})]},t))})]})});ie.displayName="Breadcrumb";const le=vr(ie);xr(".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 de=a.forwardRef(({children:e,variant:t="elevated",size:a,noPadding:o=!1,padding:i,hoverable:l=!1,clickable:d=!1,className:c="",header:s,footer:v,divider:x=!1,style:m,onClick:p,tabIndex:h,...g},u)=>{const{theme:b}=or(),f=["vtx-card",`vtx-card--${t}`,`vtx-card--${a||(null==b?void 0:b.defaultSize)||"md"}`,l?"vtx-card--hoverable":"",d?"vtx-card--clickable":"",o&&!i?"vtx-card--no-padding":"",c].filter(Boolean).join(" "),w={...m||{},...i?{"--vtx-card-padding":i}:{}};return n("div",{ref:u,className:f,style:w,onClick:p,tabIndex:d?"number"==typeof h?h:0:h,...g,children:[s&&r("div",{className:"vtx-card-header"+(x?" vtx-card-header--divider":""),children:s}),r("div",{className:"vtx-card-content",children:e}),v&&r("div",{className:"vtx-card-footer"+(x?" vtx-card-footer--divider":""),children:v})]})});de.displayName="Card";const ce=vr(de);xr('/* ==========================================\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/* Empty State with Icon & Description */\r\n.vertex-datagrid-empty-state {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 64px 24px;\r\n}\r\n\r\n.vertex-datagrid-empty-state-icon {\r\n  font-size: 48px;\r\n  color: rgba(0, 0, 0, 0.26);\r\n  opacity: 0.6;\r\n}\r\n\r\n.vertex-datagrid-empty-state-message {\r\n  font-size: 1.125rem;\r\n  font-weight: 600;\r\n  color: rgba(0, 0, 0, 0.6);\r\n}\r\n\r\n.vertex-datagrid-empty-state-description {\r\n  font-size: 0.875rem;\r\n  color: rgba(0, 0, 0, 0.38);\r\n  max-width: 400px;\r\n  line-height: 1.5;\r\n  text-align: center;\r\n}\r\n\r\n/* Skeleton Loader */\r\n.vertex-datagrid-row--skeleton {\r\n  animation: vertex-pulse 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vertex-datagrid-skeleton {\r\n  height: 16px;\r\n  background: linear-gradient(\r\n    90deg,\r\n    rgba(224, 224, 224, 1) 25%,\r\n    rgba(245, 245, 245, 1) 50%,\r\n    rgba(224, 224, 224, 1) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n  border-radius: 4px;\r\n  animation: vertex-skeleton-shimmer 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vertex-datagrid-skeleton--text {\r\n  width: 100%;\r\n  max-width: 180px;\r\n}\r\n\r\n.vertex-datagrid-skeleton--checkbox {\r\n  width: 16px;\r\n  height: 16px;\r\n  border-radius: 2px;\r\n}\r\n\r\n@keyframes vertex-skeleton-shimmer {\r\n  0% {\r\n    background-position: 200% 0;\r\n  }\r\n  100% {\r\n    background-position: -200% 0;\r\n  }\r\n}\r\n\r\n@keyframes vertex-pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.7;\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/* ==========================================\r\n   Dark Mode Support\r\n   ========================================== */\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-container {\r\n  background: var(--vtx-color-neutral-800);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-icon {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-message {\r\n  color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-description {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-skeleton {\r\n  background: linear-gradient(\r\n    90deg,\r\n    var(--vtx-color-neutral-700) 25%,\r\n    var(--vtx-color-neutral-600) 50%,\r\n    var(--vtx-color-neutral-700) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n}');const se=(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()}]}},ve=({column:t,anchorEl:a,onClose:o,onSort:l,onFilter:c,currentSort:s,hasFilter:v})=>{const x=i(null);if(d(()=>{const r=r=>{x.current&&!x.current.contains(r.target)&&a&&!a.contains(r.target)&&o()};return a&&document.addEventListener("mousedown",r),()=>{document.removeEventListener("mousedown",r)}},[a,o]),!a)return null;const m=a.getBoundingClientRect();return n("div",{ref:x,className:"vertex-datagrid-column-menu",style:{position:"fixed",top:m.bottom+4,left:m.left,zIndex:1300},children:[t.sortable&&n(e,{children:[n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{l("asc"),o()},children:[r(Kr,{size:16}),r("span",{children:"Sort ascending"}),"asc"===s&&r("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{l("desc"),o()},children:[r(Qr,{size:16}),r("span",{children:"Sort descending"}),"desc"===s&&r("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),s&&n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{l(null),o()},children:[r("span",{style:{width:16}}),r("span",{children:"Unsort"})]}),t.filterable&&r("div",{className:"vertex-datagrid-column-menu-divider"})]}),t.filterable&&n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{c(),o()},children:[r("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r("span",{children:v?"Edit filter":"Filter"}),v&&r("span",{className:"vertex-datagrid-menu-badge",children:"●"})]})]})},xe=({columns:t,filterModel:a,onFilterModelChange:o,onClose:l,targetColumn:c})=>{const s=t.filter(r=>!1!==r.filterable),v=i(null);d(()=>{const r=r=>{v.current&&!v.current.contains(r.target)&&l()};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[l]),d(()=>{c&&0===a.items.length&&x(c)},[c]);const x=r=>{var n,e;const i=r||(null===(n=s[0])||void 0===n?void 0:n.field)||"",l=t.find(r=>r.field===i),d=(null==l?void 0:l.filterOperators)||se(null==l?void 0:l.type),c={id:Date.now(),field:i,operator:(null===(e=d[0])||void 0===e?void 0:e.value)||"contains",value:""};o({...a,items:[...a.items,c]})},m=(r,n)=>{var e;const i=[...a.items],l=i[r];if(i[r]={...l,...n},n.field&&n.field!==l.field){const a=t.find(r=>r.field===n.field),o=(null==a?void 0:a.filterOperators)||se(null==a?void 0:a.type);i[r].operator=(null===(e=o[0])||void 0===e?void 0:e.value)||"contains"}o({...a,items:i})},p=()=>{o({...a,logicOperator:"and"===a.logicOperator?"or":"and"})};return r("div",{className:"vertex-datagrid-filter-panel-overlay",children:n("div",{ref:v,className:"vertex-datagrid-filter-panel",children:[n("div",{className:"vertex-datagrid-filter-panel-header",children:[r(_n,{weight:"semibold",size:"sm",children:"Filters"}),r("button",{className:"vertex-datagrid-filter-close",onClick:l,children:n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),r("div",{className:"vertex-datagrid-filter-panel-body",children:0===a.items.length?n("div",{className:"vertex-datagrid-filter-empty",children:[r("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r(_n,{size:"sm",color:"secondary",children:"No filters applied"}),r(pr,{variant:"outline",size:"sm",onClick:()=>x(),children:"Add filter"})]}):n(e,{children:[a.items.map((e,i)=>{var l;const d=t.find(r=>r.field===e.field),c=(null==d?void 0:d.filterOperators)||se(null==d?void 0:d.type),v=!["isEmpty","isNotEmpty"].includes(e.operator);return n("div",{className:"vertex-datagrid-filter-row",children:[i>0&&r("button",{className:"vertex-datagrid-filter-logic-btn",onClick:p,title:"Toggle AND/OR",children:(null===(l=a.logicOperator)||void 0===l?void 0:l.toUpperCase())||"OR"}),n("div",{className:"vertex-datagrid-filter-controls",children:[r("select",{value:e.field,onChange:r=>m(i,{field:r.target.value}),className:"vertex-datagrid-filter-select",children:s.map(n=>r("option",{value:n.field,children:n.headerName},n.field))}),r("select",{value:e.operator,onChange:r=>m(i,{operator:r.target.value}),className:"vertex-datagrid-filter-select",children:c.map(n=>r("option",{value:n.value,children:n.label},n.value))}),v&&r(cn,{value:e.value||"",onChange:r=>m(i,{value:r.target.value}),placeholder:"Value",size:"sm"}),r("button",{className:"vertex-datagrid-filter-remove",onClick:()=>(r=>{const n=a.items.filter((n,e)=>e!==r);o({...a,items:n})})(i),title:"Remove filter",children:n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]})]},e.id||i)}),r("div",{className:"vertex-datagrid-filter-actions",children:r(pr,{variant:"ghost",size:"sm",onClick:()=>x(),children:"+ Add filter"})})]})}),a.items.length>0&&r("div",{className:"vertex-datagrid-filter-panel-footer",children:r(pr,{variant:"ghost",size:"sm",onClick:()=>o({items:[],logicOperator:"or"}),children:"Clear all"})})]})})},me=({columns:t,rows:a,getRowId:o=(r,n)=>{var e;return null!==(e=r.id)&&void 0!==e?e:n},filterModel:i,onFilterModelChange:l,initialState:d,disableColumnFilter:s=!1,ignoreDiacritics:v=!1,sortModel:m,onSortModelChange:p,checkboxSelection:h=!1,rowSelectionModel:u,onRowSelectionModelChange:b,pagination:f=!0,pageSize:w=10,pageSizeOptions:y=[5,10,25,50,100],loading:k=!1,skeletonLoader:N=!1,skeletonRows:z=5,loadingContent:_,emptyStateIcon:C,emptyStateTitle:S="No data available",emptyStateDescription:M,autoHeight:$=!1,density:T="standard",disableColumnMenu:j=!1,hideFooter:I=!1,size:A,className:D,...L})=>{var B,E;const{theme:R}=or(),F=A||R.defaultSize,[O,W]=c((null===(B=null==d?void 0:d.filter)||void 0===B?void 0:B.filterModel)||{items:[],logicOperator:"or"}),[P,V]=c([]),[H,Y]=c([]),[q,U]=c(0),[G,X]=c(w),[K,Q]=c(!1),[Z,J]=c(null),[rr,nr]=c(),er=null!=i?i:O,tr=null!=m?m:P,ar=null!=u?u:H,ir=x(r=>{l?l(r):W(r)},[l]),lr=x(r=>{p?p(r):V(r)},[p]),dr=x(r=>{b?b(r):Y(r)},[b]),cr=g(()=>s||0===er.items.length?a:a.filter(r=>{const n=er.items.map(n=>{const e=t.find(r=>r.field===n.field);if(!e)return!0;const a=e.valueGetter?e.valueGetter(r):r[n.field],o=(e.filterOperators||se(e.type)).find(r=>r.value===n.operator);if(!o)return!0;return o.getApplyFilterFn(n)(a)});return"and"===er.logicOperator?n.every(r=>r):n.some(r=>r)}),[a,er,t,s]),sr=g(()=>{if(0===tr.length)return cr;const r=[...cr],n=tr[0],e=t.find(r=>r.field===n.field);return e?(r.sort((r,t)=>{const a=e.valueGetter?e.valueGetter(r):r[n.field],o=e.valueGetter?e.valueGetter(t):t[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"===e.type?Number(a)-Number(o):"date"===e.type?new Date(a).getTime()-new Date(o).getTime():String(a).localeCompare(String(o)),"asc"===n.sort?i:-i}),r):r},[cr,tr,t]),vr=g(()=>{if(!f)return sr;const r=q*G,n=r+G;return sr.slice(r,n)},[sr,q,G,f]),xr=x((r,n)=>{if(!r.sortable)return;let e;e=null===n?[]:[{field:r.field,sort:n}],lr(e)},[lr]),mr=x(r=>{const n=ar.includes(r)?ar.filter(n=>n!==r):[...ar,r];dr(n)},[ar,dr]),pr=x(()=>{if(ar.length===vr.length)dr([]);else{const r=vr.map((r,n)=>o(r,n));dr(r)}},[ar,vr,dr,o]),hr=Math.ceil(sr.length/G),ur=er.items.length>0,br=(r,n,e=!1)=>{if(!r.pinned)return{};const a={position:"sticky",zIndex:e?101:100,background:e?"#fafafa":"inherit"};if("left"===r.pinned){let r=h?58:0;for(let e=0;e<n;e++)"left"===t[e].pinned&&(r+=t[e].width||150);a.left=r}else if("right"===r.pinned){let n=0;for(let e=t.indexOf(r)+1;e<t.length;e++)"right"===t[e].pinned&&(n+=t[e].width||150);a.right=n}return a};return n("div",{className:`vertex-datagrid ${`vertex-datagrid--${T}`} ${`vertex-datagrid--${F}`} ${$?"vertex-datagrid--auto-height":""} ${D||""}`,...L,children:[r("div",{className:"vertex-datagrid-container",children:n("table",{className:"vertex-datagrid-table",children:[r("thead",{className:"vertex-datagrid-thead",children:n("tr",{children:[h&&r("th",{className:"vertex-datagrid-th vertex-datagrid-checkbox-cell",children:r(gr,{checked:ar.length===vr.length&&vr.length>0,indeterminate:ar.length>0&&ar.length<vr.length,onChange:pr})}),t.map((e,t)=>{const a=tr.find(r=>r.field===e.field),o=!!a,i=null==a?void 0:a.sort,l=er.items.some(r=>r.field===e.field),d=br(e,t,!0);return r("th",{className:`vertex-datagrid-th ${e.sortable?"vertex-datagrid-th--sortable":""} ${e.pinned?`vertex-datagrid-th--pinned-${e.pinned}`:""}`,style:{width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth,textAlign:e.headerAlign||e.align||"left",flex:e.flex,...d},children:n("div",{className:"vertex-datagrid-th-content",children:[n("div",{className:"vertex-datagrid-th-label",onClick:()=>e.sortable&&xr(e,o?"asc"===i?"desc":null:"asc"),children:[r("span",{className:"vertex-datagrid-th-text",children:e.headerName}),e.sortable&&r("div",{className:"vertex-datagrid-sort-icon "+(o?"vertex-datagrid-sort-icon--active":""),children:o?r("asc"===i?Kr:Qr,{size:18}):r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",opacity:"0.4",children:r("path",{d:"M12 5v14M5 12l7 7 7-7"})})})]}),!j&&(e.sortable||e.filterable)&&n("button",{className:"vertex-datagrid-column-menu-btn "+(l?"vertex-datagrid-column-menu-btn--filtered":""),onClick:r=>{r.stopPropagation(),J({column:e,anchorEl:r.currentTarget})},title:"Column options",children:[n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"currentColor",children:[r("circle",{cx:"12",cy:"5",r:"2"}),r("circle",{cx:"12",cy:"12",r:"2"}),r("circle",{cx:"12",cy:"19",r:"2"})]}),l&&r("span",{className:"vertex-datagrid-filter-badge"})]})]})},e.field)})]})}),r("tbody",{className:"vertex-datagrid-tbody",children:k?N?Array.from({length:z}).map((e,a)=>n("tr",{className:"vertex-datagrid-row vertex-datagrid-row--skeleton",children:[h&&r("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r("div",{className:"vertex-datagrid-skeleton vertex-datagrid-skeleton--checkbox"})}),t.map(n=>r("td",{className:"vertex-datagrid-td",children:r("div",{className:"vertex-datagrid-skeleton vertex-datagrid-skeleton--text"})},n.field))]},`skeleton-${a}`)):r("tr",{children:r("td",{colSpan:t.length+(h?1:0),className:"vertex-datagrid-loading",children:r("div",{className:"vertex-datagrid-loading-content",children:_||n(e,{children:[r("div",{className:"vertex-datagrid-spinner"}),r(_n,{size:"sm",color:"secondary",children:"Loading..."})]})})})}):0===vr.length?r("tr",{children:r("td",{colSpan:t.length+(h?1:0),className:"vertex-datagrid-empty",children:n("div",C||M?{className:"vertex-datagrid-empty-state",children:[C&&r("div",{className:"vertex-datagrid-empty-state-icon",children:C}),r("div",{className:"vertex-datagrid-empty-state-message",children:S}),M&&r("div",{className:"vertex-datagrid-empty-state-description",children:M})]}:{className:"vertex-datagrid-empty-content",children:[n("svg",{width:"64",height:"64",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1",opacity:"0.3",children:[r("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2"}),r("line",{x1:"3",y1:"9",x2:"21",y2:"9"}),r("line",{x1:"9",y1:"21",x2:"9",y2:"9"})]}),r(_n,{size:"sm",color:"secondary",children:S})]})})}):vr.map((e,a)=>{const i=o(e,a),l=ar.includes(i);return n("tr",{className:"vertex-datagrid-row "+(l?"vertex-datagrid-row--selected":""),children:[h&&r("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r(gr,{checked:l,onChange:()=>mr(i)})}),t.map((n,t)=>{const a=n.valueGetter?n.valueGetter(e):e[n.field],o=n.valueFormatter?n.valueFormatter(a):a,i=n.renderCell?n.renderCell({row:e,value:a,field:n.field}):o,l=br(n,t,!1);return r("td",{className:"vertex-datagrid-td "+(n.pinned?`vertex-datagrid-td--pinned-${n.pinned}`:""),style:{textAlign:n.align||"left",...l},children:i},n.field)})]},i)})})]})}),!I&&f&&n("div",{className:"vertex-datagrid-footer",children:[r("div",{className:"vertex-datagrid-footer-left",children:ur&&n("button",{className:"vertex-datagrid-filter-chip",onClick:()=>Q(!0),children:[r("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),n("span",{children:[er.items.length," ",1===er.items.length?"filter":"filters"]})]})}),r("div",{className:"vertex-datagrid-footer-center",children:r(_n,{size:"sm",color:"secondary",children:0===sr.length?"0 rows":`${q*G+1}–${Math.min((q+1)*G,sr.length)} of ${sr.length}`})}),n("div",{className:"vertex-datagrid-footer-right",children:[n("label",{className:"vertex-datagrid-pagesize-label",children:[r(_n,{size:"sm",color:"secondary",children:"Rows per page:"}),r("select",{value:G,onChange:r=>{X(Number(r.target.value)),U(0)},className:"vertex-datagrid-pagesize-select",children:y.map(n=>r("option",{value:n,children:n},n))})]}),n("div",{className:"vertex-datagrid-pagination",children:[r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(0),disabled:0===q,title:"First page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M11 17l-5-5 5-5M18 17l-5-5 5-5"})})}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(r=>Math.max(0,r-1)),disabled:0===q,title:"Previous page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M15 18l-6-6 6-6"})})}),n(_n,{size:"sm",color:"secondary",children:["Page ",q+1," of ",hr||1]}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(r=>Math.min(hr-1,r+1)),disabled:q>=hr-1,title:"Next page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M9 18l6-6-6-6"})})}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(hr-1),disabled:q>=hr-1,title:"Last page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M13 17l5-5-5-5M6 17l5-5-5-5"})})})]})]})]}),Z&&r(ve,{column:Z.column,anchorEl:Z.anchorEl,onClose:()=>J(null),onSort:r=>xr(Z.column,r),onFilter:()=>{nr(Z.column.field),Q(!0)},currentSort:null===(E=tr.find(r=>r.field===Z.column.field))||void 0===E?void 0:E.sort,hasFilter:er.items.some(r=>r.field===Z.column.field)}),K&&r(xe,{columns:t,filterModel:er,onFilterModelChange:ir,onClose:()=>{Q(!1),nr(void 0)},targetColumn:rr})]})};me.displayName="DataGrid";const pe=vr(me);xr("/* 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 he=a.forwardRef(({textAlign:n="center",orientation:e="horizontal",variant:t="fullWidth",light:a=!1,flexItem:o=!1,children:i,component:l,className:d="",role:c,...s},v)=>{const x=l||(i||"vertical"===e?"div":"hr"),m=c||("hr"!==x?"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(" ");return r(x,{ref:v,className:p,role:m,..."vertical"===e&&"hr"!==x?{"aria-orientation":"vertical"}:{},...s,children:i&&r("span",{className:"vtx-divider-wrapper",children:i})})});he.displayName="Divider";const ge=vr(he);xr("/* 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 ue=a.forwardRef(({notifications:e,onNotificationClick:t,onMarkAllAsRead:a,onClose:o},i)=>{const l=e.filter(r=>!r.read).length;return n("div",{ref:i,className:"vtx-header-notifications-panel",children:[r("div",{className:"vtx-header-notifications-header",children:n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"subtitle2",noMargin:!0,children:"Notifications"}),l>0&&a&&r("button",{className:"vtx-header-notifications-mark-read",onClick:()=>{a(),o()},children:"Mark all as read"})]})}),r("div",{className:"vtx-header-notifications-list",children:0===e.length?n("div",{className:"vtx-header-notifications-empty",children:[r(_r,{}),r(_n,{variant:"body2",color:"neutral.500",noMargin:!0,children:"No notifications"})]}):e.map(e=>n("div",{className:`vtx-header-notification-item ${e.read?"":"vtx-header-notification-item--unread"} ${e.type?`vtx-header-notification-item--${e.type}`:""}`,onClick:()=>{null==t||t(e),o()},children:[e.icon&&r("div",{className:"vtx-header-notification-icon",children:e.icon}),n("div",{className:"vtx-header-notification-content",children:[r(_n,{variant:"body2",noMargin:!0,style:{fontWeight:e.read?400:600},children:e.title}),e.description&&r(_n,{variant:"caption",color:"neutral.600",noMargin:!0,children:e.description}),r(_n,{variant:"caption",color:"neutral.500",noMargin:!0,style:{marginTop:"4px"},children:e.time})]}),!e.read&&r("div",{className:"vtx-header-notification-dot"})]},e.id))})]})});ue.displayName="NotificationPanel";const be=a.forwardRef(({logo:e,title:t,onToggleSidebar:a,showToggle:o=!0,notifications:l=[],onNotificationClick:s,onMarkAllAsRead:v,userName:x,userSubtitle:m,userAvatar:p,userMenuItems:h=[],actions:g,className:u="",sticky:b=!0},f)=>{const[w,y]=c(!1),[k,N]=c(!1),z=i(null),_=i(null),C=i(null),S=l.filter(r=>!r.read).length;d(()=>{const r=r=>{z.current&&!z.current.contains(r.target)&&C.current&&!C.current.contains(r.target)&&y(!1),_.current&&!_.current.contains(r.target)&&N(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);const M=["vtx-header",b&&"vtx-header--sticky",u].filter(Boolean).join(" ");return n("header",{ref:f,className:M,children:[n(Nn,{align:"center",gap:16,style:{flex:1},children:[o&&a&&r("button",{className:"vtx-header-toggle",onClick:a,"aria-label":"Toggle sidebar",children:r(Cr,{})}),e&&r("div",{className:"vtx-header-logo",children:e}),t&&r(_n,{variant:"h6",noMargin:!0,className:"vtx-header-title",children:t})]}),g&&r("div",{className:"vtx-header-actions",children:g}),n("div",{className:"vtx-header-right",children:[l&&l.length>0&&n("div",{className:"vtx-header-notifications",ref:z,children:[n("button",{className:"vtx-header-icon-button "+(w?"vtx-header-icon-button--active":""),onClick:()=>y(!w),"aria-label":"Notifications",children:[r(_r,{}),S>0&&r(Zn,{variant:"error",size:"sm",style:{position:"absolute",top:"4px",right:"4px",minWidth:"18px",height:"18px",padding:"0 4px"},children:S>9?"9+":S})]}),w&&r(ue,{ref:C,notifications:l,onNotificationClick:s,onMarkAllAsRead:v,onClose:()=>y(!1)})]}),x&&n("div",{className:"vtx-header-user-menu",ref:_,children:[n("button",{className:"vtx-header-user-button "+(k?"vtx-header-user-button--active":""),onClick:()=>N(!k),"aria-label":"User menu",children:[r(Kn,{src:p,alt:x,size:"sm"}),!p&&r("span",{className:"vtx-header-avatar-fallback",children:x.split(" ").map(r=>r[0]).join("").slice(0,2)}),n("div",{className:"vtx-header-user-info",children:[r(_n,{variant:"body2",noMargin:!0,style:{fontWeight:600},children:x}),m&&r(_n,{variant:"caption",color:"neutral.600",noMargin:!0,children:m})]}),r(kr,{})]}),k&&r("div",{className:"vtx-header-user-dropdown",children:r($n,{items:h,responsive:!1})})]})]})]})});be.displayName="Header";const fe=vr(be);xr("/* ===================================\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 we=({isOpen:n})=>r("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("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),ye=a.forwardRef(({label:t,onClick:a,icon:o,disabled:i=!1,active:l=!1,items:d,badge:s,href:v,collapsed:x=!1,level:m=0},p)=>{const[h,g]=c(!1),u=d&&d.length>0,b=r(e,{children:n(Nn,{align:"center",gap:x?0:12,style:{flex:1,minWidth:0},children:[o&&r("span",{className:"vtx-sidemenu-item-icon",children:o}),!x&&n(e,{children:[r(_n,{variant:"body2",noMargin:!0,style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t}),s&&r("span",{className:"vtx-sidemenu-item-badge",children:s}),u&&r(we,{isOpen:h})]})]})}),f=["vtx-sidemenu-item",l&&"vtx-sidemenu-item--active",i&&"vtx-sidemenu-item--disabled",u&&"vtx-sidemenu-item--has-submenu",x&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" ");return n(e,{children:[r(v?"a":"div",{ref:p,className:f,onClick:r=>{i||(u?(r.preventDefault(),g(!h)):a&&(r.preventDefault(),a()))},onKeyDown:r=>{i||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),u?g(!h):null==a||a())},role:"menuitem",tabIndex:i?-1:0,"aria-disabled":i,"aria-expanded":u?h:void 0,href:v,title:x?t:void 0,"data-label":x?t:void 0,children:b}),u&&h&&!x&&r("div",{className:"vtx-sidemenu-submenu",children:d.map((n,e)=>r(ye,{...n,collapsed:x,level:m+1},e))})]})});ye.displayName="SideMenuItem";const ke=a.forwardRef(({items:e,collapsed:t=!1,onCollapseToggle:a,className:o="",width:i="260px",collapsedWidth:l="80px",header:d,footer:c,headerPadding:s,footerPadding:v},x)=>{const m=t?"number"==typeof l?`${l}px`:l:"number"==typeof i?`${i}px`:i,p=["vtx-sidemenu",t&&"vtx-sidemenu--collapsed",o].filter(Boolean).join(" ");return n("aside",{ref:x,className:p,style:{width:m},role:"navigation",children:[d&&r("div",{className:"vtx-sidemenu-header",style:s?{padding:"number"==typeof s?`${s}px`:s}:void 0,children:d}),r("div",{className:"vtx-sidemenu-content",children:e.map((n,e)=>r(ye,{...n,collapsed:t},e))}),c&&r("div",{className:"vtx-sidemenu-footer",style:v?{padding:"number"==typeof v?`${v}px`:v}:void 0,children:c})]})});ke.displayName="SideMenu";const Ne=vr(ke);function ze({columns:t,data:o,getRowKey:i,striped:l=!1,hoverable:d=!0,bordered:s=!1,size:v,caption:m,emptyMessage:p="No data available",emptyStateIcon:h,emptyStateDescription:u,loading:b=!1,loadingContent:f,skeletonLoader:w=!1,skeletonRows:y=5,scrollable:k=!0,maxHeight:N,onRowClick:z,isRowSelected:_,onRowSelect:C,sortable:S=!1,sortConfig:M,onSortChange:$,className:T="",containerClassName:j="",selectable:I=!1,selectedRows:A=[],onSelectionChange:D,pagination:L=!1,page:B=0,rowsPerPage:E=10,rowsPerPageOptions:R=[5,10,25,50],onPageChange:F,onRowsPerPageChange:O,dense:W=!1,expandableRows:P=!1,renderExpandedRow:V,expandedRows:H=[],onExpandRow:Y,stickyHeader:q=!1,toolbar:U,filterable:G=!1,filters:X={},onFiltersChange:K,...Q}){const{theme:Z}=or(),J=v||Z.defaultSize,[rr,nr]=c(M||null),[er,tr]=c(A),[ar,ir]=c(H),[lr,dr]=c(B),[cr,sr]=c(E),[vr,xr]=c(X),mr=M||rr,pr=A.length>0?A:er,hr=H.length>0?H:ar,ur=F?B:lr,br=O?E:cr,fr=Object.keys(X).length>0?X:vr,wr=r=>{if(!S)return;const n=(null==mr?void 0:mr.key)===r&&"asc"===mr.direction?"desc":"asc",e={key:r,direction:n};$?$(r,n):nr(e)},yr=g(()=>{if(!mr||!S)return o;const r=t.find(r=>r.key===mr.key),n=null==r?void 0:r.sortFn;return[...o].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)})},[o,mr,t,S]),Nr=g(()=>G&&0!==Object.keys(fr).length?yr.filter(r=>Object.entries(fr).every(([n,e])=>{if(!e)return!0;const a=t.find(r=>r.key===n);if(null==a?void 0:a.filterFn)return a.filterFn(r,e);const o=r[n];return String(o||"").toLowerCase().includes(e.toLowerCase())})):yr,[yr,G,fr,t]),zr=g(()=>{if(!L)return Nr;const r=ur*br;return Nr.slice(r,r+br)},[Nr,L,ur,br]),_r=L?zr:Nr,Cr=x(r=>{if(!I)return;const n=r?_r.map((r,n)=>i(r,n)):[];D?D(n):tr(n)},[I,_r,i,D]),Tr=x((r,n)=>{if(!I)return;const e=n?[...pr,r]:pr.filter(n=>n!==r);D?D(e):tr(e)},[I,pr,D]),jr=I&&_r.length>0&&_r.every((r,n)=>pr.includes(i(r,n))),Ir=I&&pr.length>0&&!jr,Ar=x(r=>{if(!P)return;const n=hr.includes(r)?hr.filter(n=>n!==r):[...hr,r];Y?Y(r):ir(n)},[P,hr,Y]),Dr=x(r=>{F?F(r):dr(r)},[F]),Lr=x(r=>{O?O(r):(sr(r),dr(0))},[O]),Br=x((r,n)=>{const e={...fr,[r]:n};n||delete e[r],K?K(e):xr(e),L&&(F?F(0):dr(0))},[fr,K,L,F]),Er=["vtx-table-container",k&&"vtx-table-container--scrollable",N&&"vtx-table-container--fixed-header",q&&"vtx-table-container--sticky-header",j].filter(Boolean).join(" "),Rr=["vtx-table",`vtx-table--${J}`,W&&"vtx-table--dense",l&&"vtx-table--striped",d&&"vtx-table--hoverable",s&&"vtx-table--bordered",(z||I)&&"vtx-table--clickable",q&&"vtx-table--sticky-header",T].filter(Boolean).join(" "),Fr=(r,n,e)=>{C&&C(r,n),null==z||z(r,n,e)},Or=n=>{if(!S)return null;const e=(null==mr?void 0:mr.key)===n,t=null==mr?void 0:mr.direction;return r("span",e?{className:"vtx-table-sort-icon vtx-table-sort-icon--active",children:r("asc"===t?Kr:Qr,{size:14})}:{className:"vtx-table-sort-icon vtx-table-sort-icon--inactive",children:r(Kr,{size:14})})};return n("div",{className:"vtx-table-wrapper",children:[U&&r("div",{className:"vtx-table-toolbar",children:"object"==typeof U&&null!==U&&!a.isValidElement(U)&&"title"in U?n(Nn,{justify:"between",align:"center",style:{width:"100%"},children:[U.title&&r(_n,{variant:"h6",noMargin:!0,children:U.title}),U.actions&&r("div",{className:"vtx-table-toolbar-actions",children:U.actions})]}):r(e,{children:U})}),I&&pr.length>0&&r("div",{className:"vtx-table-selection-toolbar",children:r(Nn,{align:"center",gap:16,children:n(_n,{variant:"body2",noMargin:!0,children:[pr.length," selected"]})})}),r("div",{className:Er,style:{maxHeight:N},children:n("table",{className:Rr,...Q,children:[m&&r("caption",{className:"vtx-table-caption",children:m}),r("thead",{className:"vtx-table-header",children:n("tr",{children:[I&&r("th",{className:"vtx-table-header-cell vtx-table-cell--checkbox",children:r(gr,{checked:jr,indeterminate:Ir,onChange:r=>Cr(r.target.checked),"aria-label":"Select all rows"})}),P&&r("th",{className:"vtx-table-header-cell vtx-table-cell--expand"}),t.map(e=>{const t=S&&!1!==e.sortable,a=G&&!1!==e.filterable,o=["vtx-table-header-cell",t&&"vtx-table-header-cell--sortable",e.sticky&&`vtx-table-header-cell--sticky-${e.sticky}`,e.headerClassName].filter(Boolean).join(" ");return r("th",{className:o,style:{width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth,textAlign:e.align||"left"},"aria-sort":(null==mr?void 0:mr.key)===e.key?"asc"===mr.direction?"ascending":"descending":void 0,children:n("div",{className:"vtx-table-header-content",children:[n("div",{className:"vtx-table-header-label",onClick:()=>t&&wr(e.key),onKeyDown:r=>{!t||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),wr(e.key))},role:t?"button":void 0,tabIndex:t?0:void 0,style:{cursor:t?"pointer":"default"},children:[r("span",{children:e.header}),t&&Or(e.key)]}),a&&r("div",{className:"vtx-table-filter",children:r(cn,{size:"sm",placeholder:e.filterPlaceholder||`Filter ${e.header}...`,value:fr[e.key]||"",onChange:r=>Br(e.key,r.target.value),className:"vtx-table-filter-input"})})]})},e.key)})]})}),r("tbody",{className:"vtx-table-body",children:b?w?Array.from({length:y}).map((e,a)=>n("tr",{className:"vtx-table-row vtx-table-row--skeleton",children:[I&&r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--checkbox"})}),P&&r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--icon"})}),t.map(n=>r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--text"})},n.key))]},`skeleton-${a}`)):r("tr",{children:r("td",{colSpan:t.length+(I?1:0)+(P?1:0),className:"vtx-table-loading",children:f||r("span",{className:"vtx-table-loading-spinner",children:"Loading..."})})}):0===_r.length?r("tr",{children:r("td",{colSpan:t.length+(I?1:0)+(P?1:0),className:"vtx-table-empty",children:h||u?n("div",{className:"vtx-table-empty-state",children:[h&&r("div",{className:"vtx-table-empty-state-icon",children:h}),r("div",{className:"vtx-table-empty-state-message",children:p}),u&&r("div",{className:"vtx-table-empty-state-description",children:u})]}):p})}):_r.map((e,o)=>{const l=i(e,o),d=pr.includes(l),c=hr.includes(l),s=["vtx-table-row",d&&"vtx-table-row--selected",c&&"vtx-table-row--expanded"].filter(Boolean).join(" ");return n(a.Fragment,{children:[n("tr",{className:s,onClick:r=>{I&&!r.target.closest("input, button")||Fr(e,o,r)},role:z?"button":void 0,tabIndex:z?0:void 0,"aria-selected":d,onKeyDown:r=>{!z||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),Fr(e,o,r))},children:[I&&r("td",{className:"vtx-table-cell vtx-table-cell--checkbox",children:r(gr,{checked:d,onChange:r=>{r.stopPropagation(),Tr(l,r.target.checked)},"aria-label":`Select row ${o+1}`})}),P&&r("td",{className:"vtx-table-cell vtx-table-cell--expand",children:r("button",{className:"vtx-table-expand-button",onClick:r=>{r.stopPropagation(),Ar(l)},"aria-label":c?"Collapse row":"Expand row","aria-expanded":c,children:r(c?Sr:kr,{size:16})})}),t.map(n=>{const t=["vtx-table-cell",n.sticky&&`vtx-table-cell--sticky-${n.sticky}`,n.className].filter(Boolean).join(" ");return r("td",{className:t,style:{textAlign:n.align||"left",width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth},children:n.render?n.render(e,o):e[n.key]},n.key)})]}),P&&c&&V&&r("tr",{className:"vtx-table-row-expanded",children:r("td",{colSpan:t.length+(I?1:0)+1,className:"vtx-table-cell-expanded",children:V(e,o)})})]},l)})})]})}),L&&r("div",{className:"vtx-table-pagination",children:n(Nn,{align:"center",justify:"between",style:{width:"100%"},children:[n(Nn,{align:"center",gap:8,children:[r(_n,{variant:"body2",color:"neutral.600",noMargin:!0,children:"Rows per page:"}),r("select",{className:"vtx-table-pagination-select",value:br,onChange:r=>Lr(Number(r.target.value)),"aria-label":"Rows per page",children:R.map(n=>r("option",{value:n,children:n},n))})]}),n(Nn,{align:"center",gap:16,children:[n(_n,{variant:"body2",color:"neutral.600",noMargin:!0,children:[ur*br+1,"–",Math.min((ur+1)*br,Nr.length)," of"," ",Nr.length]}),n(Nn,{align:"center",gap:4,children:[r("button",{className:"vtx-table-pagination-button",onClick:()=>Dr(0),disabled:0===ur,"aria-label":"First page",title:"First page",children:r(Zr,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Dr(ur-1),disabled:0===ur,"aria-label":"Previous page",title:"Previous page",children:r(Mr,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Dr(ur+1),disabled:(ur+1)*br>=Nr.length,"aria-label":"Next page",title:"Next page",children:r($r,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Dr(Math.ceil(Nr.length/br)-1),disabled:(ur+1)*br>=Nr.length,"aria-label":"Last page",title:"Last page",children:r(Jr,{size:18})})]})]})]})})]})}xr("/* 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  align-items: center;\n  gap: var(--vtx-spacing-1);\n}\n\n.vtx-table-sort-icon {\n  display: flex;\n  flex-direction: column;\n  margin-left: var(--vtx-spacing-1);\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--small .vtx-table-header-cell,\n.vtx-table--small .vtx-table-cell {\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\n  font-size: var(--vtx-font-size-sm);\n}\n\n.vtx-table--large .vtx-table-header-cell,\n.vtx-table--large .vtx-table-cell {\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\n  font-size: var(--vtx-font-size-lg);\n}\n\n.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.vtx-table-empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--vtx-spacing-3);\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\n}\n\n.vtx-table-empty-state-icon {\n  font-size: 48px;\n  color: var(--vtx-color-neutral-400);\n  opacity: 0.6;\n}\n\n.vtx-table-empty-state-message {\n  font-size: var(--vtx-font-size-lg);\n  font-weight: var(--vtx-font-weight-semibold);\n  color: var(--vtx-color-neutral-700);\n  font-style: normal;\n}\n\n.vtx-table-empty-state-description {\n  font-size: var(--vtx-font-size-sm);\n  color: var(--vtx-color-neutral-500);\n  max-width: 400px;\n  line-height: 1.5;\n  font-style: normal;\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/* Skeleton loader */\n.vtx-table-row--skeleton {\n  animation: vtx-pulse 1.5s ease-in-out infinite;\n}\n\n.vtx-table-skeleton {\n  height: 16px;\n  background: linear-gradient(\n    90deg,\n    var(--vtx-color-neutral-200) 25%,\n    var(--vtx-color-neutral-100) 50%,\n    var(--vtx-color-neutral-200) 75%\n  );\n  background-size: 200% 100%;\n  border-radius: var(--vtx-radius-sm);\n  animation: vtx-skeleton-shimmer 1.5s ease-in-out infinite;\n}\n\n.vtx-table-skeleton--text {\n  width: 100%;\n  max-width: 180px;\n}\n\n.vtx-table-skeleton--checkbox {\n  width: 16px;\n  height: 16px;\n  border-radius: var(--vtx-radius-xs);\n}\n\n.vtx-table-skeleton--icon {\n  width: 20px;\n  height: 20px;\n  border-radius: var(--vtx-radius-xs);\n}\n\n@keyframes vtx-skeleton-shimmer {\n  0% {\n    background-position: 200% 0;\n  }\n  100% {\n    background-position: -200% 0;\n  }\n}\n\n@keyframes vtx-pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\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/* Dark mode */\n[data-theme='dark'] .vtx-table-wrapper {\n  background-color: var(--vtx-color-neutral-800);\n  border-color: var(--vtx-color-neutral-700);\n}\n\n[data-theme='dark'] .vtx-table {\n  background-color: var(--vtx-color-neutral-800);\n  color: var(--vtx-color-neutral-100);\n}\n\n[data-theme='dark'] .vtx-table-empty-state-icon {\n  color: var(--vtx-color-neutral-500);\n}\n\n[data-theme='dark'] .vtx-table-empty-state-message {\n  color: var(--vtx-color-neutral-200);\n}\n\n[data-theme='dark'] .vtx-table-empty-state-description {\n  color: var(--vtx-color-neutral-400);\n}\n\n[data-theme='dark'] .vtx-table-skeleton {\n  background: linear-gradient(\n    90deg,\n    var(--vtx-color-neutral-700) 25%,\n    var(--vtx-color-neutral-600) 50%,\n    var(--vtx-color-neutral-700) 75%\n  );\n  background-size: 200% 100%;\n}\n\n[data-theme='dark'] .vtx-table-cell--sticky-left,\n[data-theme='dark'] .vtx-table-header-cell--sticky-left,\n[data-theme='dark'] .vtx-table-cell--sticky-right,\n[data-theme='dark'] .vtx-table-header-cell--sticky-right {\n  background-color: var(--vtx-color-neutral-800);\n}\n\n[data-theme='dark'] .vtx-table-header-cell--sticky-left,\n[data-theme='dark'] .vtx-table-header-cell--sticky-right {\n  background-color: var(--vtx-color-neutral-700);\n}"),ze.displayName="Table";const _e=vr(ze);xr("/* ==================== 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 Ce=({steps:e,currentStep:t,orientation:a="horizontal",variant:o="default",showCheckmarks:i=!0,color:l="success",size:d="md",className:c="",style:s})=>{const v=e.map(r=>"string"==typeof r?{label:r}:r),x=(n,e,t)=>n.icon?r("span",{className:"timeline-step-custom-icon",children:n.icon}):"completed"===t&&i?r("svg",{className:"timeline-step-checkmark",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})}):r("span","numbered"===o?{className:"timeline-step-number",children:e+1}:{className:"timeline-step-dot"});return r("div",{className:`timeline timeline--${a} timeline--${o} timeline--${l} timeline--${d} ${c}`,style:s,children:v.map((e,a)=>{const o=(r=>r<t?"completed":r===t?"active":"pending")(a),i=a===v.length-1,l=!!e.onClick,d=(r=>r<t)(a);return n("div",{className:`timeline-step timeline-step--${o} ${l?"timeline-step--clickable":""}`,onClick:()=>(r=>{r.onClick&&r.onClick()})(e),children:[r("div",{className:"timeline-step-indicator",children:r("div",{className:"timeline-step-icon-wrapper",children:x(e,a,o)})}),!i&&r("div",{className:"timeline-connector "+(d?"timeline-connector--filled":"")}),n("div",{className:"timeline-step-content",children:[r(_n,{variant:"body2",weight:"active"===o?"semibold":"medium",noMargin:!0,className:"timeline-step-label",children:e.label}),e.description&&r(_n,{variant:"caption",noMargin:!0,className:"timeline-step-description",children:e.description})]})]},a)})})};Ce.displayName="Timeline";xr("/* Container Component Styles */\r\n\r\n.vtx-container {\r\n  width: 100%;\r\n  margin-left: auto;\r\n  margin-right: auto;\r\n  padding-left: var(--vtx-spacing-4);\r\n  padding-right: var(--vtx-spacing-4);\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Fluid container - 100% width */\r\n.vtx-container--fluid {\r\n  max-width: 100%;\r\n}\r\n\r\n/* Fixed max-width variants */\r\n.vtx-container--xs {\r\n  max-width: 540px;\r\n}\r\n\r\n.vtx-container--sm {\r\n  max-width: 720px;\r\n}\r\n\r\n.vtx-container--md {\r\n  max-width: 960px;\r\n}\r\n\r\n.vtx-container--lg {\r\n  max-width: 1140px;\r\n}\r\n\r\n.vtx-container--xl {\r\n  max-width: 1320px;\r\n}\r\n\r\n/* No gutters variant */\r\n.vtx-container--no-gutters {\r\n  padding-left: 0;\r\n  padding-right: 0;\r\n}\r\n\r\n/* Responsive breakpoints - Bootstrap-like behavior */\r\n@media (min-width: 576px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-4);\r\n    padding-right: var(--vtx-spacing-4);\r\n  }\r\n}\r\n\r\n@media (min-width: 768px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-6);\r\n    padding-right: var(--vtx-spacing-6);\r\n  }\r\n}\r\n\r\n@media (min-width: 992px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-6);\r\n    padding-right: var(--vtx-spacing-6);\r\n  }\r\n}\r\n\r\n@media (min-width: 1200px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-8);\r\n    padding-right: var(--vtx-spacing-8);\r\n  }\r\n}\r\n\r\n/* Dark mode support */\r\n[data-theme='dark'] .vtx-container {\r\n  /* Container doesn't have background by default, so nothing to change */\r\n  /* If you want to add background colors, do it here */\r\n}\r\n");const Se=a.forwardRef(({maxWidth:n="lg",disableGutters:e=!1,fluid:t=!1,className:a="",children:o,...i},l)=>{const d=["vtx-container",t||"fluid"===n?"vtx-container--fluid":`vtx-container--${n}`,e&&"vtx-container--no-gutters",a].filter(Boolean).join(" ");return r("div",{ref:l,className:d,...i,children:o})});Se.displayName="Container";const Me=vr(Se);xr("/* 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 $e=a.forwardRef(({container:n=!1,item:e=!1,spacing:t,rowSpacing:a,columnSpacing:o,xs:i,sm:l,md:d,lg:c,xl:s,justifyContent:v,alignItems:x,alignContent:m,direction:p="row",wrap:h="wrap",className:g="",children:u,style:b,...f},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!==c&&"vtx-grid-lg"+(!0===c?"":"auto"===c?"-auto":`-${c}`),void 0!==s&&"vtx-grid-xl"+(!0===s?"":"auto"===s?"-auto":`-${s}`),n&&"row"!==p&&`vtx-grid-direction-${p}`,n&&"wrap"!==h&&`vtx-grid-wrap-${h}`,g].filter(Boolean).join(" "),k={...b};return n&&(v&&(k.justifyContent=v),x&&(k.alignItems=x),m&&(k.alignContent=m)),r("div",{ref:w,className:y,style:Object.keys(k).length>0?k:void 0,...f,children:u})});$e.displayName="Grid";const Te=vr($e);xr(".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 je=a.forwardRef(({icon:e,iconVariant:t="primary",text:a,subText:o,className:i="",style:l,...d},c)=>r(ce,{variant:"outlined",className:i,style:l,ref:c,...d,children:n(Te,{container:!0,spacing:2,alignItems:"center",wrap:"nowrap",justifyContent:"center",children:[r(Te,{item:!0,xs:"auto",children:r(Nn,{align:"center",justify:"center",children:r("span",{className:`infocard-icon infocard-icon--${t}`,children:e})})}),n(Te,{item:!0,xs:!0,children:[r(_n,{variant:"caption",children:a}),o&&r(_n,{variant:"subtitle2",children:o})]})]})}));je.displayName="InfoCardBase";const Ie=a.forwardRef(({value:e,label:t,className:a="",style:o,...i},l)=>r(ce,{variant:"outlined",className:a,style:o,ref:l,...i,children:n(Nn,{direction:"column",align:"center",justify:"center",style:{minHeight:80},children:[r(_n,{variant:"h4",children:e}),t&&r(_n,{variant:"caption",children:t})]})}));Ie.displayName="InfoCardMetric";const Ae={Base:vr(je),Metric:vr(Ie)};xr("/* 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 De=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,heading:o,subText:i,className:l="",style:d,...c},s)=>n(Nn,{direction:"row",align:"center",gap:8,className:`infotext-base ${l}`,style:d,ref:s,...c,children:[r(Nn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(Nn,{direction:"column",gap:4,children:[r(_n,{variant:"body1",weight:"medium",noMargin:!0,children:o}),i&&r(_n,{variant:"caption",color:"text-secondary",noMargin:!0,children:i})]})]}));De.displayName="InfoTextBase";const Le=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,value:o,label:i,subText:l,className:d="",style:c,...s},v)=>n(Nn,{direction:"row",align:"center",gap:8,className:`infotext-stat ${d}`,style:c,ref:v,...s,children:[e&&r(Nn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(Nn,{direction:"column",gap:4,children:[r(_n,{variant:"h5",weight:"bold",noMargin:!0,children:o}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:i}),l&&r(_n,{variant:"caption",color:"text-secondary",noMargin:!0,children:l})]})]}));Le.displayName="InfoTextStat";const Be=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,title:o,description:i,badge:l,className:d="",style:c,...s},v)=>n(Nn,{direction:"row",align:"start",gap:8,className:`infotext-feature ${d}`,style:c,ref:v,...s,children:[r(Nn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(Nn,{direction:"column",gap:6,style:{flex:1},children:[n(Nn,{align:"center",gap:8,children:[r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:o}),l&&r("span",{className:"infotext-badge",children:l})]}),r(_n,{variant:"body2",color:"text-secondary",noMargin:!0,children:i})]})]}));Be.displayName="InfoTextFeature";const Ee=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,text:o,className:i="",style:l,...d},c)=>n(Nn,{direction:"row",align:"center",gap:8,className:`infotext-compact ${i}`,style:l,ref:c,...d,children:[r("span",a?{className:`infotext-icon-small infotext-icon-small--${t}`,children:e}:{className:"infotext-icon-small-plain",children:e}),r(_n,{variant:"body2",noMargin:!0,children:o})]}));Ee.displayName="InfoTextCompact";const Re=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,heading:o,subText:i,className:l="",style:d,...c},s)=>n(Nn,{direction:"column",align:"center",gap:10,className:`infotext-vertical ${l}`,style:d,ref:s,...c,children:[r(Nn,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(Nn,{direction:"column",gap:4,align:"center",children:[r(_n,{variant:"body1",weight:"medium",align:"center",noMargin:!0,children:o}),i&&r(_n,{variant:"caption",color:"text-secondary",align:"center",noMargin:!0,children:i})]})]}));Re.displayName="InfoTextVertical";const Fe={Base:vr(De),Stat:vr(Le),Feature:vr(Be),Compact:vr(Ee),Vertical:vr(Re)};xr("/* ==================== 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 Oe=a.forwardRef(({id:e,image:t,imageAlt:a="Product",category:o,name:i,weight:l,units:d,price:s,originalPrice:v,discount:x,rating:m,initialQuantity:p=0,featured:h=!1,featuredText:g="Featured",showWishlist:u=!1,isWishlisted:b=!1,cartIcon:f,wishlistIcon:w,wishlistFilledIcon:y,quickViewIcon:k,onAddToCart:N,onIncrementCart:z,onDecrementCart:_,onWishlist:C,onQuickView:S,onClick:M,loading:$=!1,className:T="",style:j,...I},A)=>{const[D,L]=c(p),[B,E]=c(!1),R=B||$;return r(ce,{variant:"outlined",className:`productcard ${T}`,style:{padding:0,...j},ref:A,...I,children:n(Nn,{direction:"column",children:[n("div",{className:"productcard-image-wrapper",onClick:M,style:{cursor:M?"pointer":"default"},children:[r("img",{src:t,alt:a,className:"productcard-image"}),n("div",{className:"productcard-badges",children:[h&&r("span",{className:"productcard-featured-badge",children:g}),x&&r("span",{className:"productcard-discount-badge",children:x})]}),u&&C&&r("button",{className:"productcard-wishlist-btn "+(b?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),C()},"aria-label":b?"Remove from wishlist":"Add to wishlist",children:b?y||w||"♥":w||"♡"}),S&&r("div",{className:"productcard-hover-overlay",children:r(pr,{variant:"secondary",size:"sm",leftIcon:k||"👁",onClick:r=>{r.stopPropagation(),S()},children:"Quick View"})})]}),n(Nn,{direction:"column",gap:5,style:{padding:"12px"},children:[o&&r("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r(vn,{label:o,variant:"outlined",className:"productcard-category"})}),r(_n,{variant:"body1",noMargin:!0,onClick:M,style:{cursor:M?"pointer":"default"},children:i}),(void 0!==l||d)&&r(_n,{variant:"body1",noMargin:!0,className:"productcard-weight",children:void 0!==l&&d?`${l} ${d}`:void 0!==l?l:"-"}),void 0!==m&&n(Nn,{align:"center",gap:5,className:"productcard-rating-wrapper",children:[n("div",{className:"productcard-rating",children:["★".repeat(Math.floor(m)),"☆".repeat(5-Math.floor(m))]}),r(_n,{variant:"caption",noMargin:!0,children:m})]}),n(Nn,{align:"center",gap:8,children:[n(_n,{variant:"h5",noMargin:!0,className:"productcard-price",children:["$",Number(s).toFixed(2)]}),v&&v>s&&n(_n,{variant:"body2",noMargin:!0,className:"productcard-original-price",children:["$",Number(v).toFixed(2)]})]}),R?r(pr,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===D?r(pr,{fullWidth:!0,variant:"primary",leftIcon:f,onClick:async()=>{if(N){E(!0);try{await N(e,1),L(1)}catch(r){console.error("Add to cart error:",r)}finally{E(!1)}}},children:"Add to cart"}):n(Nn,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r(pr,{variant:"secondary",onClick:async()=>{if(_&&!(D<=0)){E(!0);try{await _(e,D),L(D-1)}catch(r){console.error("Decrement error:",r)}finally{E(!1)}}},children:"-"}),r(_n,{noMargin:!0,className:"productcard-quantity-value",children:D}),r(pr,{variant:"secondary",onClick:async()=>{if(z){E(!0);try{await z(e,D),L(D+1)}catch(r){console.error("Increment error:",r)}finally{E(!1)}}},children:"+"})]})]})]})})});Oe.displayName="ProductCardBase";const We=a.forwardRef(({imagePosition:e="left",...t},a)=>{const{id:o,image:i,imageAlt:l="Product",category:d,name:s,weight:v,units:x,price:m,originalPrice:p,discount:h,rating:g,initialQuantity:u=0,featured:b=!1,featuredText:f="Featured",showWishlist:w=!1,isWishlisted:y=!1,cartIcon:k,wishlistIcon:N,wishlistFilledIcon:z,quickViewIcon:_,onAddToCart:C,onIncrementCart:S,onDecrementCart:M,onWishlist:$,onQuickView:T,onClick:j,loading:I=!1,className:A="",style:D}=t,[L,B]=c(u),[E,R]=c(!1),F=E||I;return r(ce,{variant:"outlined",className:`productcard-wide ${A}`,style:{padding:0,...D},ref:a,children:n(Nn,{direction:"left"===e?"row":"row-reverse",children:[n("div",{className:"productcard-wide-image-wrapper",onClick:j,style:{cursor:j?"pointer":"default"},children:[r("img",{src:i,alt:l,className:"productcard-wide-image"}),n("div",{className:"productcard-badges",children:[b&&r("span",{className:"productcard-featured-badge",children:f}),h&&r("span",{className:"productcard-discount-badge",children:h})]}),w&&$&&r("button",{className:"productcard-wishlist-btn "+(y?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),$()},children:y?z||N||"♥":N||"♡"})]}),n(Nn,{direction:"column",gap:12,style:{padding:"16px 20px",flex:1,minWidth:0},children:[d&&r("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r(vn,{label:d,variant:"outlined",className:"productcard-category"})}),n(Nn,{direction:"column",gap:6,children:[r(_n,{variant:"h5",weight:"bold",noMargin:!0,onClick:j,style:{cursor:j?"pointer":"default",wordBreak:"break-word"},children:s}),(void 0!==v||x)&&r(_n,{variant:"body2",noMargin:!0,className:"productcard-weight",children:void 0!==v&&x?`${v} ${x}`:void 0!==v?v:"-"})]}),void 0!==g&&n(Nn,{align:"center",gap:6,children:[n("div",{className:"productcard-rating",children:["★".repeat(Math.floor(g)),"☆".repeat(5-Math.floor(g))]}),r(_n,{variant:"caption",noMargin:!0,children:g})]}),n(Nn,{align:"center",gap:8,wrap:"wrap",style:{marginTop:"auto"},children:[n(_n,{variant:"h4",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(m).toFixed(2)]}),p&&p>m&&n(_n,{variant:"body1",noMargin:!0,className:"productcard-original-price",children:["$",Number(p).toFixed(2)]})]}),n(Nn,{gap:12,align:"center",direction:"row",wrap:"wrap",children:[r("div",{style:{flex:"1 1 auto",minWidth:"140px"},children:F?r(pr,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===L?r(pr,{fullWidth:!0,variant:"primary",leftIcon:k,onClick:async()=>{if(C){R(!0);try{await C(o,1),B(1)}catch(r){console.error("Add to cart error:",r)}finally{R(!1)}}},children:"Add to cart"}):n(Nn,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r(pr,{variant:"secondary",onClick:async()=>{if(M&&!(L<=0)){R(!0);try{await M(o,L),B(L-1)}catch(r){console.error("Decrement error:",r)}finally{R(!1)}}},children:"-"}),r(_n,{noMargin:!0,className:"productcard-quantity-value",children:L}),r(pr,{variant:"primary",onClick:async()=>{if(S){R(!0);try{await S(o,L),B(L+1)}catch(r){console.error("Increment error:",r)}finally{R(!1)}}},children:"+"})]})}),T&&r(pr,{variant:"outline",size:"md",leftIcon:_||"👁",onClick:T,children:"View"})]})]})]})})});We.displayName="ProductCardWide";const Pe=a.forwardRef((e,t)=>{const{id:a,image:o,imageAlt:i="Product",name:l,price:d,originalPrice:s,discount:v,rating:x,initialQuantity:m=0,showWishlist:p=!1,isWishlisted:h=!1,cartIcon:g,wishlistIcon:u,wishlistFilledIcon:b,onAddToCart:f,onIncrementCart:w,onDecrementCart:y,onWishlist:k,onClick:N,loading:z=!1,className:_="",style:C}=e,[S,M]=c(m),[$,T]=c(!1),j=$||z;return n("div",{className:`productcard-minimal ${_}`,style:C,ref:t,children:[n("div",{className:"productcard-minimal-image-wrapper",onClick:N,style:{cursor:N?"pointer":"default"},children:[r("img",{src:o,alt:i,className:"productcard-minimal-image"}),v&&r("span",{className:"productcard-minimal-discount",children:v}),p&&k&&r("button",{className:"productcard-minimal-wishlist "+(h?"productcard-minimal-wishlist--active":""),onClick:r=>{r.stopPropagation(),k()},children:h?b||u||"♥":u||"♡"})]}),n(Nn,{direction:"column",gap:8,style:{padding:"12px 0"},children:[r(_n,{variant:"body1",weight:"medium",noMargin:!0,onClick:N,style:{cursor:N?"pointer":"default"},children:l}),n(Nn,{align:"center",gap:8,children:[n(_n,{variant:"h6",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(d).toFixed(2)]}),s&&s>d&&n(_n,{variant:"caption",noMargin:!0,className:"productcard-original-price",children:["$",Number(s).toFixed(2)]})]}),void 0!==x&&n("div",{className:"productcard-rating-minimal",children:["★".repeat(Math.floor(x)),"☆".repeat(5-Math.floor(x))]}),j?r(pr,{loading:!0,variant:"primary",size:"sm",children:"Loading"}):0===S?r(pr,{variant:"primary",size:"sm",leftIcon:g,onClick:async()=>{if(f){T(!0);try{await f(a,1),M(1)}catch(r){console.error("Add to cart error:",r)}finally{T(!1)}}},fullWidth:!0,children:"Add"}):n(Nn,{align:"center",justify:"between",className:"productcard-quantity-selector-minimal",children:[r(pr,{variant:"secondary",size:"sm",onClick:async()=>{if(y&&!(S<=0)){T(!0);try{await y(a,S),M(S-1)}catch(r){console.error("Decrement error:",r)}finally{T(!1)}}},children:"-"}),r(_n,{variant:"body2",noMargin:!0,weight:"medium",children:S}),r(pr,{variant:"primary",size:"sm",onClick:async()=>{if(w){T(!0);try{await w(a,S),M(S+1)}catch(r){console.error("Increment error:",r)}finally{T(!1)}}},children:"+"})]})]})]})});Pe.displayName="ProductCardMinimal";const Ve={Base:vr(Oe),Wide:vr(We),Minimal:vr(Pe)};xr("/* ==================== 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 He=a.forwardRef(({orderId:e,orderNumber:t,status:a="pending",statusText:o,items:i,deliveryDate:l,deliveryLabel:d="Delivered on",totalAmount:c,currency:s="₹",onTrackOrder:v,onViewDetails:x,trackButtonText:m="Track Order",className:p="",style:h,...g},u)=>{const b=i[0],f=i.length-1;return r(ce,{variant:"outlined",className:`ordercard ${p}`,style:h,onClick:x?()=>x(e):void 0,ref:u,...g,children:n(Nn,{direction:"column",gap:0,children:[n(Nn,{align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-header",children:[r(_n,{variant:"body1",weight:"semibold",noMargin:!0,children:t||`Order #${e}`}),r(Zn,{variant:(()=>{switch(a){case"delivered":return"success";case"cancelled":return"error";case"processing":case"shipped":return"info";case"pending":return"warning";default:return"neutral"}})(),children:o||a.charAt(0).toUpperCase()+a.slice(1)})]}),n(Nn,{direction:"row",gap:10,className:"ordercard-content",children:[b.image&&r("div",{className:"ordercard-image-wrapper",children:r("img",{src:b.image,alt:b.name,className:"ordercard-image"})}),n(Nn,{direction:"column",gap:2,style:{flex:1,minWidth:0},children:[n(_n,{variant:"body2",weight:"medium",noMargin:!0,className:"ordercard-product-name",children:[b.name,b.quantity&&b.quantity>1&&` × ${b.quantity}`]}),f>0&&n(_n,{variant:"caption",noMargin:!0,className:"ordercard-more-items",children:["+ ",f," more ",1===f?"item":"items"]})]})]}),n(Nn,{direction:"row",align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-footer",children:[n(Nn,{direction:"column",gap:2,style:{flex:"1 1 auto",minWidth:"140px"},children:[l&&n(_n,{variant:"caption",noMargin:!0,className:"ordercard-delivery",children:[d,": ",l]}),n(_n,{variant:"body1",weight:"bold",noMargin:!0,className:"ordercard-price",children:[s,c.toLocaleString()]})]}),v&&r(pr,{variant:"primary",size:"sm",onClick:r=>{null==r||r.stopPropagation(),v(e)},className:"ordercard-track-btn",children:m})]})]})})});He.displayName="OrderCard";const Ye=vr(He);xr("/* ==================== 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 qe=a.forwardRef(({heading:t,items:o,showDividers:i=!1,compact:l=!1,variant:d="outlined",className:c="",style:s,...v},x)=>{const m=o.filter(r=>!r.hidden);return n(ce,{variant:"flat"===d?"filled":d,className:`info-list-card ${l?"info-list-card--compact":""} ${c}`,style:s,ref:x,...v,children:[t&&n(e,{children:[r(_n,{variant:"h6",weight:"semibold",noMargin:!0,className:"info-list-card-heading",children:t}),r(ge,{style:{margin:"12px 0 16px 0"}})]}),r("div",{className:"info-list-card-items",children:m.map((e,t)=>n(a.Fragment,{children:[n("div",{className:"info-list-card-item",children:[r("div",{className:`info-list-card-label ${e.labelClass||""}`,children:"string"==typeof e.label?r(_n,{variant:"body2",noMargin:!0,children:e.label}):e.label}),r("div",{className:`info-list-card-value ${e.valueClass||""}`,children:"string"==typeof e.value||"number"==typeof e.value?r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:e.value}):e.value})]}),i&&t<m.length-1&&r(ge,{style:{margin:l?"8px 0":"12px 0"}})]},t))})]})});qe.displayName="InfoListCard";const Ue=vr(qe);xr(".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 Ge=a.forwardRef(({orderId:t,orderNumber:a,orderDate:o,status:i="confirmed",statusText:l,headerText:d="Order Confirmed!",headerSubtitle:c="Thank you for your order. We'll send you a confirmation email shortly.",customerEmail:s,customerPhone:v,shippingAddress:x,billingAddress:m,items:p,subtotal:h,shippingCost:g=0,tax:u=0,discount:b=0,total:f,currency:w="₹",paymentMethod:y,transactionId:k,estimatedDelivery:N,trackingNumber:z,onDownloadInvoice:_,onContinueShopping:C,onTrackOrder:S,onViewDetails:M,onContactSupport:$,onShareOrder:T,downloadInvoiceText:j="Download Invoice",continueShoppingText:I="Continue Shopping",trackOrderText:A="Track Order",viewDetailsText:D="View Details",contactSupportText:L="Contact Support",shareOrderText:B="Share",showActions:E=!0,hideDownloadInvoice:R=!1,hideContinueShopping:F=!1,hideTrackOrder:O=!1,hideContactSupport:W=!1,className:P="",style:V,...H},Y)=>{const q=e=>n("div",{className:"orderconfirmation-address",children:[r("div",{className:"orderconfirmation-address-name",children:e.name}),r("div",{children:e.addressLine1}),e.addressLine2&&r("div",{children:e.addressLine2}),n("div",{children:[e.city,", ",e.state," ",e.zipCode]}),e.phone&&n("div",{children:["Phone: ",e.phone]})]}),U=[{label:"Order Number",value:a||`#${t}`,valueClass:"value-bold"},o?{label:"Order Date",value:o}:{label:"",value:"",hidden:!0},{label:"Status",value:r(Zn,{variant:(()=>{switch(i){case"confirmed":case"delivered":return"success";case"cancelled":return"error";case"processing":return"info";case"pending":return"warning";default:return"neutral"}})(),children:l||i.charAt(0).toUpperCase()+i.slice(1)})},N?{label:"Estimated Delivery",value:N,valueClass:"value-primary"}:{label:"",value:"",hidden:!0},z?{label:"Tracking Number",value:z,valueClass:"value-bold"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),G=[s?{label:"Email",value:s}:{label:"",value:"",hidden:!0},v?{label:"Phone",value:v}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),X=[y?{label:"Payment Method",value:y}:{label:"",value:"",hidden:!0},k?{label:"Transaction ID",value:k,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r("div",{className:`orderconfirmation ${P}`,style:V,ref:Y,...H,children:n(Nn,{direction:"column",gap:20,children:[r(ce,{variant:"filled",className:"orderconfirmation-header",children:n(Nn,{direction:"column",align:"center",gap:12,children:[r("span",{className:"orderconfirmation-success-icon",children:r(Tr,{size:32})}),r(_n,{variant:"h4",weight:"bold",align:"center",noMargin:!0,children:d}),r(_n,{variant:"body1",align:"center",noMargin:!0,className:"orderconfirmation-subtitle",children:c}),n(Zn,{variant:"success",style:{padding:"8px 20px",borderRadius:"20px",fontWeight:600,marginTop:"8px"},children:["Order ",a||`#${t}`]})]})}),r(Ue,{heading:"Order Details",items:U,variant:"outlined",showDividers:!0}),G.length>0&&r(Ue,{heading:"Customer Information",items:G,variant:"outlined",showDividers:!0}),n(ce,{variant:"outlined",className:"orderconfirmation-items-card",children:[n(_n,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Order Items (",p.length,")"]}),r(Nn,{direction:"column",gap:12,children:p.map((e,t)=>n("div",{children:[n(Nn,{direction:"row",gap:12,className:"orderconfirmation-item",children:[e.image&&r("div",{className:"orderconfirmation-item-image-wrapper",children:r("img",{src:e.image,alt:e.name,className:"orderconfirmation-item-image"})}),n(Nn,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r(_n,{variant:"body2",weight:"medium",noMargin:!0,className:"orderconfirmation-item-name",children:e.name}),e.variant&&r(_n,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-variant",children:e.variant}),n(_n,{variant:"caption",noMargin:!0,children:["Qty: ",e.quantity]})]}),n(Nn,{direction:"column",align:"end",gap:2,children:[n(_n,{variant:"body2",weight:"semibold",noMargin:!0,children:[w,(e.price*e.quantity).toLocaleString()]}),n(_n,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-unit-price",children:[w,e.price.toLocaleString()," each"]})]})]}),t<p.length-1&&r(ge,{style:{margin:"12px 0"}})]},e.id))})]}),n(ce,{variant:"outlined",className:"orderconfirmation-summary-card",children:[r(_n,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Payment Summary"}),n(Nn,{direction:"column",gap:8,children:[n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Subtotal"}),n(_n,{variant:"body2",noMargin:!0,children:[w,h.toLocaleString()]})]}),g>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Shipping"}),n(_n,{variant:"body2",noMargin:!0,children:[w,g.toLocaleString()]})]}),u>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Tax"}),n(_n,{variant:"body2",noMargin:!0,children:[w,u.toLocaleString()]})]}),b>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:"Discount"}),n(_n,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:["-",w,b.toLocaleString()]})]}),r(ge,{style:{margin:"8px 0"}}),n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n(_n,{variant:"body1",weight:"bold",noMargin:!0,className:"orderconfirmation-total",children:[w,f.toLocaleString()]})]})]}),X.length>0&&n(e,{children:[r(ge,{style:{margin:"12px 0"}}),r(Nn,{direction:"column",gap:8,children:X.map((e,t)=>n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:e.label}),r(_n,{variant:"body2",noMargin:!0,className:e.valueClass,children:e.value})]},t))})]})]}),n(Nn,{direction:"row",gap:16,wrap:"wrap",children:[r(ce,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n(Nn,{direction:"column",gap:12,children:[n(Nn,{align:"center",gap:8,children:[r(Pr,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r(ge,{}),q(x)]})}),m&&r(ce,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n(Nn,{direction:"column",gap:12,children:[n(Nn,{align:"center",gap:8,children:[r(Or,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r(ge,{}),q(m)]})})]}),E&&r(ce,{variant:"outlined",className:"orderconfirmation-actions-card",children:n(Nn,{direction:"column",gap:16,children:[r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"What's Next?"}),r(ge,{}),n(Nn,{direction:"row",gap:12,wrap:"wrap",children:[!R&&_&&r(pr,{variant:"primary",size:"md",onClick:()=>_(t),leftIcon:r(Lr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:j}),!O&&S&&z&&r(pr,{variant:"primary",size:"md",onClick:()=>S(t),leftIcon:r(Br,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:A})]}),n(Nn,{direction:"row",gap:12,wrap:"wrap",children:[!F&&C&&r(pr,{variant:"outline",size:"md",onClick:C,leftIcon:r(Er,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:I}),M&&r(pr,{variant:"outline",size:"md",onClick:()=>M(t),leftIcon:r(Fr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:D})]}),n(Nn,{direction:"row",gap:12,wrap:"wrap",justify:"center",children:[!W&&$&&r(pr,{variant:"ghost",size:"md",onClick:()=>$(t),leftIcon:r(Wr,{size:18}),children:L}),T&&r(pr,{variant:"ghost",size:"md",onClick:()=>T(t),leftIcon:r(Rr,{size:18}),children:B})]})]})}),r(ce,{variant:"filled",className:"orderconfirmation-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n(Nn,{direction:"column",gap:12,align:"center",children:[n(Nn,{align:"center",gap:8,children:[r(Wr,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r(_n,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n(Nn,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n(Nn,{align:"center",gap:6,children:[r(Wr,{size:16}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n(Nn,{align:"center",gap:6,children:[r(Vr,{size:16}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Ge.displayName="OrderConfirmation";const Xe=vr(Ge);xr(".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 Ke=a.forwardRef(({orderId:t,orderNumber:a,orderDate:o,status:i,statusText:l,customerName:d,customerEmail:c,customerPhone:s,shippingAddress:v,billingAddress:x,items:m,subtotal:p,shippingCost:h=0,tax:g=0,discount:u=0,total:b,currency:f="₹",couponCode:w,paymentMethod:y,paymentStatus:k,transactionId:N,estimatedDelivery:z,deliveredDate:_,trackingNumber:C,trackingUrl:S,carrier:M,onDownloadInvoice:$,onTrackOrder:T,onCancelOrder:j,onReturnOrder:I,onReorder:A,onContactSupport:D,onWriteReview:L,downloadInvoiceText:B="Download Invoice",trackOrderText:E="Track Package",cancelOrderText:R="Cancel Order",returnOrderText:F="Return Items",reorderText:O="Reorder",contactSupportText:W="Contact Support",writeReviewText:P="Write Review",showActions:V=!0,allowCancel:H=!0,allowReturn:Y=!0,allowReorder:q=!0,className:U="",style:G,...X},K)=>{const Q=()=>{switch(k){case"paid":return"success";case"failed":return"error";case"pending":return"warning";case"refunded":return"info";default:return"neutral"}},Z=e=>n("div",{className:"orderdetails-address",children:[r("div",{className:"orderdetails-address-name",children:e.name}),r("div",{children:e.addressLine1}),e.addressLine2&&r("div",{children:e.addressLine2}),n("div",{children:[e.city,", ",e.state," ",e.zipCode]}),e.phone&&n("div",{children:["Phone: ",e.phone]})]}),J=H&&("pending"===i||"processing"===i),rr=Y&&"delivered"===i,nr=C&&("shipped"===i||"delivered"===i),er=[d?{label:"Name",value:d}:{label:"",value:"",hidden:!0},c?{label:"Email",value:c}:{label:"",value:"",hidden:!0},s?{label:"Phone",value:s}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),tr=[y?{label:"Payment Method",value:y}:{label:"",value:"",hidden:!0},k?{label:"Payment Status",value:r(Zn,{variant:Q(),children:k.charAt(0).toUpperCase()+k.slice(1)})}:{label:"",value:"",hidden:!0},N?{label:"Transaction ID",value:N,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r("div",{className:`orderdetails ${U}`,style:G,ref:K,...X,children:n(Nn,{direction:"column",gap:24,children:[n(Nn,{direction:"column",gap:8,children:[r(_n,{variant:"h3",weight:"bold",noMargin:!0,children:"Order Details"}),n(_n,{variant:"body1",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:["Placed on ",o]})]}),r(ce,{variant:"outlined",style:{padding:"32px 24px"},children:r(Ce,{steps:["Order Placed","Packed","Shipped","Delivered"],currentStep:(()=>{switch(i){case"pending":case"cancelled":case"returned":default:return 0;case"processing":case"confirmed":return 1;case"shipped":return 2;case"delivered":return 3}})(),orientation:"horizontal",variant:"circle",showCheckmarks:!0,color:"success",size:"md"})}),n(Nn,{direction:"row",gap:16,wrap:"wrap",children:[r(ce,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(Nn,{direction:"column",gap:8,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Order Number"}),r(_n,{variant:"h6",weight:"bold",noMargin:!0,children:a||`#${t}`})]})}),r(ce,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(Nn,{direction:"column",gap:8,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Status"}),r(Zn,{variant:(()=>{switch(i){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:l||i.charAt(0).toUpperCase()+i.slice(1)})]})}),(_||z)&&r(ce,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(Nn,{direction:"column",gap:8,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:_?"Delivered On":"Estimated Delivery"}),r(_n,{variant:"h6",weight:"bold",noMargin:!0,style:{color:_?"var(--vtx-color-success-600)":"inherit"},children:_||z})]})}),k&&r(ce,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(Nn,{direction:"column",gap:8,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Payment"}),r(Zn,{variant:Q(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:k.charAt(0).toUpperCase()+k.slice(1)})]})})]}),V&&($||nr&&T)&&n(Nn,{direction:"row",gap:12,wrap:"wrap",children:[$&&r(pr,{variant:"outline",size:"md",onClick:()=>$(t),leftIcon:r(Lr,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:B}),nr&&T&&r(pr,{variant:"primary",size:"md",onClick:()=>T(t),leftIcon:r(Br,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:E})]}),(C||M)&&r(ce,{variant:"outlined",children:n(Nn,{direction:"column",gap:12,children:[n(Nn,{align:"center",gap:8,children:[r(Hr,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Information"})]}),r(ge,{}),n(Nn,{direction:"column",gap:12,children:[C&&n(Nn,{direction:"column",gap:4,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Tracking Number"}),S?r("a",{href:S,target:"_blank",rel:"noopener noreferrer",style:{color:"var(--vtx-color-primary-600)",fontWeight:600,textDecoration:"none"},children:C}):r(_n,{variant:"body2",weight:"semibold",noMargin:!0,children:C})]}),M&&n(Nn,{direction:"column",gap:4,children:[r(_n,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Carrier"}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:M})]})]})]})}),n(ce,{variant:"outlined",className:"orderdetails-items-card",children:[n(_n,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Items (",m.length,")"]}),r(Nn,{direction:"column",gap:12,children:m.map((e,t)=>n("div",{children:[n(Nn,{direction:"row",gap:12,className:"orderdetails-item",children:[e.image&&r("div",{className:"orderdetails-item-image-wrapper",children:r("img",{src:e.image,alt:e.name,className:"orderdetails-item-image"})}),n(Nn,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r(_n,{variant:"body2",weight:"medium",noMargin:!0,className:"orderdetails-item-name",children:e.name}),e.variant&&r(_n,{variant:"caption",noMargin:!0,className:"orderdetails-item-variant",children:e.variant}),n(_n,{variant:"caption",noMargin:!0,children:["Qty: ",e.quantity]})]}),n(Nn,{direction:"column",align:"end",gap:2,children:[n(_n,{variant:"body2",weight:"semibold",noMargin:!0,children:[f,(e.price*e.quantity).toLocaleString()]}),n(_n,{variant:"caption",noMargin:!0,className:"orderdetails-item-unit-price",children:[f,e.price.toLocaleString()," each"]})]})]}),t<m.length-1&&r(ge,{style:{margin:"12px 0"}})]},e.id))})]}),n(ce,{variant:"outlined",className:"orderdetails-summary-card",children:[r(_n,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Order Summary"}),n(Nn,{direction:"column",gap:8,children:[n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Subtotal"}),n(_n,{variant:"body2",noMargin:!0,children:[f,p.toLocaleString()]})]}),h>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Shipping"}),n(_n,{variant:"body2",noMargin:!0,children:[f,h.toLocaleString()]})]}),g>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:"Tax"}),n(_n,{variant:"body2",noMargin:!0,children:[f,g.toLocaleString()]})]}),w&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:"Coupon Applied"}),r(_n,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:w})]}),u>0&&n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:"Discount"}),n(_n,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:["-",f,u.toLocaleString()]})]}),r(ge,{style:{margin:"8px 0"}}),n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n(_n,{variant:"body1",weight:"bold",noMargin:!0,className:"orderdetails-total",children:[f,b.toLocaleString()]})]})]}),tr.length>0&&n(e,{children:[r(ge,{style:{margin:"12px 0"}}),r(Nn,{direction:"column",gap:8,children:tr.map((e,t)=>n(Nn,{justify:"between",align:"center",children:[r(_n,{variant:"body2",noMargin:!0,children:e.label}),r(_n,{variant:"body2",noMargin:!0,className:e.valueClass,children:e.value})]},t))})]})]}),er.length>0&&r(Ue,{heading:"Customer Information",items:er,variant:"outlined",showDividers:!0}),n(Nn,{direction:"row",gap:16,wrap:"wrap",children:[r(ce,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n(Nn,{direction:"column",gap:12,children:[n(Nn,{align:"center",gap:8,children:[r(Pr,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r(ge,{}),Z(v)]})}),x&&r(ce,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n(Nn,{direction:"column",gap:12,children:[n(Nn,{align:"center",gap:8,children:[r(Or,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r(ge,{}),Z(x)]})})]}),V&&r(ce,{variant:"outlined",className:"orderdetails-actions-card",children:n(Nn,{direction:"column",gap:16,children:[r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Order Actions"}),r(ge,{}),n(Nn,{direction:"row",gap:12,wrap:"wrap",children:[J&&j&&r(pr,{variant:"outline",size:"md",onClick:()=>j(t),leftIcon:r(Yr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px",borderColor:"var(--vtx-color-error-500)",color:"var(--vtx-color-error-600)"},children:R}),rr&&I&&r(pr,{variant:"outline",size:"md",onClick:()=>I(t),leftIcon:r(qr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:F}),q&&A&&r(pr,{variant:"outline",size:"md",onClick:()=>A(t),leftIcon:r(Ur,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:O})]}),n(Nn,{direction:"row",gap:12,wrap:"wrap",children:["delivered"===i&&L&&r(pr,{variant:"ghost",size:"md",onClick:()=>L(t),leftIcon:r(Gr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:P}),D&&r(pr,{variant:"ghost",size:"md",onClick:()=>D(t),leftIcon:r(Wr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:W})]})]})}),r(ce,{variant:"filled",className:"orderdetails-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n(Nn,{direction:"column",gap:12,align:"center",children:[n(Nn,{align:"center",gap:8,children:[r(Wr,{size:20}),r(_n,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r(_n,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n(Nn,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n(Nn,{align:"center",gap:6,children:[r(Wr,{size:16}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n(Nn,{align:"center",gap:6,children:[r(Vr,{size:16}),r(_n,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Ke.displayName="OrderDetails";const Qe=vr(Ke);xr("/* ===================================================================\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 Ze=a.forwardRef(({logo:e,navItems:t=[],actions:o,variant:i="primary",elevated:l=!1,sticky:d=!1,fullWidth:s=!1,searchEnabled:v=!1,searchPlaceholder:x="Search...",onSearch:m,onLogoClick:p,layout:h="single-row",twoRowBottomStyle:g="default",topBar:u,scrollBehavior:b,scrollThreshold:f=50,onScrollStateChange:w,className:y="",style:k,...N},z)=>{const[_,C]=c(""),[S,M]=c(null),[$,T]=c(!1),[j,I]=c(!1);a.useEffect(()=>{if(!b)return;const r=()=>{const r=window.scrollY>f;I(n=>(n!==r&&(null==w||w(r)),r))};return window.addEventListener("scroll",r,{passive:!0}),()=>window.removeEventListener("scroll",r)},[b,f,w]);const A=["vtx-header","vtx-header--desktop",`vtx-header--${i}`,`vtx-header--layout-${h}`,"two-row"===h&&"default"!==g&&`vtx-header--${g}`,l&&"vtx-header--elevated",d&&"vtx-header--sticky",s&&"vtx-header--full-width",u&&!$&&"vtx-header--has-topbar",b&&"vtx-header--scroll-behavior",b&&j&&"vtx-header--scrolled",y].filter(Boolean).join(" "),D=r=>{r.preventDefault(),m&&m(_)},L=e=>{const t=e.children&&e.children.length>0,a=e.megaMenu&&e.megaMenuColumns&&e.megaMenuColumns.length>0,o=S===e.id;return n("div",{className:`vtx-header__nav-item ${t||a?"vtx-header__nav-item--has-dropdown":""} ${a?"vtx-header__nav-item--mega":""}`,onMouseEnter:()=>(t||a)&&M(e.id),onMouseLeave:()=>(t||a)&&M(null),children:[n("a",{href:e.href,onClick:r=>{e.onClick&&(r.preventDefault(),e.onClick())},className:`vtx-header__nav-link ${e.active?"vtx-header__nav-link--active":""} ${e.disabled?"vtx-header__nav-link--disabled":""}`,"aria-current":e.active?"page":void 0,"aria-disabled":e.disabled,children:[e.icon&&r("span",{className:"vtx-header__nav-icon",children:e.icon}),r("span",{className:"vtx-header__nav-label",children:e.label}),e.badge&&r(Zn,{size:"sm",variant:"error",className:"vtx-header__nav-badge",children:e.badge}),(t||a)&&r(kr,{className:"vtx-header__nav-chevron",size:16})]}),a&&o&&r("div",{className:"vtx-header__mega-menu",children:r("div",{className:"vtx-header__mega-menu-container",children:e.megaMenuColumns.map((e,t)=>n("div",{className:"vtx-header__mega-menu-column",children:[e.title&&r(_n,{variant:"overline",weight:"bold",className:"vtx-header__mega-menu-column-title",children:e.title}),r("div",{className:"vtx-header__mega-menu-items",children:e.items.map(e=>n("a",{href:e.href,onClick:r=>{e.onClick&&(r.preventDefault(),e.onClick())},className:"vtx-header__mega-menu-item "+(e.active?"vtx-header__mega-menu-item--active":""),children:[e.icon&&r("span",{className:"vtx-header__mega-menu-icon",children:e.icon}),n("div",{className:"vtx-header__mega-menu-item-content",children:[r(_n,{variant:"body2",weight:"semibold",className:"vtx-header__mega-menu-item-label",children:e.label}),e.description&&r(_n,{variant:"caption",color:"#6b7280",className:"vtx-header__mega-menu-item-description",children:e.description})]}),e.badge&&r(Zn,{size:"sm",variant:"error",className:"vtx-header__mega-menu-badge",children:e.badge})]},e.id))})]},t))})}),t&&!a&&o&&r("div",{className:"vtx-header__dropdown",children:e.children.map(e=>n("a",{href:e.href,onClick:r=>{e.onClick&&(r.preventDefault(),e.onClick())},className:`vtx-header__dropdown-item ${e.active?"vtx-header__dropdown-item--active":""} ${e.disabled?"vtx-header__dropdown-item--disabled":""}`,children:[e.icon&&r("span",{className:"vtx-header__dropdown-icon",children:e.icon}),r("span",{className:"vtx-header__dropdown-label",children:e.label}),e.badge&&r(Zn,{size:"sm",variant:"error",className:"vtx-header__dropdown-badge",children:e.badge})]},e.id))})]},e.id)},B=()=>{if(!u||$)return null;const e=u.variant||"subtle";return r("div",{className:`vtx-header__topbar vtx-header__topbar--${e}`,children:n("div",{className:"vtx-header__topbar-container",children:[u.leftContent&&r("div",{className:"vtx-header__topbar-left",children:u.leftContent}),u.content&&r("div",{className:"vtx-header__topbar-content",children:u.content}),u.rightContent&&r("div",{className:"vtx-header__topbar-right",children:u.rightContent}),u.dismissible&&r("button",{className:"vtx-header__topbar-dismiss",onClick:()=>{var r;T(!0),null===(r=u.onDismiss)||void 0===r||r.call(u)},"aria-label":"Dismiss",children:r(Yr,{size:14})})]})})};return n("header","single-row"===h?{ref:z,className:A,style:k,...N,children:[B(),n("div",{className:"vtx-header__container",children:[e&&r("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&r("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(L)}),n("div",{className:"vtx-header__actions",children:[v&&n("form",{onSubmit:D,className:"vtx-header__search",children:[r(Xr,{className:"vtx-header__search-icon",size:18}),r("input",{type:"search",placeholder:x,value:_,onChange:r=>C(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),o&&r("div",{className:"vtx-header__actions-group",children:o})]})]})]}:"two-row"===h?{ref:z,className:A,style:k,...N,children:[B(),r("div",{className:"vtx-header__top-row",children:n("div",{className:"vtx-header__container",children:[e&&r("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),v&&n("form",{onSubmit:D,className:"vtx-header__search vtx-header__search--expanded",children:[r(Xr,{className:"vtx-header__search-icon",size:18}),r("input",{type:"search",placeholder:x,value:_,onChange:r=>C(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),o&&r("div",{className:"vtx-header__actions-group",children:o})]})}),t.length>0&&r("div",{className:"vtx-header__bottom-row",children:r("div",{className:"vtx-header__container",children:r("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(L)})})})]}:{ref:z,className:A,style:k,...N,children:[B(),n("div",{className:"vtx-header__container",children:[e&&r("div",{className:"vtx-header__logo",onClick:p,style:{cursor:p?"pointer":"default"},children:e}),t.length>0&&r("nav",{className:"vtx-header__nav","aria-label":"Main navigation",children:t.map(L)}),n("div",{className:"vtx-header__actions",children:[v&&n("form",{onSubmit:D,className:"vtx-header__search",children:[r(Xr,{className:"vtx-header__search-icon",size:18}),r("input",{type:"search",placeholder:x,value:_,onChange:r=>C(r.target.value),className:"vtx-header__search-input","aria-label":"Search"})]}),o&&r("div",{className:"vtx-header__actions-group",children:o})]})]})]})});Ze.displayName="HeaderDesktop";const Je=a.forwardRef(({logo:t,navItems:a=[],actions:o,variant:i="primary",elevated:l=!1,sticky:d=!1,searchEnabled:s=!1,searchPlaceholder:v="Search...",onSearch:x,onLogoClick:m,menuOpen:p,onMenuOpenChange:h,className:g="",style:u,...b},f)=>{const[w,y]=c(!1),[k,N]=c(""),[z,_]=c(new Set),C=void 0!==p,S=C?p:w,M=r=>{C?null==h||h(r):y(r)},$=["vtx-header","vtx-header--mobile",`vtx-header--${i}`,l&&"vtx-header--elevated",d&&"vtx-header--sticky",S&&"vtx-header--menu-open",g].filter(Boolean).join(" "),T=r=>{const n=new Set(z);n.has(r)?n.delete(r):n.add(r),_(n)},j=(e,t=0)=>{const a=e.children&&e.children.length>0,o=z.has(e.id);return n("div",{className:`vtx-header__mobile-nav-item vtx-header__mobile-nav-item--level-${t}`,children:[n("div",{className:"vtx-header__mobile-nav-link-wrapper",children:[n("a",{href:e.href,onClick:r=>{a?(r.preventDefault(),T(e.id)):e.onClick?(r.preventDefault(),e.onClick(),M(!1)):M(!1)},className:`vtx-header__mobile-nav-link ${e.active?"vtx-header__mobile-nav-link--active":""} ${e.disabled?"vtx-header__mobile-nav-link--disabled":""}`,"aria-current":e.active?"page":void 0,"aria-disabled":e.disabled,children:[e.icon&&r("span",{className:"vtx-header__mobile-nav-icon",children:e.icon}),r("span",{className:"vtx-header__mobile-nav-label",children:e.label}),e.badge&&r(Zn,{size:"sm",variant:"error",className:"vtx-header__mobile-nav-badge",children:e.badge})]}),a&&r("button",{className:"vtx-header__mobile-nav-toggle "+(o?"vtx-header__mobile-nav-toggle--expanded":""),onClick:()=>T(e.id),"aria-label":`Toggle ${e.label} submenu`,"aria-expanded":o,children:r(kr,{size:16})})]}),a&&o&&r("div",{className:"vtx-header__mobile-nav-children",children:e.children.map(r=>j(r,t+1))})]},e.id)};return n(e,{children:[r("header",{ref:f,className:$,style:u,...b,children:n("div",{className:"vtx-header__container",children:[r("button",{className:"vtx-header__menu-toggle",onClick:()=>M(!S),"aria-label":"Toggle menu","aria-expanded":S,children:r(S?Yr:Cr,{size:24})}),t&&r("div",{className:"vtx-header__logo",onClick:m,style:{cursor:m?"pointer":"default"},children:t}),o&&r("div",{className:"vtx-header__actions-group",children:o})]})}),S&&r("div",{className:"vtx-header__overlay",onClick:()=>M(!1),"aria-hidden":"true"}),r("div",{className:"vtx-header__mobile-menu "+(S?"vtx-header__mobile-menu--open":""),children:n("div",{className:"vtx-header__mobile-menu-content",children:[s&&n("form",{onSubmit:r=>{r.preventDefault(),x&&x(k)},className:"vtx-header__mobile-search",children:[r(Xr,{className:"vtx-header__mobile-search-icon",size:18}),r("input",{type:"search",placeholder:v,value:k,onChange:r=>N(r.target.value),className:"vtx-header__mobile-search-input","aria-label":"Search"})]}),a.length>0&&r("nav",{className:"vtx-header__mobile-nav","aria-label":"Mobile navigation",children:a.map(r=>j(r))}),o&&r("div",{className:"vtx-header__mobile-actions",children:o})]})})]})});Je.displayName="HeaderMobile";const rt=({desktopProps:n,mobileProps:e,breakpoint:t=768})=>{const[o,i]=c(!1);return a.useEffect(()=>{const r=()=>{i(window.innerWidth<t)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[t]),o?r(Je,{...e}):r(Ze,{...n})};rt.displayName="HeaderResponsive";const nt={Desktop:vr(Ze),Mobile:vr(Je),Responsive:rt};export{yn as Accordion,wn as AccordionItem,In as ActionMenu,te as AdminHeader,Ln as Alert,Kn as Avatar,Zn as Badge,le as Breadcrumb,pr as Button,ce as Card,gr as Checkbox,br as CheckboxGroup,vn as Chip,Me as Container,pe as DataGrid,ge as Divider,Nn as Flex,Te as Grid,fe as Header,nt as HomeHeader,Ae as InfoCard,Ue as InfoListCard,Fe as InfoText,cn as Input,oe as Link,$n as Menu,Sn as MenuItem,En as Modal,mn as MultiSelect,Ye as OrderCard,Xe as OrderConfirmation,Qe as OrderDetails,Ve as ProductCard,hn as Radio,un as RadioGroup,fn as Select,Ne as SideMenu,ye as SideMenuItem,_e as Table,_n as Text,ar as ThemeProvider,Ce as Timeline,On as Toast,Un as ToastContainer,Gn as Tooltip,rr as createCustomTokens,nr as generateCSSVariables,Q as generateColorShades,er as injectCSSVariables,Z as normalizeColors,Yn as toast,J as tokens,tn as useBodyScrollLock,rn as useClickOutside,ln as useDebounce,en as useEscapeKey,nn as useFocusTrap,on as useId,or as useThemeContext,Pn as useToast};
+import{jsx as r,jsxs as n,Fragment as e}from"react/jsx-runtime";import*as t from"react";import a,{useEffect as o,useState as i,useRef as l,createContext as d,useContext as c,useCallback as s,useId as v,useImperativeHandle as x,Children as m,isValidElement as p,cloneElement as h,useMemo as u}from"react";import{createPortal as g}from"react-dom";import{FiCheck as b,FiCalendar as f,FiChevronDown as y,FiBell as w,FiMenu as k,FiChevronRight as _,FiCheckCircle as N,FiAlertCircle as z,FiAlertTriangle as C,FiInfo as S,FiMinusCircle as $,FiDownload as M,FiPackage as T,FiShoppingBag as D,FiShare2 as j,FiEye as I,FiCreditCard as L,FiMessageCircle as A,FiMapPin as R,FiPhone as B,FiTruck as E,FiX as O,FiCornerUpLeft as F,FiRefreshCw as W,FiStar as P,FiSearch as H,FiPlus as V,FiMinus as Y,FiChevronUp as q,FiChevronLeft as U,FiArrowUp as G,FiArrowDown as X,FiChevronsLeft as K,FiChevronsRight as Q,FiShoppingCart as J,FiTrendingUp as Z}from"react-icons/fi";const rr=(r,n)=>{o(()=>{const e=e=>{const t=null==r?void 0:r.current;t&&!t.contains(e.target)&&n(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}},[r,n])},nr=(r,n)=>{o(()=>{if(!n)return;const e=r.current;if(!e)return;const t=e.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(),e.addEventListener("keydown",i),()=>{e.removeEventListener("keydown",i)}},[r,n])},er=r=>{o(()=>{const n=n=>{"Escape"===n.key&&r()};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[r])},tr=r=>{o(()=>{if(!r)return;const n=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=n}},[r])};let ar=0;const or=(r="vtx")=>{const[n]=i(()=>`${r}-${++ar}`);return n},ir=(r,n)=>{const[e,t]=i(r);return o(()=>{const e=setTimeout(()=>{t(r)},n);return()=>{clearTimeout(e)}},[r,n]),e},lr="dynamic-styles";let dr=null,cr=!1;function sr(){let r=document.getElementById(lr);return r||(r=document.createElement("style"),r.id=lr,document.head.appendChild(r)),r}const vr=new Set,xr={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"},mr={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 pr(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=mr[r];if(a){let n;if(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}; }`,!vr.has(n)){sr().appendChild(document.createTextNode(n)),vr.add(n)}return t}}if(n=r.match(/^([a-z]+)-(.+)$/),n){const r=n[1],e=n[2],t=mr[r],a=xr[e];if(t&&a){const n=`${r}-${e.replace(/[^a-z0-9]/gi,"")}`;let o;if(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}; }`,!vr.has(o)){sr().appendChild(document.createTextNode(o)),vr.add(o)}return n}}return r}function hr(r){if(!r.classList||0===r.classList.length)return;const n=Array.from(r.classList),e=n.map(r=>pr(r));e.some((r,e)=>r!==n[e])&&(r.className=e.join(" "))}function ur(){cr||(document.body&&document.querySelectorAll("*").forEach(r=>hr(r)),dr=new MutationObserver(r=>{r.forEach(r=>{"childList"===r.type?r.addedNodes.forEach(r=>{r.nodeType===Node.ELEMENT_NODE&&(hr(r),r.querySelectorAll("*").forEach(r=>hr(r)))}):"attributes"===r.type&&"class"===r.attributeName&&hr(r.target)})}),dr.observe(document.body||document.documentElement,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["class"]}),cr=!0)}function gr(n){const e=e=>{const t=(e.className||"").split(" ").map(r=>pr(r)).join(" ");return r(n,{...e,className:t})};return e.displayName=n.displayName||n.name||"Component",e}function br(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 c=`#${r.toString(16).padStart(2,"0")}${i.toString(16).padStart(2,"0")}${d.toString(16).padStart(2,"0")}`;o[Number(n)]=c}return o}function fr(r){const n={};for(const[e,t]of Object.entries(r))if("string"==typeof t)n[e]=br(t);else if("object"==typeof t&&null!==t)if(t[500]){const r=br(t[500]);n[e]={...r,...t}}else n[e]=t;return n}const yr={colors:{primary:br("#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 wr(r){return r}function kr(r){const n=r||yr,e=[];return Object.entries(n.colors).forEach(([r,n])=>{"object"==typeof n?Object.entries(n).forEach(([n,t])=>{e.push(`  --vtx-color-${r}-${n}: ${t};`)}):e.push(`  --vtx-color-${r}: ${n};`)}),Object.entries(n.spacing).forEach(([r,n])=>{e.push(`  --vtx-spacing-${r}: ${n};`)}),Object.entries(n.typography.fontFamily).forEach(([r,n])=>{e.push(`  --vtx-font-family-${r}: ${n};`)}),Object.entries(n.typography.fontSize).forEach(([r,n])=>{e.push(`  --vtx-font-size-${r}: ${n};`)}),Object.entries(n.typography.fontWeight).forEach(([r,n])=>{e.push(`  --vtx-font-weight-${r}: ${n};`)}),Object.entries(n.typography.lineHeight).forEach(([r,n])=>{e.push(`  --vtx-line-height-${r}: ${n};`)}),Object.entries(n.typography.letterSpacing).forEach(([r,n])=>{e.push(`  --vtx-letter-spacing-${r}: ${n};`)}),Object.entries(n.typography.textVariants).forEach(([r,n])=>{Object.entries(n).forEach(([n,t])=>{const a=n.replace(/([A-Z])/g,"-$1").toLowerCase();e.push(`  --vtx-text-${r}-${a}: ${t};`)})}),Object.entries(n.borderRadius).forEach(([r,n])=>{e.push(`  --vtx-radius-${r}: ${n};`)}),Object.entries(n.shadows).forEach(([r,n])=>{e.push(`  --vtx-shadow-${r}: ${n};`)}),Object.entries(n.transitions).forEach(([r,n])=>{e.push(`  --vtx-transition-${r}: ${n};`)}),Object.entries(n.zIndex).forEach(([r,n])=>{e.push(`  --vtx-z-${r}: ${n};`)}),e.join("\n")}function _r(r){if("undefined"==typeof document)return;const n="vtx-ui-variables";let e=document.getElementById(n);e||(e=document.createElement("style"),e.id=n,document.head.appendChild(e));const t=kr(r);e.textContent=`:root {\n${t}\n}`}const Nr=e=>n("svg",{className:"vtx-multiselect-icon-spinner",width:e.size||16,height:e.size||16,viewBox:"0 0 16 16",fill:"none",children:[r("circle",{className:"vtx-multiselect-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r("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"})]}),zr=b,Cr=n=>r("svg",{width:n.size||16,height:n.size||16,viewBox:"0 0 16 16",fill:"none",className:"vtx-icon-close",children:r("path",{d:"M12 4L4 12M4 4L12 12",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),Sr=f,$r=y,Mr=V,Tr=Y,Dr=w,jr=k,Ir=q,Lr=U,Ar=_,Rr=N,Br=z,Er=C,Or=S,Fr=$,Wr=M,Pr=T,Hr=D,Vr=j,Yr=I,qr=L,Ur=A,Gr=R,Xr=B,Kr=E,Qr=O,Jr=F,Zr=W,rn=P,nn=H,en=J,tn=Z,an=G,on=X,ln=K,dn=Q;function cn(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))}}cn("/* ===== Toast Component Styles ===== */\r\n.vtx-toast {\r\n  --vtx-toast-animation-duration: 300ms;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  min-width: 300px;\r\n  max-width: 500px;\r\n  padding: 0;\r\n  margin: 0;\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-lg);\r\n  box-shadow: var(--vtx-shadow-lg);\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-900);\r\n  pointer-events: auto;\r\n  overflow: hidden;\r\n  position: relative;\r\n  animation: vtx-toast-enter var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\r\n    forwards;\r\n}\r\n\r\n.vtx-toast--exiting {\r\n  animation: vtx-toast-exit var(--vtx-toast-animation-duration) cubic-bezier(0.4, 0, 0.2, 1)\r\n    forwards;\r\n}\r\n\r\n/* ===== Toast Variants ===== */\r\n.vtx-toast--success {\r\n  border-left: 4px solid var(--vtx-color-success-500);\r\n}\r\n\r\n.vtx-toast--error {\r\n  border-left: 4px solid var(--vtx-color-error-500);\r\n}\r\n\r\n.vtx-toast--warning {\r\n  border-left: 4px solid var(--vtx-color-warning-500);\r\n}\r\n\r\n.vtx-toast--info {\r\n  border-left: 4px solid var(--vtx-color-info-500);\r\n}\r\n\r\n.vtx-toast--default {\r\n  border-left: 4px solid var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-toast--primary {\r\n  background: var(--vtx-color-neutral-50);\r\n  color: var(--vtx-color-primary-600);\r\n  border: 1px solid var(--vtx-color-primary-200);\r\n  border-left: 4px solid var(--vtx-color-primary-500);\r\n}\r\n\r\n/* ===== Toast Wrapper ===== */\r\n.vtx-toast__wrapper {\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  min-height: 64px;\r\n}\r\n\r\n/* ===== Toast Icon ===== */\r\n.vtx-toast__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 20px;\r\n  height: 20px;\r\n  flex-shrink: 0;\r\n  margin-top: 2px;\r\n}\r\n\r\n.vtx-toast--success .vtx-toast__icon {\r\n  color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-toast--error .vtx-toast__icon {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-toast--warning .vtx-toast__icon {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-toast--info .vtx-toast__icon {\r\n  color: var(--vtx-color-info-600);\r\n}\r\n\r\n.vtx-toast--default .vtx-toast__icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n/* ===== Toast Content ===== */\r\n.vtx-toast__content {\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n  min-width: 0; /* Allow content to shrink */\r\n}\r\n\r\n.vtx-toast__title {\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: 1.4;\r\n  color: var(--vtx-color-neutral-900);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__title {\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-toast__description {\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: 1.5;\r\n  color: var(--vtx-color-neutral-700);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__description {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-toast__body {\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: 1.5;\r\n  color: var(--vtx-color-neutral-800);\r\n  margin: 0;\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__body {\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n/* ===== Toast Actions ===== */\r\n.vtx-toast__actions {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-2);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-toast__action {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-3);\r\n  background: transparent;\r\n  border: 1px solid var(--vtx-color-primary-500);\r\n  border-radius: var(--vtx-radius-base);\r\n  color: var(--vtx-color-primary-600);\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  line-height: 1;\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n  text-decoration: none;\r\n  white-space: nowrap;\r\n}\r\n\r\n.vtx-toast__action:hover {\r\n  background: var(--vtx-color-primary-50);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-toast__action:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__action {\r\n  border-color: var(--vtx-color-primary-500);\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__action:hover {\r\n  background: var(--vtx-color-primary-50);\r\n  border-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__action:focus {\r\n  outline-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-toast__close {\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  background: transparent;\r\n  border: none;\r\n  border-radius: var(--vtx-radius-base);\r\n  color: var(--vtx-color-neutral-500);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-toast__close:hover {\r\n  background: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-toast__close:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__close {\r\n  color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__close:hover {\r\n  background: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__close:focus {\r\n  outline-color: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* ===== Progress Bar ===== */\r\n.vtx-toast__progress-container {\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  right: 0;\r\n  height: 4px;\r\n  background: var(--vtx-color-neutral-200);\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-toast__progress {\r\n  height: 100%;\r\n  background: currentColor;\r\n  transform-origin: left;\r\n  transition: transform 16ms linear;\r\n}\r\n\r\n.vtx-toast--success .vtx-toast__progress {\r\n  background: var(--vtx-color-success-500);\r\n}\r\n\r\n.vtx-toast--error .vtx-toast__progress {\r\n  background: var(--vtx-color-error-500);\r\n}\r\n\r\n.vtx-toast--warning .vtx-toast__progress {\r\n  background: var(--vtx-color-warning-500);\r\n}\r\n\r\n.vtx-toast--info .vtx-toast__progress {\r\n  background: var(--vtx-color-info-500);\r\n}\r\n\r\n.vtx-toast--default .vtx-toast__progress {\r\n  background: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-toast--primary .vtx-toast__progress {\r\n  background: var(--vtx-color-primary-500);\r\n}\r\n\r\n/* ===== Toast Animations ===== */\r\n@keyframes vtx-toast-enter {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n}\r\n\r\n@keyframes vtx-toast-exit {\r\n  from {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    max-height: 200px;\r\n    margin-bottom: var(--vtx-toast-gap, 12px);\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    transform: translateX(100%);\r\n    max-height: 0;\r\n    margin-bottom: 0;\r\n    padding-top: 0;\r\n    padding-bottom: 0;\r\n  }\r\n}\r\n\r\n/* Position-specific animations */\r\n.vtx-toast-container--top-left .vtx-toast,\r\n.vtx-toast-container--bottom-left .vtx-toast {\r\n  animation-name: vtx-toast-enter-left;\r\n}\r\n\r\n.vtx-toast-container--top-left .vtx-toast--exiting,\r\n.vtx-toast-container--bottom-left .vtx-toast--exiting {\r\n  animation-name: vtx-toast-exit-left;\r\n}\r\n\r\n@keyframes vtx-toast-enter-left {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateX(-100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n}\r\n\r\n@keyframes vtx-toast-exit-left {\r\n  from {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n    max-height: 200px;\r\n    margin-bottom: var(--vtx-toast-gap, 12px);\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    transform: translateX(-100%);\r\n    max-height: 0;\r\n    margin-bottom: 0;\r\n    padding-top: 0;\r\n    padding-bottom: 0;\r\n  }\r\n}\r\n\r\n.vtx-toast-container--top-center .vtx-toast,\r\n.vtx-toast-container--bottom-center .vtx-toast {\r\n  animation-name: vtx-toast-enter-center;\r\n}\r\n\r\n.vtx-toast-container--top-center .vtx-toast--exiting,\r\n.vtx-toast-container--bottom-center .vtx-toast--exiting {\r\n  animation-name: vtx-toast-exit-center;\r\n}\r\n\r\n@keyframes vtx-toast-enter-center {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(-100%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n@keyframes vtx-toast-exit-center {\r\n  from {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n    max-height: 200px;\r\n    margin-bottom: var(--vtx-toast-gap, 12px);\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    transform: translateY(-100%);\r\n    max-height: 0;\r\n    margin-bottom: 0;\r\n    padding-top: 0;\r\n    padding-bottom: 0;\r\n  }\r\n}\r\n\r\n/* ===== Dark Theme Support ===== */\r\n[data-vtx-toast-theme='dark'] .vtx-toast {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__title {\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__description {\r\n  color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__body {\r\n  color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__close {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__close:hover {\r\n  background: var(--vtx-color-neutral-700);\r\n  color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__progress-container {\r\n  background: var(--vtx-color-neutral-600);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__action {\r\n  border-color: var(--vtx-color-primary-400);\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast__action:hover {\r\n  background: var(--vtx-color-primary-900);\r\n  border-color: var(--vtx-color-primary-300);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary {\r\n  background: var(--vtx-color-primary-500);\r\n  color: white;\r\n  border: 1px solid var(--vtx-color-primary-500);\r\n  border-left: 4px solid var(--vtx-color-primary-600);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__icon {\r\n  color: white;\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__title {\r\n  color: white;\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__description {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__body {\r\n  color: rgba(255, 255, 255, 0.95);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close {\r\n  color: rgba(255, 255, 255, 0.8);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:hover {\r\n  background: rgba(255, 255, 255, 0.1);\r\n  color: white;\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__close:focus {\r\n  outline-color: rgba(255, 255, 255, 0.8);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__progress {\r\n  background: rgba(255, 255, 255, 0.8);\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action {\r\n  border-color: rgba(255, 255, 255, 0.6);\r\n  color: white;\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:hover {\r\n  background: rgba(255, 255, 255, 0.1);\r\n  border-color: white;\r\n}\r\n\r\n[data-vtx-toast-theme='dark'] .vtx-toast--primary .vtx-toast__action:focus {\r\n  outline-color: rgba(255, 255, 255, 0.8);\r\n}\r\n\r\n/* ===== Responsive Design ===== */\r\n@media (max-width: 640px) {\r\n  .vtx-toast {\r\n    min-width: 280px;\r\n    max-width: calc(100vw - 32px);\r\n    margin: 0;\r\n  }\r\n\r\n  .vtx-toast__wrapper {\r\n    padding: var(--vtx-spacing-3);\r\n  }\r\n\r\n  .vtx-toast__actions {\r\n    gap: var(--vtx-spacing-1);\r\n  }\r\n\r\n  .vtx-toast__action {\r\n    font-size: var(--vtx-font-size-xs);\r\n    padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  }\r\n}\r\n\r\n/* ===== High Contrast Mode ===== */\r\n@media (prefers-contrast: high) {\r\n  .vtx-toast {\r\n    border-width: 2px;\r\n  }\r\n\r\n  .vtx-toast__close:focus,\r\n  .vtx-toast__action:focus {\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-toast {\r\n    animation-duration: 1ms;\r\n  }\r\n\r\n  .vtx-toast__progress {\r\n    transition: none;\r\n  }\r\n}\r\n");const sn={success:r("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("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"})})},vn=a.forwardRef(({children:e,onDismiss:t,id:d,variant:c="default",autoClose:s=5e3,closeButton:v=!0,progressBar:x=!0,pauseOnHover:m=!0,pauseOnFocusLoss:p=!0,icon:h,action:u,className:g="",style:b,title:f,description:y,animationDuration:w=300,isVisible:k,createdAt:_,onClose:N,onOpen:z,toastId:C,...S},$)=>{const[M,T]=i(!1),[D,j]=i(!1),[I,L]=i(100),A=l(null),R=l(Date.now()),B=l(0),E=a.useCallback(()=>{T(!0),setTimeout(()=>{t()},w)},[t,w]);o(()=>{if(!1===s||D)return;return A.current=setInterval(()=>{const r=Date.now()-R.current-B.current,n=Math.max(0,s-r);L(n/s*100),n<=0&&E()},16),()=>{A.current&&clearInterval(A.current)}},[s,D,E]);const O=["vtx-toast",`vtx-toast--${c}`,M&&"vtx-toast--exiting",g].filter(Boolean).join(" ");return n("div",{ref:$,className:O,style:{...b,"--vtx-toast-animation-duration":`${w}ms`},onMouseEnter:()=>{m&&!D&&(j(!0),B.current=Date.now())},onMouseLeave:()=>{if(m&&D){j(!1);const r=Date.now()-B.current;R.current+=r}},onFocus:()=>{if(p&&D){j(!1);const r=Date.now()-B.current;R.current+=r}},onBlur:()=>{p&&!D&&(j(!0),B.current=Date.now())},role:"alert","aria-live":"polite","data-toast-id":d,...S,children:[n("div",{className:"vtx-toast__wrapper",children:[!1===h?null:r("div",h?{className:"vtx-toast__icon",children:h}:{className:"vtx-toast__icon",children:sn[c]}),f||y?n("div",{className:"vtx-toast__content",children:[f&&r("div",{className:"vtx-toast__title",children:f}),y&&r("div",{className:"vtx-toast__description",children:y}),e&&r("div",{className:"vtx-toast__body",children:e})]}):r("div",{className:"vtx-toast__content",children:e}),n("div",{className:"vtx-toast__actions",children:[u&&r("button",{className:"vtx-toast__action",onClick:u.onClick,type:"button",children:u.label}),v&&r("button",{className:"vtx-toast__close",onClick:E,type:"button","aria-label":"Close notification",children:r(Cr,{size:16})})]})]}),x&&!1!==s&&r("div",{className:"vtx-toast__progress-container",children:r("div",{className:"vtx-toast__progress",style:{transform:`scaleX(${I/100})`,animationPlayState:D?"paused":"running"}})})]})});vn.displayName="Toast";const xn=gr(vn),mn=d(null),pn=()=>{const r=c(mn);if(!r)throw new Error("useToast must be used within a ToastProvider");return r},hn=({children:n})=>{const[e,t]=i([]),a=s(r=>{t(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)})},[]),o=s((r,n={})=>{var e;const o=n.toastId||Date.now()+Math.random(),i={id:o,content:r,createdAt:Date.now(),isVisible:!0,autoClose:5e3,closeButton:!0,progressBar:!0,pauseOnHover:!0,pauseOnFocusLoss:!0,variant:"default",animationDuration:300,...n};return t(r=>{const n=r.filter(r=>r.id!==o);return[i,...n]}),!1!==i.autoClose&&setTimeout(()=>{a(o)},i.autoClose),null===(e=n.onOpen)||void 0===e||e.call(n),o},[a]),l=s(()=>{t([])},[]),d=s((r,n)=>{t(e=>e.map(e=>e.id===r?{...e,...n}:e))},[]),c={toasts:e,addToast:o,removeToast:a,clearAllToasts:l,updateToast:d};return r(mn.Provider,{value:c,children:n})};class un{constructor(){this.addToastFn=null,this.removeToastFn=null,this.clearAllToastsFn=null,this.updateToastFn=null}static getInstance(){return un.instance||(un.instance=new un),un.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 gn=un.getInstance();cn("/* ===== Toast Container Styles ===== */\r\n.vtx-toast-container {\r\n  --vtx-toast-gap: 12px;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: stretch;\r\n  max-width: 100vw;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-toast-container__hidden-count {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  margin-bottom: var(--vtx-toast-gap);\r\n  background: var(--vtx-color-neutral-100);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-full);\r\n  color: var(--vtx-color-neutral-700);\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  pointer-events: auto;\r\n  backdrop-filter: blur(8px);\r\n  animation: vtx-toast-fade-in 200ms ease-out;\r\n}\r\n\r\n.vtx-toast-container__list {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-toast-gap);\r\n  align-items: stretch;\r\n}\r\n\r\n/* ===== Position Variants ===== */\r\n.vtx-toast-container--top-left,\r\n.vtx-toast-container--top-center,\r\n.vtx-toast-container--top-right {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-toast-container--bottom-left,\r\n.vtx-toast-container--bottom-center,\r\n.vtx-toast-container--bottom-right {\r\n  flex-direction: column-reverse;\r\n}\r\n\r\n.vtx-toast-container--bottom-left .vtx-toast-container__hidden-count,\r\n.vtx-toast-container--bottom-center .vtx-toast-container__hidden-count,\r\n.vtx-toast-container--bottom-right .vtx-toast-container__hidden-count {\r\n  order: -1;\r\n  margin-bottom: 0;\r\n  margin-top: var(--vtx-toast-gap);\r\n}\r\n\r\n/* ===== Stacked Layout ===== */\r\n.vtx-toast-container--stacked .vtx-toast-container__list {\r\n  position: relative;\r\n}\r\n\r\n.vtx-toast-container--stacked .vtx-toast:not(:first-child) {\r\n  transform: translateY(-2px) scale(0.98);\r\n  opacity: 0.9;\r\n  z-index: -1;\r\n}\r\n\r\n.vtx-toast-container--stacked .vtx-toast:nth-child(3) {\r\n  transform: translateY(-4px) scale(0.96);\r\n  opacity: 0.8;\r\n}\r\n\r\n.vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\r\n  transform: translateY(-6px) scale(0.94);\r\n  opacity: 0.7;\r\n}\r\n\r\n/* ===== Dark Theme Support ===== */\r\n[data-vtx-toast-theme='dark'] .vtx-toast-container__hidden-count {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-600);\r\n  color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n/* ===== Responsive Design ===== */\r\n@media (max-width: 640px) {\r\n  .vtx-toast-container {\r\n    left: var(--vtx-spacing-4) !important;\r\n    right: var(--vtx-spacing-4) !important;\r\n    transform: none !important;\r\n  }\r\n\r\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\r\n    transform: translateY(-1px) scale(0.99);\r\n  }\r\n\r\n  .vtx-toast-container--stacked .vtx-toast:nth-child(3) {\r\n    transform: translateY(-2px) scale(0.98);\r\n  }\r\n\r\n  .vtx-toast-container--stacked .vtx-toast:nth-child(n + 4) {\r\n    transform: translateY(-3px) scale(0.97);\r\n  }\r\n}\r\n\r\n/* ===== Animations ===== */\r\n@keyframes vtx-toast-fade-in {\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/* ===== Accessibility ===== */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-toast-container--stacked .vtx-toast:not(:first-child) {\r\n    transform: none;\r\n    opacity: 1;\r\n  }\r\n\r\n  .vtx-toast-container__hidden-count {\r\n    animation: none;\r\n  }\r\n}\r\n\r\n/* ===== Print Styles ===== */\r\n@media print {\r\n  .vtx-toast-container {\r\n    display: none;\r\n  }\r\n}\r\n");const bn=({position:e="top-right",limit:t=5,gap:a=12,margin:i=16,className:d="",style:c,stacked:s=!0,theme:v="auto"})=>{const{toasts:x,removeToast:m,addToast:p,clearAllToasts:h,updateToast:u}=pn(),b=l(null);o(()=>{gn.setMethods(p,m,h,u)},[p,m,h,u]),o(()=>{if("auto"===v){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",v)},[v]);const f=x.slice(0,t),y=Math.max(0,x.length-t),w=["vtx-toast-container",`vtx-toast-container--${e}`,s&&"vtx-toast-container--stacked",d].filter(Boolean).join(" ");return 0===f.length?null:g(n("div",{ref:b,className:w,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":`${a}px`,...c},"aria-live":"polite","aria-label":"Notifications",children:[y>0&&n("div",{className:"vtx-toast-container__hidden-count",children:["+",y," more"]}),r("div",{className:"vtx-toast-container__list",children:f.map((n,e)=>r(xn,{id:n.id,isVisible:n.isVisible,onDismiss:()=>m(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)},fn=({children:e,...t})=>n(hn,{children:[e,r(bn,{...t})]}),yn=a.createContext(void 0),wn=a.forwardRef(({children:n,initialMode:e="light",customTokens:t,defaultSize:o="md",colorContrast:i,toastPosition:l="top-right",toastLimit:d=5,disableToasts:c=!1,linkComponent:s,imageComponent:v,...x},m)=>{const[p,h]=a.useState(e),[u,g]=a.useState(o),b={primary:"dark",secondary:"dark",outline:"light",ghost:"light",danger:"dark",success:"dark",warning:"dark",info:"dark"},f=a.useMemo(()=>{const r={...b,...i};if(!t)return{tokens:yr,mode:p,defaultSize:u,colorContrast:r,linkComponent:s,imageComponent:v||"img"};let n={...yr,...t};return t.colors&&(n.colors={...yr.colors,...fr(t.colors)}),{tokens:n,mode:p,defaultSize:u,colorContrast:r,linkComponent:s,imageComponent:v||"img"}},[t,p,u,i,s,v]);a.useEffect(()=>{document.documentElement.setAttribute("data-theme",p),t&&_r(f.tokens),ur()},[p,t,f.tokens]);const y=a.useMemo(()=>({theme:f,setMode:h,setDefaultSize:g}),[f]);return r(yn.Provider,{value:y,children:r(fn,{position:l,limit:d,children:r("div",{ref:m,...x,children:n})})})});wn.displayName="ThemeProvider";const kn=()=>{const r=a.useContext(yn);if(!r)throw new Error("useThemeContext must be used within a ThemeProvider");return r};cn("/**\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");cn("/* Autocomplete Wrapper */\r\n.vtx-autocomplete-wrapper {\r\n  position: relative;\r\n  display: inline-block;\r\n  min-width: 200px;\r\n}\r\n\r\n.vtx-autocomplete-wrapper--full-width {\r\n  width: 100%;\r\n  display: block;\r\n}\r\n\r\n/* Label */\r\n.vtx-autocomplete-label {\r\n  display: block;\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  margin-bottom: 0.375rem;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  line-height: 1.25rem;\r\n}\r\n\r\n.vtx-autocomplete-label__required {\r\n  color: var(--vtx-danger-500, #e53e3e);\r\n}\r\n\r\n/* Input Container */\r\n.vtx-autocomplete-container {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  width: 100%;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  border: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  transition:\r\n    border-color 0.15s ease-in-out,\r\n    box-shadow 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-autocomplete-container:hover:not(.vtx-autocomplete-container--disabled) {\r\n  border-color: var(--vtx-border-hover, #cbd5e0);\r\n}\r\n\r\n.vtx-autocomplete-container--focused {\r\n  border-color: var(--vtx-primary-500, #3182ce);\r\n  box-shadow: 0 0 0 3px var(--vtx-primary-100, rgba(49, 130, 206, 0.1));\r\n  outline: none;\r\n}\r\n\r\n.vtx-autocomplete-container--error {\r\n  border-color: var(--vtx-danger-500, #e53e3e);\r\n}\r\n\r\n.vtx-autocomplete-container--error.vtx-autocomplete-container--focused {\r\n  border-color: var(--vtx-danger-500, #e53e3e);\r\n  box-shadow: 0 0 0 3px var(--vtx-danger-100, rgba(229, 62, 62, 0.1));\r\n}\r\n\r\n.vtx-autocomplete-container--success {\r\n  border-color: var(--vtx-success-500, #38a169);\r\n}\r\n\r\n.vtx-autocomplete-container--success.vtx-autocomplete-container--focused {\r\n  border-color: var(--vtx-success-500, #38a169);\r\n  box-shadow: 0 0 0 3px var(--vtx-success-100, rgba(56, 161, 105, 0.1));\r\n}\r\n\r\n.vtx-autocomplete-container--disabled {\r\n  background-color: var(--vtx-bg-disabled, #f7fafc);\r\n  border-color: var(--vtx-border-color, #e2e8f0);\r\n  cursor: not-allowed;\r\n  opacity: 0.6;\r\n}\r\n\r\n/* Size Variants */\r\n.vtx-autocomplete-container--sm {\r\n  min-height: 2rem;\r\n}\r\n\r\n.vtx-autocomplete-container--sm .vtx-autocomplete-input {\r\n  padding: 0.25rem 0.625rem;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vtx-autocomplete-container--sm.vtx-autocomplete-container--with-left-icon .vtx-autocomplete-input {\r\n  padding-left: 2rem;\r\n}\r\n\r\n.vtx-autocomplete-container--sm.vtx-autocomplete-container--with-right-icon\r\n  .vtx-autocomplete-input {\r\n  padding-right: 2rem;\r\n}\r\n\r\n.vtx-autocomplete-container--md {\r\n  min-height: 2.5rem;\r\n}\r\n\r\n.vtx-autocomplete-container--md .vtx-autocomplete-input {\r\n  padding: 0.5rem 0.75rem;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vtx-autocomplete-container--md.vtx-autocomplete-container--with-left-icon .vtx-autocomplete-input {\r\n  padding-left: 2.25rem;\r\n}\r\n\r\n.vtx-autocomplete-container--md.vtx-autocomplete-container--with-right-icon\r\n  .vtx-autocomplete-input {\r\n  padding-right: 2.25rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg {\r\n  min-height: 3rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg .vtx-autocomplete-input {\r\n  padding: 0.625rem 1rem;\r\n  font-size: 1rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg.vtx-autocomplete-container--with-left-icon .vtx-autocomplete-input {\r\n  padding-left: 2.5rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg.vtx-autocomplete-container--with-right-icon\r\n  .vtx-autocomplete-input {\r\n  padding-right: 2.5rem;\r\n}\r\n\r\n/* Input */\r\n.vtx-autocomplete-input {\r\n  flex: 1;\r\n  border: none;\r\n  background: transparent;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  font-family: inherit;\r\n  outline: none;\r\n  width: 100%;\r\n  min-width: 0;\r\n}\r\n\r\n.vtx-autocomplete-input::placeholder {\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n}\r\n\r\n.vtx-autocomplete-input:disabled {\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Icons */\r\n.vtx-autocomplete-icon {\r\n  position: absolute;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-autocomplete-icon--left {\r\n  left: 0.625rem;\r\n}\r\n\r\n.vtx-autocomplete-container--sm .vtx-autocomplete-icon--left {\r\n  left: 0.5rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg .vtx-autocomplete-icon--left {\r\n  left: 0.75rem;\r\n}\r\n\r\n/* Clear Button */\r\n.vtx-autocomplete-clear {\r\n  position: absolute;\r\n  right: 0.625rem;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0.25rem;\r\n  border: none;\r\n  background: transparent;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  transition: all 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-autocomplete-clear:hover {\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  background-color: var(--vtx-bg-hover, rgba(0, 0, 0, 0.05));\r\n}\r\n\r\n.vtx-autocomplete-clear:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.vtx-autocomplete-container--sm .vtx-autocomplete-clear {\r\n  right: 0.5rem;\r\n}\r\n\r\n.vtx-autocomplete-container--lg .vtx-autocomplete-clear {\r\n  right: 0.75rem;\r\n}\r\n\r\n/* Dropdown */\r\n.vtx-autocomplete-dropdown {\r\n  position: absolute;\r\n  top: calc(100% + 0.25rem);\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 1000;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  border: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  box-shadow:\r\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\r\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);\r\n  max-height: 300px;\r\n  overflow-y: auto;\r\n  opacity: 0;\r\n  transform: translateY(-0.5rem);\r\n  transition:\r\n    opacity 0.2s ease-in-out,\r\n    transform 0.2s ease-in-out;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-autocomplete-dropdown--open {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n  pointer-events: auto;\r\n}\r\n\r\n/* Custom Scrollbar */\r\n.vtx-autocomplete-dropdown::-webkit-scrollbar {\r\n  width: 8px;\r\n}\r\n\r\n.vtx-autocomplete-dropdown::-webkit-scrollbar-track {\r\n  background-color: var(--vtx-bg-secondary, #f7fafc);\r\n  border-radius: 0 var(--vtx-border-radius, 0.375rem) var(--vtx-border-radius, 0.375rem) 0;\r\n}\r\n\r\n.vtx-autocomplete-dropdown::-webkit-scrollbar-thumb {\r\n  background-color: var(--vtx-border-hover, #cbd5e0);\r\n  border-radius: 4px;\r\n}\r\n\r\n.vtx-autocomplete-dropdown::-webkit-scrollbar-thumb:hover {\r\n  background-color: var(--vtx-text-muted, #a0aec0);\r\n}\r\n\r\n/* Options Container */\r\n.vtx-autocomplete-options {\r\n  padding: 0.25rem;\r\n}\r\n\r\n/* Option */\r\n.vtx-autocomplete-option {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 0.75rem;\r\n  padding: 0.625rem 0.75rem;\r\n  cursor: pointer;\r\n  border-radius: calc(var(--vtx-border-radius, 0.375rem) - 2px);\r\n  transition: background-color 0.15s ease-in-out;\r\n  user-select: none;\r\n}\r\n\r\n.vtx-autocomplete-option:hover:not(.vtx-autocomplete-option--disabled) {\r\n  background-color: var(--vtx-bg-hover, #f7fafc);\r\n}\r\n\r\n.vtx-autocomplete-option--highlighted:not(.vtx-autocomplete-option--disabled) {\r\n  background-color: var(--vtx-primary-50, #ebf8ff);\r\n}\r\n\r\n.vtx-autocomplete-option--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-autocomplete-option__icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  width: 1.25rem;\r\n  height: 1.25rem;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  margin-top: 0.125rem;\r\n}\r\n\r\n.vtx-autocomplete-option--highlighted .vtx-autocomplete-option__icon {\r\n  color: var(--vtx-primary-500, #3182ce);\r\n}\r\n\r\n.vtx-autocomplete-option__content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n.vtx-autocomplete-option__label {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  line-height: 1.25rem;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n.vtx-autocomplete-option__description {\r\n  font-size: 0.75rem;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  line-height: 1rem;\r\n  margin-top: 0.125rem;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Empty/Loading Messages */\r\n.vtx-autocomplete-message {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 0.5rem;\r\n  padding: 1.5rem 1rem;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  font-size: 0.875rem;\r\n  text-align: center;\r\n}\r\n\r\n.vtx-autocomplete-message--empty {\r\n  padding: 2rem 1rem;\r\n}\r\n\r\n/* Spinners */\r\n.vtx-autocomplete-spinner,\r\n.vtx-autocomplete-icon-spinner {\r\n  animation: vtx-autocomplete-spin 0.8s linear infinite;\r\n}\r\n\r\n.vtx-autocomplete-spinner__track,\r\n.vtx-autocomplete-icon-spinner__track {\r\n  opacity: 0.2;\r\n}\r\n\r\n.vtx-autocomplete-spinner__path,\r\n.vtx-autocomplete-icon-spinner__path {\r\n  animation: vtx-autocomplete-spin 0.8s linear infinite;\r\n}\r\n\r\n@keyframes vtx-autocomplete-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 Text */\r\n.vtx-autocomplete-helper {\r\n  margin-top: 0.375rem;\r\n  font-size: 0.75rem;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  line-height: 1rem;\r\n}\r\n\r\n/* Error Text */\r\n.vtx-autocomplete-error {\r\n  margin-top: 0.375rem;\r\n  font-size: 0.75rem;\r\n  color: var(--vtx-danger-500, #e53e3e);\r\n  line-height: 1rem;\r\n}\r\n\r\n/* Success Text */\r\n.vtx-autocomplete-success {\r\n  margin-top: 0.375rem;\r\n  font-size: 0.75rem;\r\n  color: var(--vtx-success-500, #38a169);\r\n  line-height: 1rem;\r\n}\r\n\r\n/* Accessibility - Focus Visible */\r\n.vtx-autocomplete-option:focus-visible {\r\n  outline: 2px solid var(--vtx-primary-500, #3182ce);\r\n  outline-offset: -2px;\r\n}\r\n\r\n.vtx-autocomplete-clear:focus-visible {\r\n  outline: 2px solid var(--vtx-primary-500, #3182ce);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Dark Mode Support */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-autocomplete-label {\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n\r\n  .vtx-autocomplete-container {\r\n    background-color: var(--vtx-bg-primary-dark, #2d3748);\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-autocomplete-container:hover:not(.vtx-autocomplete-container--disabled) {\r\n    border-color: var(--vtx-border-hover-dark, #718096);\r\n  }\r\n\r\n  .vtx-autocomplete-container--disabled {\r\n    background-color: var(--vtx-bg-disabled-dark, #1a202c);\r\n  }\r\n\r\n  .vtx-autocomplete-input {\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n\r\n  .vtx-autocomplete-input::placeholder {\r\n    color: var(--vtx-text-muted-dark, #718096);\r\n  }\r\n\r\n  .vtx-autocomplete-dropdown {\r\n    background-color: var(--vtx-bg-primary-dark, #2d3748);\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-autocomplete-option:hover:not(.vtx-autocomplete-option--disabled) {\r\n    background-color: var(--vtx-bg-hover-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-autocomplete-option__label {\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n\r\n  .vtx-autocomplete-clear:hover {\r\n    background-color: var(--vtx-bg-hover-dark, rgba(255, 255, 255, 0.1));\r\n  }\r\n}\r\n");const _n=a.forwardRef(({label:e,helperText:t,error:a,success:d,size:c,fullWidth:s=!1,options:v=[],getOptionLabel:x="label",getOptionValue:m="value",getOptionDisabled:p="disabled",getOptionDescription:h="description",getOptionIcon:u="icon",noOptionsMessage:g="No options",loading:b=!1,loadingMessage:f="Loading...",onChange:y,onSelect:w,showSearchIcon:k=!1,clearable:_=!1,onClear:N,className:z="",wrapperClassName:C="",labelClassName:S="",inputClassName:$="",dropdownClassName:M="",renderOption:T,id:D,disabled:j=!1,required:I=!1,value:L,openOnFocus:A=!0,minSearchLength:R=0,onFocus:B,onBlur:E,...O},F)=>{const{theme:W}=kn(),P=c||W.defaultSize,H=or("autocomplete"),V=D||H,Y=`${V}-helper`,q=`${V}-error`,U=`${V}-success`,G=`${V}-listbox`,[X,K]=i(""),[Q,J]=i(!1),[Z,rr]=i(-1),[nr,er]=i(!1),tr=l(null),ar=l(null),ir=l(null),lr=void 0!==L,dr=lr?L:X,cr=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,sr=Boolean(a),vr=Boolean(d)&&!sr,xr=_&&dr&&String(dr).length>0&&!j,mr=Q&&nr&&!j&&dr.length>=R,pr=[t&&!a&&!d&&Y,a&&q,d&&U].filter(Boolean).join(" "),hr=["vtx-autocomplete-wrapper",s&&"vtx-autocomplete-wrapper--full-width",C].filter(Boolean).join(" "),ur=["vtx-autocomplete-container",`vtx-autocomplete-container--${P}`,sr&&"vtx-autocomplete-container--error",vr&&"vtx-autocomplete-container--success",j&&"vtx-autocomplete-container--disabled",nr&&"vtx-autocomplete-container--focused",mr&&"vtx-autocomplete-container--open",(k||b)&&"vtx-autocomplete-container--with-left-icon",xr&&"vtx-autocomplete-container--with-right-icon",z].filter(Boolean).join(" "),gr=["vtx-autocomplete-dropdown",mr&&"vtx-autocomplete-dropdown--open",M].filter(Boolean).join(" ");o(()=>{const r=r=>{ir.current&&!ir.current.contains(r.target)&&(J(!1),er(!1))};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]),o(()=>{rr(-1)},[v]);const br=r=>{var n;if(cr(r,p))return;const e=String(cr(r,m)),t=String(cr(r,x));lr||K(t),J(!1),er(!1),null==w||w(e,r),null===(n=tr.current)||void 0===n||n.focus()};return n("div",{className:hr,ref:ir,children:[e&&n("label",{htmlFor:V,className:`vtx-autocomplete-label ${S}`.trim(),children:[e,I&&n("span",{className:"vtx-autocomplete-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:ur,children:[k&&!b&&r("span",{className:"vtx-autocomplete-icon vtx-autocomplete-icon--left","aria-hidden":"true",children:r(nn,{size:16})}),b&&r("span",{className:"vtx-autocomplete-icon vtx-autocomplete-icon--left","aria-hidden":"true",children:n("svg",{className:"vtx-autocomplete-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[r("circle",{className:"vtx-autocomplete-icon-spinner__track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r("path",{className:"vtx-autocomplete-icon-spinner__path",fill:"currentColor",d:"M8 2C4.686 2 2 4.686 2 8h2c0-2.21 1.79-4 4-4V2z"})]})}),r("input",{ref:r=>{"function"==typeof F?F(r):F&&(F.current=r),tr.current=r},id:V,type:"text",className:`vtx-autocomplete-input ${$}`.trim(),disabled:j,required:I,value:dr,onChange:r=>{const n=r.target.value;lr||K(n),J(!0),rr(-1),null==y||y(n)},onFocus:r=>{er(!0),A&&J(!0),null==B||B(r)},onBlur:r=>{setTimeout(()=>{var r;(null===(r=ir.current)||void 0===r?void 0:r.contains(document.activeElement))||(er(!1),J(!1))},200),null==E||E(r)},onKeyDown:r=>{if(mr&&0!==v.length)switch(r.key){case"ArrowDown":r.preventDefault(),rr(r=>{const n=r<v.length-1?r+1:0;return cr(v[n],p)?n<v.length-1?n+1:0:n});break;case"ArrowUp":r.preventDefault(),rr(r=>{const n=r>0?r-1:v.length-1;return cr(v[n],p)?n>0?n-1:v.length-1:n});break;case"Enter":r.preventDefault(),Z>=0&&Z<v.length&&br(v[Z]);break;case"Escape":r.preventDefault(),J(!1),rr(-1)}},"aria-invalid":sr,"aria-describedby":pr||void 0,"aria-autocomplete":"list","aria-controls":mr?G:void 0,"aria-expanded":mr,role:"combobox",autoComplete:"off",...O}),xr&&r("button",{type:"button",className:"vtx-autocomplete-clear",onClick:()=>{var r;lr||K(""),J(!1),null==N||N(),null===(r=tr.current)||void 0===r||r.focus()},"aria-label":"Clear input",tabIndex:-1,children:r(Cr,{size:16})}),mr&&r("div",{className:gr,children:b?n("div",{className:"vtx-autocomplete-message vtx-autocomplete-message--loading",children:[n("svg",{className:"vtx-autocomplete-spinner",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:[r("circle",{className:"vtx-autocomplete-spinner__track",cx:"10",cy:"10",r:"8",stroke:"currentColor",strokeWidth:"2"}),r("path",{className:"vtx-autocomplete-spinner__path",fill:"currentColor",d:"M10 2C5.582 2 2 5.582 2 10h2c0-3.314 2.686-6 6-6V2z"})]}),r("span",{children:f})]}):0===v.length?r("div",{className:"vtx-autocomplete-message vtx-autocomplete-message--empty",children:g}):r("div",{role:"listbox",id:G,className:"vtx-autocomplete-options",ref:ar,children:v.map((e,t)=>T?T(e,t):((e,t)=>{const a=String(cr(e,x)),o=String(cr(e,m)),i=cr(e,h),l=cr(e,u),d=cr(e,p),c=t===Z;return n("div",{role:"option","aria-selected":c,"aria-disabled":d,className:["vtx-autocomplete-option",c&&"vtx-autocomplete-option--highlighted",d&&"vtx-autocomplete-option--disabled"].filter(Boolean).join(" "),onClick:()=>br(e),onMouseEnter:()=>!d&&rr(t),children:[l&&r("span",{className:"vtx-autocomplete-option__icon",children:l}),n("div",{className:"vtx-autocomplete-option__content",children:[r("div",{className:"vtx-autocomplete-option__label",children:a}),i&&r("div",{className:"vtx-autocomplete-option__description",children:i})]})]},o||t)})(e,t))})})]}),t&&!a&&!d&&r("p",{id:Y,className:"vtx-autocomplete-helper",children:t}),a&&r("p",{id:q,className:"vtx-autocomplete-error",role:"alert",children:a}),d&&r("p",{id:U,className:"vtx-autocomplete-success",role:"status",children:d})]})});_n.displayName="Autocomplete";const Nn=gr(_n);cn(".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 zn=a.forwardRef(({children:t,variant:a="primary",size:o,fullWidth:i=!1,loading:l=!1,disabled:d=!1,leftIcon:c,rightIcon:s,iconOnly:v=!1,loadingText:x,asLink:m=!1,href:p,target:h,rel:u,className:g="",type:b="button",...f},y)=>{const{theme:w}=kn(),k=o||w.defaultSize||"md",_=["vtx-button",`vtx-button--${a}`,`vtx-button--${k}`,i&&"vtx-button--full-width",l&&"vtx-button--loading",v&&"vtx-button--icon-only",(()=>{if(!0===f.darkText)return"vtx-button--dark-text";if(!1===f.darkText)return"vtx-button--light-text";const r=w.colorContrast[a];return"light"===r?"vtx-button--dark-text":"dark"===r?"vtx-button--light-text":null})(),g].filter(Boolean).join(" "),N=f.style?{...f.style}:{};f.textColor&&(N.color=f.textColor);const z=n(e,{children:[l&&r("span",{className:"vtx-button__spinner",role:"status","aria-label":"Loading",children:r("svg",{className:"vtx-button__spinner-icon",viewBox:"0 0 24 24",children:r("circle",{className:"vtx-button__spinner-circle",cx:"12",cy:"12",r:"10",fill:"none",strokeWidth:"3"})})}),!l&&c&&r("span",{className:"vtx-button__icon-left",children:c}),!v&&r("span",{className:"vtx-button__content",children:l&&x?x:t}),v&&!l&&t,!l&&s&&r("span",{className:"vtx-button__icon-right",children:s})]});return m&&p?r("a",{ref:y,href:p,target:h,rel:"_blank"===h?"noopener noreferrer":u,className:_,"aria-disabled":d||l,style:N,...f,children:z}):r("button",{ref:y,type:b,className:_,disabled:d||l,"aria-busy":l,"aria-disabled":d||l,style:N,...f,children:z})});zn.displayName="Button";const Cn=gr(zn);cn("/* 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 Sn=a.forwardRef(({checked:e,indeterminate:t=!1,disabled:a=!1,label:i,size:d,variant:c="primary",error:s=!1,helperText:m,onChange:p,className:h="",inputClassName:u="",id:g,...b},f)=>{const{theme:y}=kn(),w=d||y.defaultSize||"md",k=v(),_=g||k,N=["vtx-checkbox",`vtx-checkbox--${w}`,`vtx-checkbox--${c}`,a&&"vtx-checkbox--disabled",s&&"vtx-checkbox--error",h].filter(Boolean).join(" "),z=["vtx-checkbox-input",u].filter(Boolean).join(" "),C=l(null);return x(f,()=>C.current),o(()=>{C.current&&(C.current.indeterminate=t)},[t]),n("div",{className:N,children:[n("label",{className:"vtx-checkbox-label",htmlFor:_,children:[n("span",{className:"vtx-checkbox-wrapper",children:[r("input",{ref:C,type:"checkbox",id:_,className:z,checked:e,disabled:a,onChange:p,...b}),n("span",{className:"vtx-checkbox-box",children:[r("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--check",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})}),r("svg",{className:"vtx-checkbox-icon vtx-checkbox-icon--indeterminate",viewBox:"0 0 24 24",fill:"none","aria-hidden":"true",children:r("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round"})})]})]}),i&&r("span",{className:"vtx-checkbox-label-text",children:i})]}),m&&r("div",{className:"vtx-checkbox-helper-text",children:m})]})});Sn.displayName="Checkbox";const $n=gr(Sn);cn("/* CheckboxGroup Base Styles */\r\n.vtx-checkbox-group {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n/* Group Label */\r\n.vtx-checkbox-group-label {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-checkbox-group--disabled .vtx-checkbox-group-label {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n.vtx-checkbox-group--error .vtx-checkbox-group-label {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Options Container */\r\n.vtx-checkbox-group-options {\r\n  display: flex;\r\n  gap: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-checkbox-group--vertical .vtx-checkbox-group-options {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-checkbox-group--horizontal .vtx-checkbox-group-options {\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n/* Helper Text */\r\n.vtx-checkbox-group-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-top: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-checkbox-group--error .vtx-checkbox-group-helper-text {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n");const Mn=a.forwardRef(({label:e,options:t,value:a,defaultValue:o,onChange:l,disabled:d=!1,error:c=!1,helperText:s,orientation:v="vertical",size:x,className:m="",...p},h)=>{const{theme:u}=kn(),g=x||u.defaultSize||"md",[b,f]=i(o||[]),y=void 0!==a,w=y?a:b,k=["vtx-checkbox-group",`vtx-checkbox-group--${v}`,c&&"vtx-checkbox-group--error",d&&"vtx-checkbox-group--disabled",m].filter(Boolean).join(" ");return n("div",{ref:h,className:k,...p,children:[e&&r("div",{className:"vtx-checkbox-group-label",children:e}),r("div",{className:"vtx-checkbox-group-options",children:t.map(n=>{const e=w.includes(n.value),t=d||n.disabled;return r($n,{label:n.label,checked:e,disabled:t,error:c,size:g,onChange:r=>((r,n)=>{const e=n?[...w,r]:w.filter(n=>n!==r);y||f(e),null==l||l(e)})(n.value,r.target.checked)},n.value)})}),s&&r("div",{className:"vtx-checkbox-group-helper-text",children:s})]})});Mn.displayName="CheckboxGroup";const Tn=gr(Mn);cn(".vtx-form-control {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n}\r\n\r\n.vtx-form-control--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Spacing between form controls */\r\n.vtx-form-control--spacing-none {\r\n  margin-bottom: 0;\r\n}\r\n\r\n.vtx-form-control--spacing-sm {\r\n  margin-bottom: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-form-control--spacing-md {\r\n  margin-bottom: var(--vtx-spacing-4);\r\n}\r\n\r\n.vtx-form-control--spacing-lg {\r\n  margin-bottom: var(--vtx-spacing-6);\r\n}\r\n\r\n/* Inner container */\r\n.vtx-form-control__inner {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n/* Label position: top (default) */\r\n.vtx-form-control--label-top .vtx-form-control__inner {\r\n  flex-direction: column;\r\n}\r\n\r\n/* Label position: left (horizontal) */\r\n.vtx-form-control--label-left .vtx-form-control__inner {\r\n  flex-direction: row;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-form-control--label-left .vtx-form-control__label {\r\n  min-width: 120px;\r\n  padding-top: var(--vtx-spacing-2);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-form-control--label-left .vtx-form-control__field {\r\n  flex: 1;\r\n}\r\n\r\n/* Label */\r\n.vtx-form-control__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  display: block;\r\n}\r\n\r\n.vtx-form-control__label-required {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-form-control--disabled .vtx-form-control__label {\r\n  color: var(--vtx-color-neutral-500);\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Field wrapper */\r\n.vtx-form-control__field {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n}\r\n\r\n/* Ensure children take full width if form control is full width */\r\n.vtx-form-control--full-width .vtx-form-control__field > * {\r\n  width: 100%;\r\n}\r\n\r\n/* Messages */\r\n.vtx-form-control__messages {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n  margin-top: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-form-control__helper,\r\n.vtx-form-control__error,\r\n.vtx-form-control__success {\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  margin: 0;\r\n}\r\n\r\n.vtx-form-control__helper {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-form-control__error {\r\n  color: var(--vtx-color-error-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n.vtx-form-control__success {\r\n  color: var(--vtx-color-success-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n/* State styles */\r\n.vtx-form-control--error .vtx-form-control__label {\r\n  color: var(--vtx-color-error-700);\r\n}\r\n\r\n.vtx-form-control--success .vtx-form-control__label {\r\n  color: var(--vtx-color-success-700);\r\n}\r\n\r\n/* Responsive adjustments */\r\n@media (max-width: 640px) {\r\n  .vtx-form-control--label-left .vtx-form-control__inner {\r\n    flex-direction: column;\r\n    gap: var(--vtx-spacing-2);\r\n  }\r\n\r\n  .vtx-form-control--label-left .vtx-form-control__label {\r\n    min-width: auto;\r\n    padding-top: 0;\r\n  }\r\n}\r\n");const Dn=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!0,required:d=!1,disabled:c=!1,wrapperClassName:s="",labelClassName:v="",spacing:x="md",children:m,id:p,labelPosition:h="top",className:u="",...g},b)=>{const f=or("form-control"),y=p||f,w=`${y}-helper`,k=`${y}-error`,_=`${y}-success`,N=Boolean(a),z=["vtx-form-control",`vtx-form-control--spacing-${x}`,`vtx-form-control--label-${h}`,l&&"vtx-form-control--full-width",N&&"vtx-form-control--error",Boolean(o)&&!N&&"vtx-form-control--success",c&&"vtx-form-control--disabled",s,u].filter(Boolean).join(" ");return n("div",{ref:b,className:z,...g,children:[n("div",{className:"vtx-form-control__inner",children:[e&&n("label",{htmlFor:`${y}-input`,className:`vtx-form-control__label ${v}`.trim(),children:[e,d&&n("span",{className:"vtx-form-control__label-required","aria-label":"required",children:[" ","*"]})]}),r("div",{className:"vtx-form-control__field",children:m})]}),(t||a||o)&&n("div",{className:"vtx-form-control__messages",children:[t&&!a&&!o&&r("p",{id:w,className:"vtx-form-control__helper",children:t}),a&&r("p",{id:k,className:"vtx-form-control__error",role:"alert",children:a}),o&&r("p",{id:_,className:"vtx-form-control__success",role:"status",children:o})]})]})});Dn.displayName="FormControl";const jn=gr(Dn);cn(".vtx-input-wrapper {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-input-wrapper--full-width {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-input-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-input-label__required {\r\n  color: var(--vtx-color-error-600);\r\n  margin-left: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-input-container {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-input-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.vtx-input-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-input-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-input-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-input-container--sm {\r\n  min-height: 32px;\r\n}\r\n\r\n.vtx-input-container--md {\r\n  min-height: 40px;\r\n}\r\n\r\n.vtx-input-container--lg {\r\n  min-height: 48px;\r\n}\r\n\r\n.vtx-input {\r\n  flex: 1;\r\n  width: 100%;\r\n  min-width: 0;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  color: var(--vtx-color-neutral-900);\r\n  background: transparent;\r\n  border: none;\r\n  outline: none;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-input::placeholder {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-input:disabled {\r\n  cursor: not-allowed;\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n.vtx-input-container--sm .vtx-input {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-input-container--lg .vtx-input {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Icons */\r\n.vtx-input-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n  color: var(--vtx-color-neutral-500);\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-input-icon--left {\r\n  padding-left: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-input-icon--right {\r\n  padding-right: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-input-container--with-left-icon .vtx-input {\r\n  padding-left: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-input-container--with-right-icon .vtx-input {\r\n  padding-right: var(--vtx-spacing-1);\r\n}\r\n\r\n/* Helper and error text */\r\n.vtx-input-helper,\r\n.vtx-input-error {\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  margin: 0;\r\n}\r\n\r\n.vtx-input-helper {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-input-error {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n");const In=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,leftIcon:d,rightIcon:c,clearable:s=!1,onClear:v,showCount:x=!1,className:m="",wrapperClassName:p="",labelClassName:h="",inputClassName:u="",prefix:g,suffix:b,id:f,disabled:y=!1,required:w=!1,value:k,maxLength:_,...N},z)=>{const{theme:C}=kn(),S=i||C.defaultSize,$=or("input"),M=f||$,T=`${M}-helper`,D=`${M}-error`,j=`${M}-success`,I=Boolean(a),L=Boolean(o)&&!I,A=s&&k&&String(k).length>0&&!y,R=[t&&!a&&!o&&T,a&&D,o&&j].filter(Boolean).join(" "),B=["vtx-input-wrapper",l&&"vtx-input-wrapper--full-width",p].filter(Boolean).join(" "),E=["vtx-input-container",`vtx-input-container--${S}`,I&&"vtx-input-container--error",L&&"vtx-input-container--success",y&&"vtx-input-container--disabled",(d||g)&&"vtx-input-container--with-left-element",(c||b||A)&&"vtx-input-container--with-right-element",m].filter(Boolean).join(" "),O=k?String(k).length:0,F=x&&_;return n("div",{className:B,children:[e&&n("label",{htmlFor:M,className:`vtx-input-label ${h}`.trim(),children:[e,w&&n("span",{className:"vtx-input-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:E,children:[d&&r("span",{className:"vtx-input-icon vtx-input-icon--left","aria-hidden":"true",children:d}),g&&r("span",{className:"vtx-input-prefix","aria-hidden":"true",children:g}),r("input",{ref:z,id:M,className:`vtx-input ${u}`.trim(),disabled:y,required:w,value:k,maxLength:_,"aria-invalid":I,"aria-describedby":R||void 0,...N}),b&&r("span",{className:"vtx-input-suffix","aria-hidden":"true",children:b}),A&&r("button",{type:"button",className:"vtx-input-clear",onClick:()=>{null==v||v()},"aria-label":"Clear input",tabIndex:-1,children:r(Cr,{size:16})}),c&&!A&&r("span",{className:"vtx-input-icon vtx-input-icon--right","aria-hidden":"true",children:c})]}),t&&!a&&!o&&r("p",{id:T,className:"vtx-input-helper",children:t}),a&&r("p",{id:D,className:"vtx-input-error",role:"alert",children:a}),o&&r("p",{id:j,className:"vtx-input-success",role:"status",children:o}),F&&n("p",{className:"vtx-input-counter","aria-live":"polite",children:[O," / ",_]})]})});In.displayName="Input";const Ln=gr(In);cn("/* 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--sm .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--lg .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--sm .vtx-chip__icon svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--md .vtx-chip__icon svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--lg .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--sm .vtx-chip__delete {\r\n  margin-right: -0.125rem;\r\n}\r\n\r\n.vtx-chip--lg .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--sm .vtx-chip__delete svg {\r\n  width: 0.875rem;\r\n  height: 0.875rem;\r\n}\r\n\r\n.vtx-chip--md .vtx-chip__delete svg {\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.vtx-chip--lg .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 An=a.forwardRef(({label:e,size:t="md",variant:a="filled",color:o="default",icon:i,avatar:l,onDelete:d,onClick:c,disabled:s=!1,className:v="","aria-label":x,"data-testid":m},p)=>{const h=["vtx-chip",`vtx-chip--${t}`,`vtx-chip--${a}`,`vtx-chip--${o}`,c&&!s&&"vtx-chip--clickable",s&&"vtx-chip--disabled",v].filter(Boolean).join(" ");return n("div",{ref:p,className:h,onClick:r=>{!s&&c&&c(r)},onKeyDown:r=>{s||!c||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),c(r))},role:c?"button":void 0,tabIndex:c&&!s?0:void 0,"aria-label":x||e,"aria-disabled":s,"data-testid":m,children:[l&&r("img",{src:l,alt:"",className:"vtx-chip__avatar","aria-hidden":"true"}),i&&!l&&r("span",{className:"vtx-chip__icon","aria-hidden":"true",children:i}),r("span",{className:"vtx-chip__label",children:e}),d&&r("button",{type:"button",className:"vtx-chip__delete",onClick:r=>{r.stopPropagation(),!s&&d&&d(r)},onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),r.stopPropagation(),!s&&d&&d(r))},disabled:s,"aria-label":`Remove ${e}`,tabIndex:-1,children:r(Cr,{size:16})})]})});An.displayName="Chip";const Rn=gr(An);cn("/* 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 Bn=a.forwardRef(({label:e,helperText:t,error:a,success:d,size:c,fullWidth:s=!1,options:v,value:x,defaultValue:m=[],placeholder:p="Select...",className:h="",grouped:u=!1,getOptionLabel:g="label",getOptionValue:b="value",getOptionDisabled:f="disabled",getOptionGroup:y="group",onChange:w,disabled:k=!1,required:_=!1,id:N,name:z,selectionStyle:C="checkbox",searchable:S=!1,showSelectAll:$=!1,maxChipsDisplay:M,chipColor:T="primary",chipVariant:D="light",loading:j=!1},I)=>{const{theme:L}=kn(),A=or("multiselect"),R=N||A,B=`${R}-helper`,E=`${R}-error`,O=`${R}-success`,[F,W]=i(!1),[P,H]=i(""),[V,Y]=i(m),q=l(null),U=l(null),G=void 0!==x?x:V,X=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,K=Boolean(a),Q=Boolean(d)&&!K,J=[t&&!a&&!d&&B,a&&E,d&&O].filter(Boolean).join(" ");o(()=>{const r=r=>{q.current&&!q.current.contains(r.target)&&U.current&&!U.current.contains(r.target)&&(W(!1),H(""))};if(F)return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[F]);const Z=r=>{if(k)return;const n=G.includes(r)?G.filter(n=>n!==r):[...G,r];if(void 0===x&&Y(n),w){const r=v.filter(r=>n.includes(X(r,b)));w(n,r)}},rr=P?v.filter(r=>X(r,g).toLowerCase().includes(P.toLowerCase())):v,nr=u?rr.reduce((r,n)=>{const e=X(n,y)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{}):{"":rr},er=v.filter(r=>G.includes(X(r,b))),tr=M?er.slice(0,M):er,ar=M?er.length-M:0,ir=["vtx-multiselect-wrapper",s&&"vtx-multiselect-wrapper--full-width",h].filter(Boolean).join(" "),lr=c||(null==L?void 0:L.defaultSize)||"md",dr=["vtx-multiselect-container",`vtx-multiselect-container--${lr}`,K&&"vtx-multiselect-container--error",Q&&"vtx-multiselect-container--success",k&&"vtx-multiselect-container--disabled",F&&"vtx-multiselect-container--open"].filter(Boolean).join(" "),cr=lr;return n("div",{className:ir,ref:I,children:[e&&n("label",{htmlFor:R,className:"vtx-multiselect-label",children:[e,_&&n("span",{className:"vtx-multiselect-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{ref:q,className:dr,"aria-expanded":F,"aria-haspopup":"listbox","aria-labelledby":e?`${R}-label`:void 0,"aria-describedby":J||void 0,"aria-disabled":k,children:[r("div",{className:"vtx-multiselect-input-area",onClick:()=>!k&&W(!F),role:"button",tabIndex:k?-1:0,onKeyDown:r=>{k||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),W(!F))},children:0===er.length?r("span",{className:"vtx-multiselect-placeholder",children:p}):n("div",{className:"vtx-multiselect-chips",children:[tr.map(n=>{const e=X(n,b),t=X(n,g);return r(Rn,{label:t,size:cr,color:T,variant:D,onDelete:r=>{r.stopPropagation(),(r=>{if(k)return;const n=G.filter(n=>n!==r);if(void 0===x&&Y(n),w){const r=v.filter(r=>n.includes(X(r,b)));w(n,r)}})(e)}},e)}),ar>0&&r(Rn,{label:`+${ar} more`,size:cr,color:"default",variant:"outlined"})]})}),r("span",{className:"vtx-multiselect-icon","aria-hidden":"true",children:r(j?Nr:$r,{size:16})}),F&&n("div",{ref:U,className:"vtx-multiselect-dropdown",role:"listbox",children:[S&&r("div",{className:"vtx-multiselect-search",children:r("input",{type:"text",placeholder:"Search...",value:P,onChange:r=>H(r.target.value),onClick:r=>r.stopPropagation()})}),$&&n("div",{className:"vtx-multiselect-actions",children:[r("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),(()=>{const r=v.filter(r=>!X(r,f)).map(r=>X(r,b));void 0===x&&Y(r),w&&w(r,v.filter(r=>!X(r,f)))})()},children:"Select All"}),r("button",{type:"button",className:"vtx-multiselect-action-button",onClick:r=>{r.stopPropagation(),void 0===x&&Y([]),w&&w([],[])},children:"Clear All"})]}),r("div",{className:"vtx-multiselect-options",children:0===rr.length?r("div",{className:"vtx-multiselect-empty",children:"No options found"}):Object.entries(nr).map(([e,t])=>n("div",{children:[u&&e&&r("div",{className:"vtx-multiselect-optgroup",children:e}),t.map(e=>{const t=X(e,b),a=X(e,g),o=X(e,f),i=G.includes(t),l=["vtx-multiselect-option",i&&"vtx-multiselect-option--selected",o&&"vtx-multiselect-option--disabled"].filter(Boolean).join(" ");return n("div",{className:l,onClick:()=>!o&&Z(t),role:"option","aria-selected":i,"aria-disabled":o,tabIndex:o?-1:0,onKeyDown:r=>{o||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),Z(t))},children:["checkbox"===C&&r("div",{className:"vtx-multiselect-checkbox "+(i?"vtx-multiselect-checkbox--checked":""),children:i&&r(zr,{size:16})}),r("span",{className:"vtx-multiselect-option-label",children:a}),"checkmark"===C&&r("div",{className:"vtx-multiselect-checkmark",children:i&&r(zr,{size:20})})]},t)})]},e))})]})]}),z&&r("select",{multiple:!0,name:z,value:G.map(String),onChange:()=>{},className:"vtx-multiselect-hidden-select",required:_,disabled:k,tabIndex:-1,"aria-hidden":"true",children:v.map(n=>{const e=X(n,b);return r("option",{value:String(e),children:X(n,g)},e)})}),t&&!a&&!d&&r("p",{id:B,className:"vtx-multiselect-helper",children:t}),a&&r("p",{id:E,className:"vtx-multiselect-error",role:"alert",children:a}),d&&r("p",{id:O,className:"vtx-multiselect-success",role:"status",children:d})]})});Bn.displayName="MultiSelect";const En=gr(Bn);cn("/* Radio Base Styles */\r\n.vtx-radio {\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-radio-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 radio */\r\n.vtx-radio-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-radio-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 radio circle */\r\n.vtx-radio-circle {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: var(--vtx-radio-size, 20px);\r\n  height: var(--vtx-radio-size, 20px);\r\n  border: var(--vtx-radio-border-width, 2px) solid var(--vtx-color-neutral-300);\r\n  border-radius: 50%;\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/* Inner dot */\r\n.vtx-radio-dot {\r\n  width: 50%;\r\n  height: 50%;\r\n  border-radius: 50%;\r\n  background-color: white;\r\n  opacity: 0;\r\n  transform: scale(0);\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-radio-input:checked + .vtx-radio-circle {\r\n  background-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\r\n  border-color: var(--vtx-radio-color, var(--vtx-color-primary-600));\r\n}\r\n\r\n.vtx-radio-input:checked + .vtx-radio-circle .vtx-radio-dot {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n/* Hover state */\r\n.vtx-radio-label:hover .vtx-radio-circle {\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\r\n  background-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\r\n  border-color: var(--vtx-radio-hover-color, var(--vtx-color-primary-700));\r\n}\r\n\r\n/* Focus state */\r\n.vtx-radio-input:focus-visible + .vtx-radio-circle {\r\n  outline: 2px solid var(--vtx-radio-color, var(--vtx-color-primary-600));\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Label text */\r\n.vtx-radio-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/* Disabled state */\r\n.vtx-radio--disabled .vtx-radio-label {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n}\r\n\r\n.vtx-radio--disabled .vtx-radio-circle {\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-radio--disabled .vtx-radio-input:checked + .vtx-radio-circle {\r\n  background-color: var(--vtx-color-neutral-400);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-circle,\r\n.vtx-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\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-radio--disabled .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\r\n  background-color: var(--vtx-color-neutral-400);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-radio--disabled .vtx-radio-label-text {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Error state */\r\n.vtx-radio--error .vtx-radio-circle {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-radio--error .vtx-radio-input:checked + .vtx-radio-circle {\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-radio--error .vtx-radio-label:hover .vtx-radio-input:checked + .vtx-radio-circle {\r\n  background-color: var(--vtx-color-error-700);\r\n  border-color: var(--vtx-color-error-700);\r\n}\r\n\r\n/* Helper text */\r\n.vtx-radio-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-radio-size, 20px) + var(--vtx-spacing-2));\r\n}\r\n\r\n.vtx-radio--error .vtx-radio-helper-text {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Size variants */\r\n.vtx-radio--sm {\r\n  --vtx-radio-size: 16px;\r\n  --vtx-radio-border-width: 2px;\r\n}\r\n\r\n.vtx-radio--sm .vtx-radio-label-text {\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-radio--md {\r\n  --vtx-radio-size: 20px;\r\n  --vtx-radio-border-width: 2px;\r\n}\r\n\r\n.vtx-radio--lg {\r\n  --vtx-radio-size: 24px;\r\n  --vtx-radio-border-width: 2px;\r\n}\r\n\r\n.vtx-radio--lg .vtx-radio-label-text {\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Variants */\r\n.vtx-radio--primary {\r\n  --vtx-radio-color: var(--vtx-color-primary-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-radio--secondary {\r\n  --vtx-radio-color: var(--vtx-color-neutral-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-radio--success {\r\n  --vtx-radio-color: var(--vtx-color-success-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-success-700);\r\n}\r\n\r\n.vtx-radio--error {\r\n  --vtx-radio-color: var(--vtx-color-error-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-error-700);\r\n}\r\n\r\n.vtx-radio--warning {\r\n  --vtx-radio-color: var(--vtx-color-warning-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-warning-700);\r\n}\r\n\r\n.vtx-radio--info {\r\n  --vtx-radio-color: var(--vtx-color-info-600);\r\n  --vtx-radio-hover-color: var(--vtx-color-info-700);\r\n}\r\n");const On=a.forwardRef(({checked:e,disabled:t=!1,label:a,size:o,variant:i="primary",error:l=!1,helperText:d,onChange:c,className:s="",inputClassName:x="",id:m,...p},h)=>{const{theme:u}=kn(),g=o||u.defaultSize,b=v(),f=m||b,y=d?`${f}-helper-text`:void 0,w=["vtx-radio",`vtx-radio--${g}`,`vtx-radio--${i}`,t&&"vtx-radio--disabled",l&&"vtx-radio--error",s].filter(Boolean).join(" "),k=["vtx-radio-input",x].filter(Boolean).join(" "),_=n("div",{className:"vtx-radio-wrapper",children:[r("input",{ref:h,type:"radio",id:f,className:k,checked:e,disabled:t,onChange:c,"aria-describedby":y,...p}),r("span",{className:"vtx-radio-circle",children:r("span",{className:"vtx-radio-dot"})})]});return n("div",a?{className:w,children:[n("label",{htmlFor:f,className:"vtx-radio-label",children:[_,r("span",{className:"vtx-radio-label-text",children:a})]}),d&&r("span",{id:y,className:"vtx-radio-helper-text",children:d})]}:{className:w,children:[_,d&&r("span",{id:y,className:"vtx-radio-helper-text",children:d})]})});On.displayName="Radio";const Fn=gr(On);cn("/* RadioGroup Base Styles */\r\n.vtx-radio-group {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n/* Group Label */\r\n.vtx-radio-group-label {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  line-height: var(--vtx-line-height-normal);\r\n  color: var(--vtx-color-neutral-900);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-radio-group--disabled .vtx-radio-group-label {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n.vtx-radio-group--error .vtx-radio-group-label {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Options Container */\r\n.vtx-radio-group-options {\r\n  display: flex;\r\n  gap: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-radio-group--vertical .vtx-radio-group-options {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-radio-group--horizontal .vtx-radio-group-options {\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n/* Helper Text */\r\n.vtx-radio-group-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-top: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-radio-group--error .vtx-radio-group-helper-text {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n");const Wn=a.forwardRef(({name:e,label:t,options:a,value:o,defaultValue:l,onChange:d,disabled:c=!1,error:s=!1,helperText:v,orientation:x="vertical",size:m,variant:p="primary",className:h="",...u},g)=>{const{theme:b}=kn(),f=m||b.defaultSize,[y,w]=i(l),k=void 0!==o,_=k?o:y,N=["vtx-radio-group",`vtx-radio-group--${x}`,s&&"vtx-radio-group--error",c&&"vtx-radio-group--disabled",h].filter(Boolean).join(" ");return n("div",{ref:g,className:N,role:"radiogroup","aria-label":"string"==typeof t?t:void 0,...u,children:[t&&r("div",{className:"vtx-radio-group-label",children:t}),r("div",{className:"vtx-radio-group-options",children:a.map(n=>{const t=_===n.value,a=c||n.disabled;return r(Fn,{name:e,value:n.value,label:n.label,checked:t,disabled:a,error:s,size:f,variant:p,onChange:()=>{return r=n.value,k||w(r),void(null==d||d(r));var r}},n.value)})}),v&&r("div",{className:"vtx-radio-group-helper-text",children:v})]})});Wn.displayName="RadioGroup";const Pn=gr(Wn);cn(".vtx-richtext-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n  width: 100%;\r\n}\r\n\r\n.vtx-richtext-wrapper--inline {\r\n  display: inline-flex;\r\n  width: auto;\r\n}\r\n\r\n.vtx-richtext-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-richtext-label__required {\r\n  color: var(--vtx-color-error-600);\r\n  margin-left: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-richtext-container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-base);\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-richtext-container--focused {\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.vtx-richtext-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-richtext-container--error.vtx-richtext-container--focused {\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-richtext-container--success {\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-richtext-container--success.vtx-richtext-container--focused {\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-richtext-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n  opacity: 0.6;\r\n}\r\n\r\n/* Toolbar */\r\n.vtx-richtext-toolbar {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  padding: var(--vtx-spacing-2);\r\n  background-color: var(--vtx-color-neutral-50);\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  flex-wrap: wrap;\r\n}\r\n\r\n.vtx-richtext-toolbar-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-width: 32px;\r\n  height: 32px;\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-sm);\r\n  color: var(--vtx-color-neutral-700);\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-semibold);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-richtext-toolbar-button:hover:not(:disabled) {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-richtext-toolbar-button:active:not(:disabled) {\r\n  background-color: var(--vtx-color-neutral-200);\r\n  transform: scale(0.98);\r\n}\r\n\r\n.vtx-richtext-toolbar-button:disabled {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n}\r\n\r\n.vtx-richtext-toolbar-button:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 1px;\r\n}\r\n\r\n.vtx-richtext-toolbar-clear {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-width: 32px;\r\n  height: 32px;\r\n  padding: var(--vtx-spacing-1);\r\n  margin-left: auto;\r\n  background-color: var(--vtx-color-error-100);\r\n  border: 1px solid var(--vtx-color-error-300);\r\n  border-radius: var(--vtx-radius-sm);\r\n  color: var(--vtx-color-error-700);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-richtext-toolbar-clear:hover:not(:disabled) {\r\n  background-color: var(--vtx-color-error-200);\r\n  border-color: var(--vtx-color-error-400);\r\n}\r\n\r\n.vtx-richtext-toolbar-clear:active:not(:disabled) {\r\n  transform: scale(0.98);\r\n}\r\n\r\n/* Editor */\r\n.vtx-richtext-editor {\r\n  flex: 1;\r\n  width: 100%;\r\n  min-width: 0;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  color: var(--vtx-color-neutral-900);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n  padding: var(--vtx-spacing-3);\r\n  outline: none;\r\n  overflow-y: auto;\r\n  word-wrap: break-word;\r\n}\r\n\r\n.vtx-richtext-container--sm .vtx-richtext-editor {\r\n  padding: var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-richtext-container--lg .vtx-richtext-editor {\r\n  padding: var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n.vtx-richtext-editor[contenteditable='true']:empty:before {\r\n  content: attr(data-placeholder);\r\n  color: var(--vtx-color-neutral-400);\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-richtext-editor[contenteditable='false'] {\r\n  cursor: not-allowed;\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n/* Editor content styling */\r\n.vtx-richtext-editor h1 {\r\n  font-size: var(--vtx-font-size-3xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  margin: var(--vtx-spacing-2) 0;\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-richtext-editor h2 {\r\n  font-size: var(--vtx-font-size-2xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  margin: var(--vtx-spacing-2) 0;\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-richtext-editor h3 {\r\n  font-size: var(--vtx-font-size-xl);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  margin: var(--vtx-spacing-2) 0;\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-richtext-editor p {\r\n  margin: var(--vtx-spacing-2) 0;\r\n}\r\n\r\n.vtx-richtext-editor ul,\r\n.vtx-richtext-editor ol {\r\n  margin: var(--vtx-spacing-2) 0;\r\n  padding-left: var(--vtx-spacing-6);\r\n}\r\n\r\n.vtx-richtext-editor li {\r\n  margin: var(--vtx-spacing-1) 0;\r\n}\r\n\r\n.vtx-richtext-editor a {\r\n  color: var(--vtx-color-primary-600);\r\n  text-decoration: underline;\r\n}\r\n\r\n.vtx-richtext-editor a:hover {\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-richtext-editor pre {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-sm);\r\n  padding: var(--vtx-spacing-2);\r\n  margin: var(--vtx-spacing-2) 0;\r\n  font-family: var(--vtx-font-family-mono);\r\n  font-size: var(--vtx-font-size-sm);\r\n  overflow-x: auto;\r\n}\r\n\r\n.vtx-richtext-editor b,\r\n.vtx-richtext-editor strong {\r\n  font-weight: var(--vtx-font-weight-bold);\r\n}\r\n\r\n.vtx-richtext-editor i,\r\n.vtx-richtext-editor em {\r\n  font-style: italic;\r\n}\r\n\r\n.vtx-richtext-editor u {\r\n  text-decoration: underline;\r\n}\r\n\r\n.vtx-richtext-editor s,\r\n.vtx-richtext-editor strike {\r\n  text-decoration: line-through;\r\n}\r\n\r\n/* Footer */\r\n.vtx-richtext-footer {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-2);\r\n  min-height: 20px;\r\n}\r\n\r\n.vtx-richtext-footer-left {\r\n  flex: 1;\r\n}\r\n\r\n/* Helper, error, and success text */\r\n.vtx-richtext-helper,\r\n.vtx-richtext-error,\r\n.vtx-richtext-success {\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  margin: 0;\r\n}\r\n\r\n.vtx-richtext-helper {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-richtext-error {\r\n  color: var(--vtx-color-error-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n.vtx-richtext-success {\r\n  color: var(--vtx-color-success-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n/* Character counter */\r\n.vtx-richtext-counter {\r\n  font-family: var(--vtx-font-family-mono);\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-500);\r\n  margin: 0;\r\n  white-space: nowrap;\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  transition: color var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-richtext-counter--near-limit {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-richtext-counter--at-limit {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Responsive adjustments */\r\n@media (max-width: 640px) {\r\n  .vtx-richtext-footer {\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n  }\r\n\r\n  .vtx-richtext-counter {\r\n    align-self: flex-end;\r\n  }\r\n\r\n  .vtx-richtext-toolbar {\r\n    gap: var(--vtx-spacing-0_5);\r\n  }\r\n\r\n  .vtx-richtext-toolbar-button {\r\n    min-width: 28px;\r\n    height: 28px;\r\n    padding: var(--vtx-spacing-0_5);\r\n    font-size: var(--vtx-font-size-xs);\r\n  }\r\n}\r\n");const Hn=["bold","italic","underline","strikethrough","h1","h2","h3","orderedList","unorderedList","link","alignLeft","alignCenter","alignRight","code","clearFormat","undo","redo"],Vn=a.forwardRef(({label:e,helperText:t,error:a,success:d,size:c,fullWidth:s=!0,clearable:v=!1,onClear:x,showCount:m=!1,maxLength:p,wrapperClassName:h="",labelClassName:u="",editorClassName:g="",toolbarClassName:b="",required:f=!1,disabled:y=!1,placeholder:w="Start typing...",value:k,defaultValue:_,onChange:N,minHeight:z=200,id:C,hideToolbar:S=!1,toolbarButtons:$=Hn},M)=>{const{theme:T}=kn(),D=c||T.defaultSize,j=or("richtext"),I=C||j,L=`${I}-helper`,A=`${I}-error`,R=`${I}-success`,B=l(null),[E,O]=i(!1),[F,W]=i(0),P=Boolean(a),H=Boolean(d)&&!P,V=v&&F>0&&!y,Y=[t&&!a&&!d&&L,a&&A,d&&R].filter(Boolean).join(" "),q=["vtx-richtext-wrapper",!s&&"vtx-richtext-wrapper--inline",h].filter(Boolean).join(" "),U=["vtx-richtext-container",`vtx-richtext-container--${D}`,P&&"vtx-richtext-container--error",H&&"vtx-richtext-container--success",y&&"vtx-richtext-container--disabled",E&&"vtx-richtext-container--focused"].filter(Boolean).join(" "),G=["vtx-richtext-editor",g].filter(Boolean).join(" "),X=["vtx-richtext-toolbar",b].filter(Boolean).join(" ");o(()=>{if(B.current&&!B.current.innerHTML){const r=k||_||"";B.current.innerHTML=r,K()}},[]),o(()=>{if(void 0!==k&&B.current){B.current.innerHTML!==k&&(B.current.innerHTML=k,K())}},[k]);const K=()=>{if(B.current){const r=B.current.innerText||"";W(r.length)}},Q=()=>{if(!B.current)return;const r=B.current.innerHTML,n=B.current.innerText||"";p&&n.length>p||(K(),null==N||N(r,n))},J=(r,n=void 0)=>{var e;document.execCommand(r,!1,n),null===(e=B.current)||void 0===e||e.focus()},Z=(m||p)&&void 0!==p,rr=p&&F>=.9*p,nr=p&&F>=p,er=r=>({bold:"B",italic:"I",underline:"U",strikethrough:"S",h1:"H1",h2:"H2",h3:"H3",orderedList:"1.",unorderedList:"•",link:"🔗",alignLeft:"⬅",alignCenter:"⬌",alignRight:"➡",code:"<>",clearFormat:"✕",undo:"↶",redo:"↷"}[r]),tr=r=>({bold:"Bold",italic:"Italic",underline:"Underline",strikethrough:"Strikethrough",h1:"Heading 1",h2:"Heading 2",h3:"Heading 3",orderedList:"Ordered List",unorderedList:"Unordered List",link:"Insert Link",alignLeft:"Align Left",alignCenter:"Align Center",alignRight:"Align Right",code:"Code Block",clearFormat:"Clear Formatting",undo:"Undo",redo:"Redo"}[r]);return n("div",{className:q,children:[e&&n("label",{htmlFor:I,className:`vtx-richtext-label ${u}`.trim(),children:[e,f&&n("span",{className:"vtx-richtext-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:U,children:[!S&&n("div",{className:X,role:"toolbar","aria-label":"Text formatting toolbar",children:[$.map(n=>r("button",{type:"button",className:"vtx-richtext-toolbar-button",onClick:()=>(r=>{if(!y){switch(r){case"bold":J("bold");break;case"italic":J("italic");break;case"underline":J("underline");break;case"strikethrough":J("strikeThrough");break;case"h1":J("formatBlock","<h1>");break;case"h2":J("formatBlock","<h2>");break;case"h3":J("formatBlock","<h3>");break;case"orderedList":J("insertOrderedList");break;case"unorderedList":J("insertUnorderedList");break;case"link":const r=prompt("Enter URL:");r&&J("createLink",r);break;case"alignLeft":J("justifyLeft");break;case"alignCenter":J("justifyCenter");break;case"alignRight":J("justifyRight");break;case"code":J("formatBlock","<pre>");break;case"clearFormat":J("removeFormat");break;case"undo":J("undo");break;case"redo":J("redo")}Q()}})(n),disabled:y,title:tr(n),"aria-label":tr(n),tabIndex:-1,children:er(n)},n)),V&&r("button",{type:"button",className:"vtx-richtext-toolbar-clear",onClick:()=>{var r;B.current&&(B.current.innerHTML="",K(),null==N||N("","")),null==x||x(),null===(r=B.current)||void 0===r||r.focus()},disabled:y,title:"Clear all content","aria-label":"Clear all content",tabIndex:-1,children:r(Cr,{size:14})})]}),r("div",{ref:r=>{B.current=r,"function"==typeof M?M(r):M&&(M.current=r)},id:I,className:G,contentEditable:!y,onInput:Q,onFocus:()=>O(!0),onBlur:()=>O(!1),role:"textbox","aria-multiline":"true","aria-invalid":P,"aria-describedby":Y||void 0,"aria-required":f,"data-placeholder":w,style:{minHeight:`${z}px`},suppressContentEditableWarning:!0})]}),n("div",{className:"vtx-richtext-footer",children:[n("div",{className:"vtx-richtext-footer-left",children:[t&&!a&&!d&&r("p",{id:L,className:"vtx-richtext-helper",children:t}),a&&r("p",{id:A,className:"vtx-richtext-error",role:"alert",children:a}),d&&r("p",{id:R,className:"vtx-richtext-success",role:"status",children:d})]}),Z&&n("p",{className:("vtx-richtext-counter "+(nr?"vtx-richtext-counter--at-limit":rr?"vtx-richtext-counter--near-limit":"")).trim(),"aria-live":"polite",children:[F," / ",p]})]})]})});Vn.displayName="RichTextEditor";cn(".vtx-select-wrapper {\r\n  display: inline-flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-select-wrapper--full-width {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-select-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-select-label__required {\r\n  color: var(--vtx-color-error-600);\r\n  margin-left: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-select-container {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-select-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.vtx-select-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-select-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-select-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-select-container--sm {\r\n  min-height: 32px;\r\n}\r\n\r\n.vtx-select-container--md {\r\n  min-height: 40px;\r\n}\r\n\r\n.vtx-select-container--lg {\r\n  min-height: 48px;\r\n}\r\n\r\n.vtx-select {\r\n  flex: 1;\r\n  width: 100%;\r\n  min-width: 0;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  color: var(--vtx-color-neutral-900);\r\n  background: transparent;\r\n  border: none;\r\n  outline: none;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  padding-right: var(--vtx-spacing-8);\r\n  cursor: pointer;\r\n  appearance: none;\r\n}\r\n\r\n.vtx-select:disabled {\r\n  cursor: not-allowed;\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n.vtx-select-container--sm .vtx-select {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  padding-right: var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-select-container--lg .vtx-select {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  padding-right: var(--vtx-spacing-10);\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n/* Dropdown icon */\r\n.vtx-select-icon {\r\n  position: absolute;\r\n  right: var(--vtx-spacing-3);\r\n  display: inline-flex;\r\n  align-items: center;\r\n  color: var(--vtx-color-neutral-500);\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-select-container--disabled .vtx-select-icon {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n/* Loading Spinner in Icon Area */\r\n.vtx-select-icon-spinner {\r\n  color: var(--vtx-select-loader-color, var(--vtx-color-primary-500));\r\n  animation: vtx-select-spin var(--vtx-select-loader-speed, 0.8s) linear infinite;\r\n}\r\n\r\n.vtx-select-icon-spinner-track {\r\n  opacity: var(--vtx-select-loader-track-opacity, 0.25);\r\n}\r\n\r\n.vtx-select-icon-spinner-path {\r\n  opacity: var(--vtx-select-loader-path-opacity, 1);\r\n}\r\n\r\n@keyframes vtx-select-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 and error text */\r\n.vtx-select-helper,\r\n.vtx-select-error {\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  margin: 0;\r\n}\r\n\r\n.vtx-select-helper {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-select-error {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n");const Yn=a.forwardRef(({label:e,helperText:t,error:a,success:o,size:i,fullWidth:l=!1,options:d,placeholder:c,className:s="",wrapperClassName:v="",id:x,disabled:m=!1,required:p=!1,grouped:h=!1,getOptionLabel:u="label",getOptionValue:g="value",getOptionDisabled:b="disabled",getOptionGroup:f="group",onSelectChange:y,onChange:w,loading:k=!1,..._},N)=>{const{theme:z}=kn(),C=i||z.defaultSize,S=or("select"),$=x||S,M=`${$}-helper`,T=`${$}-error`,D=`${$}-success`,j=(r,n)=>"function"==typeof n?n(r):"object"==typeof r?r[n]:r,I=Boolean(a),L=Boolean(o)&&!I,A=[t&&!a&&!o&&M,a&&T,o&&D].filter(Boolean).join(" "),R=["vtx-select-wrapper",l&&"vtx-select-wrapper--full-width",v].filter(Boolean).join(" "),B=["vtx-select-container",`vtx-select-container--${C}`,I&&"vtx-select-container--error",L&&"vtx-select-container--success",m&&"vtx-select-container--disabled",s].filter(Boolean).join(" ");return n("div",{className:R,children:[e&&n("label",{htmlFor:$,className:"vtx-select-label",children:[e,p&&n("span",{className:"vtx-select-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:B,children:[n("select",{ref:N,id:$,className:"vtx-select",disabled:m,required:p,"aria-invalid":I,"aria-describedby":A||void 0,onChange:r=>{if(null==w||w(r),y){const n=d.find(n=>String(j(n,g))===r.target.value);y(r.target.value,n)}},..._,children:[c&&r("option",{value:"",disabled:!0,children:c}),(()=>{if(!h)return d.map((n,e)=>{const t=j(n,g),a=j(n,u),o=j(n,b);return r("option",{value:t,disabled:o,children:a},t||e)});const n=d.reduce((r,n)=>{const e=j(n,f)||"Other";return r[e]||(r[e]=[]),r[e].push(n),r},{});return Object.entries(n).map(([n,e])=>r("optgroup",{label:n,children:e.map((n,e)=>{const t=j(n,g),a=j(n,u),o=j(n,b);return r("option",{value:t,disabled:o,children:a},t||e)})},n))})()]}),r("span",{className:"vtx-select-icon","aria-hidden":"true",children:k?n("svg",{className:"vtx-select-icon-spinner",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[r("circle",{className:"vtx-select-icon-spinner-track",cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"2"}),r("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("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:r("path",{d:"M4 6L8 10L12 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),t&&!a&&!o&&r("p",{id:M,className:"vtx-select-helper",children:t}),a&&r("p",{id:T,className:"vtx-select-error",role:"alert",children:a}),o&&r("p",{id:D,className:"vtx-select-success",role:"status",children:o})]})});Yn.displayName="Select";const qn=gr(Yn);cn(".vtx-textarea-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: var(--vtx-spacing-1);\r\n  width: 100%;\r\n}\r\n\r\n.vtx-textarea-wrapper--inline {\r\n  display: inline-flex;\r\n  width: auto;\r\n}\r\n\r\n.vtx-textarea-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-textarea-label__required {\r\n  color: var(--vtx-color-error-600);\r\n  margin-left: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-textarea-container {\r\n  position: relative;\r\n  display: flex;\r\n  background-color: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-textarea-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.vtx-textarea-container--error {\r\n  border-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-textarea-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-textarea-container--success {\r\n  border-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-textarea-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-textarea-container--disabled {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Sizes */\r\n.vtx-textarea-container--sm .vtx-textarea {\r\n  padding: var(--vtx-spacing-1_5) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-textarea-container--md .vtx-textarea {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-base);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-textarea-container--lg .vtx-textarea {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-lg);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n}\r\n\r\n.vtx-textarea {\r\n  flex: 1;\r\n  width: 100%;\r\n  min-width: 0;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  color: var(--vtx-color-neutral-900);\r\n  background: transparent;\r\n  border: none;\r\n  outline: none;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  resize: vertical;\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-textarea--auto-resize {\r\n  resize: none;\r\n  overflow-y: hidden;\r\n}\r\n\r\n.vtx-textarea::placeholder {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-textarea:disabled {\r\n  cursor: not-allowed;\r\n  color: var(--vtx-color-neutral-500);\r\n  resize: none;\r\n}\r\n\r\n.vtx-textarea-container--with-clear .vtx-textarea {\r\n  padding-right: var(--vtx-spacing-10);\r\n}\r\n\r\n/* Clear button */\r\n.vtx-textarea-clear {\r\n  position: absolute;\r\n  top: var(--vtx-spacing-2);\r\n  right: var(--vtx-spacing-2);\r\n  display: inline-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  background-color: var(--vtx-color-neutral-200);\r\n  border: none;\r\n  border-radius: var(--vtx-radius-full);\r\n  color: var(--vtx-color-neutral-600);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n  opacity: 0.8;\r\n}\r\n\r\n.vtx-textarea-clear:hover {\r\n  background-color: var(--vtx-color-neutral-300);\r\n  opacity: 1;\r\n}\r\n\r\n.vtx-textarea-clear:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 1px;\r\n}\r\n\r\n.vtx-textarea-clear:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n/* Footer with helper text and counter */\r\n.vtx-textarea-footer {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-2);\r\n  min-height: 20px;\r\n}\r\n\r\n.vtx-textarea-footer-left {\r\n  flex: 1;\r\n}\r\n\r\n/* Helper, error, and success text */\r\n.vtx-textarea-helper,\r\n.vtx-textarea-error,\r\n.vtx-textarea-success {\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  margin: 0;\r\n}\r\n\r\n.vtx-textarea-helper {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-textarea-error {\r\n  color: var(--vtx-color-error-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n.vtx-textarea-success {\r\n  color: var(--vtx-color-success-600);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n/* Character counter */\r\n.vtx-textarea-counter {\r\n  font-family: var(--vtx-font-family-mono);\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-500);\r\n  margin: 0;\r\n  white-space: nowrap;\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  transition: color var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-textarea-counter--near-limit {\r\n  color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-textarea-counter--at-limit {\r\n  color: var(--vtx-color-error-600);\r\n}\r\n\r\n/* Responsive adjustments */\r\n@media (max-width: 640px) {\r\n  .vtx-textarea-footer {\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n  }\r\n  \r\n  .vtx-textarea-counter {\r\n    align-self: flex-end;\r\n  }\r\n}\r\n");const Un=a.forwardRef(({label:e,helperText:t,error:o,success:i,size:l,fullWidth:d=!0,clearable:c=!1,onClear:s,showCount:v=!1,className:x="",wrapperClassName:m="",labelClassName:p="",textareaClassName:h="",id:u,disabled:g=!1,required:b=!1,value:f,maxLength:y,autoResize:w=!1,minRows:k=3,maxRows:_,rows:N,onChange:z,...C},S)=>{const{theme:$}=kn(),M=l||$.defaultSize,T=or("textarea"),D=u||T,j=`${D}-helper`,I=`${D}-error`,L=`${D}-success`,A=a.useRef(null),R=Boolean(o),B=Boolean(i)&&!R,E=c&&f&&String(f).length>0&&!g,O=[t&&!o&&!i&&j,o&&I,i&&L].filter(Boolean).join(" "),F=["vtx-textarea-wrapper",!d&&"vtx-textarea-wrapper--inline",m].filter(Boolean).join(" "),W=["vtx-textarea-container",`vtx-textarea-container--${M}`,R&&"vtx-textarea-container--error",B&&"vtx-textarea-container--success",g&&"vtx-textarea-container--disabled",E&&"vtx-textarea-container--with-clear",x].filter(Boolean).join(" "),P=["vtx-textarea",w&&"vtx-textarea--auto-resize",h].filter(Boolean).join(" "),H=f?String(f).length:0,V=(v||y)&&void 0!==y;a.useEffect(()=>{if(w&&A.current){const r=A.current;r.style.height="auto";let n=r.scrollHeight;const e=parseInt(getComputedStyle(r).lineHeight);if(k){const r=e*k;n=Math.max(n,r)}if(_){const r=e*_;n=Math.min(n,r)}r.style.height=`${n}px`}},[f,w,k,_]);const Y=w?k:N||k,q=y&&H>=.9*y,U=y&&H>=y;return n("div",{className:F,children:[e&&n("label",{htmlFor:D,className:`vtx-textarea-label ${p}`.trim(),children:[e,b&&n("span",{className:"vtx-textarea-label__required","aria-label":"required",children:[" ","*"]})]}),n("div",{className:W,children:[r("textarea",{ref:r=>{A.current=r,"function"==typeof S?S(r):S&&(S.current=r)},id:D,className:P,disabled:g,required:b,value:f,maxLength:y,rows:Y,"aria-invalid":R,"aria-describedby":O||void 0,onChange:r=>{null==z||z(r)},...C}),E&&r("button",{type:"button",className:"vtx-textarea-clear",onClick:()=>{null==s||s(),A.current&&A.current.focus()},"aria-label":"Clear textarea",tabIndex:-1,children:r(Cr,{size:16})})]}),n("div",{className:"vtx-textarea-footer",children:[n("div",{className:"vtx-textarea-footer-left",children:[t&&!o&&!i&&r("p",{id:j,className:"vtx-textarea-helper",children:t}),o&&r("p",{id:I,className:"vtx-textarea-error",role:"alert",children:o}),i&&r("p",{id:L,className:"vtx-textarea-success",role:"status",children:i})]}),V&&n("p",{className:("vtx-textarea-counter "+(U?"vtx-textarea-counter--at-limit":q?"vtx-textarea-counter--near-limit":"")).trim(),"aria-live":"polite",children:[H," / ",y]})]})]})});Un.displayName="Textarea";const Gn=gr(Un),Xn=["Su","Mo","Tu","We","Th","Fr","Sa"],Kn=["January","February","March","April","May","June","July","August","September","October","November","December"],Qn=({value:e,onChange:t,minDate:o,maxDate:i,disabledDates:l=[],currentMonth:d,onMonthChange:c,isDateDisabled:s,rangeValue:v,onRangeChange:x,isRangeMode:m=!1})=>{const p=new Date,[h,u]=a.useState(d||e||p);a.useEffect(()=>{d&&u(d)},[d]);const g=r=>{const n=new Date(h.getFullYear(),h.getMonth()+r,1);u(n),null==c||c(n)},b=r=>!!(o&&r<o)||(!!(i&&r>i)||!!l.some(n=>f(n,r))),f=(r,n)=>r.getFullYear()===n.getFullYear()&&r.getMonth()===n.getMonth()&&r.getDate()===n.getDate(),y=(()=>{const r=h.getFullYear(),n=h.getMonth(),e=new Date(r,n,1),t=new Date(e);t.setDate(t.getDate()-e.getDay());const a=[],o=new Date(t);o.setDate(o.getDate()+41);const i=new Date(t);for(;i<=o;)a.push(new Date(i)),i.setDate(i.getDate()+1);return a})();return n("div",{className:"vtx-datepicker__calendar",children:[n("div",{className:"vtx-datepicker__header",children:[r("button",{className:"vtx-datepicker__nav-button",onClick:()=>g(-1),type:"button","aria-label":"Previous month",children:r(Lr,{size:16})}),n("div",{className:"vtx-datepicker__month-year",children:[Kn[h.getMonth()]," ",h.getFullYear()]}),r("button",{className:"vtx-datepicker__nav-button",onClick:()=>g(1),type:"button","aria-label":"Next month",children:r(Ar,{size:16})})]}),r("div",{className:"vtx-datepicker__weekdays",children:Xn.map(n=>r("div",{className:"vtx-datepicker__weekday",children:n},n))}),r("div",{className:"vtx-datepicker__days",children:y.map((n,a)=>{const o=!!e&&f(n,e),i=f(n,p),l=!(r=>r.getMonth()===h.getMonth()&&r.getFullYear()===h.getFullYear())(n),d=b(n)||(null==s?void 0:s(n))||!1,c=(r=>{if(!m||!v)return!1;const[n,e]=v;return!(!n||!e)&&r>=n&&r<=e})(n),u=(r=>{if(!m||!v)return!1;const[n]=v;return!!n&&f(r,n)})(n),g=(r=>{if(!m||!v)return!1;const[,n]=v;return!!n&&f(r,n)})(n);return r("button",{className:["vtx-datepicker__day",o&&"vtx-datepicker__day--selected",i&&"vtx-datepicker__day--today",l&&"vtx-datepicker__day--other-month",d&&"vtx-datepicker__day--disabled",c&&"vtx-datepicker__day--in-range",u&&"vtx-datepicker__day--range-start",g&&"vtx-datepicker__day--range-end"].filter(Boolean).join(" "),onClick:()=>(r=>{if(!(null==s?void 0:s(r))&&!b(r))if(m&&x){const[n,e]=v||[null,null];!n||n&&e?x([r,null]):n&&!e&&x(r>=n?[n,r]:[r,n])}else null==t||t(r)})(n),disabled:d,type:"button","aria-label":n.toLocaleDateString(),children:n.getDate()},a)})})]})};cn(".vtx-datepicker {\r\n  position: relative;\r\n}\r\n\r\n.vtx-datepicker__input {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-datepicker__input:read-only {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-datepicker__input .vtx-icon-calendar {\r\n  color: var(--vtx-color-neutral-500);\r\n  transition: color var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-datepicker__input:hover .vtx-icon-calendar,\r\n.vtx-datepicker__input:focus-within .vtx-icon-calendar {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-datepicker__input .vtx-icon-close {\r\n  color: var(--vtx-color-neutral-400);\r\n  transition: color var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-datepicker__input .vtx-icon-close:hover {\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-datepicker__dropdown {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 0;\r\n  z-index: 1000;\r\n  margin-top: var(--vtx-spacing-1);\r\n  background: white;\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-lg);\r\n  box-shadow: var(--vtx-shadow-lg);\r\n  min-width: 320px;\r\n  animation: vtx-datepicker-dropdown-enter 150ms ease-out;\r\n}\r\n\r\n@keyframes vtx-datepicker-dropdown-enter {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(-4px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n.vtx-datepicker__calendar {\r\n  padding: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-datepicker__header {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  margin-bottom: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-datepicker__nav-button {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 32px;\r\n  height: 32px;\r\n  border: none;\r\n  background: none;\r\n  border-radius: var(--vtx-radius-md);\r\n  cursor: pointer;\r\n  color: var(--vtx-color-neutral-600);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-datepicker__nav-button:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-datepicker__nav-button:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 1px;\r\n}\r\n\r\n.vtx-datepicker__month-year {\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-datepicker__weekdays {\r\n  display: grid;\r\n  grid-template-columns: repeat(7, 1fr);\r\n  gap: 1px;\r\n  margin-bottom: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-datepicker__weekday {\r\n  padding: var(--vtx-spacing-2);\r\n  text-align: center;\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  color: var(--vtx-color-neutral-500);\r\n  text-transform: uppercase;\r\n}\r\n\r\n.vtx-datepicker__days {\r\n  display: grid;\r\n  grid-template-columns: repeat(7, 1fr);\r\n  gap: 1px;\r\n}\r\n\r\n.vtx-datepicker__day {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 36px;\r\n  height: 36px;\r\n  border: none;\r\n  background: none;\r\n  border-radius: var(--vtx-radius-md);\r\n  cursor: pointer;\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-700);\r\n  transition: all var(--vtx-transition-base);\r\n  position: relative;\r\n}\r\n\r\n.vtx-datepicker__day:hover:not(:disabled) {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-datepicker__day:focus {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 1px;\r\n}\r\n\r\n.vtx-datepicker__day--selected {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-datepicker__day--selected:hover {\r\n  background-color: var(--vtx-color-primary-700);\r\n  color: white;\r\n}\r\n\r\n.vtx-datepicker__day--today {\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n}\r\n\r\n.vtx-datepicker__day--today:not(.vtx-datepicker__day--selected)::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: 2px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  width: 4px;\r\n  height: 4px;\r\n  border-radius: 50%;\r\n  background-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-datepicker__day--other-month {\r\n  color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n.vtx-datepicker__day--disabled {\r\n  color: var(--vtx-color-neutral-300);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-datepicker__day--in-range {\r\n  background-color: var(--vtx-color-primary-100);\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-datepicker__day--range-start,\r\n.vtx-datepicker__day--range-end {\r\n  background-color: var(--vtx-color-primary-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-datepicker__day--range-start:hover,\r\n.vtx-datepicker__day--range-end:hover {\r\n  background-color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-datepicker__footer {\r\n  border-top: 1px solid var(--vtx-color-neutral-200);\r\n  padding: var(--vtx-spacing-3);\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-datepicker__actions {\r\n  display: flex;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-datepicker__today-button {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-primary-600);\r\n  border: none;\r\n  background: none;\r\n  border-radius: var(--vtx-radius-sm);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-datepicker__today-button:hover {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-datepicker__range-input {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-datepicker__range-separator {\r\n  color: var(--vtx-color-neutral-400);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-datepicker__preset-button {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  width: 100%;\r\n  text-align: left;\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-neutral-700);\r\n  border: none;\r\n  background: none;\r\n  border-radius: var(--vtx-radius-sm);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-datepicker__preset-button:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-datepicker__preset-button--active {\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-datepicker__presets {\r\n  border-right: 1px solid var(--vtx-color-neutral-200);\r\n  padding: var(--vtx-spacing-3);\r\n  min-width: 140px;\r\n}\r\n\r\n.vtx-datepicker__content {\r\n  display: flex;\r\n}\r\n\r\n.vtx-datepicker__calendar-container {\r\n  flex: 1;\r\n}");const Jn=(r,n="MM/DD/YYYY")=>{if(!r)return"";const e=(r.getMonth()+1).toString().padStart(2,"0"),t=r.getDate().toString().padStart(2,"0"),a=r.getFullYear().toString();return n.replace("MM",e).replace("DD",t).replace("YYYY",a).replace("M",(r.getMonth()+1).toString()).replace("D",r.getDate().toString()).replace("YY",a.slice(-2))},Zn=r=>{if(!r)return null;try{const n=r.split("/");if(3===n.length){const r=parseInt(n[0],10)-1,e=parseInt(n[1],10),t=parseInt(n[2],10),a=new Date(t,r,e);if(a.getMonth()===r&&a.getDate()===e&&a.getFullYear()===t)return a}return null}catch{return null}},re=a.forwardRef(({value:e=null,onChange:t,label:a,placeholder:d="Select date",helperText:c,error:s,success:v,size:x,fullWidth:m=!1,disabled:p=!1,required:h=!1,minDate:u,maxDate:g,disabledDates:b,isDateDisabled:f,format:y="MM/DD/YYYY",showToday:w=!0,className:k="",inputClassName:_="",dropdownClassName:N="",clearable:z=!1,...C},S)=>{const[$,M]=i(!1),[T,D]=i(()=>Jn(e,y)),[j,I]=i(()=>e||new Date),L=l(null),A=l(null);o(()=>{D(Jn(e,y)),e&&I(e)},[e,y]),o(()=>{const r=r=>{L.current&&!L.current.contains(r.target)&&M(!1)},n=r=>{"Escape"===r.key&&M(!1)};return $&&(document.addEventListener("mousedown",r),document.addEventListener("keydown",n)),()=>{document.removeEventListener("mousedown",r),document.removeEventListener("keydown",n)}},[$]);const R=r=>{null==t||t(r),D(Jn(r,y)),M(!1)};return n("div",{ref:L,className:`vtx-datepicker ${k}`.trim(),children:[r(Ln,{ref:S,label:a,value:T,onChange:r=>{const n=r.target.value;D(n);const e=Zn(n);e&&(null==t||t(e),I(e))},onBlur:()=>{const r=Zn(T);r?D(Jn(r,y)):T&&!r&&D(Jn(e,y))},onClick:()=>{p||M(!$)},placeholder:d,helperText:c,error:s,success:v,size:x,fullWidth:m,disabled:p,required:h,readOnly:!1,rightIcon:r(Sr,{size:16}),className:`vtx-datepicker__input ${_}`.trim(),clearable:z,onClear:()=>{null==t||t(null),D(""),M(!1)},...C}),$&&n("div",{ref:A,className:`vtx-datepicker__dropdown ${N}`.trim(),children:[r(Qn,{value:e,onChange:R,currentMonth:j,onMonthChange:I,minDate:u,maxDate:g,disabledDates:b,isDateDisabled:f}),w&&r("div",{className:"vtx-datepicker__footer",children:r("button",{type:"button",className:"vtx-datepicker__today-button",onClick:()=>{const r=new Date;R(r)},children:"Today"})})]})]})});re.displayName="DatePicker";const ne=gr(re),ee=(r,n="MM/DD/YYYY")=>{if(!r)return"";const e=(r.getMonth()+1).toString().padStart(2,"0"),t=r.getDate().toString().padStart(2,"0"),a=r.getFullYear().toString();return n.replace("MM",e).replace("DD",t).replace("YYYY",a).replace("M",(r.getMonth()+1).toString()).replace("D",r.getDate().toString()).replace("YY",a.slice(-2))},te=(r,n,e)=>{const t=ee(r.start,n),a=ee(r.end,n);return t&&a?`${t} ${e} ${a}`:t||""},ae=()=>{const r=new Date,n=new Date(r);n.setDate(n.getDate()-1);const e=new Date(r);e.setDate(r.getDate()-r.getDay());const t=new Date(e);t.setDate(e.getDate()-7);const a=new Date(e);a.setDate(e.getDate()-1);const o=new Date(r.getFullYear(),r.getMonth(),1),i=new Date(r.getFullYear(),r.getMonth()-1,1),l=new Date(r.getFullYear(),r.getMonth(),0),d=new Date(r);d.setDate(r.getDate()-6);const c=new Date(r);return c.setDate(r.getDate()-29),[{label:"Today",range:{start:new Date(r),end:new Date(r)}},{label:"Yesterday",range:{start:new Date(n),end:new Date(n)}},{label:"Last 7 days",range:{start:new Date(d),end:new Date(r)}},{label:"Last 30 days",range:{start:new Date(c),end:new Date(r)}},{label:"This week",range:{start:new Date(e),end:new Date(r)}},{label:"Last week",range:{start:new Date(t),end:new Date(a)}},{label:"This month",range:{start:new Date(o),end:new Date(r)}},{label:"Last month",range:{start:new Date(i),end:new Date(l)}}]},oe=a.forwardRef(({value:e={start:null,end:null},onChange:t,label:a,startPlaceholder:d="Start date",endPlaceholder:c="End date",helperText:s,error:v,success:x,size:m,fullWidth:p=!1,disabled:h=!1,required:u=!1,minDate:g,maxDate:b,disabledDates:f,isDateDisabled:y,format:w="MM/DD/YYYY",separator:k="to",presets:_=ae(),className:N="",inputClassName:z="",dropdownClassName:C="",clearable:S=!1,...$},M)=>{const[T,D]=i(!1),[j,I]=i(()=>te(e,w,k)),[L,A]=i(()=>e.start||new Date),[R,B]=i(null),E=l(null),O=l(null);o(()=>{I(te(e,w,k)),e.start&&A(e.start);const r=_.find(r=>{var n,t,a,o;return(null===(n=r.range.start)||void 0===n?void 0:n.getTime())===(null===(t=e.start)||void 0===t?void 0:t.getTime())&&(null===(a=r.range.end)||void 0===a?void 0:a.getTime())===(null===(o=e.end)||void 0===o?void 0:o.getTime())});B((null==r?void 0:r.label)||null)},[e,w,k,_]),o(()=>{const r=r=>{E.current&&!E.current.contains(r.target)&&D(!1)},n=r=>{"Escape"===r.key&&D(!1)};return T&&(document.addEventListener("mousedown",r),document.addEventListener("keydown",n)),()=>{document.removeEventListener("mousedown",r),document.removeEventListener("keydown",n)}},[T]);return n("div",{ref:E,className:`vtx-datepicker ${N}`.trim(),children:[r(Ln,{ref:M,label:a,value:j,onClick:()=>{h||D(!T)},placeholder:`${d} ${k} ${c}`,helperText:s,error:v,success:x,size:m,fullWidth:p,disabled:h,required:u,readOnly:!0,rightIcon:r(Sr,{size:16}),className:`vtx-datepicker__input ${z}`.trim(),clearable:S,onClear:()=>{null==t||t({start:null,end:null}),I(""),B(null),D(!1)},...$}),T&&r("div",{ref:O,className:`vtx-datepicker__dropdown ${C}`.trim(),children:n("div",{className:"vtx-datepicker__content",children:[_.length>0&&r("div",{className:"vtx-datepicker__presets",children:_.map(n=>r("button",{type:"button",className:["vtx-datepicker__preset-button",R===n.label&&"vtx-datepicker__preset-button--active"].filter(Boolean).join(" "),onClick:()=>(r=>{null==t||t(r.range),B(r.label),D(!1)})(n),children:n.label},n.label))}),r("div",{className:"vtx-datepicker__calendar-container",children:r(Qn,{rangeValue:[e.start,e.end],onRangeChange:r=>{const[n,e]=r;null==t||t({start:n,end:e}),n&&e&&D(!1)},currentMonth:L,onMonthChange:A,minDate:g,maxDate:b,disabledDates:f,isDateDisabled:y,isRangeMode:!0,onChange:()=>{}})})]})})]})});oe.displayName="DateRangePicker";const ie=gr(oe),le=a.forwardRef(({item:t,isOpen:a,onToggle:o,variant:i="default",size:d="md",showChevron:c=!0,chevronPosition:s="right",expandedIcon:v,collapsedIcon:x,iconType:m="chevron",loading:p=!1,disabled:h=!1,disableAnimations:u=!1},g)=>{const b=l(null),{id:f,header:y,children:w,disabled:k,className:_,loading:N,status:z="default",icon:C,dataTestId:S}=t,$=h||k,M=p||N,T=()=>{$||M||o()},D=()=>r("div",C?{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-custom-icon`,children:a?C.expanded:C.collapsed}:"custom"===m&&v&&x?{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-custom-icon`,children:a?v:x}:"plus-minus"===m?{className:"accordion-item-chevron accordion-item-chevron--plus-minus "+(a?"open":""),"data-testid":`${S||f}-plus-minus-icon`,children:a?r(Tr,{size:16,"aria-hidden":"true"}):r(e,{children:r(Mr,{size:16,"aria-hidden":"true"})})}:{className:"accordion-item-chevron "+(a?"open":""),"data-testid":`${S||f}-chevron-icon`,children:r($r,{size:16,"aria-hidden":"true",style:{transform:a?"rotate(180deg)":void 0,transition:"transform 0.2s"}})});return n("div",{ref:g,className:`\n          accordion-item\n          accordion-item--${i}\n          accordion-item--${d}\n          ${a?"accordion-item--open":""}\n          ${$?"accordion-item--disabled":""}\n          ${M?"accordion-item--loading":""}\n          ${"default"!==z?`accordion-item--${z}`:""}\n          ${_||""}\n        `.trim(),"data-testid":S,"aria-expanded":a,"aria-disabled":$,"aria-busy":M,children:[n("div",{className:"accordion-item-header",role:"button",tabIndex:$||M?-1:0,"aria-expanded":a,"aria-controls":`accordion-content-${f}`,"aria-disabled":$,"aria-busy":M,"aria-describedby":"default"!==z?`accordion-status-${f}`:void 0,onClick:T,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),T())},"data-testid":`${S||f}-header`,children:["left"===s&&c&&D(),r("div",{className:"accordion-item-header-content",children:y}),"right"===s&&c&&D()]}),r("div",{id:`accordion-content-${f}`,className:"accordion-item-content "+(a?"accordion-item-content--open":""),role:"region","aria-labelledby":`accordion-header-${f}`,ref:b,style:{maxHeight:u?a?"none":"0":a?"500px":"0",transition:u?"none":void 0},"data-testid":`${S||f}-content`,children:n("div",{className:"accordion-item-body",children:["default"!==z&&r("div",{id:`accordion-status-${f}`,className:`accordion-status accordion-status--${z}`,"aria-live":"polite",children:n("span",{className:"visually-hidden",children:["Status: ",z]})}),w]})})]})});le.displayName="AccordionItem";cn("/* =============================================================================\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 de=a.forwardRef(({items:n,children:e,allowMultiple:t=!1,defaultOpenItems:a=[],openItems:o,onToggle:l,variant:d="default",size:c="md",className:v="",style:x,showChevron:h=!0,chevronPosition:u="right",expandedIcon:g,collapsedIcon:b,iconType:f="chevron",showDivider:y=!0,collapsible:w=!0,loading:k=!1,disabled:_=!1,spacing:N="default",disableAnimations:z=!1,...C},S)=>{const[$,M]=i(a),T=void 0!==o?o:$,D=void 0!==o,j=n||m.toArray(e).filter(r=>p(r)).map((r,n)=>{if(p(r)&&r.props){const e=r;return{id:e.props.id||`accordion-item-${n}`,header:e.props.header||`Item ${n+1}`,children:e.props.children,disabled:e.props.disabled,className:e.props.className}}return{id:`accordion-item-${n}`,header:`Item ${n+1}`,children:r}}),I=s(r=>{let n;n=t?T.includes(r)?T.filter(n=>n!==r):[...T,r]:T.includes(r)?w?[]:T:[r],D||M(n),null==l||l(n)},[t,w,T,D,l]);return r("div",{ref:S,className:`\n          accordion\n          accordion--${d}\n          accordion--${c}\n          ${y?"accordion--divider":""}\n          ${"compact"===N?"accordion--compact":""}\n          ${"spacious"===N?"accordion--spacious":""}\n          ${z?"accordion--no-animation":""}\n          ${k?"accordion--loading":""}\n          ${_?"accordion--disabled":""}\n          ${v}\n        `.trim(),style:x,role:"presentation","aria-busy":k,...C,children:j.map(n=>r(le,{item:n,isOpen:T.includes(n.id),onToggle:()=>I(n.id),variant:d,size:c,showChevron:h,chevronPosition:u,expandedIcon:g,collapsedIcon:b,iconType:f,loading:k,disabled:_,spacing:N,disableAnimations:z},n.id))})});de.displayName="Accordion";cn("/* Flex Component */\r\n.vtx-flex {\r\n  display: flex;\r\n  gap: var(--vtx-flex-gap, 0);\r\n  row-gap: var(--vtx-flex-row-gap, var(--vtx-flex-gap, 0));\r\n  column-gap: var(--vtx-flex-column-gap, var(--vtx-flex-gap, 0));\r\n}\r\n\r\n/* Full width modifier */\r\n.vtx-flex--full-width {\r\n  width: 100%;\r\n}\r\n\r\n/* Inline variant */\r\n.vtx-flex--inline {\r\n  display: inline-flex;\r\n}\r\n\r\n/* Direction variants */\r\n.vtx-flex--column {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-flex--row-reverse {\r\n  flex-direction: row-reverse;\r\n}\r\n\r\n.vtx-flex--column-reverse {\r\n  flex-direction: column-reverse;\r\n}\r\n\r\n/* Wrap variants */\r\n.vtx-flex--wrap {\r\n  flex-wrap: wrap;\r\n}\r\n\r\n.vtx-flex--wrap-reverse {\r\n  flex-wrap: wrap-reverse;\r\n}\r\n\r\n/* Justify content variants */\r\n.vtx-flex--justify-start {\r\n  justify-content: flex-start;\r\n}\r\n\r\n.vtx-flex--justify-end {\r\n  justify-content: flex-end;\r\n}\r\n\r\n.vtx-flex--justify-center {\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-flex--justify-between {\r\n  justify-content: space-between;\r\n}\r\n\r\n.vtx-flex--justify-around {\r\n  justify-content: space-around;\r\n}\r\n\r\n.vtx-flex--justify-evenly {\r\n  justify-content: space-evenly;\r\n}\r\n\r\n/* Align items variants */\r\n.vtx-flex--align-start {\r\n  align-items: flex-start;\r\n}\r\n\r\n.vtx-flex--align-end {\r\n  align-items: flex-end;\r\n}\r\n\r\n.vtx-flex--align-center {\r\n  align-items: center;\r\n}\r\n\r\n.vtx-flex--align-baseline {\r\n  align-items: baseline;\r\n}\r\n\r\n.vtx-flex--align-stretch {\r\n  align-items: stretch;\r\n}\r\n\r\n/* Align content variants (for multi-line) */\r\n.vtx-flex--align-content-start {\r\n  align-content: flex-start;\r\n}\r\n\r\n.vtx-flex--align-content-end {\r\n  align-content: flex-end;\r\n}\r\n\r\n.vtx-flex--align-content-center {\r\n  align-content: center;\r\n}\r\n\r\n.vtx-flex--align-content-between {\r\n  align-content: space-between;\r\n}\r\n\r\n.vtx-flex--align-content-around {\r\n  align-content: space-around;\r\n}\r\n\r\n.vtx-flex--align-content-stretch {\r\n  align-content: stretch;\r\n}\r\n");const ce=a.forwardRef(({children:n,direction:e="row",wrap:t="nowrap",justify:a="start",align:o="stretch",alignContent:i,gap:l,rowGap:d,columnGap:c,inline:s=!1,fullWidth:v=!1,grow:x,shrink:m,basis:p,className:h="",as:u="div",style:g,...b},f)=>{const y=u,w=["vtx-flex",s&&"vtx-flex--inline",v&&"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!==c&&(k["--vtx-flex-column-gap"]="number"==typeof c?`${c}px`:c),void 0!==x&&(k.flexGrow=x),void 0!==m&&(k.flexShrink=m),void 0!==p&&(k.flexBasis="number"==typeof p?`${p}px`:p),r(y,{ref:f,className:w,style:k,...b,children:n})});ce.displayName="Flex";const se=gr(ce);cn("/* ===== Text Component Base Styles ===== */\r\n.vtx-text {\r\n  margin: 0;\r\n  padding: 0;\r\n  font-family: var(--vtx-font-family-sans);\r\n  color: inherit;\r\n  transition: color var(--vtx-transition-fast);\r\n}\r\n\r\n/* ===== Typography Variants ===== */\r\n\r\n/* ===== Headings with Fluid Typography ===== */\r\n.vtx-text--h1 {\r\n  font-size: clamp(2.25rem, 5vw + 1rem, 3.75rem);\r\n  font-weight: var(--vtx-text-h1-font-weight, 700);\r\n  line-height: var(--vtx-text-h1-line-height, 1.2);\r\n  letter-spacing: var(--vtx-text-h1-letter-spacing, -0.025em);\r\n  margin-bottom: clamp(1rem, 2vw + 0.5rem, 1.5rem);\r\n}\r\n\r\n.vtx-text--h2 {\r\n  font-size: clamp(1.875rem, 4vw + 0.75rem, 3rem);\r\n  font-weight: var(--vtx-text-h2-font-weight, 700);\r\n  line-height: var(--vtx-text-h2-line-height, 1.25);\r\n  letter-spacing: var(--vtx-text-h2-letter-spacing, -0.025em);\r\n  margin-bottom: clamp(0.875rem, 1.75vw + 0.5rem, 1.25rem);\r\n}\r\n\r\n.vtx-text--h3 {\r\n  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);\r\n  font-weight: var(--vtx-text-h3-font-weight, 600);\r\n  line-height: var(--vtx-text-h3-line-height, 1.3);\r\n  letter-spacing: var(--vtx-text-h3-letter-spacing, -0.025em);\r\n  margin-bottom: clamp(0.75rem, 1.5vw + 0.5rem, 1rem);\r\n}\r\n\r\n.vtx-text--h4 {\r\n  font-size: clamp(1.25rem, 2.5vw + 0.5rem, 1.875rem);\r\n  font-weight: var(--vtx-text-h4-font-weight, 600);\r\n  line-height: var(--vtx-text-h4-line-height, 1.35);\r\n  letter-spacing: var(--vtx-text-h4-letter-spacing, 0);\r\n  margin-bottom: clamp(0.75rem, 1.5vw + 0.25rem, 1rem);\r\n}\r\n\r\n.vtx-text--h5 {\r\n  font-size: clamp(1.125rem, 2vw + 0.25rem, 1.5rem);\r\n  font-weight: var(--vtx-text-h5-font-weight, 600);\r\n  line-height: var(--vtx-text-h5-line-height, 1.4);\r\n  letter-spacing: var(--vtx-text-h5-letter-spacing, 0);\r\n  margin-bottom: clamp(0.625rem, 1.25vw + 0.25rem, 0.75rem);\r\n}\r\n\r\n.vtx-text--h6 {\r\n  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.25rem);\r\n  font-weight: var(--vtx-text-h6-font-weight, 600);\r\n  line-height: var(--vtx-text-h6-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-h6-letter-spacing, 0);\r\n  margin-bottom: clamp(0.625rem, 1.25vw + 0.25rem, 0.75rem);\r\n}\r\n\r\n/* ===== Body Text with Responsive Sizing ===== */\r\n.vtx-text--body1 {\r\n  font-size: clamp(0.9375rem, 1vw + 0.125rem, 1rem);\r\n  font-weight: var(--vtx-text-body1-font-weight, 400);\r\n  line-height: var(--vtx-text-body1-line-height, 1.6);\r\n  letter-spacing: var(--vtx-text-body1-letter-spacing, 0);\r\n  margin-bottom: clamp(0.625rem, 1vw + 0.25rem, 0.75rem);\r\n}\r\n\r\n.vtx-text--body2 {\r\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\r\n  font-weight: var(--vtx-text-body2-font-weight, 400);\r\n  line-height: var(--vtx-text-body2-line-height, 1.6);\r\n  letter-spacing: var(--vtx-text-body2-letter-spacing, 0.01em);\r\n  margin-bottom: clamp(0.625rem, 1vw + 0.25rem, 0.75rem);\r\n}\r\n\r\n/* ===== Subtitles with Responsive Sizing ===== */\r\n.vtx-text--subtitle1 {\r\n  font-size: clamp(1rem, 1.25vw + 0.125rem, 1.125rem);\r\n  font-weight: var(--vtx-text-subtitle1-font-weight, 500);\r\n  line-height: var(--vtx-text-subtitle1-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-subtitle1-letter-spacing, 0.0075em);\r\n  margin-bottom: clamp(0.5rem, 0.75vw + 0.125rem, 0.625rem);\r\n}\r\n\r\n.vtx-text--subtitle2 {\r\n  font-size: clamp(0.9375rem, 1vw + 0.0625rem, 1rem);\r\n  font-weight: var(--vtx-text-subtitle2-font-weight, 500);\r\n  line-height: var(--vtx-text-subtitle2-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-subtitle2-letter-spacing, 0.01em);\r\n  margin-bottom: clamp(0.5rem, 0.75vw + 0.125rem, 0.625rem);\r\n}\r\n\r\n/* ===== Caption with Responsive Sizing ===== */\r\n.vtx-text--caption {\r\n  font-size: clamp(0.6875rem, 0.75vw + 0.0625rem, 0.75rem);\r\n  font-weight: var(--vtx-text-caption-font-weight, 400);\r\n  line-height: var(--vtx-text-caption-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-caption-letter-spacing, 0.025em);\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* ===== Overline with Responsive Sizing ===== */\r\n.vtx-text--overline {\r\n  font-size: clamp(0.6875rem, 0.75vw + 0.0625rem, 0.75rem);\r\n  font-weight: var(--vtx-text-overline-font-weight, 600);\r\n  line-height: var(--vtx-text-overline-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-overline-letter-spacing, 0.1em);\r\n  text-transform: uppercase;\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n/* ===== Button Text with Responsive Sizing ===== */\r\n.vtx-text--button {\r\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\r\n  font-weight: var(--vtx-text-button-font-weight, 600);\r\n  line-height: var(--vtx-text-button-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-button-letter-spacing, 0.025em);\r\n}\r\n\r\n/* ===== Label with Responsive Sizing ===== */\r\n.vtx-text--label {\r\n  font-size: clamp(0.8125rem, 0.85vw + 0.125rem, 0.875rem);\r\n  font-weight: var(--vtx-text-label-font-weight, 500);\r\n  line-height: var(--vtx-text-label-line-height, 1.5);\r\n  letter-spacing: var(--vtx-text-label-letter-spacing, 0.0075em);\r\n  display: inline-block;\r\n  margin-bottom: clamp(0.375rem, 0.5vw + 0.125rem, 0.5rem);\r\n}\r\n\r\n/* ===== Text Alignment ===== */\r\n.vtx-text--align-left {\r\n  text-align: left;\r\n}\r\n\r\n.vtx-text--align-center {\r\n  text-align: center;\r\n}\r\n\r\n.vtx-text--align-right {\r\n  text-align: right;\r\n}\r\n\r\n.vtx-text--align-justify {\r\n  text-align: justify;\r\n}\r\n\r\n/* ===== Semantic Colors ===== */\r\n.vtx-text--color-primary {\r\n  color: var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-text--color-secondary {\r\n  color: var(--vtx-color-secondary-500);\r\n}\r\n\r\n.vtx-text--color-success {\r\n  color: var(--vtx-color-success-500);\r\n}\r\n\r\n.vtx-text--color-error {\r\n  color: var(--vtx-color-error-500);\r\n}\r\n\r\n.vtx-text--color-warning {\r\n  color: var(--vtx-color-warning-500);\r\n}\r\n\r\n.vtx-text--color-info {\r\n  color: var(--vtx-color-info-500);\r\n}\r\n\r\n.vtx-text--color-inherit {\r\n  color: inherit;\r\n}\r\n\r\n/* ===== Font Weights ===== */\r\n.vtx-text--weight-thin {\r\n  font-weight: var(--vtx-font-weight-thin, 100);\r\n}\r\n\r\n.vtx-text--weight-extralight {\r\n  font-weight: var(--vtx-font-weight-extralight, 200);\r\n}\r\n\r\n.vtx-text--weight-light {\r\n  font-weight: var(--vtx-font-weight-light, 300);\r\n}\r\n\r\n.vtx-text--weight-normal {\r\n  font-weight: var(--vtx-font-weight-normal, 400);\r\n}\r\n\r\n.vtx-text--weight-medium {\r\n  font-weight: var(--vtx-font-weight-medium, 500);\r\n}\r\n\r\n.vtx-text--weight-semibold {\r\n  font-weight: var(--vtx-font-weight-semibold, 600);\r\n}\r\n\r\n.vtx-text--weight-bold {\r\n  font-weight: var(--vtx-font-weight-bold, 700);\r\n}\r\n\r\n.vtx-text--weight-extrabold {\r\n  font-weight: var(--vtx-font-weight-extrabold, 800);\r\n}\r\n\r\n.vtx-text--weight-black {\r\n  font-weight: var(--vtx-font-weight-black, 900);\r\n}\r\n\r\n/* ===== Text Transform ===== */\r\n.vtx-text--transform-none {\r\n  text-transform: none;\r\n}\r\n\r\n.vtx-text--transform-uppercase {\r\n  text-transform: uppercase;\r\n}\r\n\r\n.vtx-text--transform-lowercase {\r\n  text-transform: lowercase;\r\n}\r\n\r\n.vtx-text--transform-capitalize {\r\n  text-transform: capitalize;\r\n}\r\n\r\n/* ===== Text Decoration ===== */\r\n.vtx-text--decoration-none {\r\n  text-decoration: none;\r\n}\r\n\r\n.vtx-text--decoration-underline {\r\n  text-decoration: underline;\r\n}\r\n\r\n.vtx-text--decoration-line-through {\r\n  text-decoration: line-through;\r\n}\r\n\r\n.vtx-text--decoration-overline {\r\n  text-decoration: overline;\r\n}\r\n\r\n/* ===== Text Utilities ===== */\r\n/* Truncation */\r\n.vtx-text--truncate {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Line Clamp */\r\n.vtx-text--line-clamp {\r\n  display: -webkit-box;\r\n  -webkit-box-orient: vertical;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n}\r\n\r\n/* Break Word */\r\n.vtx-text--break-word {\r\n  word-break: break-word;\r\n  overflow-wrap: break-word;\r\n}\r\n\r\n/* Italic */\r\n.vtx-text--italic {\r\n  font-style: italic;\r\n}\r\n\r\n/* Underline */\r\n.vtx-text--underline {\r\n  text-decoration: underline;\r\n}\r\n\r\n/* Strikethrough */\r\n.vtx-text--strikethrough {\r\n  text-decoration: line-through;\r\n}\r\n\r\n/* Gradient Text */\r\n.vtx-text--gradient {\r\n  background-clip: text;\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-size: 100%;\r\n}\r\n\r\n/* No Select */\r\n.vtx-text--no-select {\r\n  user-select: none;\r\n  -webkit-user-select: none;\r\n  -moz-user-select: none;\r\n  -ms-user-select: none;\r\n}\r\n\r\n/* ===== Dark Theme Support ===== */\r\n[data-theme='dark'] .vtx-text--caption,\r\n[data-theme='dark'] .vtx-text--overline {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n/* ===== Responsive Breakpoint Adjustments ===== */\r\n\r\n/* Small Mobile: < 480px */\r\n@media (max-width: 479px) {\r\n  .vtx-text--h1 {\r\n    font-size: clamp(1.875rem, 8vw, 2.5rem);\r\n    line-height: 1.15;\r\n    margin-bottom: 0.875rem;\r\n  }\r\n\r\n  .vtx-text--h2 {\r\n    font-size: clamp(1.625rem, 7vw, 2.125rem);\r\n    line-height: 1.2;\r\n    margin-bottom: 0.75rem;\r\n  }\r\n\r\n  .vtx-text--h3 {\r\n    font-size: clamp(1.375rem, 6vw, 1.75rem);\r\n    line-height: 1.25;\r\n    margin-bottom: 0.625rem;\r\n  }\r\n\r\n  .vtx-text--h4,\r\n  .vtx-text--h5,\r\n  .vtx-text--h6 {\r\n    margin-bottom: 0.5rem;\r\n  }\r\n\r\n  .vtx-text--body1,\r\n  .vtx-text--body2 {\r\n    line-height: 1.65;\r\n  }\r\n}\r\n\r\n/* Mobile: 480px - 767px */\r\n@media (min-width: 480px) and (max-width: 767px) {\r\n  .vtx-text--h1 {\r\n    line-height: 1.15;\r\n  }\r\n\r\n  .vtx-text--h2 {\r\n    line-height: 1.2;\r\n  }\r\n\r\n  .vtx-text--body1,\r\n  .vtx-text--body2 {\r\n    line-height: 1.65;\r\n  }\r\n}\r\n/* Enhancements ===== */\r\n.vtx-text:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: var(--vtx-radius-sm);\r\n}\r\n\r\n/* Reduced motion support */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-text {\r\n    transition: none;\r\n    animation: none;\r\n  }\r\n}\r\n\r\n/* High contrast mode */\r\n@media (prefers-contrast: high) {\r\n  .vtx-text {\r\n    font-weight: 500;\r\n  }\r\n\r\n  .vtx-text--h1,\r\n  .vtx-text--h2,\r\n  .vtx-text--h3,\r\n  .vtx-text--h4,\r\n  .vtx-text--h5,\r\n  .vtx-text--h6 {\r\n    font-weight: 700;\r\n  }\r\n\r\n  .vtx-text--caption,\r\n  .vtx-text--overline {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* ===== Container Query Support (Modern Browsers) ===== */\r\n@supports (container-type: inline-size) {\r\n  @container (max-width: 600px) {\r\n    .vtx-text--h1 {\r\n      font-size: clamp(1.875rem, 6vw, 2.5rem);\r\n    }\r\n\r\n    .vtx-text--h2 {\r\n      font-size: clamp(1.625rem, 5vw, 2.125rem);\r\n    }\r\n\r\n    .vtx-text--h3 {\r\n      font-size: clamp(1.375rem, 4vw, 1.75rem);\r\n    }\r\n  }\r\n}\r\n\r\n/* ===== Touch Device Optimizations ===== */\r\n@media (hover: none) and (pointer: coarse) {\r\n  .vtx-text--body1,\r\n  .vtx-text--body2 {\r\n    line-height: 1.65;\r\n    font-size: clamp(0.9375rem, 1.1vw + 0.125rem, 1.0625rem);\r\n  }\r\n\r\n  .vtx-text--button,\r\n  .vtx-text--label {\r\n    font-size: clamp(0.875rem, 1vw + 0.125rem, 0.9375rem);\r\n    line-height: 1.6;\r\n  }\r\n}\r\n\r\n/* ===== Very Small Screens (<= 320px) ===== */\r\n@media (max-width: 320px) {\r\n  .vtx-text--h1 {\r\n    font-size: 1.75rem;\r\n    line-height: 1.1;\r\n  }\r\n\r\n  .vtx-text--h2 {\r\n    font-size: 1.5rem;\r\n    line-height: 1.15;\r\n  }\r\n\r\n  .vtx-text--h3 {\r\n    font-size: 1.25rem;\r\n    line-height: 1.2;\r\n  }\r\n\r\n  .vtx-text--h4 {\r\n    font-size: 1.125rem;\r\n  }\r\n\r\n  .vtx-text--h5,\r\n  .vtx-text--h6 {\r\n    font-size: 1rem\r\n  };\r\n}\r\n\r\n/* Desktop: 1024px - 1439px */\r\n@media (min-width: 1024px) and (max-width: 1439px) {\r\n  .vtx-text--h1 {\r\n    line-height: 1.2;\r\n  }\r\n}\r\n\r\n/* Large Desktop: >= 1440px */\r\n@media (min-width: 1440px) {\r\n  .vtx-text--h1 {\r\n    letter-spacing: -0.03em;\r\n  }\r\n\r\n  .vtx-text--h2 {\r\n    letter-spacing: -0.03em;\r\n  }\r\n\r\n  .vtx-text--h3 {\r\n    letter-spacing: -0.03em;\r\n  }\r\n}\r\n\r\n/* ===== Landscape Mode Adjustments ===== */\r\n@media (max-width: 1023px) and (orientation: landscape) {\r\n  .vtx-text--h1,\r\n  .vtx-text--h2,\r\n  .vtx-text--h3 {\r\n    margin-bottom: 0.5rem;\r\n  }\r\n\r\n  .vtx-text--body1,\r\n  .vtx-text--body2 {\r\n    margin-bottom: 0.5rem;\r\n  }\r\n}\r\n\r\n/* ===== High Resolution Displays ===== */\r\n@media (min-resolution: 2dppx) {\r\n  .vtx-text {\r\n    -webkit-font-smoothing: antialiased;\r\n    -moz-osx-font-smoothing: grayscale;\r\n    text-rendering: optimizeLegibility;\r\n  }\r\n}\r\n\r\n/* ===== Print Styles ===== */\r\n@media print {\r\n  .vtx-text {\r\n    color: #000;\r\n  }\r\n\r\n  .vtx-text--gradient {\r\n    -webkit-text-fill-color: initial;\r\n    background-clip: initial;\r\n    -webkit-background-clip: initial;\r\n  }\r\n}\r\n\r\n/* ===== Utility Classes ===== */\r\n.vtx-text--no-margin {\r\n  margin: 0 !important;\r\n}\r\n\r\n.vtx-text--no-padding {\r\n  padding: 0 !important;\r\n}\r\n\r\n/* ===== Accessibility ===== */\r\n.vtx-text:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: var(--vtx-radius-sm);\r\n}\r\n\r\n/* Reduced motion support */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-text {\r\n    transition: none;\r\n  }\r\n}\r\n");const ve=t.forwardRef(({variant:r="body1",as:n,align:e,color:a,textColor:o,weight:i,transform:l,decoration:d,truncate:c=!1,lineClamp:s,breakWord:v=!1,italic:x=!1,underline:m=!1,strikethrough:p=!1,gradient:h,noSelect:u=!1,size:g,lineHeight:b,letterSpacing:f,noMargin:y=!1,noPadding:w=!1,className:k="",style:_,children:N,...z},C)=>{const S=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),$=["vtx-text",`vtx-text--${r}`,e&&`vtx-text--align-${e}`,i&&"string"==typeof i&&`vtx-text--weight-${i}`,a&&"inherit"!==a&&`vtx-text--color-${a}`,l&&`vtx-text--transform-${l}`,d&&`vtx-text--decoration-${d}`,c&&"vtx-text--truncate",s&&"vtx-text--line-clamp",v&&"vtx-text--break-word",x&&"vtx-text--italic",m&&"vtx-text--underline",p&&"vtx-text--strikethrough",h&&"vtx-text--gradient",u&&"vtx-text--no-select",y&&"vtx-text--no-margin",w&&"vtx-text--no-padding",k].filter(Boolean).join(" "),M={..._};if(o&&(M.color=o),i&&"number"==typeof i&&(M.fontWeight=i),s&&(M.WebkitLineClamp=s),h&&h.length>0){const r=1===h.length?h[0]:`linear-gradient(135deg, ${h.join(", ")})`;M.backgroundImage=r}return g&&(M.fontSize="number"==typeof g?`${g}px`:g),b&&(M.lineHeight="number"==typeof b?`${b}`:b),f&&(M.letterSpacing="number"==typeof f?`${f}px`:f),t.createElement(S,{ref:C,className:$,style:M,...z},N)});ve.displayName="Text";const xe=gr(ve);cn("/* Menu Component Styles */\r\n\r\n.vtx-menu-container {\r\n  position: relative;\r\n}\r\n\r\n/* Menu Toggle (Hamburger) */\r\n.vtx-menu-toggle {\r\n  display: none;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 40px;\r\n  height: 40px;\r\n  padding: var(--vtx-spacing-2);\r\n  background: transparent;\r\n  border: none;\r\n  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-text-primary);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-normal);\r\n}\r\n\r\n.vtx-menu-toggle:hover {\r\n  background: var(--vtx-background-hover);\r\n}\r\n\r\n.vtx-menu-toggle:active {\r\n  background: var(--vtx-background-active);\r\n}\r\n\r\n.vtx-menu-toggle:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Menu Container */\r\n.vtx-menu {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: var(--vtx-background-primary);\r\n  border-radius: var(--vtx-radius-lg);\r\n  box-shadow: var(--vtx-shadow-sm);\r\n  overflow: hidden;\r\n}\r\n\r\n/* Vertical Menu (Default) */\r\n.vtx-menu--vertical {\r\n  flex-direction: column;\r\n  min-width: 200px;\r\n  padding: var(--vtx-spacing-2);\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n/* Horizontal Menu */\r\n.vtx-menu--horizontal {\r\n  flex-direction: row;\r\n  padding: var(--vtx-spacing-2);\r\n  gap: var(--vtx-spacing-1);\r\n  box-shadow: none;\r\n  border-radius: 0;\r\n}\r\n\r\n/* Menu Item - Professional Sidebar Style */\r\n.vtx-menu-item {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-color-neutral-700);\r\n  background: transparent;\r\n  cursor: pointer;\r\n  transition: all 0.15s ease-in-out;\r\n  user-select: none;\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  border-left: 3px solid transparent;\r\n}\r\n\r\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-menu-item:active:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\r\n  background: var(--vtx-color-neutral-200);\r\n  transform: scale(0.98);\r\n}\r\n\r\n.vtx-menu-item:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Active Menu Item - Professional Style */\r\n.vtx-menu-item--active {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-menu-item--active .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-menu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-menu-item--active:hover .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n/* Disabled Menu Item */\r\n.vtx-menu-item--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Danger Variant */\r\n.vtx-menu-item--danger {\r\n  color: var(--vtx-color-danger-600);\r\n}\r\n\r\n.vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\r\n  background: var(--vtx-color-danger-50);\r\n}\r\n\r\n.vtx-menu-item--danger:active:not(.vtx-menu-item--disabled) {\r\n  background: var(--vtx-color-danger-100);\r\n}\r\n\r\n/* Menu Item Icon */\r\n.vtx-menu-item-icon,\r\n.vtx-menu-item-right-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 20px;\r\n  height: 20px;\r\n  flex-shrink: 0;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-menu-item-icon svg,\r\n.vtx-menu-item-right-icon svg {\r\n  width: 100%;\r\n  height: 100%;\r\n  transition: inherit;\r\n}\r\n\r\n.vtx-menu-item-icon {\r\n  color: var(--vtx-color-neutral-600);\r\n  transition: color 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-menu-item:hover .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n/* Shortcut */\r\n.vtx-menu-item-shortcut {\r\n  opacity: 0.6;\r\n  font-size: var(--vtx-font-size-xs);\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Menu Divider */\r\n.vtx-menu-divider {\r\n  height: 1px;\r\n  margin: var(--vtx-spacing-2) 0;\r\n  background: var(--vtx-border-color);\r\n}\r\n\r\n.vtx-menu--horizontal .vtx-menu-divider {\r\n  width: 1px;\r\n  height: auto;\r\n  margin: 0 var(--vtx-spacing-2);\r\n}\r\n\r\n/* Submenu Styles - Inline Expansion for Sidebar */\r\n.vtx-menu-item--has-submenu {\r\n  position: relative;\r\n}\r\n\r\n.vtx-submenu {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0;\r\n  padding-left: var(--vtx-spacing-5);\r\n  margin-top: var(--vtx-spacing-2);\r\n  margin-bottom: var(--vtx-spacing-2);\r\n  animation: slideDown 0.25s cubic-bezier(0.4, 0, 0.2, 1);\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-submenu .vtx-menu-item {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  padding-left: var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-submenu .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-submenu .vtx-menu-item--active {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-submenu .vtx-menu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n/* Nested submenu - additional indentation */\r\n.vtx-submenu .vtx-submenu {\r\n  padding-left: var(--vtx-spacing-4);\r\n}\r\n\r\n/* Submenu Animation */\r\n@keyframes slideDown {\r\n  from {\r\n    opacity: 0;\r\n    max-height: 0;\r\n    transform: translateY(-4px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    max-height: 1000px;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n/* Responsive Styles */\r\n@media (max-width: 768px) {\r\n  .vtx-menu--responsive .vtx-menu-toggle {\r\n    display: flex;\r\n  }\r\n\r\n  .vtx-menu--responsive.vtx-menu {\r\n    position: absolute;\r\n    top: 48px;\r\n    left: 0;\r\n    right: 0;\r\n    z-index: 1000;\r\n    display: none;\r\n    min-width: 100%;\r\n    max-height: calc(100vh - 64px);\r\n    overflow-y: auto;\r\n    box-shadow: var(--vtx-shadow-lg);\r\n    animation: slideDown 0.2s ease-out;\r\n  }\r\n\r\n  .vtx-menu--responsive.vtx-menu--mobile-open {\r\n    display: flex;\r\n  }\r\n\r\n  /* Force vertical layout on mobile */\r\n  .vtx-menu--responsive.vtx-menu--horizontal {\r\n    flex-direction: column;\r\n    padding: var(--vtx-spacing-2);\r\n    gap: var(--vtx-spacing-1);\r\n    border-radius: var(--vtx-radius-lg);\r\n  }\r\n\r\n  .vtx-menu--responsive.vtx-menu--horizontal .vtx-menu-divider {\r\n    width: auto;\r\n    height: 1px;\r\n    margin: var(--vtx-spacing-2) 0;\r\n  }\r\n}\r\n\r\n/* Slide Down Animation */\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/* Dark Mode - Professional Style */\r\n[data-theme='dark'] .vtx-menu {\r\n  background: var(--vtx-background-primary);\r\n  box-shadow: var(--vtx-shadow-lg);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\r\n  background-color: var(--vtx-color-primary-900);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark']\r\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active)\r\n  .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--active {\r\n  background-color: var(--vtx-color-primary-900);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--active .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-800);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--active:hover .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--danger {\r\n  color: var(--vtx-color-danger-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-menu-item--danger:hover:not(.vtx-menu-item--disabled) {\r\n  background: rgba(var(--vtx-color-danger-rgb), 0.15);\r\n}\r\n\r\n[data-theme='dark']\r\n  .vtx-submenu\r\n  .vtx-menu-item:hover:not(.vtx-menu-item--disabled):not(.vtx-menu-item--active) {\r\n  background-color: var(--vtx-color-primary-900);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active {\r\n  background-color: var(--vtx-color-primary-900);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-800);\r\n  color: var(--vtx-color-primary-400);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-submenu .vtx-menu-item--active .vtx-menu-item-icon {\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n/* Reduced Motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-menu-item,\r\n  .vtx-menu-toggle {\r\n    transition: none;\r\n  }\r\n\r\n  .vtx-submenu {\r\n    animation: none;\r\n  }\r\n\r\n  @keyframes slideDown {\r\n    from,\r\n    to {\r\n      opacity: 1;\r\n      max-height: 1000px;\r\n      transform: translateY(0);\r\n    }\r\n  }\r\n}\r\n");const me=({isOpen:n})=>r(n?Ir:$r,{size:16}),pe=a.forwardRef(({label:t,onClick:a,icon:o,rightIcon:d,disabled:c=!1,active:s=!1,variant:v="default",shortcut:x,divider:m=!1,items:p},h)=>{const[u,g]=i(!1),b=l(null),f=p&&p.length>0,y=d||(f?r(me,{isOpen:u}):null);return n(e,{children:[r("div",{ref:h||b,className:["vtx-menu-item",s&&"vtx-menu-item--active",c&&"vtx-menu-item--disabled","default"!==v&&`vtx-menu-item--${v}`,f&&"vtx-menu-item--has-submenu",u&&"vtx-menu-item--submenu-open"].filter(Boolean).join(" "),onClick:()=>{c||(f?g(!u):a&&a())},onKeyDown:r=>{c||("Enter"===r.key||" "===r.key?(r.preventDefault(),f?g(!u):null==a||a()):"ArrowDown"===r.key&&f&&!u?(r.preventDefault(),g(!0)):"ArrowUp"===r.key&&f&&u&&(r.preventDefault(),g(!1)))},role:"menuitem",tabIndex:c?-1:0,"aria-disabled":c,"aria-haspopup":f?"menu":void 0,"aria-expanded":f?u:void 0,children:n(se,{align:"center",gap:8,style:{flex:1},children:[o&&r("span",{className:"vtx-menu-item-icon",children:o}),r(xe,{variant:"body2",noMargin:!0,style:{flex:1},children:t}),x&&r(xe,{variant:"caption",textColor:"var(--color-neutral-500)",noMargin:!0,className:"vtx-menu-item-shortcut",children:x}),y&&r("span",{className:"vtx-menu-item-right-icon",children:y})]})}),f&&u&&r("div",{className:"vtx-submenu",role:"menu",children:p.map((n,e)=>r(pe,{...n},e))}),m&&r("div",{className:"vtx-menu-divider",role:"separator"})]})});pe.displayName="MenuItem";const he=a.forwardRef(({items:e,children:t,orientation:a="vertical",responsive:d=!0,className:c="",width:s},v)=>{const[x,m]=i(!1),p=l(null);o(()=>{if(!d||!x)return;const r=r=>{p.current&&!p.current.contains(r.target)&&m(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[d,x]),o(()=>{if(!d||!x)return;const r=r=>{"Escape"===r.key&&m(!1)};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[d,x]);const h=e?e.map((n,e)=>r(pe,{...n},e)):t,u=["vtx-menu",`vtx-menu--${a}`,d&&"vtx-menu--responsive",x&&"vtx-menu--mobile-open",c].filter(Boolean).join(" "),g={width:"vertical"===a&&s?"number"==typeof s?`${s}px`:s:void 0};return n("div",{ref:p,className:"vtx-menu-container",children:[d&&r("button",{className:"vtx-menu-toggle",onClick:()=>m(!x),"aria-label":"Toggle menu","aria-expanded":x,children:r(x?Qr:jr,{size:24})}),r("div",{ref:v,className:u,role:"menu",style:g,children:h})]})});he.displayName="Menu";const ue=gr(he);cn("/* ActionMenu Component Styles */\r\n\r\n.vtx-action-menu-container {\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.vtx-action-menu-trigger-wrapper {\r\n  display: inline-block;\r\n}\r\n\r\n/* Trigger Button */\r\n.vtx-action-menu-trigger {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  background: var(--vtx-background-primary);\r\n  border: 1px solid var(--vtx-color-neutral-300);\r\n  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-text-primary);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-normal);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  user-select: none;\r\n}\r\n\r\n.vtx-action-menu-trigger:hover {\r\n  background: var(--vtx-background-hover);\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-action-menu-trigger:active {\r\n  background: var(--vtx-background-active);\r\n}\r\n\r\n.vtx-action-menu-trigger:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-action-menu-trigger--open {\r\n  background: var(--vtx-background-active);\r\n  border-color: var(--vtx-color-primary-500);\r\n  box-shadow: 0 0 0 1px var(--vtx-color-primary-500);\r\n}\r\n\r\n.vtx-action-menu-trigger--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.vtx-action-menu-trigger-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-text-secondary);\r\n}\r\n\r\n/* Dropdown Menu */\r\n.vtx-action-menu {\r\n  position: absolute;\r\n  z-index: 1000;\r\n  min-width: 200px;\r\n  margin-top: var(--vtx-spacing-1);\r\n  padding: var(--vtx-spacing-2);\r\n  background: var(--vtx-background-primary);\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-lg);\r\n  animation: slideDown 0.15s ease-out;\r\n}\r\n\r\n/* Position variants */\r\n.vtx-action-menu--bottom-start {\r\n  top: 100%;\r\n  left: 0;\r\n}\r\n\r\n.vtx-action-menu--bottom-end {\r\n  top: 100%;\r\n  right: 0;\r\n}\r\n\r\n.vtx-action-menu--top-start {\r\n  bottom: 100%;\r\n  left: 0;\r\n  margin-top: 0;\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  animation: slideUp 0.15s ease-out;\r\n}\r\n\r\n.vtx-action-menu--top-end {\r\n  bottom: 100%;\r\n  right: 0;\r\n  margin-top: 0;\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  animation: slideUp 0.15s ease-out;\r\n}\r\n\r\n/* Animations */\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@keyframes slideUp {\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/* Dark Mode */\r\n[data-theme='dark'] .vtx-action-menu-trigger {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-600);\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger:hover {\r\n  background: var(--vtx-color-neutral-700);\r\n  border-color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger:active {\r\n  background: var(--vtx-color-neutral-600);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu-trigger--open {\r\n  background: var(--vtx-color-neutral-700);\r\n  border-color: var(--vtx-color-primary-400);\r\n  box-shadow: 0 0 0 1px var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-action-menu {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n/* Reduced Motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-action-menu {\r\n    animation: none;\r\n  }\r\n}\r\n");const ge=({isOpen:n})=>r(n?Ir:$r,{size:16}),be=a.forwardRef(({items:e,trigger:t,triggerLabel:d="Actions",triggerIcon:c,position:s="bottom-start",className:v="",triggerClassName:x="",disabled:m=!1,onOpen:p,onClose:h},u)=>{const[g,b]=i(!1),f=l(null),y=l(null),w=()=>{if(m)return;const r=!g;b(r),r&&p?p():!r&&h&&h()};o(()=>{if(!g)return;const r=r=>{f.current&&!f.current.contains(r.target)&&(b(!1),null==h||h())};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[g,h]),o(()=>{if(!g)return;const r=r=>{"Escape"===r.key&&(b(!1),null==h||h())};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[g,h]);const k=e.map(r=>({...r,onClick:r.onClick?()=>{var n;null===(n=r.onClick)||void 0===n||n.call(r),b(!1),null==h||h()}:void 0})),_=`vtx-action-menu--${s}`,N="function"==typeof t?t({isOpen:g,toggle:w,disabled:m}):t||n(se,{align:"center",gap:8,children:[c&&r("span",{className:"vtx-action-menu-trigger-icon",children:c}),r(xe,{variant:"body2",noMargin:!0,children:d}),r(ge,{isOpen:g})]}),z="function"==typeof t||a.isValidElement(t);return n("div",{ref:f,className:"vtx-action-menu-container",children:[r("div",z?{className:"vtx-action-menu-trigger-wrapper",children:"function"==typeof t?N:r("div",{onClick:w,children:N})}:{className:["vtx-action-menu-trigger",m&&"vtx-action-menu-trigger--disabled",g&&"vtx-action-menu-trigger--open",x].filter(Boolean).join(" "),onClick:w,onKeyDown:r=>{"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),w())},role:"button",tabIndex:m?-1:0,"aria-haspopup":"menu","aria-expanded":g,"aria-disabled":m,children:N}),g&&r("div",{ref:u||y,className:["vtx-action-menu",_,v].filter(Boolean).join(" "),role:"menu",children:k.map((n,e)=>r(pe,{...n},e))})]})});be.displayName="ActionMenu";const fe=gr(be);cn("/* 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 ye={success:r(Rr,{size:20}),error:r(Br,{size:20}),warning:r(Er,{size:20}),info:r(Or,{size:20}),neutral:r(Fr,{size:20})},we=a.forwardRef(({children:e,title:t,description:a,variant:o="info",alertStyle:l="subtle",size:d,icon:c,dismissible:s=!1,onClose:v,action:x,fullWidth:m=!1,className:p="",style:h,role:u="alert",...g},b)=>{const{theme:f}=kn(),y=d||(null==f?void 0:f.defaultSize)||"md",[w,k]=i(!0);if(!w)return null;const _=!1!==c,N=void 0===c?ye[o]:c,z=e||a;return n("div",{ref:b,className:`\n          alert\n          alert--${o}\n          alert--${l}\n          alert--${y}\n          ${m?"alert--full-width":""}\n          ${p}\n        `.trim(),style:h,role:u,...g,children:[_&&r("div",{className:"alert-icon",children:N}),n("div",{className:"alert-content",children:[t&&r("div",{className:"alert-title",children:t}),z&&r("div",{className:"alert-message",children:null!=e?e:a})]}),x&&r("div",{className:"alert-action",children:x}),s&&r("button",{type:"button",className:"alert-close",onClick:()=>{k(!1),null==v||v()},"aria-label":"Close alert",children:r(Qr,{size:16})})]})});we.displayName="Alert";const ke=gr(we);cn("/* ===== 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 _e=a.forwardRef(({isOpen:e,onClose:t,title:a,description:i,children:d,header:c,footer:s,footerButtons:v,size:x,closeOnBackdropClick:m=!0,closeOnEscape:p=!0,showCloseButton:h=!0,transparentBackdrop:u=!1,className:b="",backdropClassName:f="",preventScroll:y=!0,animation:w="fade",onAfterOpen:k,onAfterClose:_,scrollable:N=!1,centered:z=!0},C)=>{const S=l(null),$=l(null),{theme:M}=kn();let T="md";if(x?T=x:(null==M?void 0:M.defaultSize)&&(T=M.defaultSize),nr(S,e),tr(y&&e),er(()=>{p&&e&&t()}),o(()=>{e?($.current=document.activeElement,null==k||k()):$.current&&($.current.focus(),null==_||_())},[e,k,_]),!e)return null;const D=["vtx-modal-backdrop",u&&"vtx-modal-backdrop--transparent",z&&"vtx-modal-backdrop--centered",`vtx-modal-backdrop--${w}`,f].filter(Boolean).join(" "),j=["vtx-modal",`vtx-modal--${T}`,N&&"vtx-modal--scrollable",`vtx-modal--${w}`,b].filter(Boolean).join(" "),I=r("div",{className:D,onClick:r=>{m&&r.target===r.currentTarget&&t()},role:"presentation",children:n("div",{ref:r=>{S.current=r,"function"==typeof C?C(r):C&&(C.current=r)},className:j,role:"dialog","aria-modal":"true","aria-labelledby":a?"vtx-modal-title":void 0,"aria-describedby":i?"vtx-modal-description":void 0,children:[c?r("div",{className:"vtx-modal-header",children:c}):a||h?n(se,{className:"vtx-modal-header",justify:"between",align:"center",gap:8,children:[a&&n(se,{direction:"column",gap:4,className:"vtx-modal-header-content",children:[r(xe,{as:"h2",variant:"h6",weight:"semibold",id:"vtx-modal-title",noMargin:!0,children:a}),i&&r(xe,{variant:"body2",textColor:"var(--color-neutral-600)",id:"vtx-modal-description",noMargin:!0,children:i})]}),h&&r(Cn,{variant:"ghost",iconOnly:!0,size:"sm",className:"vtx-modal-close",onClick:t,"aria-label":"Close modal",children:r(Qr,{size:20})})]}):null,r(se,{direction:"column",className:"vtx-modal-body",children:d}),(s||v)&&r(se,{className:"vtx-modal-footer",justify:"end",align:"center",gap:8,children:v?v.map((n,e)=>r(Cn,{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 g(I,document.body)});_e.displayName="Modal";const Ne=gr(_e);cn(".vtx-tooltip {\r\n  position: fixed;\r\n  z-index: var(--vtx-z-tooltip);\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  background-color: var(--vtx-color-neutral-900);\r\n  color: white;\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  border-radius: var(--vtx-radius-md);\r\n  max-width: 300px;\r\n  word-wrap: break-word;\r\n  pointer-events: auto;\r\n  box-shadow: var(--vtx-shadow-lg);\r\n  opacity: 0;\r\n  transition:\r\n    opacity 150ms cubic-bezier(0.4, 0, 0.2, 1),\r\n    transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n  will-change: transform, opacity;\r\n}\r\n\r\n.vtx-tooltip--visible {\r\n  opacity: 1;\r\n}\r\n\r\n/* Inner wrapper for content and close button */\r\n.vtx-tooltip-inner {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-tooltip-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n}\r\n\r\n/* Close button */\r\n.vtx-tooltip-close {\r\n  flex-shrink: 0;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 20px;\r\n  height: 20px;\r\n  padding: 0;\r\n  background: transparent;\r\n  border: none;\r\n  color: currentColor;\r\n  cursor: pointer;\r\n  border-radius: var(--vtx-radius-sm);\r\n  transition: all var(--vtx-transition-base);\r\n  opacity: 0.7;\r\n  margin-top: -2px;\r\n}\r\n\r\n.vtx-tooltip-close:hover {\r\n  opacity: 1;\r\n  background: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.vtx-tooltip-close:active {\r\n  transform: scale(0.95);\r\n}\r\n\r\n.vtx-tooltip-close:focus-visible {\r\n  outline: 2px solid currentColor;\r\n  outline-offset: 2px;\r\n  opacity: 1;\r\n}\r\n\r\n/* Placement-specific transforms with entry animations */\r\n.vtx-tooltip--top {\r\n  transform: translate(-50%, calc(-100% - 4px)) scale(0.9);\r\n  transform-origin: bottom center;\r\n}\r\n\r\n.vtx-tooltip--top.vtx-tooltip--visible {\r\n  transform: translate(-50%, -100%) scale(1);\r\n}\r\n\r\n.vtx-tooltip--bottom {\r\n  transform: translate(-50%, 4px) scale(0.9);\r\n  transform-origin: top center;\r\n}\r\n\r\n.vtx-tooltip--bottom.vtx-tooltip--visible {\r\n  transform: translate(-50%, 0) scale(1);\r\n}\r\n\r\n.vtx-tooltip--left {\r\n  transform: translate(calc(-100% - 4px), -50%) scale(0.9);\r\n  transform-origin: right center;\r\n}\r\n\r\n.vtx-tooltip--left.vtx-tooltip--visible {\r\n  transform: translate(-100%, -50%) scale(1);\r\n}\r\n\r\n.vtx-tooltip--right {\r\n  transform: translate(4px, -50%) scale(0.9);\r\n  transform-origin: left center;\r\n}\r\n\r\n.vtx-tooltip--right.vtx-tooltip--visible {\r\n  transform: translate(0, -50%) scale(1);\r\n}\r\n\r\n/* Placement-start and placement-end variants */\r\n.vtx-tooltip--top-start {\r\n  transform: translate(0, calc(-100% - 4px)) scale(0.9);\r\n  transform-origin: bottom left;\r\n}\r\n\r\n.vtx-tooltip--top-start.vtx-tooltip--visible {\r\n  transform: translate(0, -100%) scale(1);\r\n}\r\n\r\n.vtx-tooltip--top-end {\r\n  transform: translate(-100%, calc(-100% - 4px)) scale(0.9);\r\n  transform-origin: bottom right;\r\n}\r\n\r\n.vtx-tooltip--top-end.vtx-tooltip--visible {\r\n  transform: translate(-100%, -100%) scale(1);\r\n}\r\n\r\n.vtx-tooltip--bottom-start {\r\n  transform: translate(0, 4px) scale(0.9);\r\n  transform-origin: top left;\r\n}\r\n\r\n.vtx-tooltip--bottom-start.vtx-tooltip--visible {\r\n  transform: translate(0, 0) scale(1);\r\n}\r\n\r\n.vtx-tooltip--bottom-end {\r\n  transform: translate(-100%, 4px) scale(0.9);\r\n  transform-origin: top right;\r\n}\r\n\r\n.vtx-tooltip--bottom-end.vtx-tooltip--visible {\r\n  transform: translate(-100%, 0) scale(1);\r\n}\r\n\r\n.vtx-tooltip--left-start {\r\n  transform: translate(calc(-100% - 4px), 0) scale(0.9);\r\n  transform-origin: right top;\r\n}\r\n\r\n.vtx-tooltip--left-start.vtx-tooltip--visible {\r\n  transform: translate(-100%, 0) scale(1);\r\n}\r\n\r\n.vtx-tooltip--left-end {\r\n  transform: translate(calc(-100% - 4px), -100%) scale(0.9);\r\n  transform-origin: right bottom;\r\n}\r\n\r\n.vtx-tooltip--left-end.vtx-tooltip--visible {\r\n  transform: translate(-100%, -100%) scale(1);\r\n}\r\n\r\n.vtx-tooltip--right-start {\r\n  transform: translate(4px, 0) scale(0.9);\r\n  transform-origin: left top;\r\n}\r\n\r\n.vtx-tooltip--right-start.vtx-tooltip--visible {\r\n  transform: translate(0, 0) scale(1);\r\n}\r\n\r\n.vtx-tooltip--right-end {\r\n  transform: translate(4px, -100%) scale(0.9);\r\n  transform-origin: left bottom;\r\n}\r\n\r\n.vtx-tooltip--right-end.vtx-tooltip--visible {\r\n  transform: translate(0, -100%) scale(1);\r\n}\r\n\r\n/* Variants */\r\n.vtx-tooltip--dark {\r\n  background-color: var(--vtx-color-neutral-900);\r\n  color: white;\r\n}\r\n\r\n.vtx-tooltip--light {\r\n  background-color: white;\r\n  color: var(--vtx-color-neutral-900);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-tooltip--light .vtx-tooltip-close:hover {\r\n  background: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-tooltip--error {\r\n  background-color: var(--vtx-color-error-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-tooltip--warning {\r\n  background-color: var(--vtx-color-warning-500);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-tooltip--success {\r\n  background-color: var(--vtx-color-success-600);\r\n  color: white;\r\n}\r\n\r\n.vtx-tooltip--info {\r\n  background-color: var(--vtx-color-info-600);\r\n  color: white;\r\n}\r\n\r\n/* Arrow */\r\n.vtx-tooltip--with-arrow .vtx-tooltip-arrow {\r\n  position: absolute;\r\n  width: 8px;\r\n  height: 8px;\r\n  background-color: inherit;\r\n  transform: rotate(45deg);\r\n  border: inherit;\r\n}\r\n\r\n.vtx-tooltip--top .vtx-tooltip-arrow {\r\n  bottom: -4px;\r\n  left: 50%;\r\n  margin-left: -4px;\r\n}\r\n\r\n.vtx-tooltip--bottom .vtx-tooltip-arrow {\r\n  top: -4px;\r\n  left: 50%;\r\n  margin-left: -4px;\r\n}\r\n\r\n.vtx-tooltip--left .vtx-tooltip-arrow {\r\n  right: -4px;\r\n  top: 50%;\r\n  margin-top: -4px;\r\n}\r\n\r\n.vtx-tooltip--right .vtx-tooltip-arrow {\r\n  left: -4px;\r\n  top: 50%;\r\n  margin-top: -4px;\r\n}\r\n");const ze=a.forwardRef(({content:t,placement:a="top",delay:d=200,hideDelay:c=0,children:s,open:v,disabled:x=!1,arrow:m=!1,maxWidth:p="300px",variant:u="dark",dismissible:b=!1,onShow:f,onHide:y,onDismiss:w,className:k="",..._},N)=>{const[z,C]=i(v||!1),[S,$]=i(!1),[M,T]=i({top:0,left:0}),D=l(null),j=l(null),I=l(null),L=l(null),A=l(!1),R=()=>{x||(A.current=!0,I.current&&clearTimeout(I.current),L.current&&clearTimeout(L.current),j.current=setTimeout(()=>{if(D.current&&A.current){const r=D.current.getBoundingClientRect(),n=E(r,a);T(n),$(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{C(!0),null==f||f()})})}},d))},B=()=>{A.current=!1,j.current&&clearTimeout(j.current),I.current=setTimeout(()=>{A.current||(C(!1),null==y||y(),L.current=setTimeout(()=>{$(!1)},150))},c)},E=(r,n)=>{const e=m?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}};o(()=>{void 0!==v&&(v?($(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{C(!0)})})):(C(!1),L.current=setTimeout(()=>{$(!1)},150)))},[v]),o(()=>()=>{j.current&&clearTimeout(j.current),I.current&&clearTimeout(I.current),L.current&&clearTimeout(L.current)},[]);const O=["vtx-tooltip",`vtx-tooltip--${a}`,`vtx-tooltip--${u}`,m&&"vtx-tooltip--with-arrow",z&&"vtx-tooltip--visible",k].filter(Boolean).join(" "),F=void 0!==v&&v||S,W=h(s,{ref:r=>{D.current=r;const n=s.ref;"function"==typeof n?n(r):n&&"object"==typeof n&&"current"in n&&(n.current=r)},onMouseEnter:r=>{var n,e;void 0===v&&R(),null===(e=(n=s.props).onMouseEnter)||void 0===e||e.call(n,r)},onMouseLeave:r=>{var n,e;void 0===v&&B(),null===(e=(n=s.props).onMouseLeave)||void 0===e||e.call(n,r)},onFocus:r=>{var n,e;void 0===v&&R(),null===(e=(n=s.props).onFocus)||void 0===e||e.call(n,r)},onBlur:r=>{var n,e;void 0===v&&B(),null===(e=(n=s.props).onBlur)||void 0===e||e.call(n,r)},"aria-describedby":z?"vtx-tooltip-content":void 0});return n(e,{children:[W,F&&g(n("div",{ref:N,id:"vtx-tooltip-content",role:"tooltip",className:O,style:{top:`${M.top}px`,left:`${M.left}px`,maxWidth:p},onMouseEnter:()=>{x||void 0!==v||(A.current=!0,I.current&&clearTimeout(I.current))},onMouseLeave:()=>{x||void 0!==v||B()},..._,children:[m&&r("span",{className:"vtx-tooltip-arrow","aria-hidden":"true"}),n("div",{className:"vtx-tooltip-inner",children:[r("span",{className:"vtx-tooltip-content",children:t}),b&&r("button",{type:"button",className:"vtx-tooltip-close",onClick:()=>{A.current=!1,C(!1),null==w||w(),null==y||y(),L.current=setTimeout(()=>{$(!1)},150)},"aria-label":"Dismiss tooltip",children:r(Cr,{size:14})})]})]}),document.body)]})});ze.displayName="Tooltip";const Ce=({data:n,grid:e,renderItem:t,className:o=""})=>{const i=a.useMemo(()=>{if(e&&!e.auto)return{mobile:e.mobile||1,tablet:e.tablet||2,desktop:e.desktop||3,spacing:e.spacing||"md",align:e.align||"stretch"};const r=(t=n.length)<=1?{mobile:1,tablet:1,desktop:1}:2===t?{mobile:1,tablet:2,desktop:2}:3===t?{mobile:1,tablet:2,desktop:3}:4===t?{mobile:1,tablet:2,desktop:4}:t<=6?{mobile:2,tablet:3,desktop:3}:t<=8?{mobile:2,tablet:3,desktop:4}:{mobile:2,tablet:4,desktop:6};var t;return{mobile:(null==e?void 0:e.mobile)||r.mobile,tablet:(null==e?void 0:e.tablet)||r.tablet,desktop:(null==e?void 0:e.desktop)||r.desktop,spacing:(null==e?void 0:e.spacing)||"md",align:(null==e?void 0:e.align)||"stretch"}},[n.length,e]),l=(d=i.mobile,c=i.tablet,s=i.desktop,["vtx-widget-grid",(v=i.spacing)?`gap-${v}`:"gap-md",`mobile-cols-${d}`,`tablet-cols-${c}`,`desktop-cols-${s}`].join(" "));var d,c,s,v;return r("div",{className:`${l} ${o}`.trim(),style:{alignItems:"stretch"===i.align?"stretch":i.align},children:n.map((n,e)=>r("div",{className:"vtx-widget-grid-item",children:t(n,e)},(null==n?void 0:n.id)||e))})};cn(".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 Se=a.forwardRef(({children:e,variant:t="elevated",size:a,noPadding:o=!1,padding:i,hoverable:l=!1,clickable:d=!1,className:c="",header:s,footer:v,divider:x=!1,style:m,onClick:p,tabIndex:h,...u},g)=>{const{theme:b}=kn(),f=["vtx-card",`vtx-card--${t}`,`vtx-card--${a||(null==b?void 0:b.defaultSize)||"md"}`,l?"vtx-card--hoverable":"",d?"vtx-card--clickable":"",o&&!i?"vtx-card--no-padding":"",c].filter(Boolean).join(" "),y={...m||{},...i?{"--vtx-card-padding":i}:{}};return n("div",{ref:g,className:f,style:y,onClick:p,tabIndex:d?"number"==typeof h?h:0:h,...u,children:[s&&r("div",{className:"vtx-card-header"+(x?" vtx-card-header--divider":""),children:s}),r("div",{className:"vtx-card-content",children:e}),v&&r("div",{className:"vtx-card-footer"+(x?" vtx-card-footer--divider":""),children:v})]})});Se.displayName="Card";const $e=gr(Se);cn(".vtx-badge {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  line-height: 1;\r\n  white-space: nowrap;\r\n  border-radius: var(--vtx-radius-base);\r\n  transition: all var(--vtx-transition-base);\r\n}\r\n\r\n/* Sizes */\r\n.vtx-badge--sm {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-xs);\r\n}\r\n\r\n.vtx-badge--md {\r\n  padding: calc(var(--vtx-spacing-1) + 1px) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-badge--lg {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-base);\r\n}\r\n\r\n/* Variants */\r\n.vtx-badge--neutral {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-800);\r\n}\r\n\r\n.vtx-badge--primary {\r\n  background-color: var(--vtx-color-primary-100);\r\n  color: var(--vtx-color-primary-800);\r\n}\r\n\r\n.vtx-badge--success {\r\n  background-color: var(--vtx-color-success-50);\r\n  color: var(--vtx-color-success-700);\r\n}\r\n\r\n.vtx-badge--warning {\r\n  background-color: var(--vtx-color-warning-50);\r\n  color: var(--vtx-color-warning-700);\r\n}\r\n\r\n.vtx-badge--error {\r\n  background-color: var(--vtx-color-error-50);\r\n  color: var(--vtx-color-error-700);\r\n}\r\n\r\n.vtx-badge--info {\r\n  background-color: var(--vtx-color-info-50);\r\n  color: var(--vtx-color-info-700);\r\n}\r\n\r\n/* Pill shape */\r\n.vtx-badge--pill {\r\n  border-radius: var(--vtx-radius-full);\r\n}\r\n\r\n/* Dot indicator */\r\n.vtx-badge-dot {\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: var(--vtx-radius-full);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-badge--neutral .vtx-badge-dot {\r\n  background-color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-badge--primary .vtx-badge-dot {\r\n  background-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-badge--success .vtx-badge-dot {\r\n  background-color: var(--vtx-color-success-600);\r\n}\r\n\r\n.vtx-badge--warning .vtx-badge-dot {\r\n  background-color: var(--vtx-color-warning-600);\r\n}\r\n\r\n.vtx-badge--error .vtx-badge-dot {\r\n  background-color: var(--vtx-color-error-600);\r\n}\r\n\r\n.vtx-badge--info .vtx-badge-dot {\r\n  background-color: var(--vtx-color-info-600);\r\n}\r\n");const Me=a.forwardRef(({variant:e="neutral",size:t,pill:a=!1,dot:o=!1,outline:i=!1,maxLength:l,icon:d,children:c,className:s="",onRemove:v,...x},m)=>{const{theme:p}=kn(),h=["vtx-badge",`vtx-badge--${e}`,`vtx-badge--${t||p.defaultSize}`,a&&"vtx-badge--pill",o&&"vtx-badge--with-dot",i&&"vtx-badge--outline",v&&"vtx-badge--removable",s].filter(Boolean).join(" "),g=u(()=>l&&"string"==typeof c&&c.length>l?`${c.slice(0,l)}...`:c,[c,l]);return n("span",{ref:m,className:h,...x,children:[o&&r("span",{className:"vtx-badge-dot","aria-hidden":"true"}),d&&r("span",{className:"vtx-badge-icon","aria-hidden":"true",children:d}),r("span",{className:"vtx-badge-content",children:g}),v&&r("button",{type:"button",className:"vtx-badge-remove",onClick:v,"aria-label":"Remove badge",children:r(Cr,{})})]})});Me.displayName="Badge";const Te=gr(Me),De=({data:e,settings:t,theme:a,variant:o,size:i,className:l,style:d})=>{const c=(null==t?void 0:t.theme)||a||"modern",s=(null==t?void 0:t.variant)||o||"primary",v=(null==t?void 0:t.size)||i||"md",x=(null==t?void 0:t.className)||l||"",m=(null==t?void 0:t.style)||d,p=!1!==(null==t?void 0:t.showTrend),h=()=>{if(!e.trend||!p)return null;const{direction:t,value:a,label:o}=e.trend,i="up"===t,l="down"===t,d=i?"success":l?"error":"neutral";return n(se,{align:"center",gap:"xs",children:[r(i||l?tn:Tr,{size:12}),n(xe,{variant:"caption",className:`text-${d}`,children:[Math.abs(a),"%",o&&` ${o}`]})]})};return r($e,{variant:"elevated",className:["vtx-metric-widget",`vtx-metric-widget--${c}`,`vtx-metric-widget--${v}`,`vtx-metric-widget--${s}`,x].filter(Boolean).join(" "),style:m,padding:"minimal"===c?"lg":"compact"===c?"md":"lg",children:(()=>{switch(c){case"minimal":return n(se,{direction:"column",align:"center",gap:"xs",children:[r(xe,{variant:"lg"===v?"h2":"sm"===v?"h5":"h3",className:"font-bold",children:e.value}),e.label&&r(xe,{variant:"caption",className:"text-neutral-500",children:e.label}),h()]});case"modern":return n(se,{direction:"column",gap:"sm",children:[n(se,{justify:"between",align:"start",children:[n("div",{children:[e.label&&r(xe,{variant:"caption",className:"text-neutral-500 mb-1",children:e.label}),r(xe,{variant:"lg"===v?"h2":"sm"===v?"h5":"h3",className:"font-bold",children:e.value})]}),e.icon&&r("div",{className:`metric-icon metric-icon--${s} metric-icon--${v}`,children:e.icon})]}),(e.trend||e.badge)&&n(se,{justify:"between",align:"center",children:[h(),e.badge&&r(Te,{variant:(t=e.badge.variant,("error"===t?"error":"secondary"===t?"neutral":t)||"neutral"),children:e.badge.text})]})]});case"compact":return n(se,{align:"center",gap:"md",children:[e.icon&&r("div",{className:`metric-icon metric-icon--${s} metric-icon--${v}`,children:e.icon}),n(se,{direction:"column",gap:"xs",children:[r(xe,{variant:"lg"===v?"h3":"sm"===v?"h6":"h4",className:"font-bold",children:e.value}),e.label&&r(xe,{variant:"caption",className:"text-neutral-500",children:e.label}),h()]})]});default:return n(se,{direction:"column",gap:"sm",children:[r(xe,{variant:"lg"===v?"h2":"sm"===v?"h5":"h3",className:"font-bold",children:e.value}),e.label&&r(xe,{variant:"caption",className:"text-neutral-500",children:e.label}),h()]})}var t})()})};cn(".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");cn("/* Grid Base Styles */\r\n.vtx-grid {\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Container Styles */\r\n.vtx-grid-container {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Item Styles */\r\n.vtx-grid-item {\r\n  margin: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Direction */\r\n.vtx-grid-direction-row {\r\n  flex-direction: row;\r\n}\r\n\r\n.vtx-grid-direction-row-reverse {\r\n  flex-direction: row-reverse;\r\n}\r\n\r\n.vtx-grid-direction-column {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-grid-direction-column-reverse {\r\n  flex-direction: column-reverse;\r\n}\r\n\r\n/* Wrap */\r\n.vtx-grid-wrap-nowrap {\r\n  flex-wrap: nowrap;\r\n}\r\n\r\n.vtx-grid-wrap-wrap {\r\n  flex-wrap: wrap;\r\n}\r\n\r\n.vtx-grid-wrap-wrap-reverse {\r\n  flex-wrap: wrap-reverse;\r\n}\r\n\r\n/* Spacing - Container */\r\n.vtx-grid-spacing-0 {\r\n  margin: 0;\r\n}\r\n\r\n.vtx-grid-spacing-0 > .vtx-grid-item {\r\n  padding: 0;\r\n}\r\n\r\n.vtx-grid-spacing-1 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\r\n}\r\n\r\n.vtx-grid-spacing-1 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\r\n}\r\n\r\n.vtx-grid-spacing-2 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\r\n}\r\n\r\n.vtx-grid-spacing-2 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\r\n}\r\n\r\n.vtx-grid-spacing-3 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\r\n}\r\n\r\n.vtx-grid-spacing-3 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\r\n}\r\n\r\n.vtx-grid-spacing-4 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\r\n}\r\n\r\n.vtx-grid-spacing-4 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\r\n}\r\n\r\n.vtx-grid-spacing-5 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\r\n}\r\n\r\n.vtx-grid-spacing-5 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\r\n}\r\n\r\n.vtx-grid-spacing-6 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 6);\r\n}\r\n\r\n.vtx-grid-spacing-6 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3);\r\n}\r\n\r\n.vtx-grid-spacing-7 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -3.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 7);\r\n}\r\n\r\n.vtx-grid-spacing-7 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 3.5);\r\n}\r\n\r\n.vtx-grid-spacing-8 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 8);\r\n}\r\n\r\n.vtx-grid-spacing-8 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4);\r\n}\r\n\r\n.vtx-grid-spacing-9 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -4.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 9);\r\n}\r\n\r\n.vtx-grid-spacing-9 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 4.5);\r\n}\r\n\r\n.vtx-grid-spacing-10 {\r\n  margin: calc(var(--vtx-grid-spacing-unit, 8px) * -5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 10);\r\n}\r\n\r\n.vtx-grid-spacing-10 > .vtx-grid-item {\r\n  padding: calc(var(--vtx-grid-spacing-unit, 8px) * 5);\r\n}\r\n\r\n/* Row Spacing */\r\n.vtx-grid-row-spacing-1 {\r\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\r\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\r\n}\r\n\r\n.vtx-grid-row-spacing-1 > .vtx-grid-item {\r\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\r\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\r\n}\r\n\r\n.vtx-grid-row-spacing-2 {\r\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\r\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\r\n}\r\n\r\n.vtx-grid-row-spacing-2 > .vtx-grid-item {\r\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\r\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\r\n}\r\n\r\n.vtx-grid-row-spacing-3 {\r\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\r\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\r\n}\r\n\r\n.vtx-grid-row-spacing-3 > .vtx-grid-item {\r\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\r\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\r\n}\r\n\r\n.vtx-grid-row-spacing-4 {\r\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\r\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\r\n}\r\n\r\n.vtx-grid-row-spacing-4 > .vtx-grid-item {\r\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\r\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\r\n}\r\n\r\n.vtx-grid-row-spacing-5 {\r\n  margin-top: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\r\n  margin-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\r\n}\r\n\r\n.vtx-grid-row-spacing-5 > .vtx-grid-item {\r\n  padding-top: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\r\n  padding-bottom: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\r\n}\r\n\r\n/* Column Spacing */\r\n.vtx-grid-column-spacing-1 {\r\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\r\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -0.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 1);\r\n}\r\n\r\n.vtx-grid-column-spacing-1 > .vtx-grid-item {\r\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\r\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 0.5);\r\n}\r\n\r\n.vtx-grid-column-spacing-2 {\r\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\r\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 2);\r\n}\r\n\r\n.vtx-grid-column-spacing-2 > .vtx-grid-item {\r\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\r\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1);\r\n}\r\n\r\n.vtx-grid-column-spacing-3 {\r\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\r\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -1.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 3);\r\n}\r\n\r\n.vtx-grid-column-spacing-3 > .vtx-grid-item {\r\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\r\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 1.5);\r\n}\r\n\r\n.vtx-grid-column-spacing-4 {\r\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\r\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 4);\r\n}\r\n\r\n.vtx-grid-column-spacing-4 > .vtx-grid-item {\r\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\r\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2);\r\n}\r\n\r\n.vtx-grid-column-spacing-5 {\r\n  margin-left: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\r\n  margin-right: calc(var(--vtx-grid-spacing-unit, 8px) * -2.5);\r\n  width: calc(100% + var(--vtx-grid-spacing-unit, 8px) * 5);\r\n}\r\n\r\n.vtx-grid-column-spacing-5 > .vtx-grid-item {\r\n  padding-left: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\r\n  padding-right: calc(var(--vtx-grid-spacing-unit, 8px) * 2.5);\r\n}\r\n\r\n/* XS (Extra Small) - 0px and up */\r\n.vtx-grid-xs-auto {\r\n  flex-grow: 0;\r\n  flex-basis: auto;\r\n  max-width: none;\r\n}\r\n\r\n.vtx-grid-xs {\r\n  flex-grow: 1;\r\n  flex-basis: 0;\r\n  max-width: 100%;\r\n}\r\n\r\n.vtx-grid-xs-1 {\r\n  flex-grow: 0;\r\n  flex-basis: 8.333333%;\r\n  max-width: 8.333333%;\r\n}\r\n\r\n.vtx-grid-xs-2 {\r\n  flex-grow: 0;\r\n  flex-basis: 16.666667%;\r\n  max-width: 16.666667%;\r\n}\r\n\r\n.vtx-grid-xs-3 {\r\n  flex-grow: 0;\r\n  flex-basis: 25%;\r\n  max-width: 25%;\r\n}\r\n\r\n.vtx-grid-xs-4 {\r\n  flex-grow: 0;\r\n  flex-basis: 33.333333%;\r\n  max-width: 33.333333%;\r\n}\r\n\r\n.vtx-grid-xs-5 {\r\n  flex-grow: 0;\r\n  flex-basis: 41.666667%;\r\n  max-width: 41.666667%;\r\n}\r\n\r\n.vtx-grid-xs-6 {\r\n  flex-grow: 0;\r\n  flex-basis: 50%;\r\n  max-width: 50%;\r\n}\r\n\r\n.vtx-grid-xs-7 {\r\n  flex-grow: 0;\r\n  flex-basis: 58.333333%;\r\n  max-width: 58.333333%;\r\n}\r\n\r\n.vtx-grid-xs-8 {\r\n  flex-grow: 0;\r\n  flex-basis: 66.666667%;\r\n  max-width: 66.666667%;\r\n}\r\n\r\n.vtx-grid-xs-9 {\r\n  flex-grow: 0;\r\n  flex-basis: 75%;\r\n  max-width: 75%;\r\n}\r\n\r\n.vtx-grid-xs-10 {\r\n  flex-grow: 0;\r\n  flex-basis: 83.333333%;\r\n  max-width: 83.333333%;\r\n}\r\n\r\n.vtx-grid-xs-11 {\r\n  flex-grow: 0;\r\n  flex-basis: 91.666667%;\r\n  max-width: 91.666667%;\r\n}\r\n\r\n.vtx-grid-xs-12 {\r\n  flex-grow: 0;\r\n  flex-basis: 100%;\r\n  max-width: 100%;\r\n}\r\n\r\n/* SM (Small) - 600px and up */\r\n@media (min-width: 600px) {\r\n  .vtx-grid-sm-auto {\r\n    flex-grow: 0;\r\n    flex-basis: auto;\r\n    max-width: none;\r\n  }\r\n\r\n  .vtx-grid-sm {\r\n    flex-grow: 1;\r\n    flex-basis: 0;\r\n    max-width: 100%;\r\n  }\r\n\r\n  .vtx-grid-sm-1 {\r\n    flex-grow: 0;\r\n    flex-basis: 8.333333%;\r\n    max-width: 8.333333%;\r\n  }\r\n\r\n  .vtx-grid-sm-2 {\r\n    flex-grow: 0;\r\n    flex-basis: 16.666667%;\r\n    max-width: 16.666667%;\r\n  }\r\n\r\n  .vtx-grid-sm-3 {\r\n    flex-grow: 0;\r\n    flex-basis: 25%;\r\n    max-width: 25%;\r\n  }\r\n\r\n  .vtx-grid-sm-4 {\r\n    flex-grow: 0;\r\n    flex-basis: 33.333333%;\r\n    max-width: 33.333333%;\r\n  }\r\n\r\n  .vtx-grid-sm-5 {\r\n    flex-grow: 0;\r\n    flex-basis: 41.666667%;\r\n    max-width: 41.666667%;\r\n  }\r\n\r\n  .vtx-grid-sm-6 {\r\n    flex-grow: 0;\r\n    flex-basis: 50%;\r\n    max-width: 50%;\r\n  }\r\n\r\n  .vtx-grid-sm-7 {\r\n    flex-grow: 0;\r\n    flex-basis: 58.333333%;\r\n    max-width: 58.333333%;\r\n  }\r\n\r\n  .vtx-grid-sm-8 {\r\n    flex-grow: 0;\r\n    flex-basis: 66.666667%;\r\n    max-width: 66.666667%;\r\n  }\r\n\r\n  .vtx-grid-sm-9 {\r\n    flex-grow: 0;\r\n    flex-basis: 75%;\r\n    max-width: 75%;\r\n  }\r\n\r\n  .vtx-grid-sm-10 {\r\n    flex-grow: 0;\r\n    flex-basis: 83.333333%;\r\n    max-width: 83.333333%;\r\n  }\r\n\r\n  .vtx-grid-sm-11 {\r\n    flex-grow: 0;\r\n    flex-basis: 91.666667%;\r\n    max-width: 91.666667%;\r\n  }\r\n\r\n  .vtx-grid-sm-12 {\r\n    flex-grow: 0;\r\n    flex-basis: 100%;\r\n    max-width: 100%;\r\n  }\r\n}\r\n\r\n/* MD (Medium) - 960px and up */\r\n@media (min-width: 960px) {\r\n  .vtx-grid-md-auto {\r\n    flex-grow: 0;\r\n    flex-basis: auto;\r\n    max-width: none;\r\n  }\r\n\r\n  .vtx-grid-md {\r\n    flex-grow: 1;\r\n    flex-basis: 0;\r\n    max-width: 100%;\r\n  }\r\n\r\n  .vtx-grid-md-1 {\r\n    flex-grow: 0;\r\n    flex-basis: 8.333333%;\r\n    max-width: 8.333333%;\r\n  }\r\n\r\n  .vtx-grid-md-2 {\r\n    flex-grow: 0;\r\n    flex-basis: 16.666667%;\r\n    max-width: 16.666667%;\r\n  }\r\n\r\n  .vtx-grid-md-3 {\r\n    flex-grow: 0;\r\n    flex-basis: 25%;\r\n    max-width: 25%;\r\n  }\r\n\r\n  .vtx-grid-md-4 {\r\n    flex-grow: 0;\r\n    flex-basis: 33.333333%;\r\n    max-width: 33.333333%;\r\n  }\r\n\r\n  .vtx-grid-md-5 {\r\n    flex-grow: 0;\r\n    flex-basis: 41.666667%;\r\n    max-width: 41.666667%;\r\n  }\r\n\r\n  .vtx-grid-md-6 {\r\n    flex-grow: 0;\r\n    flex-basis: 50%;\r\n    max-width: 50%;\r\n  }\r\n\r\n  .vtx-grid-md-7 {\r\n    flex-grow: 0;\r\n    flex-basis: 58.333333%;\r\n    max-width: 58.333333%;\r\n  }\r\n\r\n  .vtx-grid-md-8 {\r\n    flex-grow: 0;\r\n    flex-basis: 66.666667%;\r\n    max-width: 66.666667%;\r\n  }\r\n\r\n  .vtx-grid-md-9 {\r\n    flex-grow: 0;\r\n    flex-basis: 75%;\r\n    max-width: 75%;\r\n  }\r\n\r\n  .vtx-grid-md-10 {\r\n    flex-grow: 0;\r\n    flex-basis: 83.333333%;\r\n    max-width: 83.333333%;\r\n  }\r\n\r\n  .vtx-grid-md-11 {\r\n    flex-grow: 0;\r\n    flex-basis: 91.666667%;\r\n    max-width: 91.666667%;\r\n  }\r\n\r\n  .vtx-grid-md-12 {\r\n    flex-grow: 0;\r\n    flex-basis: 100%;\r\n    max-width: 100%;\r\n  }\r\n}\r\n\r\n/* LG (Large) - 1280px and up */\r\n@media (min-width: 1280px) {\r\n  .vtx-grid-lg-auto {\r\n    flex-grow: 0;\r\n    flex-basis: auto;\r\n    max-width: none;\r\n  }\r\n\r\n  .vtx-grid-lg {\r\n    flex-grow: 1;\r\n    flex-basis: 0;\r\n    max-width: 100%;\r\n  }\r\n\r\n  .vtx-grid-lg-1 {\r\n    flex-grow: 0;\r\n    flex-basis: 8.333333%;\r\n    max-width: 8.333333%;\r\n  }\r\n\r\n  .vtx-grid-lg-2 {\r\n    flex-grow: 0;\r\n    flex-basis: 16.666667%;\r\n    max-width: 16.666667%;\r\n  }\r\n\r\n  .vtx-grid-lg-3 {\r\n    flex-grow: 0;\r\n    flex-basis: 25%;\r\n    max-width: 25%;\r\n  }\r\n\r\n  .vtx-grid-lg-4 {\r\n    flex-grow: 0;\r\n    flex-basis: 33.333333%;\r\n    max-width: 33.333333%;\r\n  }\r\n\r\n  .vtx-grid-lg-5 {\r\n    flex-grow: 0;\r\n    flex-basis: 41.666667%;\r\n    max-width: 41.666667%;\r\n  }\r\n\r\n  .vtx-grid-lg-6 {\r\n    flex-grow: 0;\r\n    flex-basis: 50%;\r\n    max-width: 50%;\r\n  }\r\n\r\n  .vtx-grid-lg-7 {\r\n    flex-grow: 0;\r\n    flex-basis: 58.333333%;\r\n    max-width: 58.333333%;\r\n  }\r\n\r\n  .vtx-grid-lg-8 {\r\n    flex-grow: 0;\r\n    flex-basis: 66.666667%;\r\n    max-width: 66.666667%;\r\n  }\r\n\r\n  .vtx-grid-lg-9 {\r\n    flex-grow: 0;\r\n    flex-basis: 75%;\r\n    max-width: 75%;\r\n  }\r\n\r\n  .vtx-grid-lg-10 {\r\n    flex-grow: 0;\r\n    flex-basis: 83.333333%;\r\n    max-width: 83.333333%;\r\n  }\r\n\r\n  .vtx-grid-lg-11 {\r\n    flex-grow: 0;\r\n    flex-basis: 91.666667%;\r\n    max-width: 91.666667%;\r\n  }\r\n\r\n  .vtx-grid-lg-12 {\r\n    flex-grow: 0;\r\n    flex-basis: 100%;\r\n    max-width: 100%;\r\n  }\r\n}\r\n\r\n/* XL (Extra Large) - 1920px and up */\r\n@media (min-width: 1920px) {\r\n  .vtx-grid-xl-auto {\r\n    flex-grow: 0;\r\n    flex-basis: auto;\r\n    max-width: none;\r\n  }\r\n\r\n  .vtx-grid-xl {\r\n    flex-grow: 1;\r\n    flex-basis: 0;\r\n    max-width: 100%;\r\n  }\r\n\r\n  .vtx-grid-xl-1 {\r\n    flex-grow: 0;\r\n    flex-basis: 8.333333%;\r\n    max-width: 8.333333%;\r\n  }\r\n\r\n  .vtx-grid-xl-2 {\r\n    flex-grow: 0;\r\n    flex-basis: 16.666667%;\r\n    max-width: 16.666667%;\r\n  }\r\n\r\n  .vtx-grid-xl-3 {\r\n    flex-grow: 0;\r\n    flex-basis: 25%;\r\n    max-width: 25%;\r\n  }\r\n\r\n  .vtx-grid-xl-4 {\r\n    flex-grow: 0;\r\n    flex-basis: 33.333333%;\r\n    max-width: 33.333333%;\r\n  }\r\n\r\n  .vtx-grid-xl-5 {\r\n    flex-grow: 0;\r\n    flex-basis: 41.666667%;\r\n    max-width: 41.666667%;\r\n  }\r\n\r\n  .vtx-grid-xl-6 {\r\n    flex-grow: 0;\r\n    flex-basis: 50%;\r\n    max-width: 50%;\r\n  }\r\n\r\n  .vtx-grid-xl-7 {\r\n    flex-grow: 0;\r\n    flex-basis: 58.333333%;\r\n    max-width: 58.333333%;\r\n  }\r\n\r\n  .vtx-grid-xl-8 {\r\n    flex-grow: 0;\r\n    flex-basis: 66.666667%;\r\n    max-width: 66.666667%;\r\n  }\r\n\r\n  .vtx-grid-xl-9 {\r\n    flex-grow: 0;\r\n    flex-basis: 75%;\r\n    max-width: 75%;\r\n  }\r\n\r\n  .vtx-grid-xl-10 {\r\n    flex-grow: 0;\r\n    flex-basis: 83.333333%;\r\n    max-width: 83.333333%;\r\n  }\r\n\r\n  .vtx-grid-xl-11 {\r\n    flex-grow: 0;\r\n    flex-basis: 91.666667%;\r\n    max-width: 91.666667%;\r\n  }\r\n\r\n  .vtx-grid-xl-12 {\r\n    flex-grow: 0;\r\n    flex-basis: 100%;\r\n    max-width: 100%;\r\n  }\r\n}\r\n");const je=a.forwardRef(({container:n=!1,item:e=!1,spacing:t,rowSpacing:a,columnSpacing:o,xs:i,sm:l,md:d,lg:c,xl:s,justifyContent:v,alignItems:x,alignContent:m,direction:p="row",wrap:h="wrap",className:u="",children:g,style:b,...f},y)=>{const w=["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!==c&&"vtx-grid-lg"+(!0===c?"":"auto"===c?"-auto":`-${c}`),void 0!==s&&"vtx-grid-xl"+(!0===s?"":"auto"===s?"-auto":`-${s}`),n&&"row"!==p&&`vtx-grid-direction-${p}`,n&&"wrap"!==h&&`vtx-grid-wrap-${h}`,u].filter(Boolean).join(" "),k={...b};return n&&(v&&(k.justifyContent=v),x&&(k.alignItems=x),m&&(k.alignContent=m)),r("div",{ref:y,className:w,style:Object.keys(k).length>0?k:void 0,...f,children:g})});je.displayName="Grid";const Ie=gr(je),Le=a.forwardRef(({icon:e,iconVariant:t="primary",text:a,subText:o,className:i="",style:l,...d},c)=>r($e,{variant:"outlined",className:i,style:l,ref:c,...d,children:n(Ie,{container:!0,spacing:2,alignItems:"center",wrap:"nowrap",justifyContent:"center",children:[r(Ie,{item:!0,xs:"auto",children:r(se,{align:"center",justify:"center",children:r("span",{className:`infocard-icon infocard-icon--${t}`,children:e})})}),n(Ie,{item:!0,xs:!0,children:[r(xe,{variant:"caption",children:a}),o&&r(xe,{variant:"subtitle2",children:o})]})]})}));Le.displayName="InfoCardBase";const Ae=a.forwardRef(({value:e,label:t,className:a="",style:o,...i},l)=>r($e,{variant:"outlined",className:a,style:o,ref:l,...i,children:n(se,{direction:"column",align:"center",justify:"center",style:{minHeight:80},children:[r(xe,{variant:"h4",children:e}),t&&r(xe,{variant:"caption",children:t})]})}));Ae.displayName="InfoCardMetric";const Re={Base:gr(Le),Metric:gr(Ae)};cn("/* 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 Be=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,heading:o,subText:i,className:l="",style:d,...c},s)=>n(se,{direction:"row",align:"center",gap:8,className:`infotext-base ${l}`,style:d,ref:s,...c,children:[r(se,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(se,{direction:"column",gap:4,children:[r(xe,{variant:"body1",weight:"medium",noMargin:!0,children:o}),i&&r(xe,{variant:"caption",textColor:"var(--text-secondary)",noMargin:!0,children:i})]})]}));Be.displayName="InfoTextBase";const Ee=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,value:o,label:i,subText:l,className:d="",style:c,...s},v)=>n(se,{direction:"row",align:"center",gap:8,className:`infotext-stat ${d}`,style:c,ref:v,...s,children:[e&&r(se,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(se,{direction:"column",gap:4,children:[r(xe,{variant:"h5",weight:"bold",noMargin:!0,children:o}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:i}),l&&r(xe,{variant:"caption",textColor:"var(--text-secondary)",noMargin:!0,children:l})]})]}));Ee.displayName="InfoTextStat";const Oe=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,title:o,description:i,badge:l,className:d="",style:c,...s},v)=>n(se,{direction:"row",align:"start",gap:8,className:`infotext-feature ${d}`,style:c,ref:v,...s,children:[r(se,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(se,{direction:"column",gap:6,style:{flex:1},children:[n(se,{align:"center",gap:8,children:[r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:o}),l&&r("span",{className:"infotext-badge",children:l})]}),r(xe,{variant:"body2",textColor:"var(--text-secondary)",noMargin:!0,children:i})]})]}));Oe.displayName="InfoTextFeature";const Fe=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,text:o,className:i="",style:l,...d},c)=>n(se,{direction:"row",align:"center",gap:8,className:`infotext-compact ${i}`,style:l,ref:c,...d,children:[r("span",a?{className:`infotext-icon-small infotext-icon-small--${t}`,children:e}:{className:"infotext-icon-small-plain",children:e}),r(xe,{variant:"body2",noMargin:!0,children:o})]}));Fe.displayName="InfoTextCompact";const We=a.forwardRef(({icon:e,iconVariant:t="primary",iconCircle:a=!0,heading:o,subText:i,className:l="",style:d,...c},s)=>n(se,{direction:"column",align:"center",gap:10,className:`infotext-vertical ${l}`,style:d,ref:s,...c,children:[r(se,{align:"center",justify:"center",className:"infotext-icon-wrapper",children:r("span",a?{className:`infotext-icon infotext-icon--${t}`,children:e}:{className:"infotext-icon-plain",children:e})}),n(se,{direction:"column",gap:4,align:"center",children:[r(xe,{variant:"body1",weight:"medium",align:"center",noMargin:!0,children:o}),i&&r(xe,{variant:"caption",textColor:"var(--text-secondary)",align:"center",noMargin:!0,children:i})]})]}));We.displayName="InfoTextVertical";const Pe={Base:gr(Be),Stat:gr(Ee),Feature:gr(Oe),Compact:gr(Fe),Vertical:gr(We)},He=({data:n,settings:t,theme:a,variant:o,className:i,style:l})=>{const d=(null==t?void 0:t.theme)||a||"modern",c=(null==t?void 0:t.variant)||o||"primary",s=(null==t?void 0:t.className)||i||"",v=(null==t?void 0:t.style)||l,x="error"===(m=(null==t?void 0:t.iconVariant)||c)?"danger":"neutral"===m?"secondary":m||"primary";var m;return"minimal"===d||"compact"===d?r(Pe.Base,{icon:n.icon||r(e,{}),iconVariant:x,iconCircle:"compact"!==d,heading:n.text,subText:n.subText,className:s,style:v}):r(Re.Base,{icon:n.icon||r(e,{}),iconVariant:x,text:n.text,subText:n.subText,className:s,style:v})};cn("/* ==================== 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 Ve=a.forwardRef(({id:e,image:t,imageAlt:a="Product",category:o,name:l,weight:d,units:c,price:s,originalPrice:v,discount:x,rating:m,initialQuantity:p=0,featured:h=!1,featuredText:u="Featured",showWishlist:g=!1,isWishlisted:b=!1,cartIcon:f,wishlistIcon:y,wishlistFilledIcon:w,quickViewIcon:k,onAddToCart:_,onIncrementCart:N,onDecrementCart:z,onWishlist:C,onQuickView:S,onClick:$,loading:M=!1,className:T="",style:D,...j},I)=>{const[L,A]=i(p),[R,B]=i(!1),E=R||M;return r($e,{variant:"outlined",className:`productcard ${T}`,style:{...D},noPadding:!0,ref:I,...j,children:n(se,{direction:"column",children:[n("div",{className:"productcard-image-wrapper",onClick:$,style:{cursor:$?"pointer":"default"},children:[r("img",{src:t,alt:a,className:"productcard-image"}),n("div",{className:"productcard-badges",children:[h&&r("span",{className:"productcard-featured-badge",children:u}),x&&r("span",{className:"productcard-discount-badge",children:x})]}),g&&C&&r("button",{className:"productcard-wishlist-btn "+(b?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),C()},"aria-label":b?"Remove from wishlist":"Add to wishlist",children:b?w||y||"♥":y||"♡"}),S&&r("div",{className:"productcard-hover-overlay",children:r(Cn,{variant:"secondary",size:"sm",leftIcon:k||"👁",onClick:r=>{r.stopPropagation(),S()},children:"Quick View"})})]}),n(se,{direction:"column",gap:5,className:"p-3",children:[o&&r("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r(Rn,{label:o,variant:"outlined",className:"productcard-category"})}),r(xe,{variant:"body1",noMargin:!0,onClick:$,style:{cursor:$?"pointer":"default"},children:l}),(void 0!==d||c)&&r(xe,{variant:"body1",noMargin:!0,className:"productcard-weight",children:void 0!==d&&c?`${d} ${c}`:void 0!==d?d:"-"}),void 0!==m&&n(se,{align:"center",gap:5,className:"productcard-rating-wrapper",children:[n("div",{className:"productcard-rating",children:["★".repeat(Math.floor(m)),"☆".repeat(5-Math.floor(m))]}),r(xe,{variant:"caption",noMargin:!0,children:m})]}),n(se,{align:"center",gap:8,children:[n(xe,{variant:"h5",noMargin:!0,className:"productcard-price",children:["$",Number(s).toFixed(2)]}),v&&v>s&&n(xe,{variant:"body2",noMargin:!0,className:"productcard-original-price",children:["$",Number(v).toFixed(2)]})]}),E?r(Cn,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===L?r(Cn,{fullWidth:!0,variant:"primary",leftIcon:f,onClick:async()=>{if(_){B(!0);try{await _(e,1),A(1)}catch(r){console.error("Add to cart error:",r)}finally{B(!1)}}},children:"Add to cart"}):n(se,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r(Cn,{variant:"secondary",onClick:async()=>{if(z&&!(L<=0)){B(!0);try{await z(e,L),A(L-1)}catch(r){console.error("Decrement error:",r)}finally{B(!1)}}},children:"-"}),r(xe,{noMargin:!0,className:"productcard-quantity-value",children:L}),r(Cn,{variant:"secondary",onClick:async()=>{if(N){B(!0);try{await N(e,L),A(L+1)}catch(r){console.error("Increment error:",r)}finally{B(!1)}}},children:"+"})]})]})]})})});Ve.displayName="ProductCardBase";const Ye=a.forwardRef(({imagePosition:e="left",...t},a)=>{const{id:o,image:l,imageAlt:d="Product",category:c,name:s,weight:v,units:x,price:m,originalPrice:p,discount:h,rating:u,initialQuantity:g=0,featured:b=!1,featuredText:f="Featured",showWishlist:y=!1,isWishlisted:w=!1,cartIcon:k,wishlistIcon:_,wishlistFilledIcon:N,quickViewIcon:z,onAddToCart:C,onIncrementCart:S,onDecrementCart:$,onWishlist:M,onQuickView:T,onClick:D,loading:j=!1,className:I="",style:L}=t,[A,R]=i(g),[B,E]=i(!1),O=B||j;return r($e,{variant:"outlined",className:`productcard-wide ${I}`,style:{padding:0,...L},ref:a,children:n(se,{direction:"left"===e?"row":"row-reverse",children:[n("div",{className:"productcard-wide-image-wrapper",onClick:D,style:{cursor:D?"pointer":"default"},children:[r("img",{src:l,alt:d,className:"productcard-wide-image"}),n("div",{className:"productcard-badges",children:[b&&r("span",{className:"productcard-featured-badge",children:f}),h&&r("span",{className:"productcard-discount-badge",children:h})]}),y&&M&&r("button",{className:"productcard-wishlist-btn "+(w?"productcard-wishlist-btn--active":""),onClick:r=>{r.stopPropagation(),M()},children:w?N||_||"♥":_||"♡"})]}),n(se,{direction:"column",gap:12,style:{padding:"16px 20px",flex:1,minWidth:0},children:[c&&r("div",{style:{display:"inline-flex",alignSelf:"flex-start"},children:r(Rn,{label:c,variant:"outlined",className:"productcard-category"})}),n(se,{direction:"column",gap:6,children:[r(xe,{variant:"h5",weight:"bold",noMargin:!0,onClick:D,style:{cursor:D?"pointer":"default",wordBreak:"break-word"},children:s}),(void 0!==v||x)&&r(xe,{variant:"body2",noMargin:!0,className:"productcard-weight",children:void 0!==v&&x?`${v} ${x}`:void 0!==v?v:"-"})]}),void 0!==u&&n(se,{align:"center",gap:6,children:[n("div",{className:"productcard-rating",children:["★".repeat(Math.floor(u)),"☆".repeat(5-Math.floor(u))]}),r(xe,{variant:"caption",noMargin:!0,children:u})]}),n(se,{align:"center",gap:8,wrap:"wrap",style:{marginTop:"auto"},children:[n(xe,{variant:"h4",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(m).toFixed(2)]}),p&&p>m&&n(xe,{variant:"body1",noMargin:!0,className:"productcard-original-price",children:["$",Number(p).toFixed(2)]})]}),n(se,{gap:12,align:"center",direction:"row",wrap:"wrap",children:[r("div",{style:{flex:"1 1 auto",minWidth:"140px"},children:O?r(Cn,{fullWidth:!0,loading:!0,variant:"primary",children:"Loading"}):0===A?r(Cn,{fullWidth:!0,variant:"primary",leftIcon:k,onClick:async()=>{if(C){E(!0);try{await C(o,1),R(1)}catch(r){console.error("Add to cart error:",r)}finally{E(!1)}}},children:"Add to cart"}):n(se,{align:"center",direction:"row",justify:"between",className:"productcard-quantity-selector",children:[r(Cn,{variant:"secondary",onClick:async()=>{if($&&!(A<=0)){E(!0);try{await $(o,A),R(A-1)}catch(r){console.error("Decrement error:",r)}finally{E(!1)}}},children:"-"}),r(xe,{noMargin:!0,className:"productcard-quantity-value",children:A}),r(Cn,{variant:"primary",onClick:async()=>{if(S){E(!0);try{await S(o,A),R(A+1)}catch(r){console.error("Increment error:",r)}finally{E(!1)}}},children:"+"})]})}),T&&r(Cn,{variant:"outline",size:"md",leftIcon:z||"👁",onClick:T,children:"View"})]})]})]})})});Ye.displayName="ProductCardWide";const qe=a.forwardRef((e,t)=>{const{id:a,image:o,imageAlt:l="Product",name:d,price:c,originalPrice:s,discount:v,rating:x,initialQuantity:m=0,showWishlist:p=!1,isWishlisted:h=!1,cartIcon:u,wishlistIcon:g,wishlistFilledIcon:b,onAddToCart:f,onIncrementCart:y,onDecrementCart:w,onWishlist:k,onClick:_,loading:N=!1,className:z="",style:C}=e,[S,$]=i(m),[M,T]=i(!1),D=M||N;return n("div",{className:`productcard-minimal ${z}`,style:C,ref:t,children:[n("div",{className:"productcard-minimal-image-wrapper",onClick:_,style:{cursor:_?"pointer":"default"},children:[r("img",{src:o,alt:l,className:"productcard-minimal-image"}),v&&r("span",{className:"productcard-minimal-discount",children:v}),p&&k&&r("button",{className:"productcard-minimal-wishlist "+(h?"productcard-minimal-wishlist--active":""),onClick:r=>{r.stopPropagation(),k()},children:h?b||g||"♥":g||"♡"})]}),n(se,{direction:"column",gap:8,style:{padding:"12px 0"},children:[r(xe,{variant:"body1",weight:"medium",noMargin:!0,onClick:_,style:{cursor:_?"pointer":"default"},children:d}),n(se,{align:"center",gap:8,children:[n(xe,{variant:"h6",weight:"bold",noMargin:!0,className:"productcard-price",children:["$",Number(c).toFixed(2)]}),s&&s>c&&n(xe,{variant:"caption",noMargin:!0,className:"productcard-original-price",children:["$",Number(s).toFixed(2)]})]}),void 0!==x&&n("div",{className:"productcard-rating-minimal",children:["★".repeat(Math.floor(x)),"☆".repeat(5-Math.floor(x))]}),D?r(Cn,{loading:!0,variant:"primary",size:"sm",children:"Loading"}):0===S?r(Cn,{variant:"primary",size:"sm",leftIcon:u,onClick:async()=>{if(f){T(!0);try{await f(a,1),$(1)}catch(r){console.error("Add to cart error:",r)}finally{T(!1)}}},fullWidth:!0,children:"Add"}):n(se,{align:"center",justify:"between",className:"productcard-quantity-selector-minimal",children:[r(Cn,{variant:"secondary",size:"sm",onClick:async()=>{if(w&&!(S<=0)){T(!0);try{await w(a,S),$(S-1)}catch(r){console.error("Decrement error:",r)}finally{T(!1)}}},children:"-"}),r(xe,{variant:"body2",noMargin:!0,weight:"medium",children:S}),r(Cn,{variant:"primary",size:"sm",onClick:async()=>{if(y){T(!0);try{await y(a,S),$(S+1)}catch(r){console.error("Increment error:",r)}finally{T(!1)}}},children:"+"})]})]})]})});qe.displayName="ProductCardMinimal";const Ue={Base:gr(Ve),Wide:gr(Ye),Minimal:gr(qe)},Ge=({data:n,settings:e})=>r(Ue.Base,{id:n.id,name:n.name,price:Number(n.price),originalPrice:n.originalPrice?Number(n.originalPrice):void 0,category:n.category,rating:n.rating,image:n.image||"",...e||{}});cn("/* ==================== 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 Xe=a.forwardRef(({orderId:e,orderNumber:t,status:a="pending",statusText:o,items:i,deliveryDate:l,deliveryLabel:d="Delivered on",totalAmount:c,currency:s="₹",onTrackOrder:v,onViewDetails:x,trackButtonText:m="Track Order",className:p="",style:h,...u},g)=>{const b=i[0],f=i.length-1;return r($e,{variant:"outlined",className:`ordercard ${p}`,style:h,onClick:x?()=>x(e):void 0,ref:g,...u,children:n(se,{direction:"column",gap:0,children:[n(se,{align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-header",children:[r(xe,{variant:"body1",weight:"semibold",noMargin:!0,children:t||`Order #${e}`}),r(Te,{variant:(()=>{switch(a){case"delivered":return"success";case"cancelled":return"error";case"processing":case"shipped":return"info";case"pending":return"warning";default:return"neutral"}})(),children:o||a.charAt(0).toUpperCase()+a.slice(1)})]}),n(se,{direction:"row",gap:10,className:"ordercard-content",children:[b.image&&r("div",{className:"ordercard-image-wrapper",children:r("img",{src:b.image,alt:b.name,className:"ordercard-image"})}),n(se,{direction:"column",gap:2,style:{flex:1,minWidth:0},children:[n(xe,{variant:"body2",weight:"medium",noMargin:!0,className:"ordercard-product-name",children:[b.name,b.quantity&&b.quantity>1&&` × ${b.quantity}`]}),f>0&&n(xe,{variant:"caption",noMargin:!0,className:"ordercard-more-items",children:["+ ",f," more ",1===f?"item":"items"]})]})]}),n(se,{direction:"row",align:"center",justify:"between",wrap:"wrap",gap:8,className:"ordercard-footer",children:[n(se,{direction:"column",gap:2,style:{flex:"1 1 auto",minWidth:"140px"},children:[l&&n(xe,{variant:"caption",noMargin:!0,className:"ordercard-delivery",children:[d,": ",l]}),n(xe,{variant:"body1",weight:"bold",noMargin:!0,className:"ordercard-price",children:[s,c.toLocaleString()]})]}),v&&r(Cn,{variant:"primary",size:"sm",onClick:r=>{null==r||r.stopPropagation(),v(e)},className:"ordercard-track-btn",children:m})]})]})})});Xe.displayName="OrderCard";const Ke=gr(Xe),Qe=({data:n,settings:e})=>{var t,a,o,i,l,d,c,s,v,x;const m=(n.items||[]).map((r,n)=>({id:`item-${n}`,name:r.name,quantity:r.quantity,image:void 0})),p=(null===(a=null===(t=n.actions)||void 0===t?void 0:t[0])||void 0===a?void 0:a.onClick)||(null===(i=null===(o=n.actions)||void 0===o?void 0:o[0])||void 0===i?void 0:i.href)?()=>{var r,e;(null===(e=null===(r=n.actions)||void 0===r?void 0:r[0])||void 0===e?void 0:e.onClick)&&n.actions[0].onClick()}:void 0,h=(null===(d=null===(l=n.actions)||void 0===l?void 0:l[1])||void 0===d?void 0:d.onClick)||(null===(s=null===(c=n.actions)||void 0===c?void 0:c[1])||void 0===s?void 0:s.href)?()=>{var r,e;(null===(e=null===(r=n.actions)||void 0===r?void 0:r[1])||void 0===e?void 0:e.onClick)&&n.actions[1].onClick()}:void 0;return r(Ke,{orderId:n.id,orderNumber:n.id,status:(r=>{const n=r.toLowerCase();return"completed"===n?"delivered":["pending","processing","delivered","cancelled","shipped"].includes(n)?n:"pending"})(n.status),statusText:n.status,items:m.length>0?m:[{id:"1",name:"No items"}],deliveryDate:(r=>{if(!r)return;return("string"==typeof r?new Date(r):r).toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"})})(n.date),totalAmount:(r=>{if("string"==typeof r){const n=parseFloat(r.replace(/[^0-9.-]+/g,""));return isNaN(n)?0:n}return r})(n.total),currency:"$",onTrackOrder:p,onViewDetails:h,trackButtonText:(null===(x=null===(v=n.actions)||void 0===v?void 0:v[0])||void 0===x?void 0:x.label)||"Track Order",className:null==e?void 0:e.className,style:null==e?void 0:e.style})};cn(".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 Je=a.forwardRef(({src:e,alt:t="",size:a,shape:o="circle",fallback:l="?",onImageError:d,onImageLoad:c,imgProps:s,statusIndicator:v,statusPosition:x="bottom-right",className:m="",...p},h)=>{const{theme:u}=kn(),g=a||u.defaultSize||"md",[b,f]=i(!1),y=["vtx-avatar",`vtx-avatar--${g}`,`vtx-avatar--${o}`,v&&"vtx-avatar--with-status",m].filter(Boolean).join(" "),w=e&&!b,k=l.slice(0,2).toUpperCase();return n("div",{ref:h,className:y,role:"img","aria-label":t||l||"Avatar",...p,children:[w?r("img",{src:e,alt:t,className:"vtx-avatar-image",onError:r=>{f(!0),null==d||d(r)},onLoad:r=>{null==c||c(r)},loading:"lazy",...s}):r("span",{className:"vtx-avatar-fallback","aria-hidden":"true",children:k}),v&&r("span",{className:`vtx-avatar-status vtx-avatar-status--${x}`,"aria-label":"Status indicator",children:v})]})});Je.displayName="Avatar";const Ze=gr(Je),rt=({data:e,settings:t,theme:a,variant:o,size:i,className:l,style:d})=>{const c=(null==t?void 0:t.theme)||a||"modern",s=(null==t?void 0:t.variant)||o||"primary",v=(null==t?void 0:t.size)||i||"md",x=(null==t?void 0:t.className)||l||"",m=(null==t?void 0:t.style)||d,p=!1!==(null==t?void 0:t.showDividers),h=null==t?void 0:t.maxItems,u=n=>n.avatar?r(Ze,{src:"string"==typeof n.avatar?n.avatar:n.avatar.src,alt:"string"==typeof n.avatar?n.title:n.avatar.alt,size:"lg"===v?"md":"sm"}):null,g=n=>n.actions&&0!==n.actions.length?r(se,{gap:"xs",children:n.actions.slice(0,2).map((n,e)=>r(Cn,{variant:"error"===n.variant?"danger":n.variant||"ghost",size:"sm",onClick:n.onClick,href:n.href,children:n.label},e))}):null;return r($e,{variant:"elevated",className:["vtx-list-widget",`vtx-list-widget--${c}`,`vtx-list-widget--${v}`,`vtx-list-widget--${s}`,x].filter(Boolean).join(" "),style:m,padding:"lg",children:(()=>{const t=h?e.items.slice(0,h):e.items;return n(se,{direction:"column",gap:"sm",children:[e.title&&r(xe,{variant:"h6",className:"font-semibold mb-2",children:e.title}),t.map((e,a)=>n("div",{children:[n(se,{align:"start",gap:"md",className:"py-2",children:[u(e),n(se,{direction:"column",gap:"xs",style:{flex:1},children:[n(se,{justify:"between",align:"start",children:[n(se,{direction:"column",gap:"xs",children:[r(xe,{variant:"lg"===v?"body1":"body2",className:"font-medium",children:e.title}),e.subtitle&&r(xe,{variant:"caption",className:"text-neutral-600",children:e.subtitle}),e.description&&r(xe,{variant:"caption",className:"text-neutral-500",children:e.description})]}),n(se,{align:"center",gap:"sm",children:[e.badge&&r(Te,{variant:"error"===e.badge.variant?"error":e.badge.variant||"neutral",size:"sm",children:e.badge.text}),g(e)]})]}),e.metadata&&Object.keys(e.metadata).length>0&&r(se,{gap:"md",children:Object.entries(e.metadata).map(([r,e])=>n(xe,{variant:"caption",className:"text-neutral-500",children:[n("span",{className:"font-medium",children:[r,":"]})," ",String(e)]},r))})]})]}),p&&a<t.length-1&&r("div",{className:"border-b border-neutral-200 my-2"})]},e.id||a)),h&&e.items.length>h&&n(xe,{variant:"caption",className:"text-neutral-500 text-center mt-2",children:["+",e.items.length-h," more items"]})]})})()})};cn("/* Link Component Styles */\r\n\r\n.vtx-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  font-family: var(--vtx-font-family-sans);\r\n  text-decoration: none;\r\n  cursor: pointer;\r\n  transition: color var(--vtx-transition-base), opacity var(--vtx-transition-base);\r\n  position: relative;\r\n}\r\n\r\n.vtx-link:hover {\r\n  opacity: 0.8;\r\n  text-decoration: underline;\r\n  text-underline-offset: 2px;\r\n}\r\n\r\n.vtx-link:active {\r\n  opacity: 0.6;\r\n}\r\n\r\n.vtx-link:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: 2px;\r\n}\r\n\r\n/* Disabled state */\r\n.vtx-link--disabled {\r\n  cursor: not-allowed;\r\n  opacity: 0.5;\r\n  pointer-events: none;\r\n}\r\n\r\n/* No underline variant */\r\n.vtx-link--no-underline {\r\n  text-decoration: none;\r\n}\r\n\r\n.vtx-link--no-underline:hover {\r\n  text-decoration: underline;\r\n}\r\n\r\n/* Color variants */\r\n.vtx-link--primary {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-link--primary:hover {\r\n  color: var(--vtx-color-primary-700);\r\n}\r\n\r\n.vtx-link--secondary {\r\n  color: var(--vtx-color-secondary-600);\r\n}\r\n\r\n.vtx-link--secondary:hover {\r\n  color: var(--vtx-color-secondary-700);\r\n}\r\n\r\n.vtx-link--neutral {\r\n  color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n.vtx-link--neutral:hover {\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-link--inherit {\r\n  color: inherit;\r\n}\r\n\r\n/* Text variants (sizes) */\r\n.vtx-link--h1 {\r\n  font-size: var(--vtx-font-size-4xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h2 {\r\n  font-size: var(--vtx-font-size-3xl);\r\n  font-weight: var(--vtx-font-weight-bold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h3 {\r\n  font-size: var(--vtx-font-size-2xl);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n.vtx-link--h4 {\r\n  font-size: var(--vtx-font-size-xl);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-snug);\r\n}\r\n\r\n.vtx-link--h5 {\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-snug);\r\n}\r\n\r\n.vtx-link--h6 {\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-link--body1 {\r\n  font-size: var(--vtx-font-size-base);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n}\r\n\r\n.vtx-link--body2 {\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-relaxed);\r\n}\r\n\r\n.vtx-link--caption {\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-normal);\r\n}\r\n\r\n.vtx-link--small {\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  line-height: var(--vtx-line-height-tight);\r\n}\r\n\r\n/* Icons */\r\n.vtx-link__icon-left,\r\n.vtx-link__icon-right {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-link__content {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n/* Dark mode support */\r\n[data-theme='dark'] .vtx-link--primary {\r\n  color: var(--vtx-color-primary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--primary:hover {\r\n  color: var(--vtx-color-primary-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--secondary {\r\n  color: var(--vtx-color-secondary-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--secondary:hover {\r\n  color: var(--vtx-color-secondary-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--neutral {\r\n  color: var(--vtx-color-neutral-300);\r\n}\r\n\r\n[data-theme='dark'] .vtx-link--neutral:hover {\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n/* Reduced motion */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .vtx-link {\r\n    transition: none;\r\n  }\r\n}\r\n");const nt=a.forwardRef(({children:t,href:a,component:o,componentProps:i={},variant:l="body1",noUnderline:d=!1,disabled:c=!1,color:s="primary",leftIcon:v,rightIcon:x,external:m=!1,download:p,className:h="",target:u,rel:g,...b},f)=>{let y;try{y=kn()}catch(r){y=null}const w=m||void 0!==u||void 0!==p?null:o||(null==y?void 0:y.theme.linkComponent),k=["vtx-link",`vtx-link--${l}`,`vtx-link--${s}`,d&&"vtx-link--no-underline",c&&"vtx-link--disabled",h].filter(Boolean).join(" "),_=n(e,{children:[v&&r("span",{className:"vtx-link__icon-left",children:v}),r("span",{className:"vtx-link__content",children:t}),x&&r("span",{className:"vtx-link__icon-right",children:x})]});if(w){return r(w,{ref:f,className:k,"aria-disabled":c,...i,...b,children:_})}return r("a",{ref:f,href:c?void 0:a,target:m?"_blank":u,rel:m?"noopener noreferrer":g,className:k,"aria-disabled":c,onClick:c?r=>r.preventDefault():b.onClick,download:p,...b,children:_})});nt.displayName="Link";const et=gr(nt),tt=({data:e,settings:t,theme:a,variant:o,size:i,className:l,style:d})=>{const c=(null==t?void 0:t.theme)||a||"modern",s=(null==t?void 0:t.variant)||o||"primary",v=(null==t?void 0:t.size)||i||"md",x=(null==t?void 0:t.className)||l||"",m=(null==t?void 0:t.style)||d,p=(null==t?void 0:t.variant)||"body",h=(null==t?void 0:t.alignment)||"left",u=null==t?void 0:t.titleColor,g=null==t?void 0:t.contentColor,b=null==t?void 0:t.captionColor,f=null==t?void 0:t.backgroundColor,y=r=>{if("lg"===v)switch(r){case"title":return"h1"===p?"h1":"h2"===p?"h2":"h3"===p?"h3":"h4";case"content":return"body1";case"caption":return"body2"}if("sm"===v)switch(r){case"title":return"h1"===p?"h3":"h2"===p?"h4":"h3"===p?"h5":"h6";case"content":return"body2";case"caption":return"caption"}switch(r){case"title":return"h1"===p?"h2":"h2"===p?"h3":"h3"===p?"h4":"h5";case"content":return"body1";case"caption":return"body2"}};if(e.icon&&("minimal"===c||"compact"===c))return r(Pe.Stat,{icon:e.icon,value:e.title||e.content||"",label:e.caption,className:x,style:m});return r($e,{variant:"outlined",className:["vtx-text-widget",`vtx-text-widget--${c}`,`vtx-text-widget--${v}`,`vtx-text-widget--${s}`,h&&`vtx-text-widget--${h}`,x].filter(Boolean).join(" "),style:{...m,backgroundColor:f,textAlign:h||"left"},padding:"lg",children:n(se,{direction:"column",gap:"md",children:[e.title&&r(xe,{variant:y("title"),className:"font-bold",style:{color:u},children:e.title}),e.content&&r(xe,{variant:y("content"),className:"text-neutral-700 leading-relaxed",style:{color:g},children:e.content}),e.caption&&r(xe,{variant:y("caption"),className:"text-neutral-500",style:{color:b},children:e.caption}),e.actions&&e.actions.length>0&&r(se,{gap:"sm",children:e.actions.map((n,e)=>"link"===n.type?r(et,{href:n.href,variant:n.variant||s,children:n.label},e):r(Cn,{variant:"error"===n.variant?"danger":n.variant||(0===e?"primary":"ghost"),size:"lg"===v?"md":"sm",onClick:n.onClick,href:n.href,children:n.label},e))})]})})};cn("/* Breadcrumb Component Styles */\r\n\r\n.vtx-breadcrumb {\r\n  display: block;\r\n}\r\n\r\n.vtx-breadcrumb-list {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n/* Responsive display */\r\n.vtx-breadcrumb-list--mobile {\r\n  display: none;\r\n}\r\n\r\n.vtx-breadcrumb-list--desktop {\r\n  display: flex;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .vtx-breadcrumb-list--desktop {\r\n    display: none;\r\n  }\r\n  \r\n  .vtx-breadcrumb-list--mobile {\r\n    display: flex;\r\n  }\r\n}\r\n\r\n/* Breadcrumb Item */\r\n.vtx-breadcrumb-item {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-breadcrumb-item-content,\r\n.vtx-breadcrumb-item-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-0-5);\r\n  color: var(--vtx-color-neutral-600);\r\n  text-decoration: none !important;\r\n  transition: color var(--vtx-transition-base);\r\n}\r\n\r\n.vtx-breadcrumb-item-link {\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-breadcrumb-item-link:hover {\r\n  color: var(--vtx-color-primary-600);\r\n  text-decoration: none !important;\r\n}\r\n\r\n.vtx-breadcrumb-item-link:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n  border-radius: 2px;\r\n}\r\n\r\n/* Active item */\r\n.vtx-breadcrumb-item--active .vtx-breadcrumb-item-content {\r\n  color: var(--vtx-color-neutral-900);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n}\r\n\r\n/* Ellipsis */\r\n.vtx-breadcrumb-item--ellipsis .vtx-breadcrumb-item-content {\r\n  color: var(--vtx-color-neutral-500);\r\n  cursor: default;\r\n  user-select: none;\r\n}\r\n\r\n/* Icon */\r\n.vtx-breadcrumb-item-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  line-height: 1;\r\n  margin-right: 5px;\r\n}\r\n\r\n/* Label - ensure proper alignment with Text component */\r\n.vtx-breadcrumb-item-label {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  line-height: 1 !important;\r\n  margin: 0 !important;\r\n}\r\n\r\n/* Separator */\r\n.vtx-breadcrumb-separator {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: var(--vtx-color-neutral-400);\r\n  user-select: none;\r\n  line-height: 1;\r\n}\r\n");const at=a.forwardRef(({items:t,separator:o=r(Ar,{size:16}),linkComponent:i,maxItems:l,size:d,className:c="",separatorClassName:s=""},v)=>{const{theme:x}=kn(),m=d||x.defaultSize,p=a.useMemo(()=>{if(!l||t.length<=l)return t;return[t[0],{label:"...",active:!1},...t.slice(-(l-2))]},[t,l]),h=a.useMemo(()=>{if(t.length<=2)return t;return[t[0],{label:"...",active:!1},t[t.length-1]]},[t]),u=["vtx-breadcrumb",`vtx-breadcrumb--${m}`,c].filter(Boolean).join(" "),g=["vtx-breadcrumb-separator",s].filter(Boolean).join(" "),b=(t,a)=>{const o=a===p.length-1,l=t.active||o,d="..."===t.label,c=["vtx-breadcrumb-item",l&&"vtx-breadcrumb-item--active",d&&"vtx-breadcrumb-item--ellipsis"].filter(Boolean).join(" "),s=n(e,{children:[t.icon&&r("span",{className:"vtx-breadcrumb-item-icon",children:t.icon}),t.label&&r(xe,{as:"span",variant:"body2",className:"vtx-breadcrumb-item-label",children:t.label})]});if(d)return r("li",{className:c,children:r("span",{className:"vtx-breadcrumb-item-content",children:t.label})},a);if(l)return r("li",{className:c,"aria-current":"page",children:r("span",{className:"vtx-breadcrumb-item-content",children:s})},a);const v=t.href||t.linkProps;return r("li",v?{className:c,children:r(et,{href:t.href,component:i,componentProps:t.linkProps,className:"vtx-breadcrumb-item-link",color:"inherit",children:s})}:{className:c,children:r("span",{className:"vtx-breadcrumb-item-content",children:s})},a)};return n("nav",{ref:v,className:u,"aria-label":"Breadcrumb",children:[r("ol",{className:"vtx-breadcrumb-list vtx-breadcrumb-list--desktop",children:p.map((e,t)=>n(a.Fragment,{children:[b(e,t),t<p.length-1&&r("li",{className:g,"aria-hidden":"true",children:o})]},t))}),r("ol",{className:"vtx-breadcrumb-list vtx-breadcrumb-list--mobile",children:h.map((e,t)=>n(a.Fragment,{children:[b(e,t),t<h.length-1&&r("li",{className:g,"aria-hidden":"true",children:o})]},t))})]})});at.displayName="Breadcrumb";const ot=gr(at),it=({data:e,settings:t,theme:a,variant:o,size:i,className:l,style:d})=>{const c=(null==t?void 0:t.theme)||a||"modern",s=(null==t?void 0:t.variant)||o||"primary",v=(null==t?void 0:t.size)||i||"md",x=(null==t?void 0:t.className)||l||"",m=(null==t?void 0:t.style)||d,p=!1!==(null==t?void 0:t.showBreadcrumbs),h=!1!==(null==t?void 0:t.showAvatar),u=null==t?void 0:t.backgroundColor,g=()=>"lg"===v?"h1":"sm"===v?"h3":"h2",b=()=>"lg"===v?"h5":"sm"===v?"body2":"h6",f=()=>e.breadcrumbs&&0!==e.breadcrumbs.length&&p?r(ot,{items:e.breadcrumbs.map(r=>({label:String(r.label),href:r.href,onClick:r.onClick})),size:"lg"===v?"md":"sm"}):null,y=()=>e.avatar&&h?r(Ze,{src:"string"==typeof e.avatar?e.avatar:e.avatar.src,alt:"string"==typeof e.avatar?String(e.title):e.avatar.alt,size:"lg"===v?"lg":"sm"===v?"sm":"md"}):null,w=()=>e.actions&&0!==e.actions.length?r(se,{gap:"sm",children:e.actions.map((n,e)=>"link"===n.type?r(et,{href:n.href,variant:n.variant||s,className:"font-medium",children:n.label},e):r(Cn,{variant:"error"===n.variant?"danger":n.variant||(0===e?"primary":"outline"),size:"lg"===v?"lg":"sm"===v?"sm":"md",onClick:n.onClick,href:n.href,children:n.label},e))}):null,k=()=>e.badges&&0!==e.badges.length?r(se,{gap:"xs",children:e.badges.map((n,e)=>r(Te,{variant:"error"===n.variant?"error":n.variant||s,size:"lg"===v?"md":"sm",children:n.text},e))}):null;return r($e,{variant:"outlined",className:["vtx-header-widget",`vtx-header-widget--${c}`,`vtx-header-widget--${v}`,`vtx-header-widget--${s}`,x].filter(Boolean).join(" "),style:{...m,backgroundColor:u},padding:"minimal"===c?"md":"compact"===c?"sm":"lg",children:(()=>{switch(c){case"minimal":return n(se,{direction:"column",gap:"sm",children:[f(),n(se,{align:"center",justify:"between",gap:"md",children:[n(se,{align:"center",gap:"sm",children:[y(),n(se,{direction:"column",children:[r(xe,{variant:g(),className:"font-bold",children:e.title}),e.subtitle&&r(xe,{variant:b(),className:"text-neutral-600",children:e.subtitle})]})]}),w()]}),k()]});case"modern":return n(se,{direction:"column",gap:"lg",children:[f(),n(se,{align:"start",justify:"between",gap:"lg",children:[n(se,{direction:"column",gap:"md",children:[n(se,{align:"center",gap:"md",children:[y(),n(se,{direction:"column",gap:"xs",children:[r(xe,{variant:g(),className:"font-bold",children:e.title}),e.subtitle&&r(xe,{variant:b(),className:"text-neutral-700",children:e.subtitle}),e.description&&r(xe,{variant:"body2",className:"text-neutral-600",children:e.description})]})]}),k(),e.metadata&&r(se,{gap:"lg",children:Object.entries(e.metadata).map(([e,t])=>n(se,{direction:"column",gap:"xs",children:[r(xe,{variant:"caption",className:"text-neutral-500 uppercase font-medium",children:e}),r(xe,{variant:"body2",className:"font-medium",children:String(t)})]},e))})]}),w()]})]});case"compact":return n(se,{direction:"column",gap:"xs",children:[f(),n(se,{align:"center",justify:"between",gap:"md",children:[n(se,{align:"center",gap:"sm",children:[y(),n(se,{direction:"column",children:[r(xe,{variant:g(),className:"font-semibold",children:e.title}),e.subtitle&&r(xe,{variant:"caption",className:"text-neutral-500",children:e.subtitle})]})]}),n(se,{align:"center",gap:"xs",children:[k(),e.actions&&e.actions.length>0&&r(Cn,{variant:"error"===e.actions[0].variant?"danger":e.actions[0].variant||"primary",size:"sm",onClick:e.actions[0].onClick,href:e.actions[0].href,children:e.actions[0].label})]})]})]});default:return n(se,{direction:"column",gap:"md",children:[r(xe,{variant:g(),className:"font-bold",children:e.title}),e.subtitle&&r(xe,{variant:b(),className:"text-neutral-600",children:e.subtitle}),k(),w()]})}})()})},lt=()=>{const{theme:r,setMode:n}=kn();return{tokens:r.tokens,mode:r.mode,setMode:n}},dt=({data:t,settings:o,className:l="",style:d,borderRadius:c=!1,carouselComponent:v,slideComponent:x,imageComponent:m="img",carouselProps:p={},imageProps:h={}})=>{var u,g,b,f,y,w,k,_;const{tokens:N}=lt(),[z,C]=i(0),[S,$]=i(0),[M,T]=i(0),[D,j]=a.useState(!1);a.useEffect(()=>{const r=()=>{j(window.innerWidth<768)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[]);const{slides:I=[]}=t,L=(null==o?void 0:o.overlayTheme)||"dark",A=(null==o?void 0:o.height)||"60vh",R=(null==o?void 0:o.minHeight)||"350px",B=(null==o?void 0:o.maxHeight)||"600px",E=!1!==(null==o?void 0:o.showOverlay),O=(null==o?void 0:o.hideNavigationOnMobile)||!1,F=(null==o?void 0:o.buttonSize)||"md",W=(null==o?void 0:o.buttonVariant)||"primary",P=!O||!D,H={navigation:{enabled:!0},pagination:{enabled:!0,clickable:!0,type:"bullets"},autoplay:{enabled:!0,delay:5e3,disableOnInteraction:!1,pauseOnMouseEnter:!0},loop:!0,effect:"slide",speed:600,...null==o?void 0:o.swiperConfig},V=s((r,n)=>{var e,t,a,o;return(null===(e=r.seo)||void 0===e?void 0:e.structuredData)?{"@context":"https://schema.org","@type":"ImageObject",url:r.image.src,description:r.image.alt||(null===(t=r.caption)||void 0===t?void 0:t.description),name:null===(a=r.caption)||void 0===a?void 0:a.heading,caption:null===(o=r.caption)||void 0===o?void 0:o.description,position:n+1,...r.seo.structuredData}:null},[]),Y=s(r=>{r&&window.open(r,"_blank","noopener,noreferrer")},[]),q=()=>{C(r=>(r+1)%I.length)},U=()=>{C(r=>(r-1+I.length)%I.length)},G=()=>{if(!S||!M)return;const r=S-M,n=r<-50;r>50?q():n&&U()};if(!I||0===I.length)return r("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",height:"300px",color:(null===(g=null===(u=null==N?void 0:N.colors)||void 0===u?void 0:u.neutral)||void 0===g?void 0:g[500])||"#666"},children:"No slides available"});const X={width:"100%",height:`clamp(${R}, ${A}, ${B})`,position:"relative",overflow:"visible",...c&&{borderRadius:(null===(b=null==N?void 0:N.borderRadius)||void 0===b?void 0:b.lg)||"8px"},...d},K={position:"relative",width:"100%",height:"100%",background:(null===(y=null===(f=null==N?void 0:N.colors)||void 0===f?void 0:f.neutral)||void 0===y?void 0:y[50])||"#f5f5f5"},Q={width:"100%",height:"100%",objectFit:"cover",userSelect:"none"},J={position:"absolute",top:0,left:0,width:"100%",height:"100%",zIndex:1,pointerEvents:"none",transition:"opacity 0.3s ease",background:"dark"===L?"linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.7) 100%)":"linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.6) 100%)"},Z=(r="right")=>{var n;const e=E?{}:{backdropFilter:"blur(8px)",background:"rgba(0, 0, 0, 0.45)",borderRadius:(null===(n=null==N?void 0:N.borderRadius)||void 0===n?void 0:n.lg)||"8px",boxShadow:"0 8px 32px rgba(0, 0, 0, 0.3)"};return{position:"absolute",display:"flex",flexDirection:"column",top:"50%",color:"#fff",maxWidth:"min(90%, 550px)",zIndex:3,padding:"clamp(16px, 3vw, 32px)",transform:"translateY(-50%)",...{left:{textAlign:"left",justifyContent:"flex-start",alignItems:"flex-start",left:"clamp(20px, 8%, 80px)"},center:{textAlign:"center",justifyContent:"center",alignItems:"center",left:"50%",transform:"translate(-50%, -50%)"},right:{textAlign:"right",justifyContent:"flex-end",alignItems:"flex-end",right:"clamp(20px, 8%, 80px)"}}[r],...e}},rr=(e,t)=>{const a=V(e,t),o=m;return n("div",{style:K,children:[a&&r("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:JSON.stringify(a)}}),r("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden"},children:r(o,{src:e.image.src,alt:e.image.alt,style:Q,loading:e.image.priority||0===t?"eager":"lazy",...h})}),E&&r("div",{style:J}),e.caption&&r("div",{style:Z(e.caption.position),children:n("div",{style:{width:"100%"},children:[e.caption.heading&&r("div",{style:{marginBottom:"clamp(12px, 2vw, 16px)"},children:r(xe,{variant:"h2",as:"h2",textColor:"#fff",size:"clamp(24px, 5vw, 48px)",lineHeight:1.2,noMargin:!0,style:{textShadow:"2px 2px 8px rgba(0, 0, 0, 0.5)"},children:e.caption.heading})}),e.caption.subheading&&r("div",{style:{marginBottom:"clamp(12px, 2vw, 16px)"},children:r(xe,{variant:"h4",as:"h3",textColor:"#fff",weight:"medium",size:"clamp(18px, 3vw, 32px)",lineHeight:1.3,noMargin:!0,style:{textShadow:"2px 2px 8px rgba(0, 0, 0, 0.5)"},children:e.caption.subheading})}),e.caption.description&&r("div",{style:{marginBottom:"clamp(20px, 2.5vw, 24px)"},children:r(xe,{variant:"body1",textColor:"#fff",size:"clamp(14px, 2vw, 18px)",lineHeight:1.6,noMargin:!0,style:{textShadow:"1px 1px 4px rgba(0, 0, 0, 0.6)"},children:e.caption.description})}),e.caption.buttonText&&r(Cn,{variant:W,size:F,onClick:()=>{var r;return Y(null===(r=e.caption)||void 0===r?void 0:r.buttonUrl)},style:{transition:"all 0.3s ease"},children:e.caption.buttonText})]})})]},e.id||t)};if(v&&x){const n=x;return r("div",{className:l,style:X,children:r(v,{...p,children:I.map((e,t)=>r(n,{children:rr(e,t)},e.id||t))})})}return n("div",{className:l,style:X,children:[r("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden",borderRadius:c?(null===(w=null==N?void 0:N.borderRadius)||void 0===w?void 0:w.lg)||"8px":"0"},children:r("div",{onTouchStart:r=>{$(r.targetTouches[0].clientX)},onTouchEnd:r=>{T(r.changedTouches[0].clientX),G()},style:{position:"relative",width:"100%",height:"100%",transform:`translateX(-${100*z}%)`,transition:"transform 0.3s ease",display:"flex",touchAction:"pan-y"},children:I.map((n,e)=>r("div",{style:{minWidth:"100%",height:"100%"},children:rr(n,e)},n.id||e))})}),I.length>1&&(null===(k=H.navigation)||void 0===k?void 0:k.enabled)&&P&&n(e,{children:[r(Cn,{variant:"ghost",iconOnly:!0,darkText:!0,onClick:U,"aria-label":"Previous slide",style:{position:"absolute",left:"20px",top:"50%",transform:"translateY(-50%)",width:"44px",height:"44px",backgroundColor:"#ffffff",borderRadius:"50%",boxShadow:"0 4px 12px rgba(0, 0, 0, 0.15)",zIndex:10},children:r(Lr,{size:34})}),r(Cn,{variant:"ghost",iconOnly:!0,darkText:!0,onClick:q,"aria-label":"Next slide",style:{position:"absolute",right:"20px",top:"50%",transform:"translateY(-50%)",width:"44px",height:"44px",backgroundColor:"#ffffff",borderRadius:"50%",boxShadow:"0 4px 12px rgba(0, 0, 0, 0.15)",zIndex:10},children:r(Ar,{size:34})})]}),I.length>1&&(null===(_=H.pagination)||void 0===_?void 0:_.enabled)&&r("div",{style:{position:"absolute",bottom:"clamp(12px, 3vw, 20px)",left:"50%",transform:"translateX(-50%)",display:"flex",gap:"clamp(6px, 1.5vw, 10px)",zIndex:20,padding:"8px 12px",backgroundColor:"rgba(0, 0, 0, 0.4)",borderRadius:"20px",backdropFilter:"blur(4px)",pointerEvents:"auto"},children:I.map((n,e)=>r("button",{onClick:()=>(r=>{C(r)})(e),style:{width:z===e?"28px":"10px",height:"10px",borderRadius:z===e?"5px":"50%",border:"none",backgroundColor:z===e?"#fff":"rgba(255, 255, 255, 0.6)",cursor:"pointer",transition:"all 0.3s ease",padding:0,pointerEvents:"auto"},"aria-label":`Go to slide ${e+1}`},e))})]})},ct=({data:t,className:o="",theme:l="card",style:d,autoplay:c=!1,autoplayDelay:v=5e3,borderRadius:x=!0,authorPosition:m="top"})=>{var p,h,u,g,b,f,y,w,k,_,N,z;const{tokens:C}=lt(),[S,$]=i(0),{testimonials:M,showNavigation:T=!0,showDots:D=!0}=t;a.useEffect(()=>{if(!c||M.length<=1)return;const r=setInterval(()=>{$(r=>(r+1)%M.length)},v);return()=>clearInterval(r)},[c,v,M.length]);const j=s(()=>{$(r=>(r+1)%M.length)},[M.length]),I=s(()=>{$(r=>(r-1+M.length)%M.length)},[M.length]),L=s(r=>{$(r)},[]);if(!M||0===M.length)return r(se,{justify:"center",align:"center",style:{padding:"48px 24px"},children:r(xe,{variant:"body1",textColor:(null===(h=null===(p=null==C?void 0:C.colors)||void 0===p?void 0:p.neutral)||void 0===h?void 0:h[500])||"#666",children:"No testimonials available"})});const A=M[S],R=(()=>{var r,n,e,t,a,o,i;const c={position:"relative",width:"100%",padding:"48px 32px",minHeight:"400px",display:"flex",alignItems:"center",justifyContent:"center",overflow:"hidden",...x&&{borderRadius:(null===(r=null==C?void 0:C.borderRadius)||void 0===r?void 0:r.xl)||"16px"},transition:"all 0.3s ease",...d};switch(l){case"minimal":return{...c,background:"transparent",padding:"48px 24px"};case"card":return{...c,background:"#ffffff",border:`1px solid ${(null===(e=null===(n=null==C?void 0:C.colors)||void 0===n?void 0:n.neutral)||void 0===e?void 0:e[200])||"#e5e7eb"}`,boxShadow:"0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03)"};case"gradient":return{...c,background:"linear-gradient(135deg, #667eea 0%, #764ba2 100%)",color:"#ffffff",boxShadow:"0 10px 40px rgba(102, 126, 234, 0.25)"};case"modern":return{...c,background:(null===(a=null===(t=null==C?void 0:C.colors)||void 0===t?void 0:t.neutral)||void 0===a?void 0:a[900])||"#111827",color:"#ffffff",boxShadow:"0 20px 25px -5px rgba(0, 0, 0, 0.2), 0 10px 10px -5px rgba(0, 0, 0, 0.08)"};case"professional":return{...c,background:"#ffffff",border:`1px solid ${(null===(i=null===(o=null==C?void 0:C.colors)||void 0===o?void 0:o.neutral)||void 0===i?void 0:i[200])||"#e5e7eb"}`,boxShadow:"0 10px 30px rgba(0, 0, 0, 0.08)"};case"glassmorphism":return{...c,background:"rgba(255, 255, 255, 0.15)",backdropFilter:"blur(20px)",border:"1px solid rgba(255, 255, 255, 0.25)",boxShadow:"0 8px 32px 0 rgba(31, 38, 135, 0.37)"};default:return c}})(),B=(()=>{var r,n;return"gradient"===l||"modern"===l?"#ffffff":"glassmorphism"===l?"#1f2937":(null===(n=null===(r=null==C?void 0:C.colors)||void 0===r?void 0:r.neutral)||void 0===n?void 0:n[900])||"#111827"})(),E=(()=>{var r,n;return"gradient"===l||"modern"===l?"rgba(255, 255, 255, 0.8)":"glassmorphism"===l?"#4b5563":(null===(n=null===(r=null==C?void 0:C.colors)||void 0===r?void 0:r.neutral)||void 0===n?void 0:n[600])||"#4b5563"})(),O=()=>{var e,t;return n(se,{direction:"column",align:"center",gap:"8px",children:[A.author.avatar&&r(Ze,{src:A.author.avatar,alt:A.author.name,size:"lg",style:{width:"80px",height:"80px",border:"gradient"===l||"modern"===l?"3px solid rgba(255, 255, 255, 0.2)":`3px solid ${(null===(t=null===(e=null==C?void 0:C.colors)||void 0===e?void 0:e.neutral)||void 0===t?void 0:t[200])||"#e5e7eb"}`,boxShadow:"0 4px 12px rgba(0, 0, 0, 0.1)"}}),r(xe,{variant:"h4",weight:"bold",textColor:B,align:"center",style:{fontSize:"20px",margin:0,lineHeight:1.3},children:A.author.name}),n(se,{direction:"column",align:"center",gap:"2px",children:[A.author.role&&r(xe,{variant:"body2",textColor:E,align:"center",style:{fontSize:"14px",lineHeight:1.4},children:A.author.role}),A.author.company&&r(xe,{variant:"body2",weight:"medium",textColor:E,align:"center",style:{fontSize:"14px",lineHeight:1.4},children:A.author.company})]}),A.date&&r(xe,{variant:"caption",textColor:E,align:"center",style:{fontSize:"13px",opacity:.7},children:A.date})]})};return n("div",{className:o,style:R,children:[n(se,{direction:"column",align:"center",justify:"center",gap:"32px",style:{maxWidth:"800px",width:"100%",margin:"0 auto",position:"relative",zIndex:1},children:["top"===m&&O(),r("div",{style:{fontSize:"48px",lineHeight:1,color:"gradient"===l||"modern"===l?"rgba(255, 255, 255, 0.2)":(null===(g=null===(u=null==C?void 0:C.colors)||void 0===u?void 0:u.neutral)||void 0===g?void 0:g[300])||"#d1d5db",fontFamily:"Georgia, serif",marginBottom:"-16px"},children:'"'}),A.content&&r(xe,{variant:"body1",textColor:B,align:"center",style:{fontSize:"clamp(18px, 2.5vw, 22px)",lineHeight:1.7,fontWeight:400,maxWidth:"700px"},children:A.content}),A.rating&&r("div",{style:{marginTop:"-8px"},children:(F=A.rating,r(se,{gap:"4px",justify:"minimal"===l?"start":"center",children:[1,2,3,4,5].map(n=>r("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:n<=F?"#fbbf24":"#e5e7eb",xmlns:"http://www.w3.org/2000/svg",children:r("path",{d:"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"})},n))}))}),"bottom"===m&&r("div",{style:{marginTop:"8px"},children:O()})]}),M.length>1&&T&&n(e,{children:[r("button",{onClick:I,style:{position:"absolute",left:"24px",top:"50%",transform:"translateY(-50%)",backgroundColor:"gradient"===l||"modern"===l?"rgba(255, 255, 255, 0.15)":"#ffffff",borderRadius:"50%",width:"48px",height:"48px",border:"gradient"===l||"modern"===l?"none":`2px solid ${(null===(f=null===(b=null==C?void 0:C.colors)||void 0===b?void 0:b.neutral)||void 0===f?void 0:f[200])||"#e5e7eb"}`,display:"flex",alignItems:"center",justifyContent:"center",color:"gradient"===l||"modern"===l?"#ffffff":(null===(w=null===(y=null==C?void 0:C.colors)||void 0===y?void 0:y.neutral)||void 0===w?void 0:w[700])||"#374151",boxShadow:"0 4px 12px rgba(0, 0, 0, 0.12)",cursor:"pointer",zIndex:10,transition:"all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",backdropFilter:"blur(8px)"},"aria-label":"Previous testimonial",onMouseEnter:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1.1)",r.currentTarget.style.boxShadow="0 6px 20px rgba(0, 0, 0, 0.18)"},onMouseLeave:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1)",r.currentTarget.style.boxShadow="0 4px 12px rgba(0, 0, 0, 0.12)"},children:r(Lr,{size:24})}),r("button",{onClick:j,style:{position:"absolute",right:"24px",top:"50%",transform:"translateY(-50%)",backgroundColor:"gradient"===l||"modern"===l?"rgba(255, 255, 255, 0.15)":"#ffffff",borderRadius:"50%",width:"48px",height:"48px",border:"gradient"===l||"modern"===l?"none":`2px solid ${(null===(_=null===(k=null==C?void 0:C.colors)||void 0===k?void 0:k.neutral)||void 0===_?void 0:_[200])||"#e5e7eb"}`,display:"flex",alignItems:"center",justifyContent:"center",color:"gradient"===l||"modern"===l?"#ffffff":(null===(z=null===(N=null==C?void 0:C.colors)||void 0===N?void 0:N.neutral)||void 0===z?void 0:z[700])||"#374151",boxShadow:"0 4px 12px rgba(0, 0, 0, 0.12)",cursor:"pointer",zIndex:10,transition:"all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",backdropFilter:"blur(8px)"},"aria-label":"Next testimonial",onMouseEnter:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1.1)",r.currentTarget.style.boxShadow="0 6px 20px rgba(0, 0, 0, 0.18)"},onMouseLeave:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1)",r.currentTarget.style.boxShadow="0 4px 12px rgba(0, 0, 0, 0.12)"},children:r(Ar,{size:24})})]}),M.length>1&&D&&r(se,{justify:"center",gap:"12px",style:{position:"absolute",bottom:"32px",left:"50%",transform:"translateX(-50%)",zIndex:10},children:M.map((n,e)=>{var t,a,o,i;return r("button",{onClick:()=>L(e),style:{width:S===e?"40px":"12px",height:"12px",borderRadius:S===e?"6px":"50%",border:"none",backgroundColor:S===e?"gradient"===l||"modern"===l?"#ffffff":(null===(a=null===(t=null==C?void 0:C.colors)||void 0===t?void 0:t.primary)||void 0===a?void 0:a[600])||"#2563eb":"gradient"===l||"modern"===l?"rgba(255, 255, 255, 0.3)":(null===(i=null===(o=null==C?void 0:C.colors)||void 0===o?void 0:o.neutral)||void 0===i?void 0:i[300])||"#d1d5db",cursor:"pointer",transition:"all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",boxShadow:S===e?"0 2px 8px rgba(0, 0, 0, 0.15)":"none"},"aria-label":`Go to testimonial ${e+1}`,onMouseEnter:r=>{S!==e&&(r.currentTarget.style.transform="scale(1.2)")},onMouseLeave:r=>{r.currentTarget.style.transform="scale(1)"}},e)})})]});var F},st=({items:t=[],className:a="",style:l,borderRadius:d=!0,autoplay:c=!1,autoplayDelay:v=3e3,itemsPerView:x={mobile:1,tablet:2,desktop:3},gap:m="20px",showNavigation:p=!0,showPagination:h=!0,scrollBehavior:u="page"})=>{const{tokens:g}=lt(),[b,f]=i(0),[y,w]=i(x.desktop||3);o(()=>{const r=()=>{const r=window.innerWidth;w(r<768?x.mobile||1:r<1024?x.tablet||2:x.desktop||3)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[x]);const k=Math.ceil(t.length/y),_=t.length-y;o(()=>{if(!c||0===t.length)return;const r=setInterval(()=>{z()},v);return()=>clearInterval(r)},[c,v,b,y]);const N=s(()=>{f("page"===u?r=>Math.max(0,r-y):r=>Math.max(0,r-1))},[y,u]),z=s(()=>{f("page"===u?r=>{const n=r+y;return n>_?0:n}:r=>{const n=r+1;return n>_?0:n})},[y,_,u]),C=s(r=>{f(r*y)},[y]),S=()=>Math.floor(b/y),$={position:"relative",width:"100%",overflow:"hidden",padding:"clamp(20px, 4vw, 40px)",backgroundColor:g.colors.neutral[50],borderRadius:d?g.borderRadius.lg:"0",boxShadow:g.shadows.sm,...l},M={display:"flex",gap:"number"==typeof m?`${m}px`:m,transition:"transform 0.5s cubic-bezier(0.4, 0, 0.2, 1)",transform:`translateX(-${b*(100/y)}%)`},T={flex:`0 0 calc((100% - (${"number"==typeof m?`${m}px`:m} * ${y-1})) / ${y})`,minWidth:0},D={position:"absolute",top:"50%",transform:"translateY(-50%)",zIndex:10,backgroundColor:"#ffffff",border:`1px solid ${g.colors.neutral[300]}`,borderRadius:g.borderRadius.full,width:"40px",height:"40px",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",boxShadow:g.shadows.md,transition:"all 0.2s ease"};if(0===t.length)return r("div",{style:$,children:r("div",{style:{textAlign:"center",padding:"40px",color:g.colors.neutral[500]},children:"No items to display"})});const j=b>0,I=b<_;return n("div",{className:a,style:$,children:[p&&n(e,{children:[r("button",{onClick:N,disabled:!j,style:{...D,left:"10px",opacity:j?1:.3,cursor:j?"pointer":"not-allowed"},onMouseEnter:r=>{j&&(r.currentTarget.style.transform="translateY(-50%) scale(1.1)",r.currentTarget.style.backgroundColor=g.colors.neutral[100]||"#f5f5f5")},onMouseLeave:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1)",r.currentTarget.style.backgroundColor="#ffffff"},"aria-label":"Previous",children:r(Lr,{style:{width:"20px",height:"20px",color:g.colors.neutral[900]}})}),r("button",{onClick:z,disabled:!I&&!c,style:{...D,right:"10px",opacity:I||c?1:.3,cursor:I||c?"pointer":"not-allowed"},onMouseEnter:r=>{(I||c)&&(r.currentTarget.style.transform="translateY(-50%) scale(1.1)",r.currentTarget.style.backgroundColor=g.colors.neutral[100]||"#f5f5f5")},onMouseLeave:r=>{r.currentTarget.style.transform="translateY(-50%) scale(1)",r.currentTarget.style.backgroundColor="#ffffff"},"aria-label":"Next",children:r(Ar,{style:{width:"20px",height:"20px",color:g.colors.neutral[900]}})})]}),r("div",{style:M,children:t.map((n,e)=>r("div",{style:T,children:n},e))}),h&&k>1&&r("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"8px",marginTop:"24px"},children:Array.from({length:k}).map((n,e)=>{return r("div",{onClick:()=>C(e),style:(t=S()===e,{width:t?"24px":"8px",height:"8px",borderRadius:g.borderRadius.full,backgroundColor:t?g.colors.primary[500]:g.colors.neutral[300],cursor:"pointer",transition:"all 0.3s ease",opacity:t?1:.5}),onMouseEnter:r=>{S()!==e&&(r.currentTarget.style.opacity="0.8")},onMouseLeave:r=>{S()!==e&&(r.currentTarget.style.opacity="0.5")},role:"button","aria-label":`Go to page ${e+1}`},e);var t})}),n("div",{style:{position:"absolute",left:"-9999px"},"aria-live":"polite","aria-atomic":"true",children:["Showing items ",b+1," to ",Math.min(b+y,t.length)," of ",t.length]})]})},vt=({data:e,settings:t={},theme:a="modern",className:o="",style:i})=>{var l,d,c,s,v,x,m,p,h,u,g,b,f,y,w,k,_,N;let z="md";try{const{useThemeContext:r}=require("../../../theme/ThemeProvider"),{theme:n}=r();z=n.defaultSize}catch{}const C=null!==(l=t.layout)&&void 0!==l?l:"media-left",S=null!==(d=t.variant)&&void 0!==d?d:"minimal",$=null!==(c=t.size)&&void 0!==c?c:z,M=$,T=null!==(s=t.gap)&&void 0!==s?s:"lg",D=null!==(v=t.padding)&&void 0!==v?v:"lg",j=null!==(x=t.contentAlign)&&void 0!==x?x:"left",I=null!==(m=t.verticalAlign)&&void 0!==m?m:"center",L=null!==(p=t.mediaWidth)&&void 0!==p?p:"40%",A=null!==(h=t.rounded)&&void 0!==h&&h,R=null!==(u=t.shadow)&&void 0!==u&&u,B=null!==(g=t.hover)&&void 0!==g?g:{enabled:!1},E=null!==(b=t.responsive)&&void 0!==b?b:{stackOnMobile:!0},O=null!==(f=t.overlay)&&void 0!==f?f:{enabled:!1},F={none:"0",xs:"0.5rem",sm:"1rem",md:"1.5rem",lg:"2rem",xl:"3rem","2xl":"4rem"},W={none:"0",xs:"0.5rem",sm:"1rem",md:"1.5rem",lg:"2rem",xl:"3rem","2xl":"4rem"},P={xs:{eyebrow:"0.7rem",heading:"1.25rem",subheading:"1rem",body:"0.875rem",caption:"0.75rem",scale:.8},sm:{eyebrow:"0.75rem",heading:"1.5rem",subheading:"1.125rem",body:"0.95rem",caption:"0.8rem",scale:.9},md:{eyebrow:"0.8rem",heading:"2rem",subheading:"1.5rem",body:"1rem",caption:"0.875rem",scale:1},lg:{eyebrow:"0.85rem",heading:"2.5rem",subheading:"1.75rem",body:"1.1rem",caption:"0.95rem",scale:1.1},xl:{eyebrow:"0.9rem",heading:"3rem",subheading:"2rem",body:"1.25rem",caption:"1rem",scale:1.2}},H=()=>r("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("path",{d:"M16.6667 5L7.50004 14.1667L3.33337 10",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),V=()=>{if(!e.media)return null;const{type:t="image",src:a,alt:o="",items:i,icon:l,iconSize:d="lg",aspectRatio:c,objectFit:s="cover",rounded:v,shadow:x,border:m,zoom:p}=e.media,h={width:"100%",height:"auto"===c?"auto":void 0,aspectRatio:c&&"auto"!==c?c.replace(":","/"):void 0,objectFit:s,borderRadius:v?"boolean"==typeof v?"0.5rem":`var(--border-radius-${v})`:void 0,boxShadow:x?"boolean"==typeof x?"0 4px 6px rgba(0, 0, 0, 0.1)":`var(--shadow-${x})`:void 0,border:m?"boolean"==typeof m?"1px solid var(--color-border)":`${m} solid var(--color-border)`:void 0,transition:p?"transform 0.3s ease":void 0},u={overflow:p?"hidden":"visible",borderRadius:v?"boolean"==typeof v?"0.5rem":`var(--border-radius-${v})`:void 0},g=p?"vtx-content-block__media--zoom":"";switch(t){case"image":if(a)return r("div",{className:"vtx-content-block__media-container",style:u,children:r("img",{src:a,alt:o,className:`vtx-content-block__media ${g}`,style:h})});break;case"avatar":if(a){return r(Ze,{src:a,alt:o,size:"xl"===d?"lg":d,shape:"circle",className:"vtx-content-block__avatar"})}break;case"icon":if(l){const n={sm:"2rem",md:"3rem",lg:"4rem",xl:"6rem"};return r("div",{className:"vtx-content-block__icon",style:{fontSize:n[d],width:n[d],height:n[d],display:"flex",alignItems:"center",justifyContent:"center"},children:l})}break;case"gallery":if(i&&i.length>0)return r("div",{className:"vtx-content-block__gallery",style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(150px, 1fr))",gap:"0.5rem"},children:i.map((e,t)=>n("div",{style:u,children:[r("img",{src:e.src,alt:e.alt,className:"vtx-content-block__gallery-item",style:h}),e.caption&&r(xe,{variant:"caption",className:"vtx-content-block__gallery-caption",style:{marginTop:"0.5rem"},children:e.caption})]},t))});break;case"logo":case"illustration":if(a)return r("div",{className:"vtx-content-block__media-container",style:{...u,display:"flex",alignItems:"center",justifyContent:"center"},children:r("img",{src:a,alt:o,className:"vtx-content-block__media",style:{...h,maxWidth:"100%",height:"auto"}})})}return null},Y=()=>{const t=e.content||{},a=e.colors||{};return n("div",{className:"vtx-content-block__content",style:{textAlign:j},children:[t.eyebrow&&r(xe,{variant:t.eyebrowVariant||"overline",className:"vtx-content-block__eyebrow",style:{color:a.eyebrow,marginBottom:F[T]||F.sm,display:"block",textTransform:"uppercase",letterSpacing:"0.05em",fontSize:P[M].eyebrow},children:t.eyebrow}),e.tags&&e.tags.length>0&&r(se,{gap:"xs",wrap:"wrap",style:{marginBottom:F[T]||F.md},children:e.tags.map((e,t)=>{const a="danger"===e.variant?"error":"secondary"===e.variant?"primary":e.variant||"primary";return e.href?r(et,{href:e.href,children:n(Te,{variant:a,children:[e.icon&&r("span",{style:{marginRight:"0.25rem"},children:e.icon}),e.text]})},t):n(Te,{variant:a,children:[e.icon&&r("span",{style:{marginRight:"0.25rem"},children:e.icon}),e.text]},t)})}),t.heading&&r(xe,{variant:t.headingVariant||"h2",className:"vtx-content-block__heading",style:{color:a.heading,marginBottom:t.subheading||t.body?F[T]||F.md:"0",fontWeight:"bold",fontSize:P[M].heading},children:t.heading}),t.subheading&&r(xe,{variant:t.subheadingVariant||"h4",className:"vtx-content-block__subheading",style:{color:a.subheading,marginBottom:t.body?F[T]||F.md:"0",fontSize:P[M].subheading},children:t.subheading}),t.body&&r(xe,{variant:t.bodyVariant||"body1",className:"vtx-content-block__body",style:{color:a.body,marginBottom:t.list||e.product||e.stats?F[T]||F.md:"0",lineHeight:"1.6",fontSize:P[M].body},children:t.body}),t.list&&t.list.length>0&&r("ul",{className:"vtx-content-block__list",style:{margin:`${F[T]||F.md} 0`,padding:0,listStyle:"none"},children:t.list.map((e,a)=>n("li",{style:{display:"flex",alignItems:"flex-start",marginBottom:F.sm},children:["check"===t.listType&&e.checked&&r("span",{style:{color:"var(--color-success)",marginRight:"0.5rem",flexShrink:0},children:r(H,{})}),"icon"===t.listType&&e.icon&&r("span",{style:{marginRight:"0.5rem",flexShrink:0},children:e.icon}),"bullet"===t.listType&&r("span",{style:{marginRight:"0.5rem",flexShrink:0},children:"•"}),"number"===t.listType&&n("span",{style:{marginRight:"0.5rem",flexShrink:0},children:[a+1,"."]}),r(xe,{variant:"body1",style:{flex:1,fontSize:P[M].body},children:e.text})]},a))}),e.product&&n("div",{className:"vtx-content-block__product",style:{margin:`${F[T]||F.md} 0`},children:[r(se,{gap:"sm",align:"center",wrap:"wrap",children:e.product.price&&n(se,{gap:"xs",align:"center",children:[n(xe,{variant:"h3",style:{fontWeight:"bold",color:"var(--color-primary)",fontSize:`calc(${P[M].heading} * 0.8)`},children:[e.product.currency||"$",e.product.price]}),e.product.comparePrice&&n(xe,{variant:"body1",style:{textDecoration:"line-through",color:"var(--color-text-muted)",fontSize:P[M].body},children:[e.product.currency||"$",e.product.comparePrice]}),e.product.discount&&r(Te,{variant:"error",children:e.product.discount})]})}),n(se,{gap:"sm",align:"center",style:{marginTop:F.sm},wrap:"wrap",children:[e.product.rating&&n(se,{gap:"xs",align:"center",children:[n(xe,{variant:"body1",style:{fontSize:P[M].body},children:["⭐ ",e.product.rating]}),e.product.reviewCount&&n(xe,{variant:"body2",style:{color:"var(--color-text-muted)",fontSize:P[M].caption},children:["(",e.product.reviewCount," reviews)"]})]}),e.product.stock&&r(Te,{variant:"in-stock"===e.product.stock||"number"==typeof e.product.stock&&e.product.stock>0?"success":"limited"===e.product.stock?"warning":"error",children:"number"==typeof e.product.stock?`${e.product.stock} in stock`:e.product.stock}),e.product.sku&&n(xe,{variant:"body2",style:{color:"var(--color-text-muted)",fontSize:P[M].caption},children:["SKU: ",e.product.sku]})]})]}),e.stats&&e.stats.length>0&&r("div",{className:"vtx-content-block__stats",style:{margin:`${F[T]||F.lg} 0`},children:r(se,{gap:"lg",wrap:"wrap",justify:"center"===j?"center":"right"===j?"end":"start",children:e.stats.map((e,t)=>n("div",{className:"vtx-content-block__stat-item",children:[e.icon&&r("div",{style:{marginBottom:F.sm,fontSize:`calc(1.5rem * ${P[M].scale})`},children:e.icon}),r(xe,{variant:"h3",style:{fontWeight:"bold",marginBottom:F.xs,fontSize:`calc(${P[M].heading} * 0.85)`},children:e.value}),r(xe,{variant:"body2",style:{color:"var(--color-text-muted)",fontSize:P[M].body},children:e.label})]},t))})}),e.quote&&n("div",{className:"vtx-content-block__quote",style:{margin:`${F[T]||F.lg} 0`,padding:`1rem ${F.lg}`,borderLeft:"4px solid var(--color-primary)",backgroundColor:"var(--color-background-subtle)",borderRadius:"0.25rem"},children:[n(xe,{variant:"body1",style:{fontStyle:"italic",marginBottom:e.quote.author?F.sm:"0",fontSize:P[M].body},children:['"',e.quote.text,'"']}),e.quote.author&&n(xe,{variant:"body2",style:{color:"var(--color-text-muted)",fontWeight:"bold",fontSize:P[M].caption},children:["— ",e.quote.author]})]}),e.metadata&&e.metadata.length>0&&r("div",{className:"vtx-content-block__metadata",style:{margin:`${F[T]||F.md} 0`},children:r(se,{direction:"column",gap:"xs",children:e.metadata.map((e,t)=>n(se,{gap:"sm",align:"center",children:[e.icon&&r("span",{style:{color:"var(--color-text-muted)"},children:e.icon}),n(xe,{variant:"body2",style:{fontSize:P[M].caption},children:[n("strong",{children:[e.label,":"]})," ",e.value]})]},t))})}),e.author&&r("div",{className:"vtx-content-block__author",style:{margin:`${F[T]||F.lg} 0`},children:n(se,{gap:"md",align:"center",children:[e.author.avatar&&r(Ze,{src:e.author.avatar,alt:e.author.name,size:"xs"===$?"sm":"sm"===$?"md":"lg"}),n("div",{children:[r(xe,{variant:"body1",style:{fontWeight:"bold",marginBottom:F.xs,fontSize:P[M].subheading},children:e.author.name}),e.author.role&&n(xe,{variant:"body2",style:{color:"var(--color-text-muted)",fontSize:P[M].caption},children:[e.author.role,e.author.company&&` at ${e.author.company}`]}),e.author.social&&e.author.social.length>0&&r(se,{gap:"sm",style:{marginTop:F.sm},children:e.author.social.map((n,e)=>r(et,{href:n.url,target:"_blank",rel:"noopener noreferrer",style:{fontSize:P[M].body},children:n.icon||n.platform},e))})]})]})}),t.caption&&r(xe,{variant:"caption",className:"vtx-content-block__caption",style:{color:a.caption||"var(--color-text-muted)",marginTop:F[T]||F.md,display:"block",fontSize:P[M].caption},children:t.caption}),t.footnote&&r(xe,{variant:"caption",className:"vtx-content-block__footnote",style:{color:"var(--color-text-muted)",marginTop:F.sm,fontSize:P[M].caption,display:"block"},children:t.footnote}),e.actions&&e.actions.length>0&&r(se,{gap:"md",style:{marginTop:F[T]||F.lg},wrap:"wrap",justify:"center"===j?"center":"right"===j?"end":"start",children:e.actions.map((e,t)=>"link"===e.type?n(et,{href:e.href,variant:e.variant,children:["left"===e.iconPosition&&e.icon&&r("span",{style:{marginRight:"0.5rem"},children:e.icon}),e.label,"right"===e.iconPosition&&e.icon&&r("span",{style:{marginLeft:"0.5rem"},children:e.icon})]},t):n(Cn,{variant:"outline"===e.variant?"outline":"ghost"===e.variant?"ghost":e.variant,size:e.size||"md",onClick:e.onClick,href:e.href,style:{width:e.fullWidth?"100%":"auto"},children:["left"===e.iconPosition&&e.icon&&r("span",{style:{marginRight:"0.5rem"},children:e.icon}),e.label,"right"===e.iconPosition&&e.icon&&r("span",{style:{marginLeft:"0.5rem"},children:e.icon})]},t))})]})},q=(()=>{const r={container:{display:"flex",gap:F[T],alignItems:I},media:{},content:{}};switch(C){case"media-left":return{...r,container:{...r.container,flexDirection:"row"},media:{flex:`0 0 ${L}`,maxWidth:L},content:{flex:"1"}};case"media-right":return{...r,container:{...r.container,flexDirection:"row-reverse"},media:{flex:`0 0 ${L}`,maxWidth:L},content:{flex:"1"}};case"split-equal":return{...r,container:{...r.container,flexDirection:"row"},media:{flex:"1"},content:{flex:"1"}};case"media-top":return{...r,container:{...r.container,flexDirection:"column"},media:{width:"100%"},content:{width:"100%"}};case"media-bottom":return{...r,container:{...r.container,flexDirection:"column-reverse"},media:{width:"100%"},content:{width:"100%"}};case"centered":return{...r,container:{...r.container,flexDirection:"column",alignItems:"center"},media:{maxWidth:"600px"},content:{maxWidth:"800px",textAlign:"center"}};case"centered-media-top":return{...r,container:{...r.container,flexDirection:"column",alignItems:"center"},media:{marginBottom:"1rem"},content:{textAlign:"center"}};case"sidebar-left":return{...r,container:{...r.container,flexDirection:"row"},media:{flex:"0 0 30%",maxWidth:"30%"},content:{flex:"1"}};case"sidebar-right":return{...r,container:{...r.container,flexDirection:"row-reverse"},media:{flex:"0 0 30%",maxWidth:"30%"},content:{flex:"1"}};case"grid-2col":case"grid-3col":const n="grid-2col"===C?2:3;return{...r,container:{display:"grid",gridTemplateColumns:`repeat(${n}, 1fr)`,gap:F[T]},media:{},content:{}};case"media-background":return{...r,container:{position:"relative",minHeight:"400px",display:"flex",alignItems:"center",justifyContent:"center"},media:{position:"absolute",top:0,left:0,width:"100%",height:"100%",zIndex:0},content:{position:"relative",zIndex:2,maxWidth:"800px",padding:W[D],textAlign:"center"}};default:return r}})(),U={...i,background:(null===(y=t.background)||void 0===y?void 0:y.gradient)||(null===(w=t.background)||void 0===w?void 0:w.color)||(null===(k=e.colors)||void 0===k?void 0:k.background),opacity:null===(_=t.background)||void 0===_?void 0:_.opacity,borderRadius:A?"boolean"==typeof A?"0.5rem":`var(--border-radius-${A})`:void 0,boxShadow:R?"boolean"==typeof R?"0 4px 6px rgba(0, 0, 0, 0.1)":`var(--shadow-${R})`:void 0,padding:"minimal"!==S?W[D]:void 0,border:t.border?"boolean"==typeof t.border||"all"===t.border?"1px solid var(--color-border)":"left"===t.border||"right"===t.border||"top"===t.border||"bottom"===t.border?"none":void 0:void 0,borderLeft:"left"===t.border?"4px solid var(--color-primary)":void 0,borderRight:"right"===t.border?"4px solid var(--color-primary)":void 0,borderTop:"top"===t.border?"4px solid var(--color-primary)":void 0,borderBottom:"bottom"===t.border?"4px solid var(--color-primary)":void 0,transition:(null==B?void 0:B.enabled)?"transform 0.3s ease, box-shadow 0.3s ease":void 0},G=(null==B?void 0:B.enabled)?`vtx-content-block--hover-${B.effect||"lift"}`:"",X=["vtx-content-block",`vtx-content-block--${C}`,`vtx-content-block--${a}`,`vtx-content-block--${S}`,G,o].filter(Boolean).join(" ");if("media-background"===C)return r("div",{className:X,style:U,children:n("div",{style:q.container,children:[r("div",{style:q.media,children:V()}),O.enabled&&r("div",{style:{position:"absolute",top:0,left:0,width:"100%",height:"100%",backgroundColor:O.color||"rgba(0, 0, 0, 0.5)",opacity:null!==(N=O.opacity)&&void 0!==N?N:.5,backdropFilter:O.blur?`blur(${O.blur}px)`:void 0,zIndex:1}}),r("div",{style:q.content,children:Y()})]})});if("grid-2col"===C||"grid-3col"===C)return r("div",{className:X,style:U,children:n("div",{style:q.container,children:[e.media&&r("div",{style:q.media,children:V()}),r("div",{style:q.content,children:Y()})]})});if("card"===S||"elevated"===S||"outlined"===S||"bordered"===S){return r($e,{variant:"card"===S||"elevated"===S?"elevated":"outlined"===S||"bordered"===S?"outlined":void 0,padding:D,className:X,style:U,children:n("div",{style:q.container,children:[e.media&&r("div",{style:q.media,children:V()}),r("div",{style:q.content,children:Y()})]})})}return n("div",{className:X,style:U,children:[n("div",{style:q.container,children:[e.media&&r("div",{style:q.media,children:V()}),r("div",{style:q.content,children:Y()})]}),r("style",{dangerouslySetInnerHTML:{__html:`\n        .vtx-content-block--hover-lift:hover {\n          transform: translateY(-4px);\n          box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);\n        }\n        .vtx-content-block--hover-scale:hover {\n          transform: scale(1.02);\n        }\n        .vtx-content-block--hover-glow:hover {\n          box-shadow: 0 0 20px rgba(var(--color-primary-rgb), 0.3);\n        }\n        .vtx-content-block__media--zoom:hover {\n          transform: scale(1.1);\n        }\n\n        @media (max-width: 768px) {\n          ${E.stackOnMobile?"\n            .vtx-content-block__container {\n              flex-direction: column !important;\n            }\n            .vtx-content-block__media,\n            .vtx-content-block__content {\n              flex: 1 !important;\n              max-width: 100% !important;\n              width: 100% !important;\n            }\n          ":""}\n          ${E.hideMediaOnMobile?"\n            .vtx-content-block__media {\n              display: none;\n            }\n          ":""}\n        }\n      `}})]})},xt=({config:n,className:e="",style:t})=>{const a=(n,a,o,i,l,d)=>{const c=o||{theme:i||"modern",variant:l||"primary",size:d||"md",className:e,style:t};switch(n){case"metric":return r(De,{data:a,settings:c});case"info":return r(He,{data:a,settings:c});case"product":return r(Ge,{data:a,settings:c});case"order":return r(Qe,{data:a,settings:c});case"list":return r(rt,{data:a,settings:c});case"text":return r(tt,{data:a,settings:c});case"header":return r(it,{data:a,settings:c});case"carousel":return r(dt,{data:a,settings:c});case"testimonial":return r(ct,{data:a,className:e,style:t});case"gridCarousel":return r(st,{...a,className:e,style:t});case"contentBlock":return r(vt,{data:a,settings:c});default:return console.warn(`Unknown widget type: ${n}`),null}};if("grid"===n.type){const t=n.data,o=n.settings||{};return r(Ce,{data:t.widgets,grid:n.grid||o.grid,renderItem:r=>a(r.type,r.data,r.settings,r.theme,r.variant,r.size),className:e})}if(Array.isArray(n.data)){const t=n.settings||{};return r(Ce,{data:n.data,grid:n.grid||t.grid,renderItem:r=>a(n.type,r,n.settings,n.theme,n.variant,n.size),className:e})}return a(n.type,n.data,n.settings,n.theme,n.variant,n.size)};cn("/* ===================================\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 mt=({value:e="",onChange:t,onSubmit:a,onFocus:d,placeholder:c,loading:s,suggestions:v,icon:x})=>{const[m,p]=i(e),[h,u]=i(!1),g=l(null);o(()=>{p(e)},[e]),o(()=>{const r=r=>{g.current&&!g.current.contains(r.target)&&u(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);return n("div",{className:"vtx-admin-header-search",ref:g,children:[n("form",{onSubmit:r=>{r.preventDefault(),null==a||a(m),u(!1)},className:"vtx-admin-header-search-form",children:[r("div",{className:"vtx-admin-header-search-icon",children:s?r("span",{className:"vtx-admin-header-search-spinner"}):x||r(nn,{})}),r("input",{type:"text",className:"vtx-admin-header-search-input",placeholder:c||"Search...",value:m,onChange:r=>{const n=r.target.value;p(n),null==t||t(n),u(!0)},onFocus:()=>{null==d||d(),v&&v.length>0&&u(!0)}}),m&&r("button",{type:"button",className:"vtx-admin-header-search-clear",onClick:()=>{p(""),null==t||t("")},"aria-label":"Clear search",children:r(Qr,{})})]}),h&&v&&v.length>0&&r("div",{className:"vtx-admin-header-search-suggestions",children:v.map(e=>n("button",{type:"button",className:"vtx-admin-header-search-suggestion",onClick:()=>{var r;null===(r=e.onClick)||void 0===r||r.call(e),u(!1)},children:[e.icon&&r("span",{className:"vtx-admin-header-search-suggestion-icon",children:e.icon}),n("div",{className:"vtx-admin-header-search-suggestion-content",children:[r("span",{className:"vtx-admin-header-search-suggestion-label",children:e.label}),e.category&&r("span",{className:"vtx-admin-header-search-suggestion-category",children:e.category})]})]},e.id))})]})},pt=({notifications:t,onNotificationClick:a,onMarkAllAsRead:o,onClearAll:i,onViewAll:l,onClose:d,maxNotifications:c=5})=>{const s=t.filter(r=>!r.read).length,v=t.slice(0,c);return n("div",{className:"vtx-admin-header-notifications-panel",children:[n("div",{className:"vtx-admin-header-notifications-header",children:[n("div",{className:"vtx-admin-header-notifications-header-title",children:[r(xe,{variant:"subtitle2",noMargin:!0,style:{fontWeight:600},children:"Notifications"}),s>0&&r(Te,{variant:"primary",size:"sm",style:{marginLeft:"8px"},children:s})]}),n("div",{className:"vtx-admin-header-notifications-header-actions",children:[s>0&&o&&r("button",{className:"vtx-admin-header-notifications-action-btn",onClick:o,title:"Mark all as read",children:"Mark all read"}),t.length>0&&i&&r("button",{className:"vtx-admin-header-notifications-action-btn vtx-admin-header-notifications-action-btn--danger",onClick:i,title:"Clear all",children:"Clear"})]})]}),r("div",{className:"vtx-admin-header-notifications-list",children:0===t.length?n("div",{className:"vtx-admin-header-notifications-empty",children:[r("div",{style:{fontSize:"48px",opacity:.3},children:r(Dr,{})}),r(xe,{variant:"body2",noMargin:!0,style:{marginTop:"12px",color:"var(--vtx-color-neutral-500)"},children:"No notifications"})]}):r(e,{children:v.map(e=>{const t=e.href?"a":"button";return n(t,{className:`vtx-admin-header-notification-item ${e.read?"":"vtx-admin-header-notification-item--unread"} ${e.type?`vtx-admin-header-notification-item--${e.type}`:""}`,onClick:()=>(r=>{null==a||a(r),d()})(e),href:e.href,type:e.href?void 0:"button",children:[(e.icon||e.avatar)&&r("div",{className:"vtx-admin-header-notification-icon",children:e.avatar?r(Ze,{src:e.avatar,size:"sm",alt:"Notification"}):e.icon}),n("div",{className:"vtx-admin-header-notification-content",children:[r(xe,{variant:"body2",noMargin:!0,style:{fontWeight:e.read?400:600},children:e.title}),e.description&&r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-600)",marginTop:"2px"},children:e.description}),r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-neutral-500)",marginTop:"4px"},children:e.time})]}),!e.read&&r("div",{className:"vtx-admin-header-notification-dot"})]},e.id)})})}),t.length>c&&l&&r("div",{className:"vtx-admin-header-notifications-footer",children:n("button",{className:"vtx-admin-header-notifications-view-all",onClick:()=>{l(),d()},children:["View all ",t.length," notifications"]})})]})},ht=({items:e,onClose:t})=>r("div",{className:"vtx-admin-header-user-dropdown",children:e.map((e,o)=>{const i=e.href?"a":"button";return n(a.Fragment,{children:[n(i,{className:`vtx-admin-header-user-menu-item ${e.variant?`vtx-admin-header-user-menu-item--${e.variant}`:""} ${e.disabled?"vtx-admin-header-user-menu-item--disabled":""}`,onClick:()=>(r=>{var n;r.disabled||(null===(n=r.onClick)||void 0===n||n.call(r),t())})(e),href:e.href,type:e.href?void 0:"button",disabled:e.disabled,children:[e.icon&&r("span",{className:"vtx-admin-header-user-menu-icon",children:e.icon}),r("span",{className:"vtx-admin-header-user-menu-label",children:e.label}),e.badge&&r(Te,{size:"sm",className:"vtx-admin-header-user-menu-badge",children:e.badge}),e.shortcut&&r("span",{className:"vtx-admin-header-user-menu-shortcut",children:e.shortcut})]}),e.divider&&r("div",{className:"vtx-admin-header-user-menu-divider"})]},o)})}),ut=a.forwardRef(({logo:e,title:t,subtitle:d,onLogoClick:c,onToggleSidebar:s,showToggleButton:v=!0,toggleIcon:x,showSearch:m=!1,searchPlaceholder:p,searchValue:h,onSearchChange:u,onSearchSubmit:g,onSearchFocus:b,searchSuggestions:f,searchLoading:y,searchIcon:w,notifications:k=[],onNotificationClick:_,onMarkAllAsRead:N,onClearAllNotifications:z,onViewAllNotifications:C,showNotifications:S=!0,notificationIcon:$,quickActions:M=[],userName:T,userRole:D,userAvatar:j,userAvatarFallback:I,userMenuItems:L=[],showUserMenu:A=!0,onUserAvatarClick:R,actions:B,leftContent:E,centerContent:O,rightContent:F,className:W="",style:P,variant:H="default",theme:V="light",sticky:Y=!0,height:q="64px",blur:U=!1,maxNotifications:G=5,showBreadcrumbs:X=!1,breadcrumbs:K=[]},Q)=>{const[J,Z]=i(!1),[rr,nr]=i(!1),er=l(null),tr=l(null),ar=k.filter(r=>!r.read).length;o(()=>{const r=r=>{er.current&&!er.current.contains(r.target)&&Z(!1),tr.current&&!tr.current.contains(r.target)&&nr(!1)};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]),o(()=>{const r=r=>{"Escape"===r.key&&(Z(!1),nr(!1))};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[]);const or=["vtx-admin-header",`vtx-admin-header--${H}`,`vtx-admin-header--${V}`,Y&&"vtx-admin-header--sticky",U&&"vtx-admin-header--blur",W].filter(Boolean).join(" "),ir={...P,height:"number"==typeof q?`${q}px`:q};return n("header",{ref:Q,className:or,style:ir,children:[n("div",{className:"vtx-admin-header-container",children:[n("div",{className:"vtx-admin-header-left",children:[v&&s&&r("button",{className:"vtx-admin-header-toggle",onClick:s,"aria-label":"Toggle sidebar",type:"button",children:x||r(jr,{})}),(e||t)&&n("div",{className:"vtx-admin-header-brand",onClick:c,style:{cursor:c?"pointer":"default"},children:[e&&r("div",{className:"vtx-admin-header-logo",children:e}),t&&n("div",{className:"vtx-admin-header-brand-text",children:[r(xe,{variant:"h6",noMargin:!0,className:"vtx-admin-header-title",children:t}),d&&r(xe,{variant:"caption",noMargin:!0,className:"vtx-admin-header-subtitle",children:d})]})]}),E]}),n("div",{className:"vtx-admin-header-center",children:[m&&r(mt,{value:h,onChange:u,onSubmit:g,onFocus:b,placeholder:p,loading:y,suggestions:f,icon:w}),O]}),n("div",{className:"vtx-admin-header-right",children:[M.length>0&&r("div",{className:"vtx-admin-header-quick-actions",children:M.map(e=>n("button",{className:"vtx-admin-header-icon-button "+(e.disabled?"vtx-admin-header-icon-button--disabled":""),onClick:e.onClick,title:e.tooltip||e.label,disabled:e.disabled,"aria-label":e.label,type:"button",children:[e.icon,e.badge&&r(Te,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:e.badge})]},e.id))}),B,F,(S||A)&&r("div",{className:"vtx-admin-header-divider"}),S&&k.length>0&&n("div",{className:"vtx-admin-header-notifications",ref:er,children:[n("button",{className:"vtx-admin-header-icon-button "+(J?"vtx-admin-header-icon-button--active":""),onClick:()=>Z(!J),"aria-label":"Notifications",type:"button",children:[$||r(Dr,{}),ar>0&&r(Te,{variant:"error",size:"sm",className:"vtx-admin-header-icon-badge",children:ar>9?"9+":ar})]}),J&&r(pt,{notifications:k,onNotificationClick:_,onMarkAllAsRead:N,onClearAll:z,onViewAll:C,onClose:()=>Z(!1),maxNotifications:G})]}),A&&T&&n("div",{className:"vtx-admin-header-user",ref:tr,children:[n("button",{className:"vtx-admin-header-user-button "+(rr?"vtx-admin-header-user-button--active":""),onClick:()=>{L.length>0?nr(!rr):null==R||R()},"aria-label":"User menu",type:"button",children:[j?r(Ze,{src:j,alt:T,size:"sm",className:"vtx-admin-header-user-avatar"}):r("div",{className:"vtx-admin-header-user-avatar vtx-admin-header-user-avatar-fallback",children:I||T.charAt(0).toUpperCase()}),n("div",{className:"vtx-admin-header-user-info",children:[r(xe,{variant:"body2",noMargin:!0,className:"vtx-admin-header-user-name",children:T}),D&&r(xe,{variant:"caption",noMargin:!0,className:"vtx-admin-header-user-role",children:D})]}),L.length>0&&r($r,{})]}),rr&&L.length>0&&r(ht,{items:L,onClose:()=>nr(!1)})]})]})]}),X&&K.length>0&&r("div",{className:"vtx-admin-header-breadcrumbs",children:K.map((e,t)=>n(a.Fragment,{children:[t>0&&r("span",{className:"vtx-admin-header-breadcrumb-separator",children:"/"}),e.href||e.onClick?r("a",{href:e.href,onClick:r=>{e.onClick&&(r.preventDefault(),e.onClick())},className:"vtx-admin-header-breadcrumb",children:e.label}):r("span",{className:"vtx-admin-header-breadcrumb vtx-admin-header-breadcrumb--current",children:e.label})]},t))})]})});ut.displayName="AdminHeader";const gt=gr(ut);cn('/* ==========================================\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/* Empty State with Icon & Description */\r\n.vertex-datagrid-empty-state {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 64px 24px;\r\n}\r\n\r\n.vertex-datagrid-empty-state-icon {\r\n  font-size: 48px;\r\n  color: rgba(0, 0, 0, 0.26);\r\n  opacity: 0.6;\r\n}\r\n\r\n.vertex-datagrid-empty-state-message {\r\n  font-size: 1.125rem;\r\n  font-weight: 600;\r\n  color: rgba(0, 0, 0, 0.6);\r\n}\r\n\r\n.vertex-datagrid-empty-state-description {\r\n  font-size: 0.875rem;\r\n  color: rgba(0, 0, 0, 0.38);\r\n  max-width: 400px;\r\n  line-height: 1.5;\r\n  text-align: center;\r\n}\r\n\r\n/* Skeleton Loader */\r\n.vertex-datagrid-row--skeleton {\r\n  animation: vertex-pulse 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vertex-datagrid-skeleton {\r\n  height: 16px;\r\n  background: linear-gradient(\r\n    90deg,\r\n    rgba(224, 224, 224, 1) 25%,\r\n    rgba(245, 245, 245, 1) 50%,\r\n    rgba(224, 224, 224, 1) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n  border-radius: 4px;\r\n  animation: vertex-skeleton-shimmer 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vertex-datagrid-skeleton--text {\r\n  width: 100%;\r\n  max-width: 180px;\r\n}\r\n\r\n.vertex-datagrid-skeleton--checkbox {\r\n  width: 16px;\r\n  height: 16px;\r\n  border-radius: 2px;\r\n}\r\n\r\n@keyframes vertex-skeleton-shimmer {\r\n  0% {\r\n    background-position: 200% 0;\r\n  }\r\n  100% {\r\n    background-position: -200% 0;\r\n  }\r\n}\r\n\r\n@keyframes vertex-pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.7;\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/* ==========================================\r\n   Dark Mode Support\r\n   ========================================== */\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid {\r\n  background: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-container {\r\n  background: var(--vtx-color-neutral-800);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-icon {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-message {\r\n  color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-empty-state-description {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n[data-theme=\'dark\'] .vertex-datagrid-skeleton {\r\n  background: linear-gradient(\r\n    90deg,\r\n    var(--vtx-color-neutral-700) 25%,\r\n    var(--vtx-color-neutral-600) 50%,\r\n    var(--vtx-color-neutral-700) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n}');const bt=(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()}]}},ft=({column:t,anchorEl:a,onClose:i,onSort:d,onFilter:c,currentSort:s,hasFilter:v})=>{const x=l(null);if(o(()=>{const r=r=>{x.current&&!x.current.contains(r.target)&&a&&!a.contains(r.target)&&i()};return a&&document.addEventListener("mousedown",r),()=>{document.removeEventListener("mousedown",r)}},[a,i]),!a)return null;const m=a.getBoundingClientRect();return n("div",{ref:x,className:"vertex-datagrid-column-menu",style:{position:"fixed",top:m.bottom+4,left:m.left,zIndex:1300},children:[t.sortable&&n(e,{children:[n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{d("asc"),i()},children:[r(an,{size:16}),r("span",{children:"Sort ascending"}),"asc"===s&&r("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{d("desc"),i()},children:[r(on,{size:16}),r("span",{children:"Sort descending"}),"desc"===s&&r("span",{className:"vertex-datagrid-menu-check",children:"✓"})]}),s&&n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{d(null),i()},children:[r("span",{style:{width:16}}),r("span",{children:"Unsort"})]}),t.filterable&&r("div",{className:"vertex-datagrid-column-menu-divider"})]}),t.filterable&&n("button",{className:"vertex-datagrid-column-menu-item",onClick:()=>{c(),i()},children:[r("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r("span",{children:v?"Edit filter":"Filter"}),v&&r("span",{className:"vertex-datagrid-menu-badge",children:"●"})]})]})},yt=({columns:t,filterModel:a,onFilterModelChange:i,onClose:d,targetColumn:c})=>{const s=t.filter(r=>!1!==r.filterable),v=l(null);o(()=>{const r=r=>{v.current&&!v.current.contains(r.target)&&d()};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[d]),o(()=>{c&&0===a.items.length&&x(c)},[c]);const x=r=>{var n,e;const o=r||(null===(n=s[0])||void 0===n?void 0:n.field)||"",l=t.find(r=>r.field===o),d=(null==l?void 0:l.filterOperators)||bt(null==l?void 0:l.type),c={id:Date.now(),field:o,operator:(null===(e=d[0])||void 0===e?void 0:e.value)||"contains",value:""};i({...a,items:[...a.items,c]})},m=(r,n)=>{var e;const o=[...a.items],l=o[r];if(o[r]={...l,...n},n.field&&n.field!==l.field){const a=t.find(r=>r.field===n.field),i=(null==a?void 0:a.filterOperators)||bt(null==a?void 0:a.type);o[r].operator=(null===(e=i[0])||void 0===e?void 0:e.value)||"contains"}i({...a,items:o})},p=()=>{i({...a,logicOperator:"and"===a.logicOperator?"or":"and"})};return r("div",{className:"vertex-datagrid-filter-panel-overlay",children:n("div",{ref:v,className:"vertex-datagrid-filter-panel",children:[n("div",{className:"vertex-datagrid-filter-panel-header",children:[r(xe,{weight:"semibold",size:"sm",children:"Filters"}),r("button",{className:"vertex-datagrid-filter-close",onClick:d,children:n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),r("div",{className:"vertex-datagrid-filter-panel-body",children:0===a.items.length?n("div",{className:"vertex-datagrid-filter-empty",children:[r("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),r(xe,{size:"sm",color:"secondary",children:"No filters applied"}),r(Cn,{variant:"outline",size:"sm",onClick:()=>x(),children:"Add filter"})]}):n(e,{children:[a.items.map((e,o)=>{var l;const d=t.find(r=>r.field===e.field),c=(null==d?void 0:d.filterOperators)||bt(null==d?void 0:d.type),v=!["isEmpty","isNotEmpty"].includes(e.operator);return n("div",{className:"vertex-datagrid-filter-row",children:[o>0&&r("button",{className:"vertex-datagrid-filter-logic-btn",onClick:p,title:"Toggle AND/OR",children:(null===(l=a.logicOperator)||void 0===l?void 0:l.toUpperCase())||"OR"}),n("div",{className:"vertex-datagrid-filter-controls",children:[r("select",{value:e.field,onChange:r=>m(o,{field:r.target.value}),className:"vertex-datagrid-filter-select",children:s.map(n=>r("option",{value:n.field,children:n.headerName},n.field))}),r("select",{value:e.operator,onChange:r=>m(o,{operator:r.target.value}),className:"vertex-datagrid-filter-select",children:c.map(n=>r("option",{value:n.value,children:n.label},n.value))}),v&&r(Ln,{value:e.value||"",onChange:r=>m(o,{value:r.target.value}),placeholder:"Value",size:"sm"}),r("button",{className:"vertex-datagrid-filter-remove",onClick:()=>(r=>{const n=a.items.filter((n,e)=>e!==r);i({...a,items:n})})(o),title:"Remove filter",children:n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[r("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]})]},e.id||o)}),r("div",{className:"vertex-datagrid-filter-actions",children:r(Cn,{variant:"ghost",size:"sm",onClick:()=>x(),children:"+ Add filter"})})]})}),a.items.length>0&&r("div",{className:"vertex-datagrid-filter-panel-footer",children:r(Cn,{variant:"ghost",size:"sm",onClick:()=>i({items:[],logicOperator:"or"}),children:"Clear all"})})]})})},wt=({columns:t,rows:a,getRowId:o=(r,n)=>{var e;return null!==(e=r.id)&&void 0!==e?e:n},filterModel:l,onFilterModelChange:d,initialState:c,disableColumnFilter:v=!1,ignoreDiacritics:x=!1,sortModel:m,onSortModelChange:p,checkboxSelection:h=!1,rowSelectionModel:g,onRowSelectionModelChange:b,pagination:f=!0,pageSize:y=10,pageSizeOptions:w=[5,10,25,50,100],loading:k=!1,skeletonLoader:_=!1,skeletonRows:N=5,loadingContent:z,emptyStateIcon:C,emptyStateTitle:S="No data available",emptyStateDescription:$,autoHeight:M=!1,density:T="standard",disableColumnMenu:D=!1,hideFooter:j=!1,size:I,className:L,...A})=>{var R,B;const{theme:E}=kn(),O=I||E.defaultSize,[F,W]=i((null===(R=null==c?void 0:c.filter)||void 0===R?void 0:R.filterModel)||{items:[],logicOperator:"or"}),[P,H]=i([]),[V,Y]=i([]),[q,U]=i(0),[G,X]=i(y),[K,Q]=i(!1),[J,Z]=i(null),[rr,nr]=i(),er=null!=l?l:F,tr=null!=m?m:P,ar=null!=g?g:V,or=s(r=>{d?d(r):W(r)},[d]),ir=s(r=>{p?p(r):H(r)},[p]),lr=s(r=>{b?b(r):Y(r)},[b]),dr=u(()=>v||0===er.items.length?a:a.filter(r=>{const n=er.items.map(n=>{const e=t.find(r=>r.field===n.field);if(!e)return!0;const a=e.valueGetter?e.valueGetter(r):r[n.field],o=(e.filterOperators||bt(e.type)).find(r=>r.value===n.operator);if(!o)return!0;return o.getApplyFilterFn(n)(a)});return"and"===er.logicOperator?n.every(r=>r):n.some(r=>r)}),[a,er,t,v]),cr=u(()=>{if(0===tr.length)return dr;const r=[...dr],n=tr[0],e=t.find(r=>r.field===n.field);return e?(r.sort((r,t)=>{const a=e.valueGetter?e.valueGetter(r):r[n.field],o=e.valueGetter?e.valueGetter(t):t[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"===e.type?Number(a)-Number(o):"date"===e.type?new Date(a).getTime()-new Date(o).getTime():String(a).localeCompare(String(o)),"asc"===n.sort?i:-i}),r):r},[dr,tr,t]),sr=u(()=>{if(!f)return cr;const r=q*G,n=r+G;return cr.slice(r,n)},[cr,q,G,f]),vr=s((r,n)=>{if(!r.sortable)return;let e;e=null===n?[]:[{field:r.field,sort:n}],ir(e)},[ir]),xr=s(r=>{const n=ar.includes(r)?ar.filter(n=>n!==r):[...ar,r];lr(n)},[ar,lr]),mr=s(()=>{if(ar.length===sr.length)lr([]);else{const r=sr.map((r,n)=>o(r,n));lr(r)}},[ar,sr,lr,o]),pr=Math.ceil(cr.length/G),hr=er.items.length>0,ur=(r,n,e=!1)=>{if(!r.pinned)return{};const a={position:"sticky",zIndex:e?101:100,background:e?"#fafafa":"inherit"};if("left"===r.pinned){let r=h?58:0;for(let e=0;e<n;e++)"left"===t[e].pinned&&(r+=t[e].width||150);a.left=r}else if("right"===r.pinned){let n=0;for(let e=t.indexOf(r)+1;e<t.length;e++)"right"===t[e].pinned&&(n+=t[e].width||150);a.right=n}return a};return n("div",{className:`vertex-datagrid ${`vertex-datagrid--${T}`} ${`vertex-datagrid--${O}`} ${M?"vertex-datagrid--auto-height":""} ${L||""}`,...A,children:[r("div",{className:"vertex-datagrid-container",children:n("table",{className:"vertex-datagrid-table",children:[r("thead",{className:"vertex-datagrid-thead",children:n("tr",{children:[h&&r("th",{className:"vertex-datagrid-th vertex-datagrid-checkbox-cell",children:r($n,{checked:ar.length===sr.length&&sr.length>0,indeterminate:ar.length>0&&ar.length<sr.length,onChange:mr})}),t.map((e,t)=>{const a=tr.find(r=>r.field===e.field),o=!!a,i=null==a?void 0:a.sort,l=er.items.some(r=>r.field===e.field),d=ur(e,t,!0);return r("th",{className:`vertex-datagrid-th ${e.sortable?"vertex-datagrid-th--sortable":""} ${e.pinned?`vertex-datagrid-th--pinned-${e.pinned}`:""}`,style:{width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth,textAlign:e.headerAlign||e.align||"left",flex:e.flex,...d},children:n("div",{className:"vertex-datagrid-th-content",children:[n("div",{className:"vertex-datagrid-th-label",onClick:()=>e.sortable&&vr(e,o?"asc"===i?"desc":null:"asc"),children:[r("span",{className:"vertex-datagrid-th-text",children:e.headerName}),e.sortable&&r("div",{className:"vertex-datagrid-sort-icon "+(o?"vertex-datagrid-sort-icon--active":""),children:o?r("asc"===i?an:on,{size:18}):r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",opacity:"0.4",children:r("path",{d:"M12 5v14M5 12l7 7 7-7"})})})]}),!D&&(e.sortable||e.filterable)&&n("button",{className:"vertex-datagrid-column-menu-btn "+(l?"vertex-datagrid-column-menu-btn--filtered":""),onClick:r=>{r.stopPropagation(),Z({column:e,anchorEl:r.currentTarget})},title:"Column options",children:[n("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"currentColor",children:[r("circle",{cx:"12",cy:"5",r:"2"}),r("circle",{cx:"12",cy:"12",r:"2"}),r("circle",{cx:"12",cy:"19",r:"2"})]}),l&&r("span",{className:"vertex-datagrid-filter-badge"})]})]})},e.field)})]})}),r("tbody",{className:"vertex-datagrid-tbody",children:k?_?Array.from({length:N}).map((e,a)=>n("tr",{className:"vertex-datagrid-row vertex-datagrid-row--skeleton",children:[h&&r("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r("div",{className:"vertex-datagrid-skeleton vertex-datagrid-skeleton--checkbox"})}),t.map(n=>r("td",{className:"vertex-datagrid-td",children:r("div",{className:"vertex-datagrid-skeleton vertex-datagrid-skeleton--text"})},n.field))]},`skeleton-${a}`)):r("tr",{children:r("td",{colSpan:t.length+(h?1:0),className:"vertex-datagrid-loading",children:r("div",{className:"vertex-datagrid-loading-content",children:z||n(e,{children:[r("div",{className:"vertex-datagrid-spinner"}),r(xe,{size:"sm",color:"secondary",children:"Loading..."})]})})})}):0===sr.length?r("tr",{children:r("td",{colSpan:t.length+(h?1:0),className:"vertex-datagrid-empty",children:n("div",C||$?{className:"vertex-datagrid-empty-state",children:[C&&r("div",{className:"vertex-datagrid-empty-state-icon",children:C}),r("div",{className:"vertex-datagrid-empty-state-message",children:S}),$&&r("div",{className:"vertex-datagrid-empty-state-description",children:$})]}:{className:"vertex-datagrid-empty-content",children:[n("svg",{width:"64",height:"64",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1",opacity:"0.3",children:[r("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2"}),r("line",{x1:"3",y1:"9",x2:"21",y2:"9"}),r("line",{x1:"9",y1:"21",x2:"9",y2:"9"})]}),r(xe,{size:"sm",color:"secondary",children:S})]})})}):sr.map((e,a)=>{const i=o(e,a),l=ar.includes(i);return n("tr",{className:"vertex-datagrid-row "+(l?"vertex-datagrid-row--selected":""),children:[h&&r("td",{className:"vertex-datagrid-td vertex-datagrid-checkbox-cell",children:r($n,{checked:l,onChange:()=>xr(i)})}),t.map((n,t)=>{const a=n.valueGetter?n.valueGetter(e):e[n.field],o=n.valueFormatter?n.valueFormatter(a):a,i=n.renderCell?n.renderCell({row:e,value:a,field:n.field}):o,l=ur(n,t,!1);return r("td",{className:"vertex-datagrid-td "+(n.pinned?`vertex-datagrid-td--pinned-${n.pinned}`:""),style:{textAlign:n.align||"left",...l},children:i},n.field)})]},i)})})]})}),!j&&f&&n("div",{className:"vertex-datagrid-footer",children:[r("div",{className:"vertex-datagrid-footer-left",children:hr&&n("button",{className:"vertex-datagrid-filter-chip",onClick:()=>Q(!0),children:[r("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M22 3H2l8 9.46V19l4 2v-8.54L22 3z"})}),n("span",{children:[er.items.length," ",1===er.items.length?"filter":"filters"]})]})}),r("div",{className:"vertex-datagrid-footer-center",children:r(xe,{size:"sm",color:"secondary",children:0===cr.length?"0 rows":`${q*G+1}–${Math.min((q+1)*G,cr.length)} of ${cr.length}`})}),n("div",{className:"vertex-datagrid-footer-right",children:[n("label",{className:"vertex-datagrid-pagesize-label",children:[r(xe,{size:"sm",color:"secondary",children:"Rows per page:"}),r("select",{value:G,onChange:r=>{X(Number(r.target.value)),U(0)},className:"vertex-datagrid-pagesize-select",children:w.map(n=>r("option",{value:n,children:n},n))})]}),n("div",{className:"vertex-datagrid-pagination",children:[r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(0),disabled:0===q,title:"First page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M11 17l-5-5 5-5M18 17l-5-5 5-5"})})}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(r=>Math.max(0,r-1)),disabled:0===q,title:"Previous page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M15 18l-6-6 6-6"})})}),n(xe,{size:"sm",color:"secondary",children:["Page ",q+1," of ",pr||1]}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(r=>Math.min(pr-1,r+1)),disabled:q>=pr-1,title:"Next page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M9 18l6-6-6-6"})})}),r("button",{className:"vertex-datagrid-pagination-btn",onClick:()=>U(pr-1),disabled:q>=pr-1,title:"Last page",children:r("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:r("path",{d:"M13 17l5-5-5-5M6 17l5-5-5-5"})})})]})]})]}),J&&r(ft,{column:J.column,anchorEl:J.anchorEl,onClose:()=>Z(null),onSort:r=>vr(J.column,r),onFilter:()=>{nr(J.column.field),Q(!0)},currentSort:null===(B=tr.find(r=>r.field===J.column.field))||void 0===B?void 0:B.sort,hasFilter:er.items.some(r=>r.field===J.column.field)}),K&&r(yt,{columns:t,filterModel:er,onFilterModelChange:or,onClose:()=>{Q(!1),nr(void 0)},targetColumn:rr})]})};wt.displayName="DataGrid";const kt=gr(wt);cn("/* Base divider styles */\r\n.vtx-divider {\r\n  margin: 0;\r\n  flex-shrink: 0;\r\n  border-width: 0;\r\n  border-style: solid;\r\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\r\n  border-bottom-width: thin;\r\n}\r\n\r\n/* Light variant */\r\n.vtx-divider--light {\r\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\r\n}\r\n\r\n/* Horizontal orientation (default) */\r\n.vtx-divider--horizontal {\r\n  width: 100%;\r\n  border-bottom-width: 1px;\r\n}\r\n\r\n/* Vertical orientation */\r\n.vtx-divider--vertical {\r\n  height: auto;\r\n  align-self: stretch;\r\n  border-bottom-width: 0;\r\n  border-right-width: 1px;\r\n}\r\n\r\n/* Flex item variant */\r\n.vtx-divider--flex-item {\r\n  height: auto;\r\n  align-self: stretch;\r\n}\r\n\r\n.vtx-divider--flex-item.vtx-divider--horizontal {\r\n  height: 1px;\r\n  width: 100%;\r\n  align-self: auto;\r\n}\r\n\r\n/* Variants */\r\n.vtx-divider--fullWidth {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-divider--inset {\r\n  margin-left: var(--vtx-spacing-9);\r\n}\r\n\r\n.vtx-divider--middle {\r\n  margin-left: var(--vtx-spacing-3);\r\n  margin-right: var(--vtx-spacing-3);\r\n}\r\n\r\n.vtx-divider--vertical.vtx-divider--inset {\r\n  margin-left: 0;\r\n  margin-top: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-divider--vertical.vtx-divider--middle {\r\n  margin-left: 0;\r\n  margin-right: 0;\r\n  margin-top: var(--vtx-spacing-2);\r\n  margin-bottom: var(--vtx-spacing-2);\r\n}\r\n\r\n/* With children */\r\n.vtx-divider--with-children {\r\n  display: flex;\r\n  white-space: nowrap;\r\n  text-align: center;\r\n  border: 0;\r\n  border-color: var(--vtx-divider-color, var(--vtx-color-neutral-200));\r\n  font-family: var(--vtx-font-family-sans);\r\n  font-size: var(--vtx-divider-text-size, var(--vtx-font-size-sm));\r\n  color: var(--vtx-divider-text-color, var(--vtx-color-neutral-600));\r\n  font-weight: var(--vtx-divider-text-weight, var(--vtx-font-weight-medium));\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--light {\r\n  border-color: var(--vtx-divider-color-light, var(--vtx-color-neutral-100));\r\n  color: var(--vtx-divider-text-color-light, var(--vtx-color-neutral-500));\r\n}\r\n\r\n.vtx-divider--with-children::before,\r\n.vtx-divider--with-children::after {\r\n  content: '';\r\n  align-self: center;\r\n  border-top: thin solid;\r\n  border-color: inherit;\r\n}\r\n\r\n/* Text alignment - horizontal only */\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::before {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-center::after {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::before {\r\n  width: 5%;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-left::after {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::before {\r\n  width: 100%;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--horizontal.vtx-divider--text-right::after {\r\n  width: 5%;\r\n}\r\n\r\n/* Wrapper for children content */\r\n.vtx-divider-wrapper {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  padding-left: var(--vtx-spacing-3);\r\n  padding-right: var(--vtx-spacing-3);\r\n}\r\n\r\n/* Vertical divider with children (not commonly used but supported) */\r\n.vtx-divider--with-children.vtx-divider--vertical {\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--vertical::before,\r\n.vtx-divider--with-children.vtx-divider--vertical::after {\r\n  border-top: 0;\r\n  border-left: thin solid;\r\n  height: 100%;\r\n  width: auto;\r\n}\r\n\r\n.vtx-divider--with-children.vtx-divider--vertical .vtx-divider-wrapper {\r\n  padding-left: 0;\r\n  padding-right: 0;\r\n  padding-top: var(--vtx-spacing-2);\r\n  padding-bottom: var(--vtx-spacing-2);\r\n}\r\n");const _t=a.forwardRef(({textAlign:n="center",orientation:e="horizontal",variant:t="fullWidth",light:a=!1,flexItem:o=!1,children:i,component:l,className:d="",role:c,...s},v)=>{const x=l||(i||"vertical"===e?"div":"hr"),m=c||("hr"!==x?"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(" ");return r(x,{ref:v,className:p,role:m,..."vertical"===e&&"hr"!==x?{"aria-orientation":"vertical"}:{},...s,children:i&&r("span",{className:"vtx-divider-wrapper",children:i})})});_t.displayName="Divider";const Nt=gr(_t);cn("/* ===================================\r\n   SideMenu - Enterprise Sidebar Navigation\r\n   =================================== */\r\n\r\n/* CSS Variables for Theming - Using Theme Tokens */\r\n:root {\r\n  /* Default/Light Theme - Using theme token colors */\r\n  --vtx-sidemenu-bg: var(--vtx-color-neutral-50, #ffffff);\r\n  --vtx-sidemenu-border: var(--vtx-color-neutral-200, #e5e5e5);\r\n  --vtx-sidemenu-shadow: var(--vtx-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));\r\n  \r\n  --vtx-sidemenu-item-color: var(--vtx-color-neutral-700, #404040);\r\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-neutral-100, #f5f5f5);\r\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-50, #eff6ff);\r\n  --vtx-sidemenu-item-active-color: var(--vtx-color-primary-600, #2563eb);\r\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-neutral-500, #737373);\r\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-primary-600, #2563eb);\r\n  \r\n  --vtx-sidemenu-submenu-bg: var(--vtx-color-neutral-50, #fafafa);\r\n  --vtx-sidemenu-submenu-border: var(--vtx-color-neutral-100, #f5f5f5);\r\n  \r\n  --vtx-sidemenu-header-border: var(--vtx-color-neutral-200, #e5e5e5);\r\n  --vtx-sidemenu-footer-border: var(--vtx-color-neutral-200, #e5e5e5);\r\n  \r\n  --vtx-sidemenu-toggle-bg: var(--vtx-color-neutral-100, #f5f5f5);\r\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-neutral-200, #e5e5e5);\r\n  --vtx-sidemenu-toggle-color: var(--vtx-color-neutral-500, #737373);\r\n  \r\n  --vtx-sidemenu-badge-bg: var(--vtx-color-error-500, #ef4444);\r\n  --vtx-sidemenu-badge-color: var(--vtx-color-neutral-50, #ffffff);\r\n  \r\n  --vtx-sidemenu-transition-speed: var(--vtx-transition-base, 200ms);\r\n  --vtx-sidemenu-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n/* ===================================\r\n   Base Sidebar Structure\r\n   =================================== */\r\n\r\n.vtx-sidemenu {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: var(--vtx-sidemenu-bg);\r\n  height: 100vh;\r\n  overflow: hidden;\r\n  transition: width var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n  position: relative;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-sidemenu--elevated {\r\n  box-shadow: var(--vtx-sidemenu-shadow);\r\n}\r\n\r\n.vtx-sidemenu--bordered {\r\n  border-right: 1px solid var(--vtx-sidemenu-border);\r\n}\r\n\r\n.vtx-sidemenu--right {\r\n  border-right: none;\r\n  border-left: 1px solid var(--vtx-sidemenu-border);\r\n}\r\n\r\n.vtx-sidemenu--collapsed {\r\n  transition: width var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n}\r\n\r\n/* ===================================\r\n   Header Section\r\n   =================================== */\r\n\r\n.vtx-sidemenu-header {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 20px 16px;\r\n  border-bottom: 1px solid var(--vtx-sidemenu-header-border);\r\n  flex-shrink: 0;\r\n  min-height: 72px;\r\n}\r\n\r\n.vtx-sidemenu-header-content {\r\n  flex: 1;\r\n  min-width: 0;\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-sidemenu--collapsed .vtx-sidemenu-header {\r\n  justify-content: center;\r\n  padding: 20px 8px;\r\n}\r\n\r\n.vtx-sidemenu--collapsed .vtx-sidemenu-header-content {\r\n  display: none;\r\n}\r\n\r\n/* ===================================\r\n   Content Section (Scrollable Menu Items)\r\n   =================================== */\r\n\r\n.vtx-sidemenu-content {\r\n  flex: 1;\r\n  overflow-y: auto;\r\n  overflow-x: hidden;\r\n  padding: 12px 12px;\r\n}\r\n\r\n.vtx-sidemenu-content::-webkit-scrollbar {\r\n  width: 6px;\r\n}\r\n\r\n.vtx-sidemenu-content::-webkit-scrollbar-track {\r\n  background: transparent;\r\n}\r\n\r\n.vtx-sidemenu-content::-webkit-scrollbar-thumb {\r\n  background: var(--vtx-color-neutral-300, #d4d4d4);\r\n  border-radius: var(--vtx-border-radius-sm, 0.125rem);\r\n}\r\n\r\n.vtx-sidemenu-content::-webkit-scrollbar-thumb:hover {\r\n  background: var(--vtx-color-neutral-400, #a3a3a3);\r\n}\r\n\r\n.vtx-sidemenu--collapsed .vtx-sidemenu-content {\r\n  padding: 12px 8px;\r\n}\r\n\r\n/* ===================================\r\n   Footer Section\r\n   =================================== */\r\n\r\n.vtx-sidemenu-footer {\r\n  border-top: 1px solid var(--vtx-sidemenu-footer-border);\r\n  padding: 16px 12px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-sidemenu--collapsed .vtx-sidemenu-footer {\r\n  padding: 16px 8px;\r\n  text-align: center;\r\n}\r\n\r\n/* ===================================\r\n   Menu Items - Professional Style (Same as Menu component)\r\n   =================================== */\r\n\r\n.vtx-sidemenu-item {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-color-neutral-700);\r\n  background: transparent;\r\n  cursor: pointer;\r\n  transition: all 0.15s ease-in-out;\r\n  user-select: none;\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-medium);\r\n  border-left: 3px solid transparent;\r\n  text-decoration: none;\r\n  outline: none;\r\n  border-right: none;\r\n  border-top: none;\r\n  border-bottom: none;\r\n  text-align: left;\r\n  width: 100%;\r\n}\r\n\r\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-item:active:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\r\n  background: var(--vtx-color-neutral-200);\r\n  transform: scale(0.98);\r\n}\r\n\r\n.vtx-sidemenu-item:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-500);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Active Menu Item - Professional Style */\r\n.vtx-sidemenu-item--active {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n}\r\n\r\n/* Disabled Menu Item */\r\n.vtx-sidemenu-item--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Collapsed State */\r\n.vtx-sidemenu-item--collapsed {\r\n  justify-content: center;\r\n  padding: var(--vtx-spacing-3);\r\n  gap: 0;\r\n}\r\n\r\n/* Icon Styling - Professional (Same as Menu) */\r\n.vtx-sidemenu-item-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 20px;\r\n  height: 20px;\r\n  flex-shrink: 0;\r\n  color: var(--vtx-color-neutral-600);\r\n  transition: color 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) .vtx-sidemenu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-item-icon svg {\r\n  width: 100%;\r\n  height: 100%;\r\n  transition: inherit;\r\n}\r\n\r\n/* Text Content */\r\n.vtx-sidemenu-item-label {\r\n  flex: 1;\r\n  color: inherit;\r\n  font-size: inherit;\r\n  font-weight: inherit;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Badge */\r\n.vtx-sidemenu-item-badge {\r\n  font-size: var(--vtx-font-size-xs);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  min-width: 20px;\r\n  height: 18px;\r\n  padding: 0 6px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border-radius: var(--vtx-radius-full);\r\n  background: var(--vtx-color-error-500);\r\n  color: white;\r\n  line-height: 1;\r\n  top: 8px;\r\n  right: 8px;\r\n  box-shadow: 0 0 0 2px var(--vtx-sidemenu-bg);\r\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\r\n}\r\n\r\n@keyframes pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.7;\r\n  }\r\n}\r\n\r\n/* Chevron Icon */\r\n.vtx-sidemenu-chevron {\r\n  display: flex;\r\n  align-items: center;\r\n  color: var(--vtx-color-neutral-400);\r\n  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-sidemenu-chevron--open {\r\n  transform: rotate(180deg);\r\n}\r\n\r\n/* ===================================\r\n   Submenu - Professional Style (Same as Menu)\r\n   =================================== */\r\n\r\n.vtx-sidemenu-submenu {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0;\r\n  padding-left: var(--vtx-spacing-5);\r\n  margin-top: var(--vtx-spacing-2);\r\n  margin-bottom: var(--vtx-spacing-2);\r\n  animation: slideDown 0.25s cubic-bezier(0.4, 0, 0.2, 1);\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-sidemenu-submenu .vtx-sidemenu-item {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-4);\r\n  padding-left: var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-normal);\r\n  margin-bottom: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-sidemenu-submenu .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled):not(.vtx-sidemenu-item--active) {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-submenu .vtx-sidemenu-item--active {\r\n  background-color: var(--vtx-color-primary-50);\r\n  color: var(--vtx-color-primary-600);\r\n  font-weight: 600;\r\n  border-left-color: var(--vtx-color-primary-600);\r\n}\r\n\r\n.vtx-sidemenu-submenu .vtx-sidemenu-item--active:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n}\r\n\r\n.vtx-sidemenu-submenu .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\r\n  color: var(--vtx-color-primary-600);\r\n}\r\n\r\n/* Nested submenu - additional indentation */\r\n.vtx-sidemenu-submenu .vtx-sidemenu-submenu {\r\n  padding-left: var(--vtx-spacing-4);\r\n}\r\n\r\n@keyframes slideDown {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(-4px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n/* ===================================\r\n   Collapse Toggle Button\r\n   =================================== */\r\n\r\n.vtx-sidemenu-collapse-wrapper {\r\n  padding: 12px 16px;\r\n  display: flex;\r\n  justify-content: center;\r\n  border-top: 1px solid var(--vtx-sidemenu-header-border);\r\n}\r\n\r\n.vtx-sidemenu-toggle {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 8px;\r\n  background-color: var(--vtx-sidemenu-toggle-bg);\r\n  border: none;\r\n  cursor: pointer;\r\n  color: var(--vtx-sidemenu-toggle-color);\r\n  transition: all var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n  outline: none;\r\n}\r\n\r\n.vtx-sidemenu-toggle:hover {\r\n  background-color: var(--vtx-sidemenu-toggle-hover-bg);\r\n}\r\n\r\n.vtx-sidemenu-toggle:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-sidemenu-toggle-icon {\r\n  transition: transform var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n}\r\n\r\n.vtx-sidemenu-toggle-icon--rotated {\r\n  transform: rotate(180deg);\r\n}\r\n\r\n/* ===================================\r\n   VARIANT: Compact\r\n   =================================== */\r\n\r\n.vtx-sidemenu--compact .vtx-sidemenu-item-content {\r\n  padding: 8px 12px;\r\n}\r\n\r\n.vtx-sidemenu--compact .vtx-sidemenu-content {\r\n  padding: 4px;\r\n}\r\n\r\n.vtx-sidemenu--compact .vtx-sidemenu-header {\r\n  padding: 16px 12px;\r\n  min-height: 56px;\r\n}\r\n\r\n.vtx-sidemenu--compact .vtx-sidemenu-item-label {\r\n  font-size: 13px;\r\n}\r\n\r\n.vtx-sidemenu--compact .vtx-sidemenu-item-icon {\r\n  width: 18px;\r\n  height: 18px;\r\n}\r\n\r\n/* ===================================\r\n   VARIANT: Modern\r\n   =================================== */\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item {\r\n  border-radius: 12px;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item::before {\r\n  content: '';\r\n  position: absolute;\r\n  left: 0;\r\n  top: 0;\r\n  bottom: 0;\r\n  width: 3px;\r\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n  opacity: 0;\r\n  transition: opacity var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n}\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item--active::before {\r\n  opacity: 1;\r\n}\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) {\r\n  transform: translateX(2px);\r\n}\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item-icon {\r\n  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n}\r\n\r\n.vtx-sidemenu--modern .vtx-sidemenu-item--active .vtx-sidemenu-item-icon {\r\n  animation: pulse 2s infinite;\r\n}\r\n\r\n@keyframes pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.7;\r\n  }\r\n}\r\n\r\n/* ===================================\r\n   VARIANT: Enterprise\r\n   =================================== */\r\n\r\n.vtx-sidemenu--enterprise {\r\n  border-right: 1px solid #e5e7eb;\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-item {\r\n  border-radius: 6px;\r\n  margin-bottom: 2px;\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-item-content {\r\n  padding: 12px 16px;\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-item-label {\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  letter-spacing: -0.01em;\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-item--active {\r\n  background-color: var(--vtx-color-primary-50, #eff6ff);\r\n  border-left: 3px solid var(--vtx-color-primary-600, #2563eb);\r\n  padding-left: 13px;\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-header {\r\n  padding: var(--vtx-spacing-6, 1.5rem) var(--vtx-spacing-5, 1.25rem);\r\n  border-bottom: 2px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n}\r\n\r\n.vtx-sidemenu--enterprise .vtx-sidemenu-submenu {\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n  border-left: 2px solid var(--vtx-color-neutral-200, #e5e5e5);\r\n  margin-left: var(--vtx-spacing-3, 0.75rem);\r\n  border-radius: 0 var(--vtx-border-radius-lg, 0.5rem) var(--vtx-border-radius-lg, 0.5rem) 0;\r\n}\r\n\r\n/* ===================================\r\n   VARIANT: Minimal\r\n   =================================== */\r\n\r\n.vtx-sidemenu--minimal {\r\n  background-color: transparent;\r\n  box-shadow: none;\r\n}\r\n\r\n.vtx-sidemenu--minimal .vtx-sidemenu-item {\r\n  border-radius: 4px;\r\n  margin-bottom: 0;\r\n}\r\n\r\n.vtx-sidemenu--minimal .vtx-sidemenu-item:hover:not(.vtx-sidemenu-item--disabled) {\r\n  background-color: rgba(0, 0, 0, 0.03);\r\n}\r\n\r\n.vtx-sidemenu--minimal .vtx-sidemenu-item--active {\r\n  background-color: rgba(37, 99, 235, 0.08);\r\n}\r\n\r\n.vtx-sidemenu--minimal .vtx-sidemenu-header,\r\n.vtx-sidemenu--minimal .vtx-sidemenu-footer {\r\n  border-color: transparent;\r\n}\r\n\r\n.vtx-sidemenu--minimal .vtx-sidemenu-submenu {\r\n  background-color: transparent;\r\n}\r\n\r\n/* ===================================\r\n   THEME: Dark - Using Theme Tokens\r\n   =================================== */\r\n\r\n.vtx-sidemenu--dark {\r\n  --vtx-sidemenu-bg: var(--vtx-color-neutral-800, #262626);\r\n  --vtx-sidemenu-border: var(--vtx-color-neutral-700, #404040);\r\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));\r\n  \r\n  --vtx-sidemenu-item-color: var(--vtx-color-neutral-200, #e5e5e5);\r\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-neutral-700, #404040);\r\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-600, #2563eb);\r\n  --vtx-sidemenu-item-active-color: var(--vtx-color-neutral-50, #fafafa);\r\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-neutral-400, #a3a3a3);\r\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-neutral-50, #fafafa);\r\n  \r\n  --vtx-sidemenu-submenu-bg: var(--vtx-color-neutral-900, #171717);\r\n  --vtx-sidemenu-submenu-border: var(--vtx-color-neutral-700, #404040);\r\n  \r\n  --vtx-sidemenu-header-border: var(--vtx-color-neutral-700, #404040);\r\n  --vtx-sidemenu-footer-border: var(--vtx-color-neutral-700, #404040);\r\n  \r\n  --vtx-sidemenu-toggle-bg: var(--vtx-color-neutral-700, #404040);\r\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-neutral-600, #525252);\r\n  --vtx-sidemenu-toggle-color: var(--vtx-color-neutral-400, #a3a3a3);\r\n}\r\n\r\n/* ===================================\r\n   THEME: Primary - Using Theme Tokens\r\n   =================================== */\r\n\r\n.vtx-sidemenu--primary {\r\n  --vtx-sidemenu-bg: var(--vtx-color-primary-800, #1e40af);\r\n  --vtx-sidemenu-border: var(--vtx-color-primary-900, #1e3a8a);\r\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));\r\n  \r\n  --vtx-sidemenu-item-color: var(--vtx-color-primary-100, #dbeafe);\r\n  --vtx-sidemenu-item-hover-bg: var(--vtx-color-primary-900, #1e3a8a);\r\n  --vtx-sidemenu-item-active-bg: var(--vtx-color-primary-500, #3b82f6);\r\n  --vtx-sidemenu-item-active-color: var(--vtx-color-neutral-50, #fafafa);\r\n  --vtx-sidemenu-item-icon-color: var(--vtx-color-primary-300, #93c5fd);\r\n  --vtx-sidemenu-item-icon-active-color: var(--vtx-color-neutral-50, #fafafa);\r\n  \r\n  --vtx-sidemenu-submenu-bg: var(--vtx-color-primary-900, #1e3a8a);\r\n  --vtx-sidemenu-submenu-border: var(--vtx-color-primary-800, #1e40af);\r\n  \r\n  --vtx-sidemenu-header-border: var(--vtx-color-primary-900, #1e3a8a);\r\n  --vtx-sidemenu-footer-border: var(--vtx-color-primary-900, #1e3a8a);\r\n  \r\n  --vtx-sidemenu-toggle-bg: var(--vtx-color-primary-900, #1e3a8a);\r\n  --vtx-sidemenu-toggle-hover-bg: var(--vtx-color-primary-700, #1d4ed8);\r\n  --vtx-sidemenu-toggle-color: var(--vtx-color-primary-300, #93c5fd);\r\n}\r\n\r\n/* ===================================\r\n   THEME: Gradient\r\n   =================================== */\r\n\r\n.vtx-sidemenu--gradient {\r\n  background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);\r\n  --vtx-sidemenu-bg: transparent;\r\n  --vtx-sidemenu-border: rgba(255, 255, 255, 0.1);\r\n  --vtx-sidemenu-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);\r\n  \r\n  --vtx-sidemenu-item-color: rgba(255, 255, 255, 0.9);\r\n  --vtx-sidemenu-item-hover-bg: rgba(255, 255, 255, 0.1);\r\n  --vtx-sidemenu-item-active-bg: rgba(255, 255, 255, 0.2);\r\n  --vtx-sidemenu-item-active-color: #ffffff;\r\n  --vtx-sidemenu-item-icon-color: rgba(255, 255, 255, 0.7);\r\n  --vtx-sidemenu-item-icon-active-color: #ffffff;\r\n  \r\n  --vtx-sidemenu-submenu-bg: rgba(0, 0, 0, 0.1);\r\n  --vtx-sidemenu-submenu-border: rgba(255, 255, 255, 0.1);\r\n  \r\n  --vtx-sidemenu-header-border: rgba(255, 255, 255, 0.1);\r\n  --vtx-sidemenu-footer-border: rgba(255, 255, 255, 0.1);\r\n  \r\n  --vtx-sidemenu-toggle-bg: rgba(255, 255, 255, 0.1);\r\n  --vtx-sidemenu-toggle-hover-bg: rgba(255, 255, 255, 0.2);\r\n  --vtx-sidemenu-toggle-color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n/* ===================================\r\n   Responsive Adjustments\r\n   =================================== */\r\n\r\n/* Mobile Menu Button */\r\n.vtx-mobile-menu-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 44px;\r\n  height: 44px;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background-color: transparent;\r\n  color: var(--vtx-color-neutral-700, #404040);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-base, 200ms) cubic-bezier(0.4, 0, 0.2, 1);\r\n  outline: none;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-mobile-menu-button::before {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background-color: var(--vtx-color-neutral-900, #171717);\r\n  opacity: 0;\r\n  transition: opacity var(--vtx-transition-base, 200ms) cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.vtx-mobile-menu-button:hover::before {\r\n  opacity: 0.05;\r\n}\r\n\r\n.vtx-mobile-menu-button:active::before {\r\n  opacity: 0.1;\r\n}\r\n\r\n.vtx-mobile-menu-button:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.vtx-mobile-menu-button svg {\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n/* Button Variants */\r\n.vtx-mobile-menu-button--default {\r\n  background-color: var(--vtx-color-neutral-100, #f5f5f5);\r\n}\r\n\r\n.vtx-mobile-menu-button--default:hover {\r\n  background-color: var(--vtx-color-neutral-200, #e5e5e5);\r\n}\r\n\r\n.vtx-mobile-menu-button--ghost {\r\n  background-color: transparent;\r\n  border: 1px solid var(--vtx-color-neutral-300, #d4d4d4);\r\n}\r\n\r\n.vtx-mobile-menu-button--ghost:hover {\r\n  border-color: var(--vtx-color-neutral-400, #a3a3a3);\r\n  background-color: var(--vtx-color-neutral-50, #fafafa);\r\n}\r\n\r\n.vtx-mobile-menu-button--minimal {\r\n  background-color: transparent;\r\n}\r\n\r\n/* Hide on desktop by default */\r\n@media (min-width: 769px) {\r\n  .vtx-mobile-menu-button {\r\n    display: none;\r\n  }\r\n}\r\n\r\n/* Mobile: Overlay Mode */\r\n.vtx-sidemenu--mobile {\r\n  position: fixed;\r\n  left: 0;\r\n  top: 0;\r\n  z-index: var(--vtx-z-index-modal, 1200);\r\n  transform: translateX(-100%);\r\n  transition: transform var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\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));\r\n}\r\n\r\n.vtx-sidemenu--mobile.vtx-sidemenu--right {\r\n  left: auto;\r\n  right: 0;\r\n  transform: translateX(100%);\r\n}\r\n\r\n.vtx-sidemenu--mobile.vtx-sidemenu--mobile-open {\r\n  transform: translateX(0);\r\n}\r\n\r\n/* Backdrop */\r\n.vtx-sidemenu-backdrop {\r\n  position: fixed;\r\n  inset: 0;\r\n  background-color: rgba(0, 0, 0, 0.5);\r\n  z-index: calc(var(--vtx-z-index-modal, 1200) - 1);\r\n  animation: fadeIn 200ms var(--vtx-sidemenu-transition-easing);\r\n  backdrop-filter: blur(2px);\r\n  -webkit-backdrop-filter: blur(2px);\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/* Mobile Close Button */\r\n.vtx-sidemenu-mobile-close {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 40px;\r\n  height: 40px;\r\n  border-radius: var(--vtx-border-radius-lg, 0.5rem);\r\n  background-color: transparent;\r\n  border: none;\r\n  cursor: pointer;\r\n  color: var(--vtx-sidemenu-item-color);\r\n  transition: all var(--vtx-sidemenu-transition-speed) var(--vtx-sidemenu-transition-easing);\r\n  outline: none;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-sidemenu-mobile-close:hover {\r\n  background-color: var(--vtx-sidemenu-item-hover-bg);\r\n}\r\n\r\n.vtx-sidemenu-mobile-close:focus-visible {\r\n  outline: 2px solid var(--vtx-color-primary-600, #2563eb);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* Mobile: Larger touch targets */\r\n.vtx-sidemenu--mobile .vtx-sidemenu-item-content {\r\n  padding: 14px 16px;\r\n  min-height: 48px;\r\n}\r\n\r\n.vtx-sidemenu--mobile .vtx-sidemenu-item-icon {\r\n  width: 24px;\r\n  height: 24px;\r\n}\r\n\r\n.vtx-sidemenu--mobile .vtx-sidemenu-toggle {\r\n  width: 44px;\r\n  height: 44px;\r\n}\r\n\r\n.vtx-sidemenu--mobile .vtx-sidemenu-header {\r\n  min-height: 64px;\r\n  padding: var(--vtx-spacing-4, 1rem) var(--vtx-spacing-4, 1rem);\r\n}\r\n\r\n/* Desktop: Push Mode */\r\n@media (min-width: 769px) {\r\n  .vtx-sidemenu {\r\n    position: relative;\r\n    transform: none !important;\r\n  }\r\n}\r\n\r\n/* Tablet: Adjust for medium screens */\r\n@media (max-width: 1024px) and (min-width: 769px) {\r\n  .vtx-sidemenu {\r\n    width: 240px !important;\r\n  }\r\n  \r\n  .vtx-sidemenu--collapsed {\r\n    width: 64px !important;\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-sidemenu,\r\n  .vtx-sidemenu-item,\r\n  .vtx-sidemenu-toggle,\r\n  .vtx-sidemenu-item-icon,\r\n  .vtx-sidemenu-item-chevron,\r\n  .vtx-sidemenu-submenu {\r\n    transition: none;\r\n    animation: none;\r\n  }\r\n}\r\n\r\n/* High Contrast Mode */\r\n@media (prefers-contrast: high) {\r\n  .vtx-sidemenu {\r\n    border: 2px solid currentColor;\r\n  }\r\n  \r\n  .vtx-sidemenu-item--active {\r\n    outline: 2px solid currentColor;\r\n    outline-offset: -2px;\r\n  }\r\n}\r\n");const zt=({isOpen:n})=>r("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("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})}),Ct=a.forwardRef(({label:t,onClick:a,icon:o,disabled:l=!1,active:d=!1,items:c,badge:s,href:v,collapsed:x=!1,level:m=0},p)=>{const[h,u]=i(!1),g=c&&c.length>0,b=r(e,{children:n(se,{align:"center",gap:x?0:12,style:{flex:1,minWidth:0},children:[o&&r("span",{className:"vtx-sidemenu-item-icon",children:o}),!x&&n(e,{children:[r(xe,{variant:"body2",noMargin:!0,style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t}),s&&r("span",{className:"vtx-sidemenu-item-badge",children:s}),g&&r(zt,{isOpen:h})]})]})}),f=["vtx-sidemenu-item",d&&"vtx-sidemenu-item--active",l&&"vtx-sidemenu-item--disabled",g&&"vtx-sidemenu-item--has-submenu",x&&"vtx-sidemenu-item--collapsed"].filter(Boolean).join(" ");return n(e,{children:[r(v?"a":"div",{ref:p,className:f,onClick:r=>{l||(g?(r.preventDefault(),u(!h)):a&&(r.preventDefault(),a()))},onKeyDown:r=>{l||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),g?u(!h):null==a||a())},role:"menuitem",tabIndex:l?-1:0,"aria-disabled":l,"aria-expanded":g?h:void 0,href:v,title:x?t:void 0,"data-label":x?t:void 0,children:b}),g&&h&&!x&&r("div",{className:"vtx-sidemenu-submenu",children:c.map((n,e)=>r(Ct,{...n,collapsed:x,level:m+1},e))})]})});Ct.displayName="SideMenuItem";const St=a.forwardRef(({items:e,collapsed:t=!1,onCollapseToggle:a,className:o="",width:i="260px",collapsedWidth:l="80px",header:d,footer:c,headerPadding:s,footerPadding:v},x)=>{const m=t?"number"==typeof l?`${l}px`:l:"number"==typeof i?`${i}px`:i,p=["vtx-sidemenu",t&&"vtx-sidemenu--collapsed",o].filter(Boolean).join(" ");return n("aside",{ref:x,className:p,style:{width:m},role:"navigation",children:[d&&r("div",{className:"vtx-sidemenu-header",style:s?{padding:"number"==typeof s?`${s}px`:s}:void 0,children:d}),r("div",{className:"vtx-sidemenu-content",children:e.map((n,e)=>r(Ct,{...n,collapsed:t},e))}),c&&r("div",{className:"vtx-sidemenu-footer",style:v?{padding:"number"==typeof v?`${v}px`:v}:void 0,children:c})]})});St.displayName="SideMenu";const $t=gr(St);function Mt({columns:t,data:o,getRowKey:l,striped:d=!1,hoverable:c=!0,bordered:v=!1,size:x,caption:m,emptyMessage:p="No data available",emptyStateIcon:h,emptyStateDescription:g,loading:b=!1,loadingContent:f,skeletonLoader:y=!1,skeletonRows:w=5,scrollable:k=!0,maxHeight:_,onRowClick:N,isRowSelected:z,onRowSelect:C,sortable:S=!1,sortConfig:$,onSortChange:M,className:T="",containerClassName:D="",selectable:j=!1,selectedRows:I=[],onSelectionChange:L,pagination:A=!1,page:R=0,rowsPerPage:B=10,rowsPerPageOptions:E=[5,10,25,50],onPageChange:O,onRowsPerPageChange:F,dense:W=!1,expandableRows:P=!1,renderExpandedRow:H,expandedRows:V=[],onExpandRow:Y,stickyHeader:q=!1,toolbar:U,filterable:G=!1,filters:X={},onFiltersChange:K,...Q}){const{theme:J}=kn(),Z=x||J.defaultSize,[rr,nr]=i($||null),[er,tr]=i(I),[ar,or]=i(V),[ir,lr]=i(R),[dr,cr]=i(B),[sr,vr]=i(X),xr=$||rr,mr=I.length>0?I:er,pr=V.length>0?V:ar,hr=O?R:ir,ur=F?B:dr,gr=Object.keys(X).length>0?X:sr,br=r=>{if(!S)return;const n=(null==xr?void 0:xr.key)===r&&"asc"===xr.direction?"desc":"asc",e={key:r,direction:n};M?M(r,n):nr(e)},fr=u(()=>{if(!xr||!S)return o;const r=t.find(r=>r.key===xr.key),n=null==r?void 0:r.sortFn;return[...o].sort((r,e)=>{if(n)return"asc"===xr.direction?n(r,e):n(e,r);const t=r[xr.key],a=e[xr.key];if("string"==typeof t&&"string"==typeof a)return"asc"===xr.direction?t.localeCompare(a):a.localeCompare(t);if("number"==typeof t&&"number"==typeof a)return"asc"===xr.direction?t-a:a-t;const o=String(t),i=String(a);return"asc"===xr.direction?o.localeCompare(i):i.localeCompare(o)})},[o,xr,t,S]),yr=u(()=>G&&0!==Object.keys(gr).length?fr.filter(r=>Object.entries(gr).every(([n,e])=>{if(!e)return!0;const a=t.find(r=>r.key===n);if(null==a?void 0:a.filterFn)return a.filterFn(r,e);const o=r[n];return String(o||"").toLowerCase().includes(e.toLowerCase())})):fr,[fr,G,gr,t]),wr=u(()=>{if(!A)return yr;const r=hr*ur;return yr.slice(r,r+ur)},[yr,A,hr,ur]),kr=A?wr:yr,_r=s(r=>{if(!j)return;const n=r?kr.map((r,n)=>l(r,n)):[];L?L(n):tr(n)},[j,kr,l,L]),Nr=s((r,n)=>{if(!j)return;const e=n?[...mr,r]:mr.filter(n=>n!==r);L?L(e):tr(e)},[j,mr,L]),zr=j&&kr.length>0&&kr.every((r,n)=>mr.includes(l(r,n))),Cr=j&&mr.length>0&&!zr,Sr=s(r=>{if(!P)return;const n=pr.includes(r)?pr.filter(n=>n!==r):[...pr,r];Y?Y(r):or(n)},[P,pr,Y]),Mr=s(r=>{O?O(r):lr(r)},[O]),Tr=s(r=>{F?F(r):(cr(r),lr(0))},[F]),Dr=s((r,n)=>{const e={...gr,[r]:n};n||delete e[r],K?K(e):vr(e),A&&(O?O(0):lr(0))},[gr,K,A,O]),jr=["vtx-table-container",k&&"vtx-table-container--scrollable",_&&"vtx-table-container--fixed-header",q&&"vtx-table-container--sticky-header",D].filter(Boolean).join(" "),Rr=["vtx-table",`vtx-table--${Z}`,W&&"vtx-table--dense",d&&"vtx-table--striped",c&&"vtx-table--hoverable",v&&"vtx-table--bordered",(N||j)&&"vtx-table--clickable",q&&"vtx-table--sticky-header",T].filter(Boolean).join(" "),Br=(r,n,e)=>{C&&C(r,n),null==N||N(r,n,e)},Er=n=>{if(!S)return null;const e=(null==xr?void 0:xr.key)===n,t=null==xr?void 0:xr.direction;return r("span",e?{className:"vtx-table-sort-icon vtx-table-sort-icon--active",children:r("asc"===t?an:on,{size:14})}:{className:"vtx-table-sort-icon vtx-table-sort-icon--inactive",children:r(an,{size:14})})};return n("div",{className:"vtx-table-wrapper",children:[U&&r("div",{className:"vtx-table-toolbar",children:"object"==typeof U&&null!==U&&!a.isValidElement(U)&&"title"in U?n(se,{justify:"between",align:"center",style:{width:"100%"},children:[U.title&&r(xe,{variant:"h6",noMargin:!0,children:U.title}),U.actions&&r("div",{className:"vtx-table-toolbar-actions",children:U.actions})]}):r(e,{children:U})}),j&&mr.length>0&&r("div",{className:"vtx-table-selection-toolbar",children:r(se,{align:"center",gap:16,children:n(xe,{variant:"body2",noMargin:!0,children:[mr.length," selected"]})})}),r("div",{className:jr,style:{maxHeight:_},children:n("table",{className:Rr,...Q,children:[m&&r("caption",{className:"vtx-table-caption",children:m}),r("thead",{className:"vtx-table-header",children:n("tr",{children:[j&&r("th",{className:"vtx-table-header-cell vtx-table-cell--checkbox",children:r($n,{checked:zr,indeterminate:Cr,onChange:r=>_r(r.target.checked),"aria-label":"Select all rows"})}),P&&r("th",{className:"vtx-table-header-cell vtx-table-cell--expand"}),t.map(e=>{const t=S&&!1!==e.sortable,a=G&&!1!==e.filterable,o=["vtx-table-header-cell",t&&"vtx-table-header-cell--sortable",e.sticky&&`vtx-table-header-cell--sticky-${e.sticky}`,e.headerClassName].filter(Boolean).join(" ");return r("th",{className:o,style:{width:e.width,minWidth:e.minWidth,maxWidth:e.maxWidth,textAlign:e.align||"left"},"aria-sort":(null==xr?void 0:xr.key)===e.key?"asc"===xr.direction?"ascending":"descending":void 0,children:n("div",{className:"vtx-table-header-content",children:[n("div",{className:"vtx-table-header-label",onClick:()=>t&&br(e.key),onKeyDown:r=>{!t||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),br(e.key))},role:t?"button":void 0,tabIndex:t?0:void 0,style:{cursor:t?"pointer":"default"},children:[r("span",{children:e.header}),t&&Er(e.key)]}),a&&r("div",{className:"vtx-table-filter",children:r(Ln,{size:"sm",placeholder:e.filterPlaceholder||`Filter ${e.header}...`,value:gr[e.key]||"",onChange:r=>Dr(e.key,r.target.value),className:"vtx-table-filter-input"})})]})},e.key)})]})}),r("tbody",{className:"vtx-table-body",children:b?y?Array.from({length:w}).map((e,a)=>n("tr",{className:"vtx-table-row vtx-table-row--skeleton",children:[j&&r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--checkbox"})}),P&&r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--icon"})}),t.map(n=>r("td",{className:"vtx-table-cell",children:r("div",{className:"vtx-table-skeleton vtx-table-skeleton--text"})},n.key))]},`skeleton-${a}`)):r("tr",{children:r("td",{colSpan:t.length+(j?1:0)+(P?1:0),className:"vtx-table-loading",children:r("div",{className:"vtx-table-loading-content",children:f||n(e,{children:[r("div",{className:"vtx-table-spinner"}),r(xe,{size:"sm",children:"Loading..."})]})})})}):0===kr.length?r("tr",{children:r("td",{colSpan:t.length+(j?1:0)+(P?1:0),className:"vtx-table-empty",children:h||g?n("div",{className:"vtx-table-empty-state",children:[h&&r("div",{className:"vtx-table-empty-state-icon",children:h}),r("div",{className:"vtx-table-empty-state-message",children:p}),g&&r("div",{className:"vtx-table-empty-state-description",children:g})]}):p})}):kr.map((e,o)=>{const i=l(e,o),d=mr.includes(i),c=pr.includes(i),s=["vtx-table-row",d&&"vtx-table-row--selected",c&&"vtx-table-row--expanded"].filter(Boolean).join(" ");return n(a.Fragment,{children:[n("tr",{className:s,onClick:r=>{j&&!r.target.closest("input, button")||Br(e,o,r)},role:N?"button":void 0,tabIndex:N?0:void 0,"aria-selected":d,onKeyDown:r=>{!N||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),Br(e,o,r))},children:[j&&r("td",{className:"vtx-table-cell vtx-table-cell--checkbox",children:r($n,{checked:d,onChange:r=>{r.stopPropagation(),Nr(i,r.target.checked)},"aria-label":`Select row ${o+1}`})}),P&&r("td",{className:"vtx-table-cell vtx-table-cell--expand",children:r("button",{className:"vtx-table-expand-button",onClick:r=>{r.stopPropagation(),Sr(i)},"aria-label":c?"Collapse row":"Expand row","aria-expanded":c,children:r(c?Ir:$r,{size:16})})}),t.map(n=>{const t=["vtx-table-cell",n.sticky&&`vtx-table-cell--sticky-${n.sticky}`,n.className].filter(Boolean).join(" ");return r("td",{className:t,style:{textAlign:n.align||"left",width:n.width,minWidth:n.minWidth,maxWidth:n.maxWidth},children:n.render?n.render(e,o):e[n.key]},n.key)})]}),P&&c&&H&&r("tr",{className:"vtx-table-row-expanded",children:r("td",{colSpan:t.length+(j?1:0)+1,className:"vtx-table-cell-expanded",children:H(e,o)})})]},i)})})]})}),A&&r("div",{className:"vtx-table-pagination",children:n(se,{align:"center",justify:"between",style:{width:"100%"},children:[n(se,{align:"center",gap:8,children:[r(xe,{variant:"body2",textColor:"var(--color-neutral-600)",noMargin:!0,children:"Rows per page:"}),r("select",{className:"vtx-table-pagination-select",value:ur,onChange:r=>Tr(Number(r.target.value)),"aria-label":"Rows per page",children:E.map(n=>r("option",{value:n,children:n},n))})]}),n(se,{align:"center",gap:16,children:[n(xe,{variant:"body2",textColor:"var(--color-neutral-600)",noMargin:!0,children:[hr*ur+1,"–",Math.min((hr+1)*ur,yr.length)," of"," ",yr.length]}),n(se,{align:"center",gap:4,children:[r("button",{className:"vtx-table-pagination-button",onClick:()=>Mr(0),disabled:0===hr,"aria-label":"First page",title:"First page",children:r(ln,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Mr(hr-1),disabled:0===hr,"aria-label":"Previous page",title:"Previous page",children:r(Lr,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Mr(hr+1),disabled:(hr+1)*ur>=yr.length,"aria-label":"Next page",title:"Next page",children:r(Ar,{size:18})}),r("button",{className:"vtx-table-pagination-button",onClick:()=>Mr(Math.ceil(yr.length/ur)-1),disabled:(hr+1)*ur>=yr.length,"aria-label":"Last page",title:"Last page",children:r(dn,{size:18})})]})]})]})})]})}cn("/* Table Wrapper & Toolbar */\r\n.vtx-table-wrapper {\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  background-color: white;\r\n  border-radius: var(--vtx-radius-lg);\r\n  border: 1px solid var(--vtx-color-neutral-200);\r\n  overflow: hidden;\r\n}\r\n\r\n.vtx-table-toolbar {\r\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  background-color: white;\r\n}\r\n\r\n.vtx-table-toolbar-actions {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-table-selection-toolbar {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-6);\r\n  background-color: var(--vtx-color-primary-50);\r\n  border-bottom: 1px solid var(--vtx-color-primary-100);\r\n}\r\n\r\n.vtx-table-container {\r\n  width: 100%;\r\n  overflow-x: auto;\r\n}\r\n\r\n.vtx-table-container--fixed-header,\r\n.vtx-table-container--sticky-header {\r\n  overflow-y: auto;\r\n}\r\n\r\n.vtx-table {\r\n  width: 100%;\r\n  border-collapse: collapse;\r\n  font-family: var(--vtx-font-family-sans);\r\n  background-color: white;\r\n}\r\n\r\n.vtx-table-caption {\r\n  padding: var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  text-align: left;\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* Header */\r\n.vtx-table-header {\r\n  background-color: var(--vtx-color-neutral-50);\r\n  border-bottom: 2px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-table--sticky-header .vtx-table-header {\r\n  position: sticky;\r\n  top: 0;\r\n  z-index: 10;\r\n}\r\n\r\n.vtx-table-header-cell {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-sm);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  color: var(--vtx-color-neutral-700);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  white-space: nowrap;\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n\r\n.vtx-table-header-cell--sortable {\r\n  cursor: pointer;\r\n  user-select: none;\r\n  transition: background-color var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-table-header-cell--sortable:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n.vtx-table-header-content {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-table-header-label {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-1);\r\n}\r\n\r\n.vtx-table-sort-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-direction: row;\r\n}\r\n\r\n/* Body */\r\n.vtx-table-body {\r\n  background-color: white;\r\n}\r\n\r\n.vtx-table-row {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n  transition: background-color var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-table-row:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.vtx-table-row--selected {\r\n  background-color: var(--vtx-color-primary-50);\r\n}\r\n\r\n.vtx-table-row--expanded {\r\n  border-bottom: none;\r\n}\r\n\r\n.vtx-table-row-expanded {\r\n  border-bottom: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-table-row-expanded:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.vtx-table-cell-expanded {\r\n  padding: var(--vtx-spacing-4);\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n\r\n.vtx-table-cell {\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  font-size: var(--vtx-font-size-base);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-table-cell--checkbox {\r\n  width: 48px;\r\n  padding: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-table-cell--expand {\r\n  width: 48px;\r\n  padding: var(--vtx-spacing-2);\r\n}\r\n\r\n.vtx-table-expand-button {\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  border-radius: var(--vtx-radius-md);\r\n  cursor: pointer;\r\n  color: var(--vtx-color-neutral-600);\r\n  transition: all var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-table-expand-button:hover {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n/* Sizes */\r\n.vtx-table--small .vtx-table-header-cell,\r\n.vtx-table--small .vtx-table-cell {\r\n  padding: var(--vtx-spacing-2) var(--vtx-spacing-3);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n.vtx-table--large .vtx-table-header-cell,\r\n.vtx-table--large .vtx-table-cell {\r\n  padding: var(--vtx-spacing-4) var(--vtx-spacing-6);\r\n  font-size: var(--vtx-font-size-lg);\r\n}\r\n\r\n.vtx-table--dense .vtx-table-header-cell,\r\n.vtx-table--dense .vtx-table-cell {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\r\n  font-size: var(--vtx-font-size-sm);\r\n}\r\n\r\n/* Striped */\r\n.vtx-table--striped .vtx-table-row:nth-child(even) {\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n\r\n/* Hoverable */\r\n.vtx-table--hoverable .vtx-table-row:hover {\r\n  background-color: var(--vtx-color-primary-50);\r\n}\r\n\r\n.vtx-table--hoverable .vtx-table-row--selected:hover {\r\n  background-color: var(--vtx-color-primary-100);\r\n}\r\n\r\n/* Clickable */\r\n.vtx-table--clickable .vtx-table-row {\r\n  cursor: pointer;\r\n}\r\n\r\n/* Bordered */\r\n.vtx-table--bordered .vtx-table-cell,\r\n.vtx-table--bordered .vtx-table-header-cell {\r\n  border-right: 1px solid var(--vtx-color-neutral-200);\r\n}\r\n\r\n.vtx-table--bordered .vtx-table-cell:last-child,\r\n.vtx-table--bordered .vtx-table-header-cell:last-child {\r\n  border-right: none;\r\n}\r\n\r\n/* Empty state */\r\n.vtx-table-empty {\r\n  padding: var(--vtx-spacing-12) var(--vtx-spacing-4);\r\n  text-align: center;\r\n  color: var(--vtx-color-neutral-500);\r\n  font-style: italic;\r\n}\r\n\r\n.vtx-table-empty-state {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: var(--vtx-spacing-3);\r\n  padding: var(--vtx-spacing-8) var(--vtx-spacing-4);\r\n}\r\n\r\n.vtx-table-empty-state-icon {\r\n  font-size: 48px;\r\n  color: var(--vtx-color-neutral-400);\r\n  opacity: 0.6;\r\n}\r\n\r\n.vtx-table-empty-state-message {\r\n  font-size: var(--vtx-font-size-lg);\r\n  font-weight: var(--vtx-font-weight-semibold);\r\n  color: var(--vtx-color-neutral-700);\r\n  font-style: normal;\r\n}\r\n\r\n.vtx-table-empty-state-description {\r\n  font-size: var(--vtx-font-size-sm);\r\n  color: var(--vtx-color-neutral-500);\r\n  max-width: 400px;\r\n  line-height: 1.5;\r\n  font-style: normal;\r\n}\r\n\r\n/* Loading state */\r\n.vtx-table-loading,\r\n.vtx-table-empty {\r\n  padding: 0;\r\n  text-align: center;\r\n  border: none;\r\n}\r\n\r\n.vtx-table-loading-content,\r\n.vtx-table-empty-content {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: var(--vtx-spacing-4);\r\n  padding: var(--vtx-spacing-16) var(--vtx-spacing-6);\r\n  color: var(--vtx-color-neutral-600);\r\n}\r\n\r\n.vtx-table-spinner {\r\n  width: 40px;\r\n  height: 40px;\r\n  border: 3px solid var(--vtx-color-primary-100);\r\n  border-top-color: var(--vtx-color-primary-500);\r\n  border-radius: 50%;\r\n  animation: vtx-spinner-rotate 0.8s linear infinite;\r\n}\r\n\r\n@keyframes vtx-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.vtx-table-loading-spinner {\r\n  display: inline-block;\r\n  animation: vtx-spin 1s linear infinite;\r\n}\r\n\r\n/* Skeleton loader */\r\n.vtx-table-row--skeleton {\r\n  animation: vtx-pulse 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vtx-table-skeleton {\r\n  height: 16px;\r\n  background: linear-gradient(\r\n    90deg,\r\n    var(--vtx-color-neutral-200) 25%,\r\n    var(--vtx-color-neutral-100) 50%,\r\n    var(--vtx-color-neutral-200) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n  border-radius: var(--vtx-radius-sm);\r\n  animation: vtx-skeleton-shimmer 1.5s ease-in-out infinite;\r\n}\r\n\r\n.vtx-table-skeleton--text {\r\n  width: 100%;\r\n  max-width: 180px;\r\n}\r\n\r\n.vtx-table-skeleton--checkbox {\r\n  width: 16px;\r\n  height: 16px;\r\n  border-radius: var(--vtx-radius-xs);\r\n}\r\n\r\n.vtx-table-skeleton--icon {\r\n  width: 20px;\r\n  height: 20px;\r\n  border-radius: var(--vtx-radius-xs);\r\n}\r\n\r\n@keyframes vtx-skeleton-shimmer {\r\n  0% {\r\n    background-position: 200% 0;\r\n  }\r\n  100% {\r\n    background-position: -200% 0;\r\n  }\r\n}\r\n\r\n@keyframes vtx-pulse {\r\n  0%, 100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.7;\r\n  }\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/* Pagination */\r\n.vtx-table-pagination {\r\n  display: flex;\r\n  align-items: center;\r\n  padding: var(--vtx-spacing-3) var(--vtx-spacing-4);\r\n  border-top: 1px solid var(--vtx-color-neutral-200);\r\n  background-color: white;\r\n}\r\n\r\n.vtx-table-pagination-select {\r\n  padding: var(--vtx-spacing-1) var(--vtx-spacing-2);\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  color: var(--vtx-color-neutral-900);\r\n  background-color: white;\r\n  cursor: pointer;\r\n  transition: border-color var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-table-pagination-select:hover {\r\n  border-color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n.vtx-table-pagination-select:focus {\r\n  outline: none;\r\n  border-color: var(--vtx-color-primary-500);\r\n  box-shadow: 0 0 0 3px var(--vtx-color-primary-100);\r\n}\r\n\r\n.vtx-table-pagination-button {\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  border-radius: var(--vtx-radius-md);\r\n  color: var(--vtx-color-neutral-600);\r\n  cursor: pointer;\r\n  transition: all var(--vtx-transition-fast);\r\n}\r\n\r\n.vtx-table-pagination-button:hover:not(:disabled) {\r\n  background-color: var(--vtx-color-neutral-100);\r\n  color: var(--vtx-color-neutral-900);\r\n}\r\n\r\n.vtx-table-pagination-button:disabled {\r\n  opacity: 0.4;\r\n  cursor: not-allowed;\r\n}\r\n\r\n/* Sticky columns */\r\n.vtx-table-cell--sticky-left,\r\n.vtx-table-header-cell--sticky-left {\r\n  position: sticky;\r\n  left: 0;\r\n  z-index: 2;\r\n  background-color: white;\r\n  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-table-cell--sticky-right,\r\n.vtx-table-header-cell--sticky-right {\r\n  position: sticky;\r\n  right: 0;\r\n  z-index: 2;\r\n  background-color: white;\r\n  box-shadow: -2px 0 4px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.vtx-table-header-cell--sticky-left,\r\n.vtx-table-header-cell--sticky-right {\r\n  z-index: 11;\r\n  background-color: var(--vtx-color-neutral-50);\r\n}\r\n/* Dark mode */\r\n[data-theme='dark'] .vtx-table-wrapper {\r\n  background-color: var(--vtx-color-neutral-800);\r\n  border-color: var(--vtx-color-neutral-700);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table {\r\n  background-color: var(--vtx-color-neutral-800);\r\n  color: var(--vtx-color-neutral-100);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-empty-state-icon {\r\n  color: var(--vtx-color-neutral-500);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-empty-state-message {\r\n  color: var(--vtx-color-neutral-200);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-empty-state-description {\r\n  color: var(--vtx-color-neutral-400);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-skeleton {\r\n  background: linear-gradient(\r\n    90deg,\r\n    var(--vtx-color-neutral-700) 25%,\r\n    var(--vtx-color-neutral-600) 50%,\r\n    var(--vtx-color-neutral-700) 75%\r\n  );\r\n  background-size: 200% 100%;\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-cell--sticky-left,\r\n[data-theme='dark'] .vtx-table-header-cell--sticky-left,\r\n[data-theme='dark'] .vtx-table-cell--sticky-right,\r\n[data-theme='dark'] .vtx-table-header-cell--sticky-right {\r\n  background-color: var(--vtx-color-neutral-800);\r\n}\r\n\r\n[data-theme='dark'] .vtx-table-header-cell--sticky-left,\r\n[data-theme='dark'] .vtx-table-header-cell--sticky-right {\r\n  background-color: var(--vtx-color-neutral-700);\r\n}"),Mt.displayName="Table";const Tt=gr(Mt);cn("/* ==================== 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 Dt=({steps:e,currentStep:t,orientation:a="horizontal",variant:o="default",showCheckmarks:i=!0,color:l="success",size:d="md",className:c="",style:s})=>{const v=e.map(r=>"string"==typeof r?{label:r}:r),x=(n,e,t)=>n.icon?r("span",{className:"timeline-step-custom-icon",children:n.icon}):"completed"===t&&i?r("svg",{className:"timeline-step-checkmark",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:r("path",{d:"M20 6L9 17L4 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})}):r("span","numbered"===o?{className:"timeline-step-number",children:e+1}:{className:"timeline-step-dot"});return r("div",{className:`timeline timeline--${a} timeline--${o} timeline--${l} timeline--${d} ${c}`,style:s,children:v.map((e,a)=>{const o=(r=>r<t?"completed":r===t?"active":"pending")(a),i=a===v.length-1,l=!!e.onClick,d=(r=>r<t)(a);return n("div",{className:`timeline-step timeline-step--${o} ${l?"timeline-step--clickable":""}`,onClick:()=>(r=>{r.onClick&&r.onClick()})(e),children:[r("div",{className:"timeline-step-indicator",children:r("div",{className:"timeline-step-icon-wrapper",children:x(e,a,o)})}),!i&&r("div",{className:"timeline-connector "+(d?"timeline-connector--filled":"")}),n("div",{className:"timeline-step-content",children:[r(xe,{variant:"body2",weight:"active"===o?"semibold":"medium",noMargin:!0,className:"timeline-step-label",children:e.label}),e.description&&r(xe,{variant:"caption",noMargin:!0,className:"timeline-step-description",children:e.description})]})]},a)})})};Dt.displayName="Timeline";cn("/* Container Component Styles */\r\n\r\n.vtx-container {\r\n  width: 100%;\r\n  margin-left: auto;\r\n  margin-right: auto;\r\n  padding-left: var(--vtx-spacing-4);\r\n  padding-right: var(--vtx-spacing-4);\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Fluid container - 100% width */\r\n.vtx-container--fluid {\r\n  max-width: 100%;\r\n}\r\n\r\n/* Fixed max-width variants */\r\n.vtx-container--xs {\r\n  max-width: 540px;\r\n}\r\n\r\n.vtx-container--sm {\r\n  max-width: 720px;\r\n}\r\n\r\n.vtx-container--md {\r\n  max-width: 960px;\r\n}\r\n\r\n.vtx-container--lg {\r\n  max-width: 1140px;\r\n}\r\n\r\n.vtx-container--xl {\r\n  max-width: 1320px;\r\n}\r\n\r\n/* No gutters variant */\r\n.vtx-container--no-gutters {\r\n  padding-left: 0;\r\n  padding-right: 0;\r\n}\r\n\r\n/* Responsive breakpoints - Bootstrap-like behavior */\r\n@media (min-width: 576px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-4);\r\n    padding-right: var(--vtx-spacing-4);\r\n  }\r\n}\r\n\r\n@media (min-width: 768px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-6);\r\n    padding-right: var(--vtx-spacing-6);\r\n  }\r\n}\r\n\r\n@media (min-width: 992px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-6);\r\n    padding-right: var(--vtx-spacing-6);\r\n  }\r\n}\r\n\r\n@media (min-width: 1200px) {\r\n  .vtx-container--xs,\r\n  .vtx-container--sm,\r\n  .vtx-container--md,\r\n  .vtx-container--lg,\r\n  .vtx-container--xl {\r\n    padding-left: var(--vtx-spacing-8);\r\n    padding-right: var(--vtx-spacing-8);\r\n  }\r\n}\r\n\r\n/* Dark mode support */\r\n[data-theme='dark'] .vtx-container {\r\n  /* Container doesn't have background by default, so nothing to change */\r\n  /* If you want to add background colors, do it here */\r\n}\r\n");const jt=a.forwardRef(({maxWidth:n="lg",disableGutters:e=!1,fluid:t=!1,className:a="",children:o,...i},l)=>{const d=["vtx-container",t||"fluid"===n?"vtx-container--fluid":`vtx-container--${n}`,e&&"vtx-container--no-gutters",a].filter(Boolean).join(" ");return r("div",{ref:l,className:d,...i,children:o})});jt.displayName="Container";const It=gr(jt);cn("/* ==================== 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 Lt=a.forwardRef(({heading:t,items:o,showDividers:i=!1,compact:l=!1,variant:d="outlined",className:c="",style:s,...v},x)=>{const m=o.filter(r=>!r.hidden);return n($e,{variant:"flat"===d?"filled":d,className:`info-list-card ${l?"info-list-card--compact":""} ${c}`,style:s,ref:x,...v,children:[t&&n(e,{children:[r(xe,{variant:"h6",weight:"semibold",noMargin:!0,className:"info-list-card-heading",children:t}),r(Nt,{style:{margin:"12px 0 16px 0"}})]}),r("div",{className:"info-list-card-items",children:m.map((e,t)=>n(a.Fragment,{children:[n("div",{className:"info-list-card-item",children:[r("div",{className:`info-list-card-label ${e.labelClass||""}`,children:"string"==typeof e.label?r(xe,{variant:"body2",noMargin:!0,children:e.label}):e.label}),r("div",{className:`info-list-card-value ${e.valueClass||""}`,children:"string"==typeof e.value||"number"==typeof e.value?r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:e.value}):e.value})]}),i&&t<m.length-1&&r(Nt,{style:{margin:l?"8px 0":"12px 0"}})]},t))})]})});Lt.displayName="InfoListCard";const At=gr(Lt);cn(".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 Rt=a.forwardRef(({orderId:t,orderNumber:a,orderDate:o,status:i="confirmed",statusText:l,headerText:d="Order Confirmed!",headerSubtitle:c="Thank you for your order. We'll send you a confirmation email shortly.",customerEmail:s,customerPhone:v,shippingAddress:x,billingAddress:m,items:p,subtotal:h,shippingCost:u=0,tax:g=0,discount:b=0,total:f,currency:y="₹",paymentMethod:w,transactionId:k,estimatedDelivery:_,trackingNumber:N,onDownloadInvoice:z,onContinueShopping:C,onTrackOrder:S,onViewDetails:$,onContactSupport:M,onShareOrder:T,downloadInvoiceText:D="Download Invoice",continueShoppingText:j="Continue Shopping",trackOrderText:I="Track Order",viewDetailsText:L="View Details",contactSupportText:A="Contact Support",shareOrderText:R="Share",showActions:B=!0,hideDownloadInvoice:E=!1,hideContinueShopping:O=!1,hideTrackOrder:F=!1,hideContactSupport:W=!1,className:P="",style:H,...V},Y)=>{const q=e=>n("div",{className:"orderconfirmation-address",children:[r("div",{className:"orderconfirmation-address-name",children:e.name}),r("div",{children:e.addressLine1}),e.addressLine2&&r("div",{children:e.addressLine2}),n("div",{children:[e.city,", ",e.state," ",e.zipCode]}),e.phone&&n("div",{children:["Phone: ",e.phone]})]}),U=[{label:"Order Number",value:a||`#${t}`,valueClass:"value-bold"},o?{label:"Order Date",value:o}:{label:"",value:"",hidden:!0},{label:"Status",value:r(Te,{variant:(()=>{switch(i){case"confirmed":case"delivered":return"success";case"cancelled":return"error";case"processing":return"info";case"pending":return"warning";default:return"neutral"}})(),children:l||i.charAt(0).toUpperCase()+i.slice(1)})},_?{label:"Estimated Delivery",value:_,valueClass:"value-primary"}:{label:"",value:"",hidden:!0},N?{label:"Tracking Number",value:N,valueClass:"value-bold"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),G=[s?{label:"Email",value:s}:{label:"",value:"",hidden:!0},v?{label:"Phone",value:v}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),X=[w?{label:"Payment Method",value:w}:{label:"",value:"",hidden:!0},k?{label:"Transaction ID",value:k,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r("div",{className:`orderconfirmation ${P}`,style:H,ref:Y,...V,children:n(se,{direction:"column",gap:20,children:[r($e,{variant:"filled",className:"orderconfirmation-header",children:n(se,{direction:"column",align:"center",gap:12,children:[r("span",{className:"orderconfirmation-success-icon",children:r(Rr,{size:32})}),r(xe,{variant:"h4",weight:"bold",align:"center",noMargin:!0,children:d}),r(xe,{variant:"body1",align:"center",noMargin:!0,className:"orderconfirmation-subtitle",children:c}),n(Te,{variant:"success",style:{padding:"8px 20px",borderRadius:"20px",fontWeight:600,marginTop:"8px"},children:["Order ",a||`#${t}`]})]})}),r(At,{heading:"Order Details",items:U,variant:"outlined",showDividers:!0}),G.length>0&&r(At,{heading:"Customer Information",items:G,variant:"outlined",showDividers:!0}),n($e,{variant:"outlined",className:"orderconfirmation-items-card",children:[n(xe,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Order Items (",p.length,")"]}),r(se,{direction:"column",gap:12,children:p.map((e,t)=>n("div",{children:[n(se,{direction:"row",gap:12,className:"orderconfirmation-item",children:[e.image&&r("div",{className:"orderconfirmation-item-image-wrapper",children:r("img",{src:e.image,alt:e.name,className:"orderconfirmation-item-image"})}),n(se,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r(xe,{variant:"body2",weight:"medium",noMargin:!0,className:"orderconfirmation-item-name",children:e.name}),e.variant&&r(xe,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-variant",children:e.variant}),n(xe,{variant:"caption",noMargin:!0,children:["Qty: ",e.quantity]})]}),n(se,{direction:"column",align:"end",gap:2,children:[n(xe,{variant:"body2",weight:"semibold",noMargin:!0,children:[y,(e.price*e.quantity).toLocaleString()]}),n(xe,{variant:"caption",noMargin:!0,className:"orderconfirmation-item-unit-price",children:[y,e.price.toLocaleString()," each"]})]})]}),t<p.length-1&&r(Nt,{style:{margin:"12px 0"}})]},e.id))})]}),n($e,{variant:"outlined",className:"orderconfirmation-summary-card",children:[r(xe,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Payment Summary"}),n(se,{direction:"column",gap:8,children:[n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Subtotal"}),n(xe,{variant:"body2",noMargin:!0,children:[y,h.toLocaleString()]})]}),u>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Shipping"}),n(xe,{variant:"body2",noMargin:!0,children:[y,u.toLocaleString()]})]}),g>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Tax"}),n(xe,{variant:"body2",noMargin:!0,children:[y,g.toLocaleString()]})]}),b>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:"Discount"}),n(xe,{variant:"body2",noMargin:!0,className:"orderconfirmation-discount",children:["-",y,b.toLocaleString()]})]}),r(Nt,{style:{margin:"8px 0"}}),n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n(xe,{variant:"body1",weight:"bold",noMargin:!0,className:"orderconfirmation-total",children:[y,f.toLocaleString()]})]})]}),X.length>0&&n(e,{children:[r(Nt,{style:{margin:"12px 0"}}),r(se,{direction:"column",gap:8,children:X.map((e,t)=>n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:e.label}),r(xe,{variant:"body2",noMargin:!0,className:e.valueClass,children:e.value})]},t))})]})]}),n(se,{direction:"row",gap:16,wrap:"wrap",children:[r($e,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n(se,{direction:"column",gap:12,children:[n(se,{align:"center",gap:8,children:[r(Gr,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r(Nt,{}),q(x)]})}),m&&r($e,{variant:"outlined",className:"orderconfirmation-address-card",style:{flex:"1 1 280px"},children:n(se,{direction:"column",gap:12,children:[n(se,{align:"center",gap:8,children:[r(qr,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r(Nt,{}),q(m)]})})]}),B&&r($e,{variant:"outlined",className:"orderconfirmation-actions-card",children:n(se,{direction:"column",gap:16,children:[r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"What's Next?"}),r(Nt,{}),n(se,{direction:"row",gap:12,wrap:"wrap",children:[!E&&z&&r(Cn,{variant:"primary",size:"md",onClick:()=>z(t),leftIcon:r(Wr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:D}),!F&&S&&N&&r(Cn,{variant:"primary",size:"md",onClick:()=>S(t),leftIcon:r(Pr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:I})]}),n(se,{direction:"row",gap:12,wrap:"wrap",children:[!O&&C&&r(Cn,{variant:"outline",size:"md",onClick:C,leftIcon:r(Hr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:j}),$&&r(Cn,{variant:"outline",size:"md",onClick:()=>$(t),leftIcon:r(Yr,{size:18}),style:{flex:"1 1 auto",minWidth:"170px"},children:L})]}),n(se,{direction:"row",gap:12,wrap:"wrap",justify:"center",children:[!W&&M&&r(Cn,{variant:"ghost",size:"md",onClick:()=>M(t),leftIcon:r(Ur,{size:18}),children:A}),T&&r(Cn,{variant:"ghost",size:"md",onClick:()=>T(t),leftIcon:r(Vr,{size:18}),children:R})]})]})}),r($e,{variant:"filled",className:"orderconfirmation-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n(se,{direction:"column",gap:12,align:"center",children:[n(se,{align:"center",gap:8,children:[r(Ur,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r(xe,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n(se,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n(se,{align:"center",gap:6,children:[r(Ur,{size:16}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n(se,{align:"center",gap:6,children:[r(Xr,{size:16}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Rt.displayName="OrderConfirmation";const Bt=gr(Rt);cn(".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 Et=a.forwardRef(({orderId:t,orderNumber:a,orderDate:o,status:i,statusText:l,customerName:d,customerEmail:c,customerPhone:s,shippingAddress:v,billingAddress:x,items:m,subtotal:p,shippingCost:h=0,tax:u=0,discount:g=0,total:b,currency:f="₹",couponCode:y,paymentMethod:w,paymentStatus:k,transactionId:_,estimatedDelivery:N,deliveredDate:z,trackingNumber:C,trackingUrl:S,carrier:$,onDownloadInvoice:M,onTrackOrder:T,onCancelOrder:D,onReturnOrder:j,onReorder:I,onContactSupport:L,onWriteReview:A,downloadInvoiceText:R="Download Invoice",trackOrderText:B="Track Package",cancelOrderText:E="Cancel Order",returnOrderText:O="Return Items",reorderText:F="Reorder",contactSupportText:W="Contact Support",writeReviewText:P="Write Review",showActions:H=!0,allowCancel:V=!0,allowReturn:Y=!0,allowReorder:q=!0,className:U="",style:G,...X},K)=>{const Q=()=>{switch(k){case"paid":return"success";case"failed":return"error";case"pending":return"warning";case"refunded":return"info";default:return"neutral"}},J=e=>n("div",{className:"orderdetails-address",children:[r("div",{className:"orderdetails-address-name",children:e.name}),r("div",{children:e.addressLine1}),e.addressLine2&&r("div",{children:e.addressLine2}),n("div",{children:[e.city,", ",e.state," ",e.zipCode]}),e.phone&&n("div",{children:["Phone: ",e.phone]})]}),Z=V&&("pending"===i||"processing"===i),rr=Y&&"delivered"===i,nr=C&&("shipped"===i||"delivered"===i),er=[d?{label:"Name",value:d}:{label:"",value:"",hidden:!0},c?{label:"Email",value:c}:{label:"",value:"",hidden:!0},s?{label:"Phone",value:s}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden),tr=[w?{label:"Payment Method",value:w}:{label:"",value:"",hidden:!0},k?{label:"Payment Status",value:r(Te,{variant:Q(),children:k.charAt(0).toUpperCase()+k.slice(1)})}:{label:"",value:"",hidden:!0},_?{label:"Transaction ID",value:_,valueClass:"value-muted"}:{label:"",value:"",hidden:!0}].filter(r=>!r.hidden);return r("div",{className:`orderdetails ${U}`,style:G,ref:K,...X,children:n(se,{direction:"column",gap:24,children:[n(se,{direction:"column",gap:8,children:[r(xe,{variant:"h3",weight:"bold",noMargin:!0,children:"Order Details"}),n(xe,{variant:"body1",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:["Placed on ",o]})]}),r($e,{variant:"outlined",style:{padding:"32px 24px"},children:r(Dt,{steps:["Order Placed","Packed","Shipped","Delivered"],currentStep:(()=>{switch(i){case"pending":case"cancelled":case"returned":default:return 0;case"processing":case"confirmed":return 1;case"shipped":return 2;case"delivered":return 3}})(),orientation:"horizontal",variant:"circle",showCheckmarks:!0,color:"success",size:"md"})}),n(se,{direction:"row",gap:16,wrap:"wrap",children:[r($e,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(se,{direction:"column",gap:8,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Order Number"}),r(xe,{variant:"h6",weight:"bold",noMargin:!0,children:a||`#${t}`})]})}),r($e,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(se,{direction:"column",gap:8,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Status"}),r(Te,{variant:(()=>{switch(i){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:l||i.charAt(0).toUpperCase()+i.slice(1)})]})}),(z||N)&&r($e,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(se,{direction:"column",gap:8,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:z?"Delivered On":"Estimated Delivery"}),r(xe,{variant:"h6",weight:"bold",noMargin:!0,style:{color:z?"var(--vtx-color-success-600)":"inherit"},children:z||N})]})}),k&&r($e,{variant:"outlined",style:{flex:"1 1 200px",minWidth:"200px"},children:n(se,{direction:"column",gap:8,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",textTransform:"uppercase",fontSize:"0.75rem",fontWeight:600},children:"Payment"}),r(Te,{variant:Q(),style:{alignSelf:"flex-start",padding:"4px 12px"},children:k.charAt(0).toUpperCase()+k.slice(1)})]})})]}),H&&(M||nr&&T)&&n(se,{direction:"row",gap:12,wrap:"wrap",children:[M&&r(Cn,{variant:"outline",size:"md",onClick:()=>M(t),leftIcon:r(Wr,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:R}),nr&&T&&r(Cn,{variant:"primary",size:"md",onClick:()=>T(t),leftIcon:r(Pr,{size:18}),style:{flex:"1 1 auto",minWidth:"180px"},children:B})]}),(C||$)&&r($e,{variant:"outlined",children:n(se,{direction:"column",gap:12,children:[n(se,{align:"center",gap:8,children:[r(Kr,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Information"})]}),r(Nt,{}),n(se,{direction:"column",gap:12,children:[C&&n(se,{direction:"column",gap:4,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Tracking Number"}),S?r("a",{href:S,target:"_blank",rel:"noopener noreferrer",style:{color:"var(--vtx-color-primary-600)",fontWeight:600,textDecoration:"none"},children:C}):r(xe,{variant:"body2",weight:"semibold",noMargin:!0,children:C})]}),$&&n(se,{direction:"column",gap:4,children:[r(xe,{variant:"caption",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)",fontSize:"0.75rem"},children:"Carrier"}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:$})]})]})]})}),n($e,{variant:"outlined",className:"orderdetails-items-card",children:[n(xe,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:["Items (",m.length,")"]}),r(se,{direction:"column",gap:12,children:m.map((e,t)=>n("div",{children:[n(se,{direction:"row",gap:12,className:"orderdetails-item",children:[e.image&&r("div",{className:"orderdetails-item-image-wrapper",children:r("img",{src:e.image,alt:e.name,className:"orderdetails-item-image"})}),n(se,{direction:"column",gap:4,style:{flex:1,minWidth:0},children:[r(xe,{variant:"body2",weight:"medium",noMargin:!0,className:"orderdetails-item-name",children:e.name}),e.variant&&r(xe,{variant:"caption",noMargin:!0,className:"orderdetails-item-variant",children:e.variant}),n(xe,{variant:"caption",noMargin:!0,children:["Qty: ",e.quantity]})]}),n(se,{direction:"column",align:"end",gap:2,children:[n(xe,{variant:"body2",weight:"semibold",noMargin:!0,children:[f,(e.price*e.quantity).toLocaleString()]}),n(xe,{variant:"caption",noMargin:!0,className:"orderdetails-item-unit-price",children:[f,e.price.toLocaleString()," each"]})]})]}),t<m.length-1&&r(Nt,{style:{margin:"12px 0"}})]},e.id))})]}),n($e,{variant:"outlined",className:"orderdetails-summary-card",children:[r(xe,{variant:"h6",weight:"semibold",style:{marginBottom:"12px"},children:"Order Summary"}),n(se,{direction:"column",gap:8,children:[n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Subtotal"}),n(xe,{variant:"body2",noMargin:!0,children:[f,p.toLocaleString()]})]}),h>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Shipping"}),n(xe,{variant:"body2",noMargin:!0,children:[f,h.toLocaleString()]})]}),u>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:"Tax"}),n(xe,{variant:"body2",noMargin:!0,children:[f,u.toLocaleString()]})]}),y&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:"Coupon Applied"}),r(xe,{variant:"body2",noMargin:!0,className:"orderdetails-coupon",children:y})]}),g>0&&n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:"Discount"}),n(xe,{variant:"body2",noMargin:!0,className:"orderdetails-discount",children:["-",f,g.toLocaleString()]})]}),r(Nt,{style:{margin:"8px 0"}}),n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body1",weight:"bold",noMargin:!0,children:"Total"}),n(xe,{variant:"body1",weight:"bold",noMargin:!0,className:"orderdetails-total",children:[f,b.toLocaleString()]})]})]}),tr.length>0&&n(e,{children:[r(Nt,{style:{margin:"12px 0"}}),r(se,{direction:"column",gap:8,children:tr.map((e,t)=>n(se,{justify:"between",align:"center",children:[r(xe,{variant:"body2",noMargin:!0,children:e.label}),r(xe,{variant:"body2",noMargin:!0,className:e.valueClass,children:e.value})]},t))})]})]}),er.length>0&&r(At,{heading:"Customer Information",items:er,variant:"outlined",showDividers:!0}),n(se,{direction:"row",gap:16,wrap:"wrap",children:[r($e,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n(se,{direction:"column",gap:12,children:[n(se,{align:"center",gap:8,children:[r(Gr,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Shipping Address"})]}),r(Nt,{}),J(v)]})}),x&&r($e,{variant:"outlined",className:"orderdetails-address-card",style:{flex:"1 1 280px"},children:n(se,{direction:"column",gap:12,children:[n(se,{align:"center",gap:8,children:[r(qr,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Billing Address"})]}),r(Nt,{}),J(x)]})})]}),H&&r($e,{variant:"outlined",className:"orderdetails-actions-card",children:n(se,{direction:"column",gap:16,children:[r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Order Actions"}),r(Nt,{}),n(se,{direction:"row",gap:12,wrap:"wrap",children:[Z&&D&&r(Cn,{variant:"outline",size:"md",onClick:()=>D(t),leftIcon:r(Qr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px",borderColor:"var(--vtx-color-error-500)",color:"var(--vtx-color-error-600)"},children:E}),rr&&j&&r(Cn,{variant:"outline",size:"md",onClick:()=>j(t),leftIcon:r(Jr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:O}),q&&I&&r(Cn,{variant:"outline",size:"md",onClick:()=>I(t),leftIcon:r(Zr,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:F})]}),n(se,{direction:"row",gap:12,wrap:"wrap",children:["delivered"===i&&A&&r(Cn,{variant:"ghost",size:"md",onClick:()=>A(t),leftIcon:r(rn,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:P}),L&&r(Cn,{variant:"ghost",size:"md",onClick:()=>L(t),leftIcon:r(Ur,{size:18}),style:{flex:"1 1 auto",minWidth:"160px"},children:W})]})]})}),r($e,{variant:"filled",className:"orderdetails-help-card",style:{background:"var(--vtx-color-primary-50)",border:"1px solid var(--vtx-color-primary-100)"},children:n(se,{direction:"column",gap:12,align:"center",children:[n(se,{align:"center",gap:8,children:[r(Ur,{size:20}),r(xe,{variant:"h6",weight:"semibold",noMargin:!0,children:"Need Help?"})]}),r(xe,{variant:"body2",align:"center",noMargin:!0,style:{color:"var(--vtx-color-text-secondary)"},children:"Our support team is available 24/7 to assist you with your order"}),n(se,{direction:"row",gap:16,wrap:"wrap",justify:"center",style:{marginTop:"4px"},children:[n(se,{align:"center",gap:6,children:[r(Ur,{size:16}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:"support@example.com"})]}),n(se,{align:"center",gap:6,children:[r(Xr,{size:16}),r(xe,{variant:"body2",weight:"medium",noMargin:!0,children:"1-800-123-4567"})]})]})]})})]})})});Et.displayName="OrderDetails";const Ot=gr(Et);cn("/* ==================== BASE DASHBOARD CARD STYLES ==================== */\r\n\r\n.dashboard-card {\r\n  position: relative;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card--clickable {\r\n  cursor: pointer;\r\n}\r\n\r\n.dashboard-card--clickable:hover {\r\n  transform: translateY(-2px);\r\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.dashboard-card--clickable:active {\r\n  transform: translateY(0);\r\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);\r\n}\r\n\r\n/* ==================== FILLED VARIANT STYLES ==================== */\r\n\r\n/* Primary filled */\r\n.dashboard-card--filled.dashboard-card--primary {\r\n  background: linear-gradient(135deg, var(--color-primary-600, #2563eb) 0%, var(--color-primary-700, #1d4ed8) 100%);\r\n  border-color: var(--color-primary-700, #1d4ed8);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--primary .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Success filled */\r\n.dashboard-card--filled.dashboard-card--success {\r\n  background: linear-gradient(135deg, var(--color-success-600, #059669) 0%, var(--color-success-700, #047857) 100%);\r\n  border-color: var(--color-success-700, #047857);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--success .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Danger filled */\r\n.dashboard-card--filled.dashboard-card--danger {\r\n  background: linear-gradient(135deg, var(--color-danger-600, #dc2626) 0%, var(--color-danger-700, #b91c1c) 100%);\r\n  border-color: var(--color-danger-700, #b91c1c);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--danger .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Warning filled */\r\n.dashboard-card--filled.dashboard-card--warning {\r\n  background: linear-gradient(135deg, var(--color-warning-600, #d97706) 0%, var(--color-warning-700, #b45309) 100%);\r\n  border-color: var(--color-warning-700, #b45309);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--warning .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Info filled */\r\n.dashboard-card--filled.dashboard-card--info {\r\n  background: linear-gradient(135deg, var(--color-info-600, #0284c7) 0%, var(--color-info-700, #0369a1) 100%);\r\n  border-color: var(--color-info-700, #0369a1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--info .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Secondary filled */\r\n.dashboard-card--filled.dashboard-card--secondary {\r\n  background: linear-gradient(135deg, var(--color-secondary-600, #4b5563) 0%, var(--color-secondary-700, #374151) 100%);\r\n  border-color: var(--color-secondary-700, #374151);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__label,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__subtitle,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__timestamp,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__activity-label,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__comparison-label,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__detail-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__value,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__activity-value,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__user-name,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__label--order {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__activity-item:hover {\r\n  background-color: rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__user-role,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__user-department,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__detail-value {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__order-details,\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__user-metrics {\r\n  background-color: rgba(255, 255, 255, 0.15);\r\n  border-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__metric-label {\r\n  color: rgba(255, 255, 255, 0.85);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__metric-value {\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__icon {\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n  color: rgba(255, 255, 255, 1);\r\n}\r\n\r\n.dashboard-card--filled.dashboard-card--secondary .dashboard-card__avatar--filled {\r\n  background-color: rgba(255, 255, 255, 0.25);\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n}\r\n\r\n/* Filled variant hover effects */\r\n.dashboard-card--filled.dashboard-card--clickable:hover {\r\n  transform: translateY(-3px);\r\n  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);\r\n}\r\n\r\n/* ==================== TYPOGRAPHY & TEXT ==================== */\r\n\r\n.dashboard-card__label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  font-weight: 600;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  font-size: 11px;\r\n  line-height: 1.5;\r\n}\r\n\r\n.dashboard-card__value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n}\r\n\r\n.dashboard-card__subtitle {\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  line-height: 1.5;\r\n}\r\n\r\n.dashboard-card__timestamp {\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  white-space: nowrap;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n}\r\n\r\n.dashboard-card__more {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  text-align: center;\r\n  font-style: italic;\r\n  padding: 4px 0;\r\n}\r\n\r\n/* ==================== ICON WRAPPER ==================== */\r\n\r\n.dashboard-card__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border-radius: 50%;\r\n  flex-shrink: 0;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__icon--sm {\r\n  width: 36px;\r\n  height: 36px;\r\n  font-size: 16px;\r\n}\r\n\r\n.dashboard-card__icon--md {\r\n  width: 44px;\r\n  height: 44px;\r\n  font-size: 20px;\r\n}\r\n\r\n.dashboard-card__icon--lg {\r\n  width: 52px;\r\n  height: 52px;\r\n  font-size: 24px;\r\n}\r\n\r\n/* Theme variants */\r\n.dashboard-card__icon--primary {\r\n  background-color: var(--color-primary-100, #dbeafe);\r\n  color: var(--color-primary-600, #2563eb);\r\n}\r\n\r\n.dashboard-card__icon--secondary {\r\n  background-color: var(--color-secondary-100, #f3f4f6);\r\n  color: var(--color-secondary-600, #4b5563);\r\n}\r\n\r\n.dashboard-card__icon--success {\r\n  background-color: var(--color-success-100, #d1fae5);\r\n  color: var(--color-success-600, #059669);\r\n}\r\n\r\n.dashboard-card__icon--danger {\r\n  background-color: var(--color-danger-100, #fee2e2);\r\n  color: var(--color-danger-600, #dc2626);\r\n}\r\n.dashboard-card__icon--warning {\r\n  background-color: var(--color-warning-100, #fef3c7);\r\n  color: var(--color-warning-600, #d97706);\r\n}\r\n\r\n.dashboard-card__icon--info {\r\n  background-color: var(--color-info-100, #dbeafe);\r\n  color: var(--color-info-600, #0284c7);\r\n}\r\n\r\n/* ==================== TREND INDICATOR ==================== */\r\n\r\n.dashboard-card__trend {\r\n  display: inline-flex;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n  font-weight: 600;\r\n  width: fit-content;\r\n}\r\n\r\n.dashboard-card__trend--sm {\r\n  padding: 2px 6px;\r\n  font-size: 12px;\r\n}\r\n\r\n.dashboard-card__trend--md {\r\n  padding: 4px 8px;\r\n  font-size: 14px;\r\n}\r\n\r\n.dashboard-card__trend--positive {\r\n  background-color: var(--color-success-100, #d1fae5);\r\n  color: var(--color-success-700, #047857);\r\n}\r\n\r\n.dashboard-card__trend--negative {\r\n  background-color: var(--color-danger-100, #fee2e2);\r\n  color: var(--color-danger-700, #b91c1c);\r\n}\r\n\r\n.dashboard-card__trend-icon {\r\n  font-size: 14px;\r\n  font-weight: bold;\r\n}\r\n\r\n.dashboard-card__trend-value {\r\n  font-weight: 600;\r\n  color: inherit;\r\n}\r\n\r\n.dashboard-card__trend-label {\r\n  color: inherit;\r\n  opacity: 0.8;\r\n}\r\n\r\n/* ==================== PROGRESS BAR ==================== */\r\n\r\n.dashboard-card__progress-bar-container {\r\n  width: 100%;\r\n  height: 8px;\r\n  background-color: var(--color-gray-200, #e5e7eb);\r\n  border-radius: 4px;\r\n  overflow: hidden;\r\n}\r\n\r\n.dashboard-card__progress-bar {\r\n  height: 100%;\r\n  border-radius: 4px;\r\n  transition: width 0.3s ease-in-out, background-color 0.2s ease-in-out;\r\n}\r\n\r\n.dashboard-card__progress-bar--primary {\r\n  background-color: var(--color-primary-600, #2563eb);\r\n}\r\n\r\n.dashboard-card__progress-bar--secondary {\r\n  background-color: var(--color-secondary-600, #4b5563);\r\n}\r\n\r\n.dashboard-card__progress-bar--success {\r\n  background-color: var(--color-success-600, #059669);\r\n}\r\n\r\n.dashboard-card__progress-bar--danger {\r\n  background-color: var(--color-danger-600, #dc2626);\r\n}\r\n\r\n.dashboard-card__progress-bar--warning {\r\n  background-color: var(--color-warning-600, #d97706);\r\n}\r\n\r\n.dashboard-card__progress-bar--info {\r\n  background-color: var(--color-info-600, #0284c7);\r\n}\r\n\r\n.dashboard-card__progress-bar--on-track {\r\n  background-color: var(--color-success-600, #059669);\r\n}\r\n\r\n.dashboard-card__progress-bar--at-risk {\r\n  background-color: var(--color-warning-600, #d97706);\r\n}\r\n\r\n.dashboard-card__progress-bar--exceeded {\r\n  background-color: var(--color-primary-600, #2563eb);\r\n}\r\n\r\n.dashboard-card__progress-bar--behind {\r\n  background-color: var(--color-danger-600, #dc2626);\r\n}\r\n\r\n.dashboard-card__progress-values {\r\n  color: var(--color-text-secondary, #6b7280);\r\n}\r\n\r\n.dashboard-card__percentage {\r\n  font-weight: 700;\r\n}\r\n\r\n.dashboard-card__percentage--primary {\r\n  color: var(--color-primary-600, #2563eb);\r\n}\r\n\r\n.dashboard-card__percentage--success {\r\n  color: var(--color-success-600, #059669);\r\n}\r\n\r\n.dashboard-card__percentage--warning {\r\n  color: var(--color-warning-600, #d97706);\r\n}\r\n\r\n.dashboard-card__percentage--danger {\r\n  color: var(--color-danger-600, #dc2626);\r\n}\r\n\r\n/* ==================== COMPARISON CARD ==================== */\r\n\r\n.dashboard-card--comparison .dashboard-card__comparison-items {\r\n  width: 100%;\r\n}\r\n\r\n.dashboard-card__comparison-label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n}\r\n\r\n.dashboard-card__divider {\r\n  background-color: var(--color-gray-200, #e5e7eb);\r\n}\r\n\r\n.dashboard-card__divider--horizontal {\r\n  width: 1px;\r\n  min-height: 60px;\r\n}\r\n\r\n.dashboard-card__divider--vertical {\r\n  width: 100%;\r\n  height: 1px;\r\n}\r\n\r\n/* ==================== ACTIVITY CARD ==================== */\r\n\r\n/* ==================== ACTIVITY CARD ==================== */\r\n\r\n.dashboard-card--activity .dashboard-card__activity-list {\r\n  width: 100%;\r\n}\r\n\r\n.dashboard-card--compact .dashboard-card__activity-item {\r\n  padding: 12px 0;\r\n}\r\n\r\n.dashboard-card__activity-item {\r\n  padding: 16px 0;\r\n  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\r\n  border-bottom: 1px solid var(--color-gray-100, #f3f4f6);\r\n}\r\n\r\n.dashboard-card__activity-item:last-child {\r\n  border-bottom: none;\r\n  padding-bottom: 0;\r\n}\r\n\r\n.dashboard-card__activity-item:first-child {\r\n  padding-top: 0;\r\n}\r\n\r\n.dashboard-card__activity-item:hover {\r\n  opacity: 0.95;\r\n}\r\n\r\n.dashboard-card__activity-label {\r\n  color: var(--color-text-primary, #111827);\r\n  font-size: 14px;\r\n  line-height: 1.5;\r\n  font-weight: 500;\r\n}\r\n\r\n.dashboard-card__activity-status-text {\r\n  font-size: 12px;\r\n  line-height: 1.4;\r\n  text-transform: capitalize;\r\n}\r\n\r\n.dashboard-card__activity-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n  font-size: 16px;\r\n  line-height: 1.4;\r\n  white-space: nowrap;\r\n  text-align: right;\r\n}\r\n\r\n.dashboard-card__activity-value-secondary {\r\n  font-size: 12px;\r\n  line-height: 1.4;\r\n  white-space: nowrap;\r\n  text-align: right;\r\n}\r\n\r\n.dashboard-card__view-all-btn {\r\n  background: none;\r\n  border: none;\r\n  color: var(--color-primary-600, #2563eb);\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  padding: 4px 8px;\r\n  border-radius: 6px;\r\n  transition: background-color 0.15s ease;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 2px;\r\n}\r\n\r\n.dashboard-card__view-all-btn:hover {\r\n  background-color: var(--color-primary-50, #eff6ff);\r\n}\r\n\r\n.dashboard-card__view-all-btn:active {\r\n  background-color: var(--color-primary-100, #dbeafe);\r\n}\r\n\r\n/* ==================== ORDER CARD ==================== */\r\n\r\n.dashboard-card--order .dashboard-card__order-details {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n  padding: 12px 16px;\r\n  border-radius: 6px;\r\n  border: 1px solid var(--color-gray-100, #f3f4f6);\r\n}\r\n\r\n.dashboard-card__detail-label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  font-weight: 600;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n}\r\n\r\n.dashboard-card__detail-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 500;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n}\r\n\r\n/* ==================== USER CARD ==================== */\r\n\r\n.dashboard-card__user-name {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__user-role {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__user-department {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__user-metrics {\r\n  border-top: 1px solid var(--color-gray-100, #f3f4f6);\r\n  padding-top: 12px;\r\n}\r\n\r\n.dashboard-card__metric-label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  font-weight: 500;\r\n}\r\n\r\n.dashboard-card__metric-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n}\r\n\r\n.dashboard-card__avatar {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border-radius: 50%;\r\n  overflow: hidden;\r\n  background-color: var(--color-gray-200, #e5e7eb);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.dashboard-card__avatar--sm {\r\n  width: 40px;\r\n  height: 40px;\r\n}\r\n\r\n.dashboard-card__avatar--md {\r\n  width: 56px;\r\n  height: 56px;\r\n}\r\n\r\n.dashboard-card__avatar--lg {\r\n  width: 72px;\r\n  height: 72px;\r\n}\r\n\r\n.dashboard-card__avatar img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n/* ==================== REVENUE CARD ==================== */\r\n\r\n.dashboard-card--revenue .dashboard-card__value {\r\n  color: var(--color-success-600, #059669);\r\n}\r\n\r\n.dashboard-card__period {\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  font-style: italic;\r\n}\r\n\r\n.dashboard-card__breakdown {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n  padding: 12px 16px;\r\n  border-radius: 6px;\r\n  border: 1px solid var(--color-gray-100, #f3f4f6);\r\n}\r\n\r\n.dashboard-card__breakdown-label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  font-weight: 500;\r\n  font-size: 12px;\r\n}\r\n\r\n.dashboard-card__breakdown-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n}\r\n\r\n.dashboard-card__breakdown-percentage {\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  font-size: 12px;\r\n}\r\n\r\n/* ==================== ALERT CARD ==================== */\r\n\r\n.dashboard-card--alert {\r\n  border-width: 2px;\r\n}\r\n\r\n.dashboard-card--alert-error {\r\n  border-color: var(--color-danger-300, #fca5a5);\r\n  background-color: var(--color-danger-50, #fef2f2);\r\n}\r\n\r\n.dashboard-card--alert-warning {\r\n  border-color: var(--color-warning-300, #fcd34d);\r\n  background-color: var(--color-warning-50, #fffbeb);\r\n}\r\n\r\n.dashboard-card--alert-success {\r\n  border-color: var(--color-success-300, #6ee7b7);\r\n  background-color: var(--color-success-50, #f0fdf4);\r\n}\r\n\r\n.dashboard-card--alert-info {\r\n  border-color: var(--color-info-300, #7dd3fc);\r\n  background-color: var(--color-info-50, #f0f9ff);\r\n}\r\n\r\n.dashboard-card__alert-title {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n}\r\n\r\n.dashboard-card__alert-message {\r\n  color: var(--color-text-secondary, #6b7280);\r\n  line-height: 1.5;\r\n}\r\n\r\n.dashboard-card__dismiss-btn {\r\n  background: none;\r\n  border: none;\r\n  font-size: 24px;\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  cursor: pointer;\r\n  padding: 0;\r\n  width: 24px;\r\n  height: 24px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border-radius: 4px;\r\n  transition: all 0.2s ease-in-out;\r\n}\r\n\r\n.dashboard-card__dismiss-btn:hover {\r\n  background-color: var(--color-gray-100, #f3f4f6);\r\n  color: var(--color-text-primary, #111827);\r\n}\r\n\r\n.dashboard-card__action-btn {\r\n  padding: 6px 12px;\r\n  border-radius: 4px;\r\n  border: 1px solid transparent;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease-in-out;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__action-btn--primary {\r\n  background-color: var(--color-primary-600, #2563eb);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__action-btn--primary:hover {\r\n  background-color: var(--color-primary-700, #1d4ed8);\r\n}\r\n\r\n.dashboard-card__action-btn--danger {\r\n  background-color: var(--color-danger-600, #dc2626);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__action-btn--danger:hover {\r\n  background-color: var(--color-danger-700, #b91c1c);\r\n}\r\n\r\n.dashboard-card__action-btn--warning {\r\n  background-color: var(--color-warning-600, #d97706);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__action-btn--warning:hover {\r\n  background-color: var(--color-warning-700, #b45309);\r\n}\r\n\r\n.dashboard-card__action-btn--success {\r\n  background-color: var(--color-success-600, #059669);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__action-btn--success:hover {\r\n  background-color: var(--color-success-700, #047857);\r\n}\r\n\r\n.dashboard-card__action-btn--info {\r\n  background-color: var(--color-info-600, #0284c7);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__action-btn--info:hover {\r\n  background-color: var(--color-info-700, #0369a1);\r\n}\r\n\r\n/* ==================== RANKING CARD ==================== */\r\n\r\n.dashboard-card--ranking .dashboard-card__ranking-list {\r\n  width: 100%;\r\n}\r\n\r\n.dashboard-card__ranking-item {\r\n  padding: 8px;\r\n  border-radius: 4px;\r\n  transition: background-color 0.2s ease-in-out;\r\n}\r\n\r\n.dashboard-card__ranking-item:hover {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n}\r\n\r\n.dashboard-card__ranking-item--highlighted {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n}\r\n\r\n.dashboard-card__rank {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 28px;\r\n  height: 28px;\r\n  border-radius: 50%;\r\n  background-color: var(--color-gray-200, #e5e7eb);\r\n  color: var(--color-text-secondary, #6b7280);\r\n  font-weight: 700;\r\n  font-size: 14px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.dashboard-card__rank--primary {\r\n  background-color: var(--color-primary-600, #2563eb);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__rank--success {\r\n  background-color: var(--color-success-600, #059669);\r\n  color: white;\r\n}\r\n\r\n.dashboard-card__ranking-label {\r\n  color: var(--color-text-primary, #111827);\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__ranking-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 700;\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__ranking-percentage {\r\n  color: var(--color-text-tertiary, #9ca3af);\r\n  white-space: nowrap;\r\n}\r\n\r\n.dashboard-card__ranking-bar-container {\r\n  width: 100%;\r\n  height: 4px;\r\n  background-color: var(--color-gray-200, #e5e7eb);\r\n  border-radius: 2px;\r\n  overflow: hidden;\r\n}\r\n\r\n.dashboard-card__ranking-bar {\r\n  height: 100%;\r\n  background-color: var(--color-gray-400, #9ca3af);\r\n  border-radius: 2px;\r\n  transition: width 0.3s ease-in-out;\r\n}\r\n\r\n.dashboard-card__ranking-bar--primary {\r\n  background-color: var(--color-primary-600, #2563eb);\r\n}\r\n\r\n.dashboard-card__ranking-bar--success {\r\n  background-color: var(--color-success-600, #059669);\r\n}\r\n\r\n/* ==================== STATUS CARD ==================== */\r\n\r\n.dashboard-card__service-name {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n}\r\n\r\n.dashboard-card__status-info {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n  padding: 8px 12px;\r\n  border-radius: 4px;\r\n}\r\n\r\n.dashboard-card__status-metrics {\r\n  background-color: var(--color-gray-50, #f9fafb);\r\n  padding: 8px 12px;\r\n  border-radius: 4px;\r\n}\r\n\r\n.dashboard-card__metric-label {\r\n  color: var(--color-text-secondary, #6b7280);\r\n}\r\n\r\n.dashboard-card__metric-value {\r\n  color: var(--color-text-primary, #111827);\r\n  font-weight: 600;\r\n}\r\n\r\n/* ==================== METRIC CARD ==================== */\r\n\r\n.dashboard-card--metric {\r\n  min-height: 200px;\r\n}\r\n\r\n.dashboard-card__metric-icon {\r\n  width: 40px;\r\n  height: 40px;\r\n  border-radius: 10px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 20px;\r\n  flex-shrink: 0;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-icon--primary {\r\n  background: rgba(37, 99, 235, 0.1);\r\n  color: #2563eb;\r\n}\r\n\r\n.dashboard-card__metric-icon--secondary {\r\n  background: rgba(75, 85, 99, 0.1);\r\n  color: #4b5563;\r\n}\r\n\r\n.dashboard-card__metric-icon--success {\r\n  background: rgba(5, 150, 105, 0.1);\r\n  color: #059669;\r\n}\r\n\r\n.dashboard-card__metric-icon--danger {\r\n  background: rgba(220, 38, 38, 0.1);\r\n  color: #dc2626;\r\n}\r\n\r\n.dashboard-card__metric-icon--warning {\r\n  background: rgba(217, 119, 6, 0.1);\r\n  color: #d97706;\r\n}\r\n\r\n.dashboard-card__metric-icon--info {\r\n  background: rgba(2, 132, 199, 0.1);\r\n  color: #0284c7;\r\n}\r\n\r\n.dashboard-card__metric-label {\r\n  color: #6b7280;\r\n  font-weight: 500;\r\n  letter-spacing: 0.01em;\r\n}\r\n\r\n.dashboard-card__metric-trend {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  padding: 4px 8px;\r\n  border-radius: 6px;\r\n  font-weight: 600;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-trend--up {\r\n  background: rgba(5, 150, 105, 0.1);\r\n  color: #059669;\r\n}\r\n\r\n.dashboard-card__metric-trend--down {\r\n  background: rgba(220, 38, 38, 0.1);\r\n  color: #dc2626;\r\n}\r\n\r\n.dashboard-card__metric-trend-icon {\r\n  font-size: 16px;\r\n  font-weight: 700;\r\n  line-height: 1;\r\n}\r\n\r\n.dashboard-card__metric-trend-value {\r\n  font-weight: 600;\r\n  font-size: 12px;\r\n}\r\n\r\n.dashboard-card__metric-value {\r\n  font-size: 48px;\r\n  font-weight: 700;\r\n  line-height: 1.1;\r\n  letter-spacing: -0.02em;\r\n  color: #111827;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-value--sm {\r\n  font-size: 32px;\r\n}\r\n\r\n.dashboard-card__metric-value--md {\r\n  font-size: 40px;\r\n}\r\n\r\n.dashboard-card__metric-value--lg {\r\n  font-size: 48px;\r\n}\r\n\r\n.dashboard-card__metric-subtitle {\r\n  color: #6b7280;\r\n  font-weight: 400;\r\n  margin-top: 4px;\r\n}\r\n\r\n.dashboard-card__metric-comparison {\r\n  padding: 8px 12px;\r\n  background: #f9fafb;\r\n  border-radius: 8px;\r\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-comparison-label {\r\n  color: #6b7280;\r\n}\r\n\r\n.dashboard-card__metric-comparison-value {\r\n  color: #111827;\r\n}\r\n\r\n/* Metric Chart Styles */\r\n\r\n.dashboard-card__metric-chart {\r\n  width: 100%;\r\n  position: relative;\r\n  margin-top: auto;\r\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-chart-svg {\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\r\n}\r\n\r\n.dashboard-card__metric-chart-line {\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card__metric-chart-line--primary {\r\n  stroke: #2563eb;\r\n}\r\n\r\n.dashboard-card__metric-chart-line--secondary {\r\n  stroke: #4b5563;\r\n}\r\n\r\n.dashboard-card__metric-chart-line--success {\r\n  stroke: #059669;\r\n}\r\n\r\n.dashboard-card__metric-chart-line--danger {\r\n  stroke: #dc2626;\r\n}\r\n\r\n.dashboard-card__metric-chart-line--warning {\r\n  stroke: #d97706;\r\n}\r\n\r\n.dashboard-card__metric-chart-line--info {\r\n  stroke: #0284c7;\r\n}\r\n\r\n.dashboard-card__metric-chart-area {\r\n  opacity: 0.2;\r\n  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n}\r\n\r\n.dashboard-card:hover .dashboard-card__metric-chart-area {\r\n  opacity: 0.3;\r\n}\r\n\r\n.dashboard-card__metric-gradient-start {\r\n  stop-opacity: 0.4;\r\n}\r\n\r\n.dashboard-card__metric-gradient-end {\r\n  stop-opacity: 0.05;\r\n}\r\n\r\n/* Theme-specific gradients */\r\n.dashboard-card--theme-primary .dashboard-card__metric-gradient-start {\r\n  stop-color: #2563eb;\r\n}\r\n\r\n.dashboard-card--theme-secondary .dashboard-card__metric-gradient-start {\r\n  stop-color: #4b5563;\r\n}\r\n\r\n.dashboard-card--theme-success .dashboard-card__metric-gradient-start {\r\n  stop-color: #059669;\r\n}\r\n\r\n.dashboard-card--theme-danger .dashboard-card__metric-gradient-start {\r\n  stop-color: #dc2626;\r\n}\r\n\r\n.dashboard-card--theme-warning .dashboard-card__metric-gradient-start {\r\n  stop-color: #d97706;\r\n}\r\n\r\n.dashboard-card--theme-info .dashboard-card__metric-gradient-start {\r\n  stop-color: #0284c7;\r\n}\r\n\r\n.dashboard-card__metric-chart-target {\r\n  stroke: #9ca3af;\r\n  stroke-width: 1;\r\n  opacity: 0.5;\r\n}\r\n\r\n/* Bar Chart Styles */\r\n\r\n.dashboard-card__metric-chart-bars {\r\n  display: flex;\r\n  align-items: flex-end;\r\n  gap: 4px;\r\n  height: 100%;\r\n  padding: 0;\r\n}\r\n\r\n.dashboard-card__metric-chart-bar-container {\r\n  flex: 1;\r\n  height: 100%;\r\n  display: flex;\r\n  align-items: flex-end;\r\n  min-width: 2px;\r\n}\r\n\r\n.dashboard-card__metric-chart-bar {\r\n  width: 100%;\r\n  border-radius: 3px 3px 0 0;\r\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n  min-height: 2px;\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--primary {\r\n  background: linear-gradient(to top, #2563eb, #60a5fa);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--secondary {\r\n  background: linear-gradient(to top, #4b5563, #9ca3af);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--success {\r\n  background: linear-gradient(to top, #059669, #34d399);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--danger {\r\n  background: linear-gradient(to top, #dc2626, #f87171);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--warning {\r\n  background: linear-gradient(to top, #d97706, #fbbf24);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar--info {\r\n  background: linear-gradient(to top, #0284c7, #38bdf8);\r\n}\r\n\r\n.dashboard-card__metric-chart-bar-container:hover .dashboard-card__metric-chart-bar {\r\n  opacity: 0.8;\r\n  transform: scaleY(1.05);\r\n}\r\n\r\n/* Filled Variant Adjustments for Metric Card */\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-label,\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-subtitle,\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-comparison-label {\r\n  color: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-value,\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-comparison-value {\r\n  color: #ffffff;\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-icon {\r\n  background: rgba(255, 255, 255, 0.2);\r\n  color: #ffffff;\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-comparison {\r\n  background: rgba(255, 255, 255, 0.15);\r\n  backdrop-filter: blur(10px);\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-chart-line {\r\n  stroke: rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-chart-area {\r\n  opacity: 0.15;\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled:hover .dashboard-card__metric-chart-area {\r\n  opacity: 0.25;\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--filled .dashboard-card__metric-chart-target {\r\n  stroke: rgba(255, 255, 255, 0.5);\r\n}\r\n\r\n/* Hover Effects */\r\n\r\n.dashboard-card--metric.dashboard-card--clickable:hover .dashboard-card__metric-icon {\r\n  transform: scale(1.05);\r\n}\r\n\r\n.dashboard-card--metric.dashboard-card--clickable:hover .dashboard-card__metric-value {\r\n  transform: translateX(2px);\r\n}\r\n\r\n/* ==================== RESPONSIVE DESIGN ==================== */\r\n\r\n@media (max-width: 768px) {\r\n  .dashboard-card__icon--lg {\r\n    width: 40px;\r\n    height: 40px;\r\n    font-size: 20px;\r\n  }\r\n\r\n  .dashboard-card__icon--md {\r\n    width: 36px;\r\n    height: 36px;\r\n    font-size: 18px;\r\n  }\r\n\r\n  .dashboard-card--comparison.dashboard-card--horizontal .dashboard-card__comparison-items {\r\n    flex-direction: column;\r\n  }\r\n\r\n  .dashboard-card__divider--horizontal {\r\n    width: 100%;\r\n    height: 1px;\r\n    min-height: auto;\r\n  }\r\n\r\n  .dashboard-card__avatar--lg {\r\n    width: 56px;\r\n    height: 56px;\r\n  }\r\n\r\n  .dashboard-card__avatar--md {\r\n    width: 48px;\r\n    height: 48px;\r\n  }\r\n}\r\n\r\n/* ==================== LOADING STATE ==================== */\r\n\r\n.dashboard-card--loading {\r\n  opacity: 0.6;\r\n  pointer-events: none;\r\n}\r\n\r\n/* ==================== ACCESSIBILITY ==================== */\r\n\r\n.dashboard-card--clickable:focus {\r\n  outline: 2px solid var(--color-primary-500, #3b82f6);\r\n  outline-offset: 2px;\r\n}\r\n\r\n.dashboard-card__action-btn:focus,\r\n.dashboard-card__dismiss-btn:focus {\r\n  outline: 2px solid var(--color-primary-500, #3b82f6);\r\n  outline-offset: 2px;\r\n}\r\n\r\n/* ==================== DARK MODE SUPPORT (OPTIONAL) ==================== */\r\n\r\n@media (prefers-color-scheme: dark) {\r\n  .dashboard-card__label {\r\n    color: var(--color-text-secondary-dark, #9ca3af);\r\n  }\r\n\r\n  .dashboard-card__value {\r\n    color: var(--color-text-primary-dark, #f9fafb);\r\n  }\r\n\r\n  .dashboard-card__subtitle,\r\n  .dashboard-card__timestamp {\r\n    color: var(--color-text-tertiary-dark, #6b7280);\r\n  }\r\n}\r\n");const Ft=({trend:e,size:t="md"})=>{var a;const o=null!==(a=e.isPositive)&&void 0!==a?a:e.value>0,i=Math.abs(e.value);return n(se,{align:"center",gap:.5,className:`dashboard-card__trend dashboard-card__trend--${o?"positive":"negative"} dashboard-card__trend--${t}`,children:[r("span",{className:"dashboard-card__trend-icon",children:o?"↑":"↓"}),n(xe,{variant:"caption",className:"dashboard-card__trend-value",children:[i,"%"]}),e.label&&r(xe,{variant:"caption",className:"dashboard-card__trend-label",children:e.label})]})},Wt=({percentage:n,theme:e="primary",status:t})=>{const a=Math.min(Math.max(n,0),100);return r("div",{className:"dashboard-card__progress-bar-container",children:r("div",{className:`dashboard-card__progress-bar ${t?`dashboard-card__progress-bar--${t}`:`dashboard-card__progress-bar--${e}`}`,style:{width:`${a}%`}})})},Pt=({icon:n,theme:e="primary",size:t="md"})=>r("div",{className:`dashboard-card__icon dashboard-card__icon--${e} dashboard-card__icon--${t}`,children:n}),Ht=({status:n,label:e})=>r(Te,{variant:{active:"success",online:"success",delivered:"success",success:"success",pending:"warning",processing:"warning",warning:"warning","at-risk":"warning",away:"warning",degraded:"warning",cancelled:"danger",offline:"danger",error:"danger",danger:"danger",behind:"danger",shipped:"info",info:"info",maintenance:"info"}[n]||"secondary",size:"sm",children:e||n}),Vt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showIcon:v=!0,showTrend:x=!0,valueSize:m="lg",layout:p="vertical"}=t;return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--stat dashboard-card--${p} dashboard-card--${s} dashboard-card--${c} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2,children:[n(se,{align:"center",justify:"between",wrap:"nowrap",gap:2,children:[r(xe,{variant:"overline",weight:"semibold",color:"secondary",className:"dashboard-card__label",style:{flex:1},children:e.label}),v&&e.icon&&r(Pt,{icon:e.icon,theme:c,size:d})]}),n(se,{direction:"column",gap:.5,children:[r(xe,{variant:"lg"===m?"h2":"md"===m?"h3":"h4",weight:"bold",className:"dashboard-card__value",children:e.value}),e.subtitle&&r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__subtitle",children:e.subtitle})]}),x&&e.trend&&r(se,{children:r(Ft,{trend:e.trend})})]})})},Yt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showPercentage:v=!0,showValues:x=!0,progressType:m="bar",status:p}=t,h=e.current/e.target*100;return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--progress dashboard-card--${s} dashboard-card--${c} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2,children:[n(se,{align:"center",justify:"between",gap:2,children:[n(se,{direction:"column",gap:.5,style:{flex:1},children:[r(xe,{variant:"overline",weight:"semibold",className:"dashboard-card__label",children:e.label}),e.subtitle&&r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__subtitle",children:e.subtitle})]}),e.icon&&r(Pt,{icon:e.icon,theme:c,size:d})]}),n(se,{direction:"column",gap:1.5,children:["bar"===m&&r(Wt,{percentage:h,theme:c,status:p}),n(se,{align:"center",justify:"between",gap:2,children:[x&&n(xe,{variant:"body2",weight:"medium",className:"dashboard-card__progress-values",children:[e.current,e.unit&&` ${e.unit}`," / ",e.target,e.unit&&` ${e.unit}`]}),v&&n(xe,{variant:"h3",weight:"bold",className:`dashboard-card__percentage dashboard-card__percentage--${c}`,children:[Math.round(h),"%"]})]}),p&&r(se,{justify:"end",children:r(Ht,{status:p})})]})]})})},qt=({data:e,settings:t={},className:o="",style:i,onClick:l,loading:d,size:c="md"})=>{const{theme:s="primary",variant:v="outlined",layout:x="horizontal",showTrends:m=!0,showDivider:p=!0}=t;return r($e,{variant:"filled"===v?"elevated":"outlined",className:`dashboard-card dashboard-card--comparison dashboard-card--${x} dashboard-card--${v} dashboard-card--${s} ${!!l?"dashboard-card--clickable":""} ${o}`,style:i,onClick:l,children:d?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2,children:[r(xe,{variant:"overline",weight:"semibold",className:"dashboard-card__label",children:e.label}),r(se,{direction:"vertical"===x?"column":"row",gap:"vertical"===x?2:3,justify:"horizontal"===x?"between":"start",align:"horizontal"===x?"stretch":"start",className:"dashboard-card__comparison-items",children:e.items.map((t,o)=>n(a.Fragment,{children:[n(se,{direction:"column",gap:1,style:{flex:1,minWidth:0},children:[n(se,{align:"center",gap:1,children:[t.icon&&r(Pt,{icon:t.icon,theme:s,size:c}),r(xe,{variant:"caption",weight:"medium",color:"secondary",className:"dashboard-card__comparison-label",truncate:!0,children:t.label})]}),r(xe,{variant:"h3",weight:"bold",className:"dashboard-card__value",children:t.value}),m&&t.trend&&r(se,{children:r(Ft,{trend:t.trend,size:"sm"})})]}),p&&o<e.items.length-1&&r("div",{className:`dashboard-card__divider dashboard-card__divider--${x}`})]},o))})]})})},Ut=({data:t,settings:a={},className:o="",style:i,onClick:l,loading:d})=>{const{theme:c="primary",variant:s="outlined",maxItems:v=5,showTimestamps:x=!0,compact:m=!1}=a,p=t.activities.slice(0,v);return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--activity dashboard-card--${s} dashboard-card--${c} ${m?"dashboard-card--compact":""} ${!!l?"dashboard-card--clickable":""} ${o}`,style:i,onClick:l,children:d?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2.5,children:[n(se,{align:"center",justify:"between",children:[r(xe,{variant:"h6",weight:"semibold",className:"dashboard-card__label",children:t.title}),t.onViewAll&&n("button",{className:"dashboard-card__view-all-btn",onClick:r=>{var n;r.stopPropagation(),null===(n=t.onViewAll)||void 0===n||n.call(t)},children:["View All",r("span",{style:{marginLeft:4},children:"›"})]})]}),r(se,{direction:"column",gap:0,className:"dashboard-card__activity-list",children:p.map(t=>r("div",{className:"dashboard-card__activity-item",children:n(se,{align:"start",justify:"between",gap:2,children:[n(se,{align:"start",gap:1.5,style:{flex:1,minWidth:0},children:[t.status&&r(se,{style:{flexShrink:0,paddingTop:2},children:r(Ht,{status:t.status})}),n(se,{direction:"column",gap:.5,style:{flex:1,minWidth:0},children:[r(xe,{variant:"body2",weight:"medium",className:"dashboard-card__activity-label",children:t.label}),n(se,{align:"center",gap:1,children:[r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__activity-status-text",style:{textTransform:"capitalize"},children:t.status||"Pending"}),x&&t.timestamp&&n(e,{children:[r("span",{style:{color:"var(--color-text-secondary, #6b7280)",fontSize:"12px"},children:"•"}),r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__timestamp",children:t.timestamp})]})]})]})]}),t.value&&n(se,{direction:"column",align:"end",gap:.5,style:{flexShrink:0},children:[r(xe,{variant:"body2",weight:"semibold",className:"dashboard-card__activity-value",children:t.value}),r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__activity-value-secondary",children:t.value})]})]})},t.id))}),t.activities.length>v&&n(xe,{variant:"caption",color:"secondary",className:"dashboard-card__more",style:{textAlign:"center",paddingTop:4},children:["+",t.activities.length-v," more"]})]})})},Gt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showCustomer:v=!0,showItems:x=!0,showDate:m=!0,layout:p="detailed"}=t;return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--order dashboard-card--${p} dashboard-card--${s} dashboard-card--${c} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2,children:[n(se,{align:"center",justify:"between",gap:2,children:[n(se,{align:"center",gap:1,children:[e.icon&&r(Pt,{icon:e.icon,theme:c,size:d}),n(xe,{variant:"body2",weight:"medium",className:"dashboard-card__label dashboard-card__label--order",children:["Order #",e.orderId]})]}),r(Ht,{status:e.status})]}),n(se,{direction:"column",gap:1.5,children:[r(xe,{variant:"h3",weight:"bold",className:"dashboard-card__value",children:((r,n="USD")=>new Intl.NumberFormat("en-US",{style:"currency",currency:n}).format(r))(e.amount,e.currency)}),(v&&e.customer||x&&e.items||m&&e.date)&&n(se,{direction:"column",gap:.75,className:"dashboard-card__order-details",children:[v&&e.customer&&n(se,{align:"center",gap:1,children:[r(xe,{variant:"caption",weight:"medium",color:"secondary",className:"dashboard-card__detail-label",children:"Customer:"}),r(xe,{variant:"caption",className:"dashboard-card__detail-value",children:e.customer})]}),x&&e.items&&n(se,{align:"center",gap:1,children:[r(xe,{variant:"caption",weight:"medium",color:"secondary",className:"dashboard-card__detail-label",children:"Items:"}),r(xe,{variant:"caption",className:"dashboard-card__detail-value",children:e.items})]}),m&&e.date&&n(se,{align:"center",gap:1,children:[r(xe,{variant:"caption",weight:"medium",color:"secondary",className:"dashboard-card__detail-label",children:"Date:"}),r(xe,{variant:"caption",className:"dashboard-card__detail-value",children:e.date})]})]})]})]})})},Xt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showStatus:v=!0,showMetrics:x=!0,layout:m="horizontal",avatarSize:p}=t,h=p||d;return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--user dashboard-card--${m} dashboard-card--${s} dashboard-card--${c} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:2,children:[n(se,{align:"center",gap:2,children:[e.avatar&&r("div",{className:`dashboard-card__avatar dashboard-card__avatar--${h} ${"filled"===s?"dashboard-card__avatar--filled":""}`,children:e.avatar}),n(se,{direction:"column",gap:.5,style:{flex:1,minWidth:0},children:[n(se,{align:"center",gap:1,wrap:"wrap",children:[r(xe,{variant:"h4",weight:"semibold",className:"dashboard-card__user-name",truncate:!0,children:e.name}),v&&e.status&&r(Ht,{status:e.status})]}),e.role&&r(xe,{variant:"body2",color:"secondary",className:"dashboard-card__user-role",truncate:!0,children:e.role}),e.department&&r(xe,{variant:"caption",color:"secondary",className:"dashboard-card__user-department",truncate:!0,children:e.department})]})]}),x&&e.metrics&&e.metrics.length>0&&r(se,{direction:"column",gap:1,className:"dashboard-card__user-metrics",children:e.metrics.map((e,t)=>n(se,{align:"center",justify:"between",gap:2,children:[r(xe,{variant:"caption",weight:"medium",color:"secondary",className:"dashboard-card__metric-label",children:e.label}),r(xe,{variant:"body2",weight:"semibold",className:"dashboard-card__metric-value",children:e.value})]},t))})]})})},Kt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showTrend:v=!0,showBreakdown:x=!0,showPeriod:m=!0,format:p="detailed"}=t,h=(r,n="USD")=>new Intl.NumberFormat("en-US",{style:"currency",currency:n,minimumFractionDigits:0,maximumFractionDigits:0}).format(r);return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--revenue dashboard-card--${p} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:1.5,children:[n(se,{align:"center",justify:"between",children:[r(xe,{variant:"body2",className:"dashboard-card__label",children:e.label}),e.icon&&r(Pt,{icon:e.icon,theme:c,size:d})]}),n(se,{direction:"column",gap:.5,children:[r(xe,{variant:"h2",className:"dashboard-card__value",children:h(e.amount,e.currency)}),m&&e.period&&r(xe,{variant:"caption",className:"dashboard-card__period",children:e.period})]}),v&&e.trend&&r(Ft,{trend:e.trend}),x&&e.breakdown&&e.breakdown.length>0&&r(se,{direction:"column",gap:.5,className:"dashboard-card__breakdown",children:e.breakdown.map((t,a)=>n(se,{align:"center",justify:"between",children:[r(xe,{variant:"caption",className:"dashboard-card__breakdown-label",children:t.label}),n(se,{align:"center",gap:1,children:[r(xe,{variant:"body2",className:"dashboard-card__breakdown-value",children:h(t.value,e.currency)}),void 0!==t.percentage&&n(xe,{variant:"caption",className:"dashboard-card__breakdown-percentage",children:["(",t.percentage,"%)"]})]})]},a))})]})})},Qt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c,variant:s="outlined",showIcon:v=!0,showTimestamp:x=!0,dismissible:m=!1,onDismiss:p}=t,h=c||("error"===e.severity?"danger":"warning"===e.severity?"warning":"success"===e.severity?"success":"info"),u=!!i,g=`dashboard-card dashboard-card--alert dashboard-card--alert-${e.severity} ${u?"dashboard-card--clickable":""} ${a}`;return r($e,{variant:"filled"===s?"elevated":"outlined",className:g,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:1.5,children:[n(se,{align:"center",justify:"between",children:[n(se,{align:"center",gap:1,children:[v&&e.icon&&r(Pt,{icon:e.icon,theme:h,size:d}),r(xe,{variant:"h4",className:"dashboard-card__alert-title",children:e.title})]}),m&&r("button",{className:"dashboard-card__dismiss-btn",onClick:r=>{r.stopPropagation(),null==p||p()},children:"×"})]}),r(xe,{variant:"body2",className:"dashboard-card__alert-message",children:e.message}),n(se,{align:"center",justify:"between",children:[x&&e.timestamp&&r(xe,{variant:"caption",className:"dashboard-card__timestamp",children:e.timestamp}),e.actionLabel&&r("button",{className:`dashboard-card__action-btn dashboard-card__action-btn--${h}`,onClick:r=>{var n;r.stopPropagation(),null===(n=e.onAction)||void 0===n||n.call(e)},children:e.actionLabel})]})]})})},Jt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",maxItems:v=5,showPercentages:x=!0,showBars:m=!0,highlightTop:p=3}=t,h=e.items.slice(0,v),u=Math.max(...h.map(r=>"number"==typeof r.value?r.value:0));return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--ranking ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:1.5,children:[r(xe,{variant:"body2",className:"dashboard-card__label",children:e.title}),r(se,{direction:"column",gap:1,className:"dashboard-card__ranking-list",children:h.map(e=>{const t=e.rank<=p,a="number"==typeof e.value&&u>0?e.value/u*100:0;return n(se,{direction:"column",gap:.5,className:"dashboard-card__ranking-item "+(t?"dashboard-card__ranking-item--highlighted":""),children:[n(se,{align:"center",justify:"between",children:[n(se,{align:"center",gap:1,style:{flex:1,minWidth:0},children:[r("div",{className:"dashboard-card__rank "+(t?`dashboard-card__rank--${c}`:""),children:e.rank}),e.icon&&r(Pt,{icon:e.icon,theme:c,size:d}),r(xe,{variant:"body2",className:"dashboard-card__ranking-label",style:{flex:1},children:e.label})]}),n(se,{align:"center",gap:1,children:[r(xe,{variant:"h4",className:"dashboard-card__ranking-value",children:e.value}),x&&void 0!==e.percentage&&n(xe,{variant:"caption",className:"dashboard-card__ranking-percentage",children:["(",e.percentage,"%)"]})]})]}),m&&r("div",{className:"dashboard-card__ranking-bar-container",children:r("div",{className:"dashboard-card__ranking-bar "+(t?`dashboard-card__ranking-bar--${c}`:""),style:{width:`${a}%`}})})]},e.rank)})}),e.items.length>v&&n(xe,{variant:"caption",className:"dashboard-card__more",children:["+",e.items.length-v," more items"]})]})})},Zt=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showChart:v=!0,showTrend:x=!0,showComparison:m=!1,chartHeight:p=60,valueSize:h="lg"}=t,u=`dashboard-card dashboard-card--metric dashboard-card--${s} dashboard-card--theme-${c} ${!!i?"dashboard-card--clickable":""} ${a}`,g=e.chartData||[],b=v&&g.length>0,f=e.chartType||"line",y=Math.max(...g,1),w=Math.min(...g,0),k=y-w||1,_=g.map(r=>(r-w)/k*100),N=()=>{if(0===_.length)return"";const r=100/(_.length-1||1);return _.map((n,e)=>({x:e*r,y:100-n})).map((r,n)=>`${0===n?"M":"L"} ${r.x} ${r.y}`).join(" ")};return r($e,{className:u,size:d,style:o,onClick:i,padding:"lg",children:l?r(se,{direction:"column",gap:2,align:"center",justify:"center",style:{minHeight:"200px"},children:r(xe,{variant:"body2",className:"dashboard-card__loading",children:"Loading..."})}):n(se,{direction:"column",gap:2,style:{height:"100%"},children:[n(se,{align:"center",justify:"between",gap:2,children:[n(se,{align:"center",gap:1.5,children:[e.icon&&r("div",{className:`dashboard-card__metric-icon dashboard-card__metric-icon--${c}`,children:e.icon}),r(xe,{variant:"body2",className:"dashboard-card__metric-label",children:e.label})]}),x&&e.trend&&n("div",{className:"dashboard-card__metric-trend "+(e.trend.isPositive?"dashboard-card__metric-trend--up":"dashboard-card__metric-trend--down"),children:[r("span",{className:"dashboard-card__metric-trend-icon",children:e.trend.isPositive?"↑":"↓"}),n(xe,{variant:"caption",className:"dashboard-card__metric-trend-value",children:[Math.abs(e.trend.value),"%"]})]})]}),n(se,{direction:"column",gap:.5,children:[r(xe,{variant:"h1",className:`dashboard-card__metric-value dashboard-card__metric-value--${h}`,children:e.value}),e.subtitle&&r(xe,{variant:"caption",className:"dashboard-card__metric-subtitle",children:e.subtitle})]}),m&&(e.comparisonValue||e.comparisonLabel)&&n(se,{align:"center",gap:1,className:"dashboard-card__metric-comparison",children:[n(xe,{variant:"caption",className:"dashboard-card__metric-comparison-label",children:[e.comparisonLabel||"vs previous",":"]}),r(xe,{variant:"caption",weight:"semibold",className:"dashboard-card__metric-comparison-value",children:e.comparisonValue})]}),b&&r("div",{className:"dashboard-card__metric-chart",style:{height:`${p}px`},children:"line"===f?n("svg",{viewBox:"0 0 100 100",preserveAspectRatio:"none",className:`dashboard-card__metric-chart-svg dashboard-card__metric-chart-svg--${c}`,children:[r("defs",{children:n("linearGradient",{id:`gradient-${c}`,x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[r("stop",{offset:"0%",className:"dashboard-card__metric-gradient-start"}),r("stop",{offset:"100%",className:"dashboard-card__metric-gradient-end"})]})}),r("path",{d:`${N()} L 100 100 L 0 100 Z`,className:"dashboard-card__metric-chart-area",fill:`url(#gradient-${c})`}),r("path",{d:N(),className:`dashboard-card__metric-chart-line dashboard-card__metric-chart-line--${c}`,fill:"none"}),e.targetValue&&r("line",{x1:"0",y1:100-(e.targetValue-w)/k*100,x2:"100",y2:100-(e.targetValue-w)/k*100,className:"dashboard-card__metric-chart-target",strokeDasharray:"2,2"})]}):r("div",{className:"dashboard-card__metric-chart-bars",children:_.map((n,e)=>r("div",{className:"dashboard-card__metric-chart-bar-container",children:r("div",{className:`dashboard-card__metric-chart-bar dashboard-card__metric-chart-bar--${c}`,style:{height:`${n}%`}})},e))})})]})})},ra=({data:e,settings:t={},className:a="",style:o,onClick:i,loading:l,size:d="md"})=>{const{theme:c="primary",variant:s="outlined",showMetrics:v=!0,showUptime:x=!0,showLastChecked:m=!0,layout:p="detailed"}=t;return r($e,{variant:"filled"===s?"elevated":"outlined",className:`dashboard-card dashboard-card--status dashboard-card--${p} ${!!i?"dashboard-card--clickable":""} ${a}`,style:o,onClick:i,children:l?r(se,{align:"center",justify:"center",style:{minHeight:120},children:r(xe,{variant:"body2",children:"Loading..."})}):n(se,{direction:"column",gap:1.5,children:[n(se,{align:"center",justify:"between",children:[n(se,{align:"center",gap:1,children:[e.icon&&r(Pt,{icon:e.icon,theme:c,size:d}),r(xe,{variant:"h4",className:"dashboard-card__service-name",children:e.service})]}),r(Ht,{status:e.status})]}),n(se,{direction:"column",gap:.5,className:"dashboard-card__status-info",children:[x&&e.uptime&&n(se,{align:"center",gap:.5,children:[r(xe,{variant:"caption",className:"dashboard-card__detail-label",children:"Uptime:"}),r(xe,{variant:"caption",className:"dashboard-card__detail-value",children:e.uptime})]}),m&&e.lastChecked&&n(se,{align:"center",gap:.5,children:[r(xe,{variant:"caption",className:"dashboard-card__detail-label",children:"Last checked:"}),r(xe,{variant:"caption",className:"dashboard-card__detail-value",children:e.lastChecked})]})]}),v&&e.metrics&&e.metrics.length>0&&r(se,{direction:"column",gap:.5,className:"dashboard-card__status-metrics",children:e.metrics.map((e,t)=>n(se,{align:"center",justify:"between",children:[r(xe,{variant:"caption",className:"dashboard-card__metric-label",children:e.label}),r(xe,{variant:"body2",className:"dashboard-card__metric-value",children:e.value})]},t))})]})})},na=a.forwardRef((n,e)=>{const t={ref:e,className:n.className,style:n.style,onClick:n.onClick,loading:n.loading,size:n.size,variant:n.variant};switch(n.type){case"stat":return r(Vt,{...n,...t});case"progress":return r(Yt,{...n,...t});case"comparison":return r(qt,{...n,...t});case"activity":return r(Ut,{...n,...t});case"order":return r(Gt,{...n,...t});case"user":return r(Xt,{...n,...t});case"revenue":return r(Kt,{...n,...t});case"alert":return r(Qt,{...n,...t});case"ranking":return r(Jt,{...n,...t});case"metric":return r(Zt,{...n,...t});case"status":return r(ra,{...n,...t});default:return null}});na.displayName="DashboardCard";const ea=gr(na);cn("/* Navbar Base */\r\n.vtx-navbar {\r\n  position: relative;\r\n  width: 100%;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  border-bottom: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  z-index: 100;\r\n}\r\n\r\n.vtx-navbar--sticky {\r\n  position: sticky;\r\n  top: 0;\r\n}\r\n\r\n.vtx-navbar--shadow {\r\n  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\r\n}\r\n\r\n/* Top Bar */\r\n.vtx-navbar__topbar {\r\n  background-color: var(--vtx-bg-secondary, #f7fafc);\r\n  border-bottom: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  padding: 0.5rem 0;\r\n  font-size: 0.875rem;\r\n}\r\n\r\n.vtx-navbar__topbar-content {\r\n  gap: 1rem;\r\n}\r\n\r\n.vtx-navbar__topbar-left,\r\n.vtx-navbar__topbar-right {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 1rem;\r\n}\r\n\r\n/* Desktop Navbar */\r\n.vtx-navbar--desktop {\r\n  padding: 1rem 0;\r\n}\r\n\r\n.vtx-navbar__row {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 2rem;\r\n  width: 100%;\r\n}\r\n\r\n.vtx-navbar__row--top {\r\n  padding-bottom: 1rem;\r\n  border-bottom: 1px solid var(--vtx-border-color, #e2e8f0);\r\n}\r\n\r\n.vtx-navbar__row--bottom {\r\n  padding-top: 1rem;\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-navbar__row--centered {\r\n  justify-content: center;\r\n}\r\n\r\n.vtx-navbar__row-end {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 1.5rem;\r\n  margin-left: auto;\r\n}\r\n\r\n/* Logo */\r\n.vtx-navbar__logo {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.vtx-navbar__logo-image {\r\n  height: 2.5rem;\r\n  width: auto;\r\n  cursor: pointer;\r\n}\r\n\r\n.vtx-navbar__brand-text {\r\n  font-size: 1.25rem;\r\n  font-weight: 700;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  cursor: pointer;\r\n}\r\n\r\n/* Navigation */\r\n.vtx-navbar__nav {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.vtx-navbar__nav-item-wrapper {\r\n  position: relative;\r\n}\r\n\r\n.vtx-navbar__nav-item {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n  padding: 0.5rem 1rem;\r\n  font-size: 0.9375rem;\r\n  font-weight: 500;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  text-decoration: none;\r\n  background: transparent;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  cursor: pointer;\r\n  transition: all 0.15s ease-in-out;\r\n  white-space: nowrap;\r\n}\r\n\r\n.vtx-navbar__nav-item:hover:not(.vtx-navbar__nav-item--disabled) {\r\n  background-color: var(--vtx-bg-hover, #f7fafc);\r\n  color: var(--vtx-primary-500, #3182ce);\r\n}\r\n\r\n.vtx-navbar__nav-item--active {\r\n  color: var(--vtx-primary-500, #3182ce);\r\n  background-color: var(--vtx-primary-50, #ebf8ff);\r\n}\r\n\r\n.vtx-navbar__nav-item--disabled {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.vtx-navbar__nav-item-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.vtx-navbar__nav-item-arrow {\r\n  transition: transform 0.2s ease-in-out;\r\n}\r\n\r\n.vtx-navbar__nav-item-arrow--open {\r\n  transform: rotate(180deg);\r\n}\r\n\r\n/* Submenu */\r\n.vtx-navbar__submenu {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 0;\r\n  margin-top: 0.5rem;\r\n  min-width: 200px;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  border: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  box-shadow:\r\n    0 10px 15px -3px rgba(0, 0, 0, 0.1),\r\n    0 4px 6px -2px rgba(0, 0, 0, 0.05);\r\n  padding: 0.5rem;\r\n  z-index: 1000;\r\n}\r\n\r\n.vtx-navbar__submenu .vtx-navbar__nav-item {\r\n  display: flex;\r\n  width: 100%;\r\n  text-align: left;\r\n}\r\n\r\n/* Mega Menu */\r\n.vtx-navbar__megamenu {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  margin-top: 0.5rem;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  border: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  box-shadow:\r\n    0 10px 15px -3px rgba(0, 0, 0, 0.1),\r\n    0 4px 6px -2px rgba(0, 0, 0, 0.05);\r\n  padding: 1.5rem;\r\n  z-index: 1000;\r\n}\r\n\r\n.vtx-navbar__megamenu-content {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\r\n  gap: 2rem;\r\n  min-width: 600px;\r\n}\r\n\r\n.vtx-navbar__megamenu-column {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.vtx-navbar__megamenu-title {\r\n  font-size: 0.875rem;\r\n  font-weight: 700;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-bottom: 0.5rem;\r\n}\r\n\r\n.vtx-navbar__megamenu-items {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.25rem;\r\n}\r\n\r\n/* Search */\r\n.vtx-navbar__search {\r\n  flex: 0 1 400px;\r\n  max-width: 400px;\r\n}\r\n\r\n.vtx-navbar--two-row .vtx-navbar__search {\r\n  flex: 1;\r\n  max-width: 600px;\r\n}\r\n\r\n.vtx-navbar__search-input {\r\n  width: 100%;\r\n}\r\n\r\n/* Icons */\r\n.vtx-navbar__icons {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.75rem;\r\n}\r\n\r\n.vtx-navbar__icon-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0.5rem;\r\n  background: transparent;\r\n  border: none;\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  cursor: pointer;\r\n  transition: background-color 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-navbar__icon-button:hover {\r\n  background-color: var(--vtx-bg-hover, #f7fafc);\r\n}\r\n\r\n/* User */\r\n.vtx-navbar__user-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n  padding: 0.375rem 0.75rem;\r\n  background: transparent;\r\n  border: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  border-radius: var(--vtx-border-radius, 0.375rem);\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  cursor: pointer;\r\n  transition: all 0.15s ease-in-out;\r\n}\r\n\r\n.vtx-navbar__user-button:hover {\r\n  background-color: var(--vtx-bg-hover, #f7fafc);\r\n  border-color: var(--vtx-border-hover, #cbd5e0);\r\n}\r\n\r\n.vtx-navbar__user-name {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n}\r\n\r\n/* Actions */\r\n.vtx-navbar__actions {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.75rem;\r\n}\r\n\r\n/* Mobile Navbar */\r\n.vtx-navbar--mobile {\r\n  padding: 0.75rem 0;\r\n}\r\n\r\n.vtx-navbar__mobile-header {\r\n  height: 100%;\r\n}\r\n\r\n.vtx-navbar__mobile-icons {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.vtx-navbar__menu-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 0.5rem;\r\n  background: transparent;\r\n  border: none;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n  cursor: pointer;\r\n}\r\n\r\n/* Mobile Drawer */\r\n.vtx-navbar__drawer {\r\n  position: fixed;\r\n  top: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  width: 100%;\r\n  max-width: 320px;\r\n  background-color: var(--vtx-bg-primary, #ffffff);\r\n  box-shadow: -4px 0 6px -1px rgba(0, 0, 0, 0.1);\r\n  transform: translateX(100%);\r\n  transition: transform 0.3s ease-in-out;\r\n  z-index: 1000;\r\n  overflow-y: auto;\r\n}\r\n\r\n.vtx-navbar__drawer--open {\r\n  transform: translateX(0);\r\n}\r\n\r\n.vtx-navbar__drawer-content {\r\n  padding: 1.5rem;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 1.5rem;\r\n}\r\n\r\n.vtx-navbar__drawer-search {\r\n  padding-bottom: 1rem;\r\n  border-bottom: 1px solid var(--vtx-border-color, #e2e8f0);\r\n}\r\n\r\n.vtx-navbar__drawer-nav {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-navbar__mobile-nav-item-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.vtx-navbar__nav-item--mobile {\r\n  width: 100%;\r\n  justify-content: flex-start;\r\n  text-align: left;\r\n  padding: 0.75rem 1rem;\r\n}\r\n\r\n.vtx-navbar__mobile-submenu {\r\n  margin-left: 1rem;\r\n  margin-top: 0.25rem;\r\n  border-left: 2px solid var(--vtx-border-color, #e2e8f0);\r\n  padding-left: 0.5rem;\r\n}\r\n\r\n.vtx-navbar__mobile-megamenu-column {\r\n  margin-bottom: 1rem;\r\n}\r\n\r\n.vtx-navbar__mobile-megamenu-title {\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  padding: 0.5rem 1rem;\r\n}\r\n\r\n.vtx-navbar__drawer-user {\r\n  padding-top: 1rem;\r\n  border-top: 1px solid var(--vtx-border-color, #e2e8f0);\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 1rem;\r\n}\r\n\r\n.vtx-navbar__drawer-user-name {\r\n  font-size: 0.9375rem;\r\n  font-weight: 600;\r\n  color: var(--vtx-text-primary, #1a202c);\r\n}\r\n\r\n.vtx-navbar__drawer-user-email {\r\n  font-size: 0.875rem;\r\n  color: var(--vtx-text-muted, #a0aec0);\r\n}\r\n\r\n.vtx-navbar__drawer-user-menu {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0.25rem;\r\n}\r\n\r\n.vtx-navbar__drawer-actions {\r\n  padding-top: 1rem;\r\n  border-top: 1px solid var(--vtx-border-color, #e2e8f0);\r\n}\r\n\r\n/* Overlay */\r\n.vtx-navbar__overlay {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  background-color: rgba(0, 0, 0, 0.5);\r\n  z-index: 999;\r\n  animation: fadeIn 0.3s ease-in-out;\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/* Dark Mode Support */\r\n@media (prefers-color-scheme: dark) {\r\n  .vtx-navbar {\r\n    background-color: var(--vtx-bg-primary-dark, #2d3748);\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-navbar__topbar {\r\n    background-color: var(--vtx-bg-secondary-dark, #1a202c);\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-navbar__brand-text,\r\n  .vtx-navbar__nav-item {\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n\r\n  .vtx-navbar__nav-item:hover:not(.vtx-navbar__nav-item--disabled) {\r\n    background-color: var(--vtx-bg-hover-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-navbar__submenu,\r\n  .vtx-navbar__megamenu,\r\n  .vtx-navbar__drawer {\r\n    background-color: var(--vtx-bg-primary-dark, #2d3748);\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n  }\r\n\r\n  .vtx-navbar__user-button {\r\n    border-color: var(--vtx-border-color-dark, #4a5568);\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n\r\n  .vtx-navbar__icon-button {\r\n    color: var(--vtx-text-primary-dark, #f7fafc);\r\n  }\r\n}\r\n\r\n/* Responsive */\r\n@media (max-width: 768px) {\r\n  .vtx-navbar--desktop {\r\n    display: none;\r\n  }\r\n}\r\n\r\n@media (min-width: 769px) {\r\n  .vtx-navbar--mobile {\r\n    display: none;\r\n  }\r\n}\r\n");const ta=({item:t,mobile:a=!1,onItemClick:o})=>{const[l,d]=i(!1),c=t.children&&t.children.length>0,s=t.megaMenu&&t.megaMenu.length>0,v=()=>{t.onClick?(t.onClick(),null==o||o()):c||s?d(!l):t.href&&(null==o||o())},x=["vtx-navbar__nav-item",t.active&&"vtx-navbar__nav-item--active",t.disabled&&"vtx-navbar__nav-item--disabled",(c||s)&&"vtx-navbar__nav-item--with-submenu",a&&"vtx-navbar__nav-item--mobile"].filter(Boolean).join(" "),m=n(e,{children:[t.icon&&r("span",{className:"vtx-navbar__nav-item-icon",children:t.icon}),r("span",{className:"vtx-navbar__nav-item-label",children:t.label}),t.badge&&r(Te,{size:"sm",variant:t.badgeVariant||"primary",children:t.badge}),(c||s)&&r($r,{size:16,className:"vtx-navbar__nav-item-arrow "+(l?"vtx-navbar__nav-item-arrow--open":"")})]});return n("div",a?{className:"vtx-navbar__mobile-nav-item-wrapper",children:[!t.href||c||s?r("button",{className:x,onClick:v,disabled:t.disabled,children:m}):r(et,{href:t.href,className:x,onClick:v,children:m}),(c||s)&&l&&n("div",{className:"vtx-navbar__mobile-submenu",children:[c&&t.children.map((n,e)=>r(ta,{item:n,mobile:!0,onItemClick:o},e)),s&&t.megaMenu.map((e,t)=>n("div",{className:"vtx-navbar__mobile-megamenu-column",children:[e.title&&r("div",{className:"vtx-navbar__mobile-megamenu-title",children:e.title}),e.items.map((n,e)=>r(ta,{item:n,mobile:!0,onItemClick:o},e))]},t))]})]}:{className:"vtx-navbar__nav-item-wrapper",onMouseLeave:()=>d(!1),children:[!t.href||c||s?r("button",{className:x,onClick:v,onMouseEnter:()=>(c||s)&&d(!0),disabled:t.disabled,children:m}):r(et,{href:t.href,className:x,onClick:v,children:m}),c&&l&&r("div",{className:"vtx-navbar__submenu",children:t.children.map((n,e)=>r(ta,{item:n,onItemClick:()=>d(!1)},e))}),s&&l&&r("div",{className:"vtx-navbar__megamenu",children:r("div",{className:"vtx-navbar__megamenu-content",children:t.megaMenu.map((e,t)=>n("div",{className:"vtx-navbar__megamenu-column",children:[e.title&&r("div",{className:"vtx-navbar__megamenu-title",children:e.title}),r("div",{className:"vtx-navbar__megamenu-items",children:e.items.map((n,e)=>r(ta,{item:n,onItemClick:()=>d(!1)},e))})]},t))})})]})},aa=({config:e,containerized:t=!0})=>{const o=n=>n?a.isValidElement(n)?n:Array.isArray(n)?n.map((n,e)=>r(ta,{item:n},e)):n:null,i={};e.backgroundColor&&(i.backgroundColor=e.backgroundColor),e.textColor&&(i.color=e.textColor);const l=n(se,{justify:"between",align:"center",className:"vtx-navbar__topbar-content",children:[r("div",{className:"vtx-navbar__topbar-left",children:o(e.left)}),r("div",{className:"vtx-navbar__topbar-right",children:o(e.right)})]});return r("div",{className:"vtx-navbar__topbar",style:i,children:t?r(It,{children:l}):l})},oa=({logo:t,logoAlt:a="Logo",onLogoClick:o,brandText:l,navigationItems:d=[],sticky:c=!1,shadow:s=!0,backgroundColor:v,className:x="",topBar:m,user:p,search:h,searchOptions:u=[],searchGetOptionLabel:g,searchGetOptionValue:b,searchGetOptionDescription:f,searchGetOptionIcon:y,searchNoOptionsMessage:w,searchLoading:k,onSearchSelect:_,notificationCount:N,onNotificationClick:z,cartCount:C,onCartClick:S,actions:$,containerized:M=!0,layout:T="single-row"})=>{const[D,j]=i(""),I=["vtx-navbar","vtx-navbar--desktop",`vtx-navbar--${T}`,c&&"vtx-navbar--sticky",s&&"vtx-navbar--shadow",x].filter(Boolean).join(" "),L={};v&&(L.backgroundColor=v);const A=r("div",{className:"vtx-navbar__logo",children:t?r("img",{src:t,alt:a,className:"vtx-navbar__logo-image",onClick:o,style:{cursor:o?"pointer":"default"}}):l?r("span",{className:"vtx-navbar__brand-text",onClick:o,children:l}):null}),R=d.length>0&&r("nav",{className:"vtx-navbar__nav",children:d.map((n,e)=>r(ta,{item:n},e))}),B=(h||u.length>0)&&r("div",{className:"vtx-navbar__search",children:r(Nn,{placeholder:(null==h?void 0:h.placeholder)||"Search...",value:D,onChange:r=>{var n;j(r),null===(n=null==h?void 0:h.onSearch)||void 0===n||n.call(h,r)},options:u,getOptionLabel:g,getOptionValue:b,getOptionDescription:f,getOptionIcon:y,noOptionsMessage:w||"No results found",loading:k,onSelect:(r,n)=>{null==_||_(r,n),j("")},showSearchIcon:!0,clearable:!0,size:"sm",className:"vtx-navbar__search-input"})}),E=n("div",{className:"vtx-navbar__icons",children:[void 0!==N&&r("button",{className:"vtx-navbar__icon-button",onClick:z,children:r(Te,{content:N>0?String(N):"",variant:"error",size:"sm",children:r(Dr,{size:20})})}),void 0!==C&&r("button",{className:"vtx-navbar__icon-button",onClick:S,children:r(Te,{content:C>0?String(C):"",variant:"error",size:"sm",children:r(en,{size:20})})})]}),O=p&&n("button",{className:"vtx-navbar__user-button",children:[r(Ze,{src:p.avatar,alt:p.name,size:"sm"}),p.name&&r("span",{className:"vtx-navbar__user-name",children:p.name}),r($r,{size:16})]}),F=$&&r("div",{className:"vtx-navbar__actions",children:$}),W=()=>"two-row"===T?n(e,{children:[n("div",{className:"vtx-navbar__row vtx-navbar__row--top",children:[A,B,n("div",{className:"vtx-navbar__row-end",children:[E,O,F]})]}),r("div",{className:"vtx-navbar__row vtx-navbar__row--bottom",children:R})]}):n("div","centered"===T?{className:"vtx-navbar__row vtx-navbar__row--centered",children:[A,R,n("div",{className:"vtx-navbar__row-end",children:[B,E,O,F]})]}:{className:"vtx-navbar__row",children:[A,R,n("div",{className:"vtx-navbar__row-end",children:[B,E,O,F]})]});return n(e,{children:[m&&r(aa,{config:m,containerized:M}),r("div",{className:I,style:L,children:M?r(It,{children:W()}):W()})]})},ia=({logo:t,logoAlt:a="Logo",onLogoClick:o,brandText:l,navigationItems:d=[],sticky:c=!1,shadow:s=!0,backgroundColor:v,className:x="",topBar:m,user:p,search:h,searchOptions:u=[],searchGetOptionLabel:g,searchGetOptionValue:b,searchGetOptionDescription:f,searchGetOptionIcon:y,searchNoOptionsMessage:w,searchLoading:k,onSearchSelect:_,notificationCount:N,onNotificationClick:z,cartCount:C,onCartClick:S,actions:$,containerized:M=!0,isOpen:T,onOpenChange:D})=>{const[j,I]=i(!1),[L,A]=i(""),R=void 0!==T,B=R?T:j,E=()=>{R||I(!1),null==D||D(!1)},O=["vtx-navbar","vtx-navbar--mobile",c&&"vtx-navbar--sticky",s&&"vtx-navbar--shadow",x].filter(Boolean).join(" "),F={};return v&&(F.backgroundColor=v),n(e,{children:[m&&r(aa,{config:m,containerized:M}),r("div",{className:O,style:F,children:M?r(It,{children:n(se,{justify:"between",align:"center",className:"vtx-navbar__mobile-header",children:[r("div",{className:"vtx-navbar__logo",children:t?r("img",{src:t,alt:a,className:"vtx-navbar__logo-image",onClick:o}):l?r("span",{className:"vtx-navbar__brand-text",onClick:o,children:l}):null}),n("div",{className:"vtx-navbar__mobile-icons",children:[void 0!==N&&r("button",{className:"vtx-navbar__icon-button",onClick:z,children:r(Te,{content:N>0?String(N):"",variant:"error",size:"sm",children:r(Dr,{size:20})})}),void 0!==C&&r("button",{className:"vtx-navbar__icon-button",onClick:S,children:r(Te,{content:C>0?String(C):"",variant:"error",size:"sm",children:r(en,{size:20})})}),r("button",{className:"vtx-navbar__menu-button",onClick:()=>{const r=!B;R||I(r),null==D||D(r)},children:r(B?Qr:jr,{size:24})})]})]})}):r(se,{justify:"between",align:"center",className:"vtx-navbar__mobile-header"})}),r("div",{className:"vtx-navbar__drawer "+(B?"vtx-navbar__drawer--open":""),children:n("div",{className:"vtx-navbar__drawer-content",children:[(h||u.length>0)&&r("div",{className:"vtx-navbar__drawer-search",children:r(Nn,{placeholder:(null==h?void 0:h.placeholder)||"Search...",value:L,onChange:r=>{var n;A(r),null===(n=null==h?void 0:h.onSearch)||void 0===n||n.call(h,r)},options:u,getOptionLabel:g,getOptionValue:b,getOptionDescription:f,getOptionIcon:y,noOptionsMessage:w||"No results found",loading:k,onSelect:(r,n)=>{null==_||_(r,n),A(""),E()},showSearchIcon:!0,clearable:!0,fullWidth:!0,size:"md"})}),d.length>0&&r("nav",{className:"vtx-navbar__drawer-nav",children:d.map((n,e)=>r(ta,{item:n,mobile:!0,onItemClick:E},e))}),p&&n("div",{className:"vtx-navbar__drawer-user",children:[n(se,{align:"center",gap:3,children:[r(Ze,{src:p.avatar,alt:p.name,size:"md"}),n("div",{children:[p.name&&r("div",{className:"vtx-navbar__drawer-user-name",children:p.name}),p.email&&r("div",{className:"vtx-navbar__drawer-user-email",children:p.email})]})]}),p.menuItems&&p.menuItems.length>0&&r("div",{className:"vtx-navbar__drawer-user-menu",children:p.menuItems.map((n,e)=>r(ta,{item:n,mobile:!0,onItemClick:E},e))})]}),$&&r("div",{className:"vtx-navbar__drawer-actions",children:$})]})}),B&&r("div",{className:"vtx-navbar__overlay",onClick:E})]})},la=({desktopLayout:n="single-row",mobileBreakpoint:e=768,...t})=>{const[a,l]=i(!1);return o(()=>{const r=()=>{l(window.innerWidth<e)};return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[e]),a?r(ia,{...t}):r(oa,{...t,layout:n})},da=Object.assign(la,{Desktop:gr(oa),Mobile:gr(ia),Responsive:gr(la)});export{de as Accordion,le as AccordionItem,fe as ActionMenu,gt as AdminHeader,ke as Alert,Nn as Autocomplete,Ze as Avatar,Te as Badge,ot as Breadcrumb,Cn as Button,Qn as Calendar,$e as Card,$n as Checkbox,Tn as CheckboxGroup,Rn as Chip,It as Container,ea as DashboardCard,kt as DataGrid,ne as DatePicker,ie as DateRangePicker,Nt as Divider,se as Flex,jn as FormControl,Ie as Grid,da as Header,Re as InfoCard,At as InfoListCard,Pe as InfoText,Ln as Input,et as Link,ue as Menu,pe as MenuItem,Ne as Modal,En as MultiSelect,da as Navbar,Ke as OrderCard,Bt as OrderConfirmation,Ot as OrderDetails,Ue as ProductCard,Fn as Radio,Pn as RadioGroup,Vn as RichTextEditor,qn as Select,$t as SideMenu,Ct as SideMenuItem,Tt as Table,xe as Text,Gn as Textarea,wn as ThemeProvider,Dt as Timeline,xn as Toast,fn as ToastContainer,ze as Tooltip,xt as Widget,wr as createCustomTokens,kr as generateCSSVariables,br as generateColorShades,_r as injectCSSVariables,fr as normalizeColors,gn as toast,yr as tokens,tr as useBodyScrollLock,rr as useClickOutside,ir as useDebounce,er as useEscapeKey,nr as useFocusTrap,or as useId,kn as useThemeContext,pn as useToast};
 //# sourceMappingURL=index.esm.js.map