@wealthx/shadcn 1.3.1 → 1.3.3

package/dist/components/ui/opportunity-summary-tab.js

@@ -62,13 +62,12 @@ __export(opportunity_summary_tab_exports, {
   OpportunitySummaryTab: () => OpportunitySummaryTab
 });
 module.exports = __toCommonJS(opportunity_summary_tab_exports);
+var React10 = __toESM(require("react"));
 var import_react4 = require("react");
 var import_lucide_react12 = require("lucide-react");
 
-// src/components/ui/button.tsx
-var import_react = require("react");
+// src/components/ui/badge.tsx
 var import_class_variance_authority = require("class-variance-authority");
-var import_lucide_react = require("lucide-react");
 
 // src/lib/utils.ts
 var import_clsx = require("clsx");
@@ -156,9 +155,213 @@ var Slot = React.forwardRef(
 );
 Slot.displayName = "Slot";
 
-// src/components/ui/button.tsx
+// src/components/ui/badge.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
-var buttonVariants = (0, import_class_variance_authority.cva)(
+var badgeVariants = (0, import_class_variance_authority.cva)(
+  "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2.5 py-0.5 text-xs font-medium font-sans whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
+  {
+    variants: {
+      variant: {
+        default: "border-primary/40 bg-primary/10 text-foreground [a&]:hover:bg-primary/15",
+        secondary: "border-border bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
+        destructive: "border-destructive/40 bg-destructive/10 text-destructive-text focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/15",
+        success: "border-success/40 bg-success/10 text-success-text [a&]:hover:bg-success/15",
+        warning: "border-warning/40 bg-warning/10 text-warning-text [a&]:hover:bg-warning/15",
+        info: "border-info/40 bg-info/10 text-info-text [a&]:hover:bg-info/15",
+        outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 [a&]:hover:underline"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge(_a) {
+  var _b = _a, {
+    className,
+    variant = "default",
+    asChild = false
+  } = _b, props = __objRest(_b, [
+    "className",
+    "variant",
+    "asChild"
+  ]);
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Comp,
+    __spreadValues({
+      className: cn(badgeVariants({ variant }), className),
+      "data-slot": "badge",
+      "data-variant": variant
+    }, props)
+  );
+}
+
+// src/components/ui/select.tsx
+var import_lucide_react = require("lucide-react");
+var import_select = require("@base-ui/react/select");
+
+// src/lib/theme-provider.tsx
+var import_react = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var ThemeVarsContext = (0, import_react.createContext)({});
+function useThemeVars() {
+  return (0, import_react.useContext)(ThemeVarsContext);
+}
+
+// src/components/ui/select.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Select(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Root, __spreadValues({ "data-slot": "select" }, props));
+}
+function SelectValue(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Value, __spreadValues({ "data-slot": "select-value" }, props));
+}
+function SelectTrigger(_a) {
+  var _b = _a, {
+    className,
+    size = "default",
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "size",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    import_select.Select.Trigger,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "flex w-fit items-center justify-between gap-2 border border-input bg-transparent px-3 py-2 text-body-medium whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20 data-popup-open:border-primary data-popup-open:ring-[3px] data-popup-open:ring-primary/20 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-placeholder:font-normal data-placeholder:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+        className
+      ),
+      "data-size": size,
+      "data-slot": "select-trigger"
+    }, props), {
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Icon, { className: "transition-transform duration-200 data-popup-open:rotate-180", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ChevronDownIcon, { className: "size-4 opacity-50" }) })
+      ]
+    })
+  );
+}
+function SelectContent(_a) {
+  var _b = _a, {
+    className,
+    children,
+    style
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children",
+    "style"
+  ]);
+  const themeVars = useThemeVars();
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_select.Select.Positioner,
+    {
+      className: "z-[200]",
+      align: "start",
+      alignItemWithTrigger: false,
+      sideOffset: 4,
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+        import_select.Select.Popup,
+        __spreadProps(__spreadValues({
+          className: cn(
+            "relative max-h-[var(--available-height)] min-w-[var(--anchor-width,8rem)] overflow-x-hidden overflow-y-auto border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
+            className
+          ),
+          "data-slot": "select-content",
+          style: __spreadValues(__spreadValues({}, themeVars), style)
+        }, props), {
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectScrollUpButton, {}),
+            children,
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectScrollDownButton, {})
+          ]
+        })
+      )
+    }
+  ) });
+}
+function SelectItem(_a) {
+  var _b = _a, {
+    className,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    import_select.Select.Item,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "relative flex w-full cursor-default items-center gap-2 py-1.5 pr-8 pl-2 text-body-small outline-hidden select-none data-highlighted:bg-primary/5 data-highlighted:text-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      ),
+      "data-slot": "select-item"
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "span",
+          {
+            className: "absolute right-2 flex size-3.5 items-center justify-center",
+            "data-slot": "select-item-indicator",
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.CheckIcon, { className: "size-4" }) })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.ItemText, { children })
+      ]
+    })
+  );
+}
+function SelectScrollUpButton(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_select.Select.ScrollUpArrow,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "flex cursor-default items-center justify-center py-1",
+        className
+      ),
+      "data-slot": "select-scroll-up-button"
+    }, props), {
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ChevronUpIcon, { className: "size-4" })
+    })
+  );
+}
+function SelectScrollDownButton(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_select.Select.ScrollDownArrow,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "flex cursor-default items-center justify-center py-1",
+        className
+      ),
+      "data-slot": "select-scroll-down-button"
+    }, props), {
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ChevronDownIcon, { className: "size-4" })
+    })
+  );
+}
+
+// src/components/ui/button.tsx
+var import_react2 = require("react");
+var import_class_variance_authority2 = require("class-variance-authority");
+var import_lucide_react2 = require("lucide-react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var buttonVariants = (0, import_class_variance_authority2.cva)(
   "inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 font-sans text-button whitespace-nowrap transition-all active:scale-[0.98] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
     variants: {
@@ -166,9 +369,9 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
         default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
         secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
         destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
-        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground focus-visible:ring-border/50 dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground focus-visible:border-border focus-visible:ring-border/50 dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
         "outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
-        "outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:ring-brand-secondary/30",
+        "outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:border-brand-secondary focus-visible:ring-brand-secondary/30",
         ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs focus-visible:ring-border/50 dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline"
       },
@@ -189,7 +392,7 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
     }
   }
 );
-var Button = (0, import_react.forwardRef)(function Button2(_a, ref) {
+var Button = (0, import_react2.forwardRef)(function Button2(_a, ref) {
   var _b = _a, {
     className,
     variant,
@@ -211,7 +414,7 @@ var Button = (0, import_react.forwardRef)(function Button2(_a, ref) {
   ]);
   const Comp = asChild ? Slot : "button";
   const isIconOnly = size === "icon" || size === "icon-xs" || size === "icon-sm" || size === "icon-lg";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     Comp,
     __spreadProps(__spreadValues({
       className: cn(buttonVariants({ variant, size, className })),
@@ -222,14 +425,55 @@ var Button = (0, import_react.forwardRef)(function Button2(_a, ref) {
       ref,
       type
     }, props), {
-      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Loader2, { "aria-hidden": "true", className: "animate-spin" }),
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.Loader2, { "aria-hidden": "true", className: "animate-spin" }),
         !isIconOnly && children
       ] }) : children
     })
   );
 });
 
+// src/components/ui/checkbox.tsx
+var import_react3 = require("react");
+var import_lucide_react3 = require("lucide-react");
+var import_checkbox = require("@base-ui/react/checkbox");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function Checkbox(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_checkbox.Checkbox.Root,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "peer group inline-flex size-4 shrink-0 border border-input shadow-xs transition-all outline-none",
+        "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        "aria-invalid:border-destructive aria-invalid:ring-destructive/20",
+        "data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground",
+        "data-indeterminate:border-primary data-indeterminate:bg-primary data-indeterminate:text-primary-foreground",
+        // Dark mode (upstream shadcn)
+        "dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-checked:bg-primary",
+        // Stacked (2 attr selectors) → wins over single-attr rules above
+        "aria-invalid:data-checked:border-destructive aria-invalid:data-checked:bg-destructive aria-invalid:data-checked:text-destructive-foreground",
+        "aria-invalid:data-indeterminate:border-destructive aria-invalid:data-indeterminate:bg-destructive aria-invalid:data-indeterminate:text-destructive-foreground",
+        className
+      ),
+      "data-slot": "checkbox"
+    }, props), {
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        import_checkbox.Checkbox.Indicator,
+        {
+          className: "grid place-content-center text-current transition-none",
+          "data-slot": "checkbox-indicator",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.CheckIcon, { className: "size-3.5 group-data-indeterminate:hidden" }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react3.MinusIcon, { className: "size-3.5 hidden group-data-indeterminate:block" })
+          ]
+        }
+      )
+    })
+  );
+}
+
 // src/lib/format-currency.ts
 function formatCurrency(value, options) {
   const { decimals = 0, showSign = false } = options != null ? options : {};
@@ -256,9 +500,9 @@ var PROPERTY_ASSET_TYPES = /* @__PURE__ */ new Set([
 ]);
 
 // src/components/ui/tabs.tsx
-var import_class_variance_authority2 = require("class-variance-authority");
+var import_class_variance_authority3 = require("class-variance-authority");
 var import_tabs = require("@base-ui/react/tabs");
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function Tabs(_a) {
   var _b = _a, {
     className,
@@ -267,7 +511,7 @@ function Tabs(_a) {
     "className",
     "orientation"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     import_tabs.Tabs.Root,
     __spreadValues({
       className: cn(
@@ -279,7 +523,7 @@ function Tabs(_a) {
     }, props)
   );
 }
-var tabsListVariants = (0, import_class_variance_authority2.cva)(
+var tabsListVariants = (0, import_class_variance_authority3.cva)(
   "group/tabs-list inline-flex w-fit items-center justify-center gap-1 rounded-none p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col",
   {
     variants: {
@@ -301,7 +545,7 @@ function TabsList(_a) {
     "className",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     import_tabs.Tabs.List,
     __spreadValues({
       className: cn(tabsListVariants({ variant }), className),
@@ -312,7 +556,7 @@ function TabsList(_a) {
 }
 function TabsTrigger(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     import_tabs.Tabs.Tab,
     __spreadValues({
       className: cn(
@@ -349,7 +593,7 @@ function TabsTrigger(_a) {
 }
 function TabsContent(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     import_tabs.Tabs.Panel,
     __spreadValues({
       className: cn("flex-1 outline-none", className),
@@ -359,17 +603,17 @@ function TabsContent(_a) {
 }
 
 // src/components/ui/financial-primitives.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var NO_DATA = "\u2014";
 function FinancialSectionLabel({
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-small uppercase text-muted-foreground", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-small uppercase text-muted-foreground", children });
 }
 function FinancialSubsectionTitle({
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-medium uppercase text-foreground", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-medium uppercase text-foreground", children });
 }
 function FinancialDetailField({
   label,
@@ -377,13 +621,13 @@ function FinancialDetailField({
   variant = "caption"
 }) {
   if (variant === "footer") {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex flex-col justify-between min-w-0", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-overline text-muted-foreground", children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-medium text-foreground mt-1 break-words", children: value != null ? value : NO_DATA })
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col justify-between min-w-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-overline text-muted-foreground", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-medium text-foreground mt-1 break-words", children: value != null ? value : NO_DATA })
     ] });
   }
   const labelClass = variant === "caption" ? "block min-h-[2rem] text-caption text-muted-foreground" : "min-h-[1.75rem] text-overline text-muted-foreground";
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
     "div",
     {
       className: cn(
@@ -391,8 +635,8 @@ function FinancialDetailField({
         variant === "overline" && "flex flex-col gap-0.5"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: labelClass, children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-medium text-foreground break-words", children: value != null ? value : NO_DATA })
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: labelClass, children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-medium text-foreground break-words", children: value != null ? value : NO_DATA })
       ]
     }
   );
@@ -402,9 +646,9 @@ function FinancialLineItem({
   value,
   destructive
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center justify-between gap-4 py-0.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-body-small text-foreground", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between gap-4 py-0.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-body-small text-foreground", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "span",
       {
         className: cn(
@@ -436,12 +680,12 @@ function FinancialLvrBar({
     warning: "bg-warning",
     destructive: "bg-destructive"
   }[color];
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-body-small text-muted-foreground", children: "LVR" }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: cn("text-label-medium", textClass), children: label })
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-body-small text-muted-foreground", children: "LVR" }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: cn("text-label-medium", textClass), children: label })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: cn("h-2.5 w-full overflow-hidden", trackClass), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: cn("h-2.5 w-full overflow-hidden", trackClass), children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "div",
       {
         className: cn("h-full", fillClass),
@@ -453,7 +697,7 @@ function FinancialLvrBar({
 function FinancialSubtotalFrame({
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mt-auto border-t border-primary/20 bg-primary/10 px-4 py-3", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "mt-auto border-t border-primary/20 bg-primary/10 px-4 py-3", children });
 }
 function FinancialSubtotalBlock({
   monthlyAverage,
@@ -461,7 +705,7 @@ function FinancialSubtotalBlock({
   label
 }) {
   const isSingle = monthlyAverage && !totalLast12Months;
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
     "div",
     {
       className: cn(
@@ -469,7 +713,7 @@ function FinancialSubtotalBlock({
         isSingle ? "justify-end" : "justify-between"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
           "div",
           {
             className: cn(
@@ -477,14 +721,14 @@ function FinancialSubtotalBlock({
               isSingle ? "text-right" : "text-left"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "min-h-[1.75rem] text-overline text-muted-foreground", children: label != null ? label : "Monthly Average" }),
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-medium text-foreground", children: monthlyAverage != null ? monthlyAverage : NO_DATA })
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "min-h-[1.75rem] text-overline text-muted-foreground", children: label != null ? label : "Monthly Average" }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-medium text-foreground", children: monthlyAverage != null ? monthlyAverage : NO_DATA })
             ]
           }
         ),
-        !isSingle && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex flex-col gap-0.5 text-right", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "min-h-[1.75rem] text-overline text-muted-foreground", children: "Total Last 12 Months" }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-label-medium text-foreground", children: totalLast12Months != null ? totalLast12Months : NO_DATA })
+        !isSingle && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col gap-0.5 text-right", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "min-h-[1.75rem] text-overline text-muted-foreground", children: "Total Last 12 Months" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-label-medium text-foreground", children: totalLast12Months != null ? totalLast12Months : NO_DATA })
         ] })
       ]
     }
@@ -492,8 +736,8 @@ function FinancialSubtotalBlock({
 }
 
 // src/components/ui/financial-cards.tsx
-var React2 = __toESM(require("react"));
-var import_lucide_react3 = require("lucide-react");
+var React3 = __toESM(require("react"));
+var import_lucide_react6 = require("lucide-react");
 
 // src/lib/format-date.ts
 var import_date_fns = require("date-fns");
@@ -509,56 +753,86 @@ function formatDateShort(iso) {
   }
 }
 
-// src/components/ui/badge.tsx
-var import_class_variance_authority3 = require("class-variance-authority");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var badgeVariants = (0, import_class_variance_authority3.cva)(
-  "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2.5 py-0.5 text-xs font-medium font-sans whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
-  {
-    variants: {
-      variant: {
-        default: "border-primary/40 bg-primary/10 text-foreground [a&]:hover:bg-primary/15",
-        secondary: "border-border bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
-        destructive: "border-destructive/40 bg-destructive/10 text-destructive-text focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/15",
-        success: "border-success/40 bg-success/10 text-success-text [a&]:hover:bg-success/15",
-        warning: "border-warning/40 bg-warning/10 text-warning-text [a&]:hover:bg-warning/15",
-        info: "border-info/40 bg-info/10 text-info-text [a&]:hover:bg-info/15",
-        outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-        ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 [a&]:hover:underline"
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-function Badge(_a) {
+// src/components/ui/accordion.tsx
+var import_lucide_react4 = require("lucide-react");
+var import_accordion = require("@base-ui/react/accordion");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function Accordion(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_accordion.Accordion.Root, __spreadValues({ "data-slot": "accordion" }, props));
+}
+function AccordionItem(_a) {
   var _b = _a, {
-    className,
-    variant = "default",
-    asChild = false
+    className
   } = _b, props = __objRest(_b, [
-    "className",
-    "variant",
-    "asChild"
+    "className"
   ]);
-  const Comp = asChild ? Slot : "span";
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    Comp,
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_accordion.Accordion.Item,
     __spreadValues({
-      className: cn(badgeVariants({ variant }), className),
-      "data-slot": "badge",
-      "data-variant": variant
+      className: cn("border-b", className),
+      "data-slot": "accordion-item"
     }, props)
   );
 }
+function AccordionTrigger(_a) {
+  var _b = _a, {
+    className,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_accordion.Accordion.Header, { className: "flex", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+    import_accordion.Accordion.Trigger,
+    __spreadProps(__spreadValues({
+      className: cn(
+        // layout
+        "flex flex-1 items-center justify-between gap-4 py-4 text-left",
+        // typography
+        "text-label-medium",
+        // base
+        "rounded-none outline-none transition-[color,opacity]",
+        // interactive states
+        "hover:underline",
+        "focus-visible:ring-2 focus-visible:ring-foreground/30",
+        "disabled:pointer-events-none disabled:opacity-50",
+        // chevron rotation when open
+        "[&[data-panel-open]>svg]:rotate-180",
+        className
+      ),
+      "data-slot": "accordion-trigger"
+    }, props), {
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.ChevronDownIcon, { className: "pointer-events-none size-4 shrink-0 text-muted-foreground transition-transform duration-200" })
+      ]
+    })
+  ) });
+}
+function AccordionContent(_a) {
+  var _b = _a, {
+    className,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_accordion.Accordion.Panel,
+    __spreadProps(__spreadValues({
+      className: "overflow-hidden text-body-small h-(--accordion-panel-height) transition-[height] duration-200 ease-out data-starting-style:h-0 data-ending-style:h-0",
+      "data-slot": "accordion-content"
+    }, props), {
+      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cn("pb-4 text-muted-foreground", className), children })
+    })
+  );
+}
 
 // src/components/ui/radio-group.tsx
-var import_lucide_react2 = require("lucide-react");
+var import_lucide_react5 = require("lucide-react");
 var import_radio_group = require("@base-ui/react/radio-group");
 var import_radio = require("@base-ui/react/radio");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var CIRCLE_BASE = "inline-flex items-center justify-center aspect-square size-4 shrink-0 rounded-full border border-primary bg-background";
 var INDICATOR_DOT = "size-2 fill-background text-background";
 function RadioGroup(_a) {
@@ -567,7 +841,7 @@ function RadioGroup(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     import_radio_group.RadioGroup,
     __spreadValues({
       className: cn("grid gap-3", className),
@@ -581,7 +855,7 @@ function RadioGroupItem(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     import_radio.Radio.Root,
     __spreadProps(__spreadValues({
       className: cn(
@@ -597,11 +871,11 @@ function RadioGroupItem(_a) {
       ),
       "data-slot": "radio-group-item"
     }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         import_radio.Radio.Indicator,
         {
           "data-slot": "radio-group-indicator",
-          children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react2.CircleIcon, { className: INDICATOR_DOT })
+          children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.CircleIcon, { className: INDICATOR_DOT })
         }
       )
     })
@@ -609,7 +883,7 @@ function RadioGroupItem(_a) {
 }
 
 // src/components/ui/financial-cards.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function PropertyCard({
   address,
   type,
@@ -632,8 +906,8 @@ function PropertyCard({
   interestCharged,
   principlePaidOff
 }) {
-  const [expanded, setExpanded] = React2.useState(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+  const [expanded, setExpanded] = React3.useState(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     "div",
     {
       className: cn(
@@ -641,20 +915,19 @@ function PropertyCard({
         !borderless && "border border-border"
       ),
       children: [
-        isLinkedToBank ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        isLinkedToBank ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
           Button,
           {
             type: "button",
             variant: "ghost",
             "aria-expanded": expanded,
             onClick: () => setExpanded((prev) => !prev),
-            className: "h-auto w-full justify-start gap-1.5 px-5 py-3 text-left",
+            className: "h-auto w-full justify-start gap-1.5 px-5 py-3 text-left has-[>svg]:px-5",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-label-medium text-foreground", children: address }),
-              type && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Badge, { variant: "outline", children: type }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "flex-1" }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-                import_lucide_react3.ChevronDown,
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "flex-1 min-w-0 truncate text-label-medium text-foreground", children: address }),
+              type && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Badge, { className: "shrink-0", variant: "outline", children: type }),
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+                import_lucide_react6.ChevronDown,
                 {
                   className: cn(
                     "h-5 w-5 shrink-0 text-muted-foreground transition-transform duration-200",
@@ -664,67 +937,67 @@ function PropertyCard({
               )
             ]
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-1.5 px-5 py-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-label-medium text-foreground", children: address }),
-          type && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Badge, { variant: "outline", children: type })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-1.5 px-5 py-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-label-medium text-foreground", children: address }),
+          type && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Badge, { variant: "outline", children: type })
         ] }),
-        !isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "px-5 pb-2 text-xs italic text-muted-foreground", children: "No mortgage account linked to this property" }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        !isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "px-5 pb-2 text-xs italic text-muted-foreground", children: "No mortgage account linked to this property" }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
           "div",
           {
             className: cn(
               "grid gap-5 px-5 py-[15px]",
-              isLinkedToBank ? "grid-cols-3" : "grid-cols-1"
+              isLinkedToBank ? "grid-cols-2" : "grid-cols-1"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Estimated Value", value: estimated }),
-              isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Loan Amount", value: loanAmount }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Equity", value: equity })
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Estimated Value", value: estimated }),
+              isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Loan Amount", value: loanAmount }),
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Equity", value: equity }) })
               ] })
             ]
           }
         ),
-        isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "px-5 pb-[15px]", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-5 pb-[15px]", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           FinancialLvrBar,
           {
             percent: lvrPercent,
             label: lvr != null ? lvr : `${lvrPercent}%`
           }
         ) }),
-        isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        isLinkedToBank && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           "div",
           {
             className: cn(
               "grid transition-[grid-template-rows] duration-200 ease-in-out",
               expanded ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "overflow-hidden", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col gap-5 border-t border-border px-5 py-[15px]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubsectionTitle, { children: "Loan" }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-4", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "overflow-hidden", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-5 border-t border-border px-5 py-[15px]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubsectionTitle, { children: "Loan" }),
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-4", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Name of Lender",
                       value: lenderName
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Current Loan Amount",
                       value: loanAmount
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Interest Rate",
                       value: interestRate
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Years Remaining",
@@ -732,29 +1005,29 @@ function PropertyCard({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-4", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-4", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Min Repayments",
                       value: minRepayments
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Average Repayments",
                       value: averageRepayments
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Redraw Amount",
                       value: redrawAmount
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     FinancialDetailField,
                     {
                       label: "Offset Account",
@@ -763,8 +1036,8 @@ function PropertyCard({
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-4 gap-y-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                   FinancialDetailField,
                   {
                     variant: "footer",
@@ -772,7 +1045,7 @@ function PropertyCard({
                     value: totalMinRepayments
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                   FinancialDetailField,
                   {
                     variant: "footer",
@@ -780,7 +1053,7 @@ function PropertyCard({
                     value: totalExtraRepayments
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                   FinancialDetailField,
                   {
                     variant: "footer",
@@ -788,7 +1061,7 @@ function PropertyCard({
                     value: interestCharged
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                   FinancialDetailField,
                   {
                     variant: "footer",
@@ -818,17 +1091,17 @@ function DebtCard({
   totalInterestPaid,
   yearsRemaining
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "border border-border overflow-hidden flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-5 px-5 py-[15px] border-b border-border min-h-[7rem] items-start", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Name of Lender", value: lenderName }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "border border-border overflow-hidden flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-3 gap-5 px-5 py-[15px] border-b border-border min-h-[7rem] items-start", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Name of Lender", value: lenderName }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         FinancialDetailField,
         {
           label: "Current Loan Amount",
           value: currentLoanAmount
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         FinancialDetailField,
         {
           label: "Current Interest Rate",
@@ -836,24 +1109,24 @@ function DebtCard({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "px-5 py-[15px] flex flex-col gap-5 flex-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubsectionTitle, { children: "Loan Stats" }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "px-5 py-[15px] flex flex-col gap-5 flex-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubsectionTitle, { children: "Loan Stats" }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-3 gap-5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           FinancialDetailField,
           {
             label: "Original Loan Amount",
             value: originalLoanAmount
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           FinancialDetailField,
           {
             label: "Original Loan Term",
             value: originalLoanTerm
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           FinancialDetailField,
           {
             label: "Monthly Repayments",
@@ -861,10 +1134,10 @@ function DebtCard({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Redraw Amount", value: redrawAmount }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Offset Account", value: offsetAmount }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-3 gap-5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Redraw Amount", value: redrawAmount }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Offset Account", value: offsetAmount }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           FinancialDetailField,
           {
             label: "Extra Loan Repayments",
@@ -873,8 +1146,8 @@ function DebtCard({
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-x-4 gap-y-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-3 gap-x-4 gap-y-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         FinancialDetailField,
         {
           variant: "footer",
@@ -882,7 +1155,7 @@ function DebtCard({
           value: totalRepaymentsMade
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         FinancialDetailField,
         {
           variant: "footer",
@@ -890,7 +1163,7 @@ function DebtCard({
           value: totalInterestPaid
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         FinancialDetailField,
         {
           variant: "footer",
@@ -901,6 +1174,16 @@ function DebtCard({
     ] }) })
   ] });
 }
+function ageFromDob(dobStr) {
+  if (!dobStr) return null;
+  const dob = new Date(dobStr);
+  if (isNaN(dob.getTime())) return null;
+  const today = /* @__PURE__ */ new Date();
+  let age = today.getFullYear() - dob.getFullYear();
+  const m = today.getMonth() - dob.getMonth();
+  if (m < 0 || m === 0 && today.getDate() < dob.getDate()) age--;
+  return age >= 0 ? age : null;
+}
 function AboutCard({
   title,
   firstName,
@@ -911,6 +1194,7 @@ function AboutCard({
   gender,
   maritalStatus,
   numDependants,
+  dependants,
   citizenStatus,
   residentialAddress,
   residentialStatus,
@@ -919,210 +1203,265 @@ function AboutCard({
   driversLicence,
   passport,
   propertyInTrust,
-  companyOwnership
+  companyOwnership,
+  borderless = false
 }) {
   const fullName = [title, firstName, lastName].filter(Boolean).join(" ") || "\u2014";
   const timeAtAddress = timeAtAddressYears || timeAtAddressMonths ? [
     timeAtAddressYears && `${timeAtAddressYears}yr`,
     timeAtAddressMonths && `${timeAtAddressMonths}mo`
   ].filter(Boolean).join(" ") : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "border border-border overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-2 gap-x-8 gap-y-4 px-5 py-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Full Name", value: fullName }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Date of Birth", value: dob || "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Gender", value: gender || "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Phone", value: phone || "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Email", value: email || "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Marital Status",
-        value: maritalStatus || "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "No. of Dependants",
-        value: numDependants != null ? numDependants : "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Citizenship",
-        value: citizenStatus || "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Residential Address",
-        value: residentialAddress || "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Residential Status",
-        value: residentialStatus || "\u2014"
-      }
-    ),
-    timeAtAddress && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Time at Address", value: timeAtAddress }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Driver's Licence",
-        value: driversLicence || "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Passport", value: passport || "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Property in Trust",
-        value: propertyInTrust || "\u2014"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialDetailField,
-      {
-        label: "Company Ownership",
-        value: companyOwnership || "\u2014"
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden divide-y divide-border",
+        !borderless && "border border-border"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 px-5 py-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Full Name", value: fullName }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Date of Birth", value: dob || "\u2014" }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Gender", value: gender || "\u2014" }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Citizenship",
+              value: citizenStatus || "\u2014"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Driver's Licence",
+              value: driversLicence || "\u2014"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Passport", value: passport || "\u2014" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 px-5 py-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Phone", value: phone || "\u2014" }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Email", value: email || "\u2014" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 px-5 py-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Marital Status",
+              value: maritalStatus || "\u2014"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "No. of Dependants",
+              value: numDependants != null ? numDependants : "\u2014"
+            }
+          ),
+          dependants && dependants.map((dep, i) => {
+            const age = ageFromDob(dep.dob);
+            const dobFormatted = formatDateShort(dep.dob) || "\u2014";
+            const value = age !== null ? `${dobFormatted} \xB7 age ${age}` : dobFormatted;
+            return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              FinancialDetailField,
+              {
+                label: `Dependant ${i + 1}`,
+                value
+              },
+              i
+            );
+          })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 px-5 py-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Residential Address",
+              value: residentialAddress || "\u2014"
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Residential Status",
+              value: residentialStatus || "\u2014"
+            }
+          ),
+          timeAtAddress && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialDetailField, { label: "Time at Address", value: timeAtAddress })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 px-5 py-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Property in Trust",
+              value: propertyInTrust || "\u2014"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            FinancialDetailField,
+            {
+              label: "Company Ownership",
+              value: companyOwnership || "\u2014"
+            }
+          )
+        ] })
+      ]
+    }
+  );
 }
-function IncomeCard({ items, totalMonthly }) {
+function IncomeCard({
+  items,
+  totalMonthly,
+  borderless = false
+}) {
   if (items.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "border border-border px-5 py-4", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm text-muted-foreground", children: "No income recorded." }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: cn("px-5 py-4", !borderless && "border border-border"), children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-sm text-muted-foreground", children: "No income recorded." }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "border border-border overflow-hidden flex flex-col", children: [
-    items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
-      "div",
-      {
-        className: cn(
-          "flex flex-col gap-3 px-5 py-[15px]",
-          i < items.length - 1 && "border-b border-border"
-        ),
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-x-6", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Type", value: item.incomeType || "\u2014" }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden flex flex-col",
+        !borderless && "border border-border"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Accordion, { openMultiple: true, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(AccordionItem, { value: String(i), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AccordionTrigger, { className: "px-5", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-1 items-center justify-between pr-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-label-medium text-foreground", children: item.incomeType }),
+              item.jobTitle && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "text-body-small text-muted-foreground", children: [
+                "\xB7 ",
+                item.jobTitle
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-label-medium text-foreground", children: item.amountLabel })
+          ] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AccordionContent, { className: "px-5", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid grid-cols-3 gap-x-6 gap-y-4 pb-2 pt-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               FinancialDetailField,
               {
                 label: "Job Title",
                 value: item.jobTitle || "\u2014"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialDetailField, { label: "Amount", value: item.amountLabel })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-3 gap-x-6", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               FinancialDetailField,
               {
                 label: "Company",
                 value: item.companyName || "\u2014"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               FinancialDetailField,
               {
                 label: "Start Date",
                 value: formatDateShort(item.startDate)
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               FinancialDetailField,
               {
                 label: "Status",
                 value: item.stillInPosition === void 0 ? "\u2014" : item.stillInPosition ? "Still in position" : item.endDate ? `Ended ${formatDateShort(item.endDate)}` : "No longer in position"
               }
+            ),
+            item.companyAddress && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              FinancialDetailField,
+              {
+                label: "Company Address",
+                value: item.companyAddress
+              }
             )
-          ] }),
-          item.companyAddress && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-            FinancialDetailField,
-            {
-              label: "Company Address",
-              value: item.companyAddress
-            }
-          )
-        ]
-      },
-      i
-    )),
-    totalMonthly && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialSubtotalBlock,
-      {
-        monthlyAverage: totalMonthly,
-        label: "Total Monthly Income"
-      }
-    ) })
-  ] });
+          ] }) })
+        ] }, i)) }),
+        totalMonthly && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          FinancialSubtotalBlock,
+          {
+            monthlyAverage: totalMonthly,
+            label: "Total Monthly Income"
+          }
+        ) })
+      ]
+    }
+  );
 }
 var EXPENSE_ICON_MAP = {
-  groceries: import_lucide_react3.ShoppingCart,
-  "dining out": import_lucide_react3.UtensilsCrossed,
-  dining: import_lucide_react3.UtensilsCrossed,
-  restaurants: import_lucide_react3.UtensilsCrossed,
-  transport: import_lucide_react3.Car,
-  transportation: import_lucide_react3.Car,
-  vehicle: import_lucide_react3.Car,
-  utilities: import_lucide_react3.Zap,
-  electricity: import_lucide_react3.Zap,
-  insurance: import_lucide_react3.Shield,
-  "council rates": import_lucide_react3.Landmark,
-  council: import_lucide_react3.Landmark,
-  rates: import_lucide_react3.Landmark,
-  medical: import_lucide_react3.HeartPulse,
-  health: import_lucide_react3.HeartPulse,
-  subscriptions: import_lucide_react3.RefreshCw,
-  subscription: import_lucide_react3.RefreshCw,
-  "credit card": import_lucide_react3.CreditCard,
-  education: import_lucide_react3.GraduationCap,
-  childcare: import_lucide_react3.Baby,
-  entertainment: import_lucide_react3.Tv,
-  gym: import_lucide_react3.Dumbbell,
-  fitness: import_lucide_react3.Dumbbell,
-  clothing: import_lucide_react3.Shirt,
-  rent: import_lucide_react3.Building2
+  groceries: import_lucide_react6.ShoppingCart,
+  "dining out": import_lucide_react6.UtensilsCrossed,
+  dining: import_lucide_react6.UtensilsCrossed,
+  restaurants: import_lucide_react6.UtensilsCrossed,
+  transport: import_lucide_react6.Car,
+  transportation: import_lucide_react6.Car,
+  vehicle: import_lucide_react6.Car,
+  utilities: import_lucide_react6.Zap,
+  electricity: import_lucide_react6.Zap,
+  insurance: import_lucide_react6.Shield,
+  "council rates": import_lucide_react6.Landmark,
+  council: import_lucide_react6.Landmark,
+  rates: import_lucide_react6.Landmark,
+  medical: import_lucide_react6.HeartPulse,
+  health: import_lucide_react6.HeartPulse,
+  subscriptions: import_lucide_react6.RefreshCw,
+  subscription: import_lucide_react6.RefreshCw,
+  "credit card": import_lucide_react6.CreditCard,
+  education: import_lucide_react6.GraduationCap,
+  childcare: import_lucide_react6.Baby,
+  entertainment: import_lucide_react6.Tv,
+  gym: import_lucide_react6.Dumbbell,
+  fitness: import_lucide_react6.Dumbbell,
+  clothing: import_lucide_react6.Shirt,
+  rent: import_lucide_react6.Building2
 };
 function getExpenseIcon(expenseType) {
   var _a;
-  return (_a = EXPENSE_ICON_MAP[expenseType.toLowerCase()]) != null ? _a : import_lucide_react3.Receipt;
+  return (_a = EXPENSE_ICON_MAP[expenseType.toLowerCase()]) != null ? _a : import_lucide_react6.Receipt;
 }
-function ExpensesCard({ items, totalMonthly }) {
+function ExpensesCard({
+  items,
+  totalMonthly,
+  borderless = false
+}) {
   if (items.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "border border-border px-5 py-4", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-sm text-muted-foreground", children: "No expenses recorded." }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: cn("px-5 py-4", !borderless && "border border-border"), children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-sm text-muted-foreground", children: "No expenses recorded." }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "border border-border overflow-hidden flex flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex flex-col", children: items.map((item, i) => {
-      const Icon = getExpenseIcon(item.expenseType);
-      return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
-        "div",
-        {
-          className: cn(
-            "flex items-center justify-between gap-4 px-5 py-2.5",
-            i < items.length - 1 && "border-b border-border"
-          ),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: "size-3.5 shrink-0 text-muted-foreground" }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-body-small text-foreground", children: item.expenseType })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-label-medium whitespace-nowrap text-destructive", children: item.amountLabel })
-          ]
-        },
-        item.expenseType
-      );
-    }) }),
-    totalMonthly && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      FinancialSubtotalBlock,
-      {
-        monthlyAverage: totalMonthly,
-        label: "Total Monthly Expenses"
-      }
-    ) })
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden flex flex-col",
+        !borderless && "border border-border"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col", children: items.map((item, i) => {
+          const Icon = getExpenseIcon(item.expenseType);
+          return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+            "div",
+            {
+              className: cn(
+                "flex items-center justify-between gap-4 px-5 py-2.5",
+                i < items.length - 1 && "border-b border-border"
+              ),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-2.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Icon, { className: "size-3.5 shrink-0 text-muted-foreground" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-body-small text-foreground", children: item.expenseType })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-label-medium whitespace-nowrap text-destructive", children: item.amountLabel })
+              ]
+            },
+            item.expenseType
+          );
+        }) }),
+        totalMonthly && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FinancialSubtotalFrame, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          FinancialSubtotalBlock,
+          {
+            monthlyAverage: totalMonthly,
+            label: "Total Monthly Expenses"
+          }
+        ) })
+      ]
+    }
+  );
 }
 
 // src/components/ui/opportunity-edit-modals.tsx
@@ -1130,26 +1469,16 @@ var React9 = __toESM(require("react"));
 var import_lucide_react11 = require("lucide-react");
 
 // src/components/ui/dialog.tsx
-var import_lucide_react4 = require("lucide-react");
+var import_lucide_react7 = require("lucide-react");
 var import_dialog = require("@base-ui/react/dialog");
-
-// src/lib/theme-provider.tsx
-var import_react2 = require("react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var ThemeVarsContext = (0, import_react2.createContext)({});
-function useThemeVars() {
-  return (0, import_react2.useContext)(ThemeVarsContext);
-}
-
-// src/components/ui/dialog.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function Dialog(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_dialog.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_dialog.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
 }
 function DialogPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_dialog.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_dialog.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
 }
 function DialogOverlay(_a) {
   var _b = _a, {
@@ -1157,7 +1486,7 @@ function DialogOverlay(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     import_dialog.Dialog.Backdrop,
     __spreadValues({
       className: cn(
@@ -1203,9 +1532,9 @@ function DialogContent(_a) {
   const themeVars = useThemeVars();
   const isAuto = size === "auto";
   const sizeStyle = isAuto ? { minWidth: minWidth != null ? minWidth : DIALOG_AUTO_MIN_WIDTH } : { maxWidth: DIALOG_MAX_WIDTHS[size] };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(DialogPortal, { container: container != null ? container : void 0, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DialogOverlay, { style: themeVars }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogPortal, { container: container != null ? container : void 0, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogOverlay, { style: themeVars }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       import_dialog.Dialog.Popup,
       __spreadProps(__spreadValues({
         className: cn(
@@ -1224,14 +1553,14 @@ function DialogContent(_a) {
       }, props), {
         children: [
           children,
-          showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+          showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
             import_dialog.Dialog.Close,
             {
               className: "absolute top-4 right-4 inline-flex size-7 items-center justify-center transition-colors hover:bg-foreground/5 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-border focus-visible:ring-offset-0 disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
               "data-slot": "dialog-close",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.XIcon, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_lucide_react7.XIcon, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "sr-only", children: "Close" })
               ]
             }
           ) : null
@@ -1244,341 +1573,113 @@ function DialogHeader(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    "div",
-    __spreadValues({
-      className: cn("flex flex-col gap-1.5", className),
-      "data-slot": "dialog-header"
-    }, props)
-  );
-}
-function DialogFooter(_a) {
-  var _b = _a, {
-    className,
-    showCloseButton = false,
-    children
-  } = _b, props = __objRest(_b, [
-    "className",
-    "showCloseButton",
-    "children"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-    "div",
-    __spreadProps(__spreadValues({
-      className: cn(
-        // WealthX: always row layout, right-aligned, separator above footer
-        "flex flex-row justify-end gap-2 border-t border-border pt-4",
-        className
-      ),
-      "data-slot": "dialog-footer"
-    }, props), {
-      children: [
-        children,
-        showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-          import_dialog.Dialog.Close,
-          {
-            className: cn(buttonVariants({ variant: "outline" })),
-            type: "button",
-            children: "Close"
-          }
-        ) : null
-      ]
-    })
-  );
-}
-function DialogTitle(_a) {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    import_dialog.Dialog.Title,
-    __spreadValues({
-      className: cn("text-h5 leading-none", className),
-      "data-slot": "dialog-title"
-    }, props)
-  );
-}
-
-// src/components/ui/input.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-function Input(_a) {
-  var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-    "input",
-    __spreadValues({
-      className: cn(
-        "h-9 w-full min-w-0 border border-input bg-transparent px-3 py-1 text-body-medium font-sans shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-label-medium file:text-foreground placeholder:font-normal placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30",
-        "focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20",
-        "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
-        className
-      ),
-      "data-slot": "input",
-      type
-    }, props)
-  );
-}
-
-// src/components/ui/label.tsx
-var import_jsx_runtime10 = (
-  // eslint-disable-next-line jsx-a11y/label-has-associated-control -- htmlFor is passed by the consumer
-  require("react/jsx-runtime")
-);
-function Label(_a) {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-    "label",
-    __spreadValues({
-      className: cn(
-        "flex items-center gap-2 text-label-medium leading-none select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
-        className
-      ),
-      "data-slot": "label"
-    }, props)
-  );
-}
-
-// src/components/ui/textarea.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-function Textarea(_a) {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    "textarea",
-    __spreadValues({
-      className: cn(
-        // WealthX: removed shadow-xs (flat panels), added font-sans
-        "flex field-sizing-content min-h-16 w-full border border-input bg-transparent px-3 py-2 text-body-medium font-sans transition-[color,box-shadow] outline-none placeholder:font-normal placeholder:text-muted-foreground focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:aria-invalid:ring-destructive/40",
-        className
-      ),
-      "data-slot": "textarea"
-    }, props)
-  );
-}
-
-// src/components/ui/select.tsx
-var import_lucide_react5 = require("lucide-react");
-var import_select = require("@base-ui/react/select");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-function Select(_a) {
-  var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.Root, __spreadValues({ "data-slot": "select" }, props));
-}
-function SelectValue(_a) {
-  var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.Value, __spreadValues({ "data-slot": "select-value" }, props));
-}
-function SelectTrigger(_a) {
-  var _b = _a, {
-    className,
-    size = "default",
-    children
-  } = _b, props = __objRest(_b, [
-    "className",
-    "size",
-    "children"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    import_select.Select.Trigger,
-    __spreadProps(__spreadValues({
-      className: cn(
-        "flex w-fit items-center justify-between gap-2 border border-input bg-transparent px-3 py-2 text-body-medium whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20 data-popup-open:border-primary data-popup-open:ring-[3px] data-popup-open:ring-primary/20 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-placeholder:font-normal data-placeholder:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
-        className
-      ),
-      "data-size": size,
-      "data-slot": "select-trigger"
-    }, props), {
-      children: [
-        children,
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.Icon, { className: "transition-transform duration-200 data-popup-open:rotate-180", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.ChevronDownIcon, { className: "size-4 opacity-50" }) })
-      ]
-    })
-  );
-}
-function SelectContent(_a) {
-  var _b = _a, {
-    className,
-    children,
-    style
-  } = _b, props = __objRest(_b, [
-    "className",
-    "children",
-    "style"
+    "className"
   ]);
-  const themeVars = useThemeVars();
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_select.Select.Positioner,
-    {
-      className: "z-[200]",
-      align: "start",
-      alignItemWithTrigger: false,
-      sideOffset: 4,
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-        import_select.Select.Popup,
-        __spreadProps(__spreadValues({
-          className: cn(
-            "relative max-h-[var(--available-height)] min-w-[var(--anchor-width,8rem)] overflow-x-hidden overflow-y-auto border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
-            className
-          ),
-          "data-slot": "select-content",
-          style: __spreadValues(__spreadValues({}, themeVars), style)
-        }, props), {
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectScrollUpButton, {}),
-            children,
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectScrollDownButton, {})
-          ]
-        })
-      )
-    }
-  ) });
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      className: cn("flex flex-col gap-1.5", className),
+      "data-slot": "dialog-header"
+    }, props)
+  );
 }
-function SelectItem(_a) {
+function DialogFooter(_a) {
   var _b = _a, {
     className,
+    showCloseButton = false,
     children
   } = _b, props = __objRest(_b, [
     "className",
+    "showCloseButton",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    import_select.Select.Item,
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    "div",
     __spreadProps(__spreadValues({
       className: cn(
-        "relative flex w-full cursor-default items-center gap-2 py-1.5 pr-8 pl-2 text-body-small outline-hidden select-none data-highlighted:bg-primary/5 data-highlighted:text-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        // WealthX: always row layout, right-aligned, separator above footer
+        "flex flex-row justify-end gap-2 border-t border-border pt-4",
         className
       ),
-      "data-slot": "select-item"
+      "data-slot": "dialog-footer"
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-          "span",
+        children,
+        showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          import_dialog.Dialog.Close,
           {
-            className: "absolute right-2 flex size-3.5 items-center justify-center",
-            "data-slot": "select-item-indicator",
-            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.CheckIcon, { className: "size-4" }) })
+            className: cn(buttonVariants({ variant: "outline" })),
+            type: "button",
+            children: "Close"
           }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_select.Select.ItemText, { children })
+        ) : null
       ]
     })
   );
 }
-function SelectScrollUpButton(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_select.Select.ScrollUpArrow,
-    __spreadProps(__spreadValues({
-      className: cn(
-        "flex cursor-default items-center justify-center py-1",
-        className
-      ),
-      "data-slot": "select-scroll-up-button"
-    }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.ChevronUpIcon, { className: "size-4" })
-    })
+function DialogTitle(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    import_dialog.Dialog.Title,
+    __spreadValues({
+      className: cn("text-h5 leading-none", className),
+      "data-slot": "dialog-title"
+    }, props)
   );
 }
-function SelectScrollDownButton(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
+
+// src/components/ui/input.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function Input(_a) {
+  var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_select.Select.ScrollDownArrow,
-    __spreadProps(__spreadValues({
+    "input",
+    __spreadValues({
       className: cn(
-        "flex cursor-default items-center justify-center py-1",
+        "h-9 w-full min-w-0 border border-input bg-transparent px-3 py-1 text-body-medium font-sans shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-label-medium file:text-foreground placeholder:font-normal placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30",
+        "focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20",
+        "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
         className
       ),
-      "data-slot": "select-scroll-down-button"
-    }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.ChevronDownIcon, { className: "size-4" })
-    })
+      "data-slot": "input",
+      type
+    }, props)
   );
 }
 
-// src/components/ui/accordion.tsx
-var import_lucide_react6 = require("lucide-react");
-var import_accordion = require("@base-ui/react/accordion");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-function Accordion(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_accordion.Accordion.Root, __spreadValues({ "data-slot": "accordion" }, props));
-}
-function AccordionItem(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
+// src/components/ui/label.tsx
+var import_jsx_runtime13 = (
+  // eslint-disable-next-line jsx-a11y/label-has-associated-control -- htmlFor is passed by the consumer
+  require("react/jsx-runtime")
+);
+function Label(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-    import_accordion.Accordion.Item,
+    "label",
     __spreadValues({
-      className: cn("border-b", className),
-      "data-slot": "accordion-item"
+      className: cn(
+        "flex items-center gap-2 text-label-medium leading-none select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      ),
+      "data-slot": "label"
     }, props)
   );
 }
-function AccordionContent(_a) {
-  var _b = _a, {
-    className,
-    children
-  } = _b, props = __objRest(_b, [
-    "className",
-    "children"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-    import_accordion.Accordion.Panel,
-    __spreadProps(__spreadValues({
-      className: "overflow-hidden text-body-small h-(--accordion-panel-height) transition-[height] duration-200 ease-out data-starting-style:h-0 data-ending-style:h-0",
-      "data-slot": "accordion-content"
-    }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: cn("pb-4 text-muted-foreground", className), children })
-    })
-  );
-}
 
-// src/components/ui/checkbox.tsx
-var import_react3 = require("react");
-var import_lucide_react7 = require("lucide-react");
-var import_checkbox = require("@base-ui/react/checkbox");
+// src/components/ui/textarea.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function Checkbox(_a) {
+function Textarea(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-    import_checkbox.Checkbox.Root,
-    __spreadProps(__spreadValues({
+    "textarea",
+    __spreadValues({
       className: cn(
-        "peer group inline-flex size-4 shrink-0 border border-input shadow-xs transition-all outline-none",
-        "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
-        "disabled:cursor-not-allowed disabled:opacity-50",
-        "aria-invalid:border-destructive aria-invalid:ring-destructive/20",
-        "data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground",
-        "data-indeterminate:border-primary data-indeterminate:bg-primary data-indeterminate:text-primary-foreground",
-        // Dark mode (upstream shadcn)
-        "dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-checked:bg-primary",
-        // Stacked (2 attr selectors) → wins over single-attr rules above
-        "aria-invalid:data-checked:border-destructive aria-invalid:data-checked:bg-destructive aria-invalid:data-checked:text-destructive-foreground",
-        "aria-invalid:data-indeterminate:border-destructive aria-invalid:data-indeterminate:bg-destructive aria-invalid:data-indeterminate:text-destructive-foreground",
+        // WealthX: removed shadow-xs (flat panels), added font-sans
+        "flex field-sizing-content min-h-16 w-full border border-input bg-transparent px-3 py-2 text-body-medium font-sans transition-[color,box-shadow] outline-none placeholder:font-normal placeholder:text-muted-foreground focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:aria-invalid:ring-destructive/40",
         className
       ),
-      "data-slot": "checkbox"
-    }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-        import_checkbox.Checkbox.Indicator,
-        {
-          className: "grid place-content-center text-current transition-none",
-          "data-slot": "checkbox-indicator",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react7.CheckIcon, { className: "size-3.5 group-data-indeterminate:hidden" }),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react7.MinusIcon, { className: "size-3.5 hidden group-data-indeterminate:block" })
-          ]
-        }
-      )
-    })
+      "data-slot": "textarea"
+    }, props)
   );
 }
 
@@ -1775,7 +1876,7 @@ function CalendarDayButton(_a) {
         defaultClassNames.day,
         className
       ),
-      "data-day": day.date.toLocaleDateString(),
+      "data-day": formatDateShort(day.date.toISOString()),
       "data-range-end": modifiers.range_end,
       "data-range-middle": modifiers.range_middle,
       "data-range-start": modifiers.range_start,
@@ -2407,7 +2508,7 @@ function OwnershipSplit({
 }
 
 // src/components/ui/opportunity-edit-modals.tsx
-var import_accordion3 = require("@base-ui/react/accordion");
+var import_accordion4 = require("@base-ui/react/accordion");
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var LOAN_PURPOSES = [
   "Purchase a home",
@@ -2629,9 +2730,9 @@ function AccordionItemHeader({
   onRemove,
   removeLabel = "Remove item"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_accordion3.Accordion.Header, { className: "flex items-center", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_accordion4.Accordion.Header, { className: "flex items-center", children: [
     /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
-      import_accordion3.Accordion.Trigger,
+      import_accordion4.Accordion.Trigger,
       {
         className: cn(
           "flex flex-1 items-center justify-between gap-4 py-4 text-left",
@@ -4315,19 +4416,9 @@ function lvrColorClass(pct) {
 }
 function serviceabilityInfo(surplus) {
   if (surplus > 1500)
-    return {
-      label: "Likely Serviceable",
-      badgeClass: "bg-emerald-50 text-emerald-700 border border-emerald-200"
-    };
-  if (surplus > 0)
-    return {
-      label: "Borderline",
-      badgeClass: "bg-amber-50 text-amber-700 border border-amber-200"
-    };
-  return {
-    label: "At Risk",
-    badgeClass: "bg-red-50 text-destructive border border-red-200"
-  };
+    return { label: "Likely Serviceable", variant: "success" };
+  if (surplus > 0) return { label: "Borderline", variant: "warning" };
+  return { label: "At Risk", variant: "destructive" };
 }
 function SectionEditButton({
   onClick,
@@ -4428,7 +4519,7 @@ function HeroBand({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cn("px-2.5 py-1 text-xs font-medium", svc.badgeClass), children: svc.label })
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Badge, { variant: svc.variant, children: svc.label })
     ] })
   ] });
 }
@@ -4453,14 +4544,15 @@ function ApplicantCardTab({
     )
   );
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-4 py-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border border-border", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-4 py-2.5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "About" }),
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SectionEditButton, { onClick: onEditAbout, title: "Edit About" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-border", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         AboutCard,
         {
+          borderless: true,
           title: about.title,
           firstName: about.firstName,
           lastName: about.lastName,
@@ -4470,6 +4562,7 @@ function ApplicantCardTab({
           gender: about.gender,
           maritalStatus: about.maritalStatus,
           numDependants: about.numDependants,
+          dependants: about.dependants,
           citizenStatus: about.citizenStatus,
           residentialAddress: about.residentialAddress,
           residentialStatus: about.residentialStatus,
@@ -4480,16 +4573,17 @@ function ApplicantCardTab({
           propertyInTrust: about.propertyInTrust,
           companyOwnership: about.companyOwnership
         }
-      )
+      ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border border-border", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-4 py-2.5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Income" }),
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SectionEditButton, { onClick: onEditIncome, title: "Edit Income" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-border", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         IncomeCard,
         {
+          borderless: true,
           items: income.items.map((i) => ({
             incomeType: i.incomeType,
             jobTitle: i.jobTitle,
@@ -4503,26 +4597,133 @@ function ApplicantCardTab({
           })),
           totalMonthly: totalMonthlyIncome
         }
-      )
+      ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border border-border", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-4 py-2.5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Expenses" }),
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SectionEditButton, { onClick: onEditExpenses, title: "Edit Expenses" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-border", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         ExpensesCard,
         {
+          borderless: true,
           items: expenses.items.map((e) => ({
             expenseType: e.expenseType,
             amountLabel: `${formatCurrency(e.amount)} / ${e.frequency}`
           })),
           totalMonthly: totalMonthlyExpenses
         }
-      )
+      ) })
     ] })
   ] });
 }
+var STATUS_OPTIONS = ["verified", "pending", "rejected"];
+var STATUS_CONFIG = {
+  verified: {
+    Icon: import_lucide_react12.CheckCircle2,
+    label: "Verified",
+    iconCls: "text-success",
+    triggerCls: "border-success text-success"
+  },
+  pending: {
+    Icon: import_lucide_react12.AlertCircle,
+    label: "Pending",
+    iconCls: "text-warning",
+    triggerCls: "border-warning text-warning"
+  },
+  rejected: {
+    Icon: import_lucide_react12.AlertCircle,
+    label: "Rejected",
+    iconCls: "text-destructive",
+    triggerCls: "border-destructive text-destructive"
+  }
+};
+function DocRow({
+  doc,
+  status,
+  isSelected,
+  uploaderName,
+  onRowClick,
+  onStatusChange
+}) {
+  const {
+    Icon: StatusIcon,
+    label: statusLabel,
+    iconCls,
+    triggerCls
+  } = STATUS_CONFIG[status];
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    "div",
+    {
+      onClick: onRowClick,
+      className: cn(
+        "flex min-h-[44px] cursor-pointer items-center gap-3 px-4 transition-colors",
+        isSelected ? "bg-primary/5" : "hover:bg-muted/40"
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "shrink-0", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Checkbox, { checked: isSelected, onCheckedChange: () => onRowClick() }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.FileText, { className: "size-4 shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+          doc.url ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "a",
+            {
+              href: doc.url,
+              target: "_blank",
+              rel: "noreferrer",
+              onClick: (e) => e.stopPropagation(),
+              className: "w-fit text-label-medium text-foreground underline-offset-2 hover:underline",
+              children: doc.name
+            }
+          ) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-label-medium text-foreground", children: doc.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+            doc.documentType,
+            doc.checklistItem ? ` \xB7 ${doc.checklistItem}` : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Badge, { variant: "secondary", className: "shrink-0", children: uploaderName }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "shrink-0", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+          Select,
+          {
+            value: status,
+            onValueChange: (v) => onStatusChange(v),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                SelectTrigger,
+                {
+                  size: "sm",
+                  className: cn("h-7 w-[116px] gap-1.5 text-xs", triggerCls),
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(StatusIcon, { className: cn("size-3.5", iconCls) }),
+                    statusLabel
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SelectContent, { children: STATUS_OPTIONS.map((v) => {
+                const { Icon, label, iconCls: iconCls2 } = STATUS_CONFIG[v];
+                return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SelectItem, { value: v, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { className: cn("size-3.5", iconCls2) }),
+                  label
+                ] }) }, v);
+              }) })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "shrink-0 text-xs text-muted-foreground", children: doc.uploadedAt }),
+        doc.url && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          "a",
+          {
+            href: doc.url,
+            download: true,
+            onClick: (e) => e.stopPropagation(),
+            className: "shrink-0 text-muted-foreground transition-colors hover:text-foreground",
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.Download, { className: "size-4" })
+          }
+        )
+      ]
+    }
+  );
+}
 function OpportunitySummaryTab({
   isJoint = false,
   loanScenario,
@@ -4542,14 +4743,64 @@ function OpportunitySummaryTab({
   coIncome,
   onCoIncomeChange,
   coExpenses,
-  onCoExpensesChange
+  onCoExpensesChange,
+  documents = [],
+  onDocumentsDownload,
+  onDocumentStatusChange
 }) {
   var _a, _b;
   const [portalEl, setPortalEl] = (0, import_react4.useState)(null);
   const [summarySubTab, setSummarySubTab] = (0, import_react4.useState)(
     "joint"
   );
-  const [loanScenarioExpanded, setLoanScenarioExpanded] = (0, import_react4.useState)(true);
+  const [selectedDocIds, setSelectedDocIds] = (0, import_react4.useState)(/* @__PURE__ */ new Set());
+  function toggleDocSelection(id) {
+    setSelectedDocIds((prev) => {
+      const next = new Set(prev);
+      if (next.has(id)) next.delete(id);
+      else next.add(id);
+      return next;
+    });
+  }
+  const [docStatusOverrides, setDocStatusOverrides] = (0, import_react4.useState)({});
+  function handleDocStatusChange(docId, status) {
+    setDocStatusOverrides((prev) => __spreadProps(__spreadValues({}, prev), { [docId]: status }));
+    onDocumentStatusChange == null ? void 0 : onDocumentStatusChange(docId, status);
+  }
+  function effectiveStatus(doc) {
+    var _a2;
+    return (_a2 = docStatusOverrides[doc.id]) != null ? _a2 : doc.status;
+  }
+  const checklistProgress = React10.useMemo(() => {
+    var _a2, _b2;
+    const map = /* @__PURE__ */ new Map();
+    for (const doc of documents) {
+      if (!doc.checklistItem) continue;
+      const st = (_a2 = docStatusOverrides[doc.id]) != null ? _a2 : doc.status;
+      const entry = (_b2 = map.get(doc.checklistItem)) != null ? _b2 : {
+        count: 0,
+        hasVerified: false,
+        hasPending: false
+      };
+      entry.count += 1;
+      if (st === "verified") entry.hasVerified = true;
+      if (st === "pending") entry.hasPending = true;
+      map.set(doc.checklistItem, entry);
+    }
+    return Array.from(map.entries()).map(([name, data]) => __spreadValues({ name }, data));
+  }, [documents, docStatusOverrides]);
+  const groupedDocs = React10.useMemo(() => {
+    var _a2;
+    if (documents.length <= 5 || !documents.some((d) => d.checklistItem))
+      return null;
+    const groups = {};
+    for (const doc of documents) {
+      const key = (_a2 = doc.checklistItem) != null ? _a2 : "Other";
+      if (!groups[key]) groups[key] = [];
+      groups[key].push(doc);
+    }
+    return groups;
+  }, [documents]);
   const [editLoanOpen, setEditLoanOpen] = (0, import_react4.useState)(false);
   const [editAssetsOpen, setEditAssetsOpen] = (0, import_react4.useState)(false);
   const [editDebtsOpen, setEditDebtsOpen] = (0, import_react4.useState)(false);
@@ -4593,20 +4844,7 @@ function OpportunitySummaryTab({
     ),
     /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "mb-4 border border-border", children: [
       /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-4 py-2.5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
-          Button,
-          {
-            type: "button",
-            variant: "ghost",
-            className: "h-auto flex-1 justify-start gap-2 px-0 text-left",
-            onClick: () => setLoanScenarioExpanded((v) => !v),
-            "aria-expanded": loanScenarioExpanded,
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Loan Scenario" }),
-              loanScenarioExpanded ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.ChevronUp, { className: "size-3.5 text-muted-foreground" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.ChevronDown, { className: "size-3.5 text-muted-foreground" })
-            ]
-          }
-        ),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Loan Scenario" }),
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           SectionEditButton,
           {
@@ -4615,7 +4853,7 @@ function OpportunitySummaryTab({
           }
         )
       ] }),
-      loanScenarioExpanded && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 border-t border-border p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "grid grid-cols-4 gap-x-6 gap-y-4 border-t border-border p-4", children: [
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialDetailField, { label: "Lending Type", value: "Home Loan" }),
         /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           FinancialDetailField,
@@ -4749,8 +4987,87 @@ function OpportunitySummaryTab({
               ] })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border border-border", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "px-4 py-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Documents" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "p-4", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-body-small text-muted-foreground", children: "No documents uploaded yet." }) })
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex min-h-[40px] items-center justify-between px-4", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FinancialSectionLabel, { children: "Documents" }),
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-3", children: [
+                  selectedDocIds.size > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                    Button,
+                    {
+                      size: "sm",
+                      variant: "outline-secondary",
+                      className: "h-7 gap-1.5 text-xs",
+                      onClick: () => {
+                        const selected = documents.filter(
+                          (d) => selectedDocIds.has(d.id)
+                        );
+                        onDocumentsDownload == null ? void 0 : onDocumentsDownload(selected);
+                      },
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.Download, { className: "size-3.5" }),
+                        "Download (",
+                        selectedDocIds.size,
+                        ")"
+                      ]
+                    }
+                  ),
+                  documents.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+                    documents.length,
+                    " file",
+                    documents.length !== 1 ? "s" : ""
+                  ] })
+                ] })
+              ] }),
+              checklistProgress.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-wrap gap-x-4 gap-y-1.5 border-t border-border px-4 py-3", children: checklistProgress.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                "span",
+                {
+                  className: cn(
+                    "flex items-center gap-1 text-xs",
+                    cat.hasVerified ? "text-success" : "text-warning"
+                  ),
+                  children: [
+                    cat.hasVerified ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.CheckCircle2, { className: "size-3.5 shrink-0" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.AlertCircle, { className: "size-3.5 shrink-0" }),
+                    cat.name,
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-muted-foreground", children: [
+                      "(",
+                      cat.count,
+                      ")"
+                    ] })
+                  ]
+                },
+                cat.name
+              )) }),
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-border", children: documents.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "px-4 py-4 text-body-small text-muted-foreground", children: "No documents uploaded yet." }) : groupedDocs ? (
+                // Grouped by checklistItem
+                Object.entries(groupedDocs).map(([category, docs]) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "bg-muted/30 px-4 py-1.5 text-xs font-medium text-muted-foreground", children: category }),
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-col divide-y divide-border", children: docs.map((doc) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                    DocRow,
+                    {
+                      doc,
+                      status: effectiveStatus(doc),
+                      isSelected: selectedDocIds.has(doc.id),
+                      uploaderName: doc.uploadedBy === "main" ? mainAbout.firstName || "Main" : (coAbout == null ? void 0 : coAbout.firstName) || "Co",
+                      onRowClick: () => toggleDocSelection(doc.id),
+                      onStatusChange: (s) => handleDocStatusChange(doc.id, s)
+                    },
+                    doc.id
+                  )) })
+                ] }, category))
+              ) : (
+                // Flat list
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-col divide-y divide-border", children: documents.map((doc) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                  DocRow,
+                  {
+                    doc,
+                    status: effectiveStatus(doc),
+                    isSelected: selectedDocIds.has(doc.id),
+                    uploaderName: doc.uploadedBy === "main" ? mainAbout.firstName || "Main" : (coAbout == null ? void 0 : coAbout.firstName) || "Co",
+                    onRowClick: () => toggleDocSelection(doc.id),
+                    onStatusChange: (s) => handleDocStatusChange(doc.id, s)
+                  },
+                  doc.id
+                )) })
+              ) })
             ] }),
             propertyCards.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border border-border", children: [
               /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-4 py-2.5", children: [
@@ -4785,7 +5102,7 @@ function OpportunitySummaryTab({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "grid grid-cols-2 gap-3 p-4", children: debts.map((debt) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DebtCard, __spreadValues({}, debtToCard(debt)), debt.id)) })
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "grid grid-cols-2 gap-3 border-t border-border p-4", children: debts.map((debt) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DebtCard, __spreadValues({}, debtToCard(debt)), debt.id)) })
             ] })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TabsContent, { value: "main", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(