@ezfit/ui 1.0.0 → 1.2.0

package/dist/index.js

@@ -1,40 +1,40 @@
-import { clsx as Q } from "clsx";
-import { twMerge as Y } from "tailwind-merge";
-import { jsx as e, jsxs as l, Fragment as A } from "react/jsx-runtime";
-import { ArrowDown01Icon as W, InformationCircleIcon as Z, AlertCircleIcon as ee, Alert01Icon as te, CheckmarkCircle01Icon as re, Cancel01Icon as P, Loading03Icon as ae, BarChartIcon as ne, Tick02Icon as E, DropletIcon as oe, Search01Icon as se, UserIcon as ie, ChartUpIcon as le, ChartDownIcon as ce } from "@hugeicons/core-free-icons";
+import { clsx as Z } from "clsx";
+import { twMerge as ee } from "tailwind-merge";
+import { jsx as e, jsxs as l, Fragment as P } from "react/jsx-runtime";
+import { ArrowDown01Icon as H, InformationCircleIcon as te, AlertCircleIcon as re, Alert01Icon as ne, CheckmarkCircle01Icon as ae, Cancel01Icon as j, Loading03Icon as oe, BarChartIcon as se, Tick02Icon as _, ArrowLeft01Icon as ie, ArrowRight01Icon as le, DropletIcon as ce, Search01Icon as de, UserIcon as pe, ChartUpIcon as me, ChartDownIcon as ue } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon as u } from "@hugeicons/react";
 import * as k from "@radix-ui/react-accordion";
-import { forwardRef as c, useId as j, useState as de, useCallback as V, useMemo as pe, useContext as me, createContext as ue } from "react";
-import { ResponsiveContainer as _, AreaChart as xe, Tooltip as G, Area as ge, BarChart as fe, XAxis as be, Bar as he, Cell as H, PieChart as Ne, Pie as ve } from "recharts";
-import { cva as w } from "class-variance-authority";
+import { forwardRef as p, useId as F, useState as xe, useCallback as V, useMemo as ge, useContext as fe, createContext as be } from "react";
+import { ResponsiveContainer as E, AreaChart as he, Tooltip as G, Area as ve, BarChart as Ne, XAxis as ye, Bar as we, Cell as O, PieChart as Ce, Pie as ke } from "recharts";
+import { cva as y } from "class-variance-authority";
 import * as $ from "@radix-ui/react-checkbox";
 import * as N from "@radix-ui/react-dialog";
-import * as O from "@radix-ui/react-radio-group";
-import * as b from "@radix-ui/react-select";
-import * as T from "@radix-ui/react-slider";
+import * as K from "@radix-ui/react-radio-group";
+import * as h from "@radix-ui/react-select";
+import * as I from "@radix-ui/react-slider";
 import * as L from "@radix-ui/react-switch";
-import * as I from "@radix-ui/react-tabs";
+import * as z from "@radix-ui/react-tabs";
 import * as C from "@radix-ui/react-toast";
-import * as h from "@radix-ui/react-tooltip";
-function s(...a) {
-  return Y(Q(a));
+import * as v from "@radix-ui/react-tooltip";
+function i(...n) {
+  return ee(Z(n));
 }
-const Gt = k.Root, ye = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
+const Jt = k.Root, Te = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
   k.Item,
   {
     ref: t,
-    className: s("overflow-hidden rounded-list border border-border-soft", a),
+    className: i("overflow-hidden rounded-list border border-border-soft", n),
     ...r
   }
 ));
-ye.displayName = "AccordionItem";
-const we = c(({ className: a, children: r, ...t }, n) => /* @__PURE__ */ e(k.Header, { className: "flex", children: /* @__PURE__ */ l(
+Te.displayName = "AccordionItem";
+const Ie = p(({ className: n, children: r, ...t }, a) => /* @__PURE__ */ e(k.Header, { className: "flex", children: /* @__PURE__ */ l(
   k.Trigger,
   {
-    ref: n,
-    className: s(
+    ref: a,
+    className: i(
       "group flex flex-1 cursor-pointer items-center justify-between p-4 text-left text-sm font-semibold outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
-      a
+      n
     ),
     ...t,
     children: [
@@ -42,31 +42,31 @@ const we = c(({ className: a, children: r, ...t }, n) => /* @__PURE__ */ e(k.Hea
       /* @__PURE__ */ e(
         u,
         {
-          icon: W,
+          icon: H,
           className: "size-[18px] flex-none text-subtle-foreground transition-transform group-data-[state=open]:rotate-180"
         }
       )
     ]
   }
 ) }));
-we.displayName = "AccordionTrigger";
-const Ce = c(({ className: a, children: r, ...t }, n) => /* @__PURE__ */ e(
+Ie.displayName = "AccordionTrigger";
+const Fe = p(({ className: n, children: r, ...t }, a) => /* @__PURE__ */ e(
   k.Content,
   {
-    ref: n,
+    ref: a,
     className: "overflow-hidden text-[13px] leading-relaxed text-muted-foreground data-[state=closed]:animate-[ezfade_0.18s_ease] data-[state=open]:animate-[ezfade_0.18s_ease]",
     ...t,
-    children: /* @__PURE__ */ e("div", { className: s("px-4 pb-4", a), children: r })
+    children: /* @__PURE__ */ e("div", { className: i("px-4 pb-4", n), children: r })
   }
 ));
-Ce.displayName = "AccordionContent";
-const ke = w(
+Fe.displayName = "AccordionContent";
+const ze = y(
   "inline-flex items-center gap-1.5 rounded-pill font-semibold whitespace-nowrap",
   {
     variants: {
       variant: {
-        active: "bg-accent-300 text-accent-foreground",
-        pro: "bg-accent-300 text-accent-muted-foreground",
+        active: "bg-accent-300 text-accent",
+        pro: "bg-white/20 text-white",
         info: "bg-info-bg text-info",
         success: "bg-success-bg text-success",
         warning: "bg-warning-bg text-warning",
@@ -80,11 +80,11 @@ const ke = w(
     },
     defaultVariants: { variant: "neutral", size: "md" }
   }
-), Te = c(
-  ({ className: a, variant: r, size: t, ...n }, o) => /* @__PURE__ */ e("span", { ref: o, className: s(ke({ variant: r, size: t }), a), ...n })
+), Be = p(
+  ({ className: n, variant: r, size: t, ...a }, o) => /* @__PURE__ */ e("span", { ref: o, className: i(ze({ variant: r, size: t }), n), ...a })
 );
-Te.displayName = "Badge";
-const Ie = w("flex items-center gap-3.5 rounded-list border p-[15px] px-[18px]", {
+Be.displayName = "Badge";
+const De = y("flex items-center gap-3.5 rounded-list border p-[15px] px-[18px]", {
   variants: {
     variant: {
       success: "border-success-border bg-success-bg",
@@ -94,44 +94,44 @@ const Ie = w("flex items-center gap-3.5 rounded-list border p-[15px] px-[18px]",
     }
   },
   defaultVariants: { variant: "info" }
-}), Fe = {
-  success: re,
-  warning: te,
-  error: ee,
-  info: Z
+}), Se = {
+  success: ae,
+  warning: ne,
+  error: re,
+  info: te
 }, M = {
   success: "text-success",
   warning: "text-warning",
   error: "text-error",
   info: "text-info"
-}, ze = {
+}, Ae = {
   success: "text-[#166534]",
   warning: "text-[#92400E]",
   error: "text-[#991B1B]",
   info: "text-[#1E40AF]"
-}, Se = {
+}, Pe = {
   success: "text-[#15803D]",
   warning: "text-[#B45309]",
   error: "text-[#B91C1C]",
   info: "text-[#1D4ED8]"
-}, Be = c(
-  ({ className: a, variant: r = "info", title: t, children: n, onDismiss: o, ...i }, p) => {
-    const d = r ?? "info", m = Fe[d];
-    return /* @__PURE__ */ l("div", { ref: p, role: "alert", className: s(Ie({ variant: r }), a), ...i, children: [
+}, je = p(
+  ({ className: n, variant: r = "info", title: t, children: a, onDismiss: o, ...s }, c) => {
+    const d = r ?? "info", m = Se[d];
+    return /* @__PURE__ */ l("div", { ref: c, role: "alert", className: i(De({ variant: r }), n), ...s, children: [
       /* @__PURE__ */ e(
         u,
         {
           icon: m,
-          className: s("size-5 flex-none", M[d]),
+          className: i("size-5 flex-none", M[d]),
           strokeWidth: 2
         }
       ),
       /* @__PURE__ */ l("div", { className: "flex-1 text-sm", children: [
-        t ? /* @__PURE__ */ l("span", { className: s("font-semibold", ze[d]), children: [
+        t ? /* @__PURE__ */ l("span", { className: i("font-semibold", Ae[d]), children: [
           t,
           " "
         ] }) : null,
-        /* @__PURE__ */ e("span", { className: Se[d], children: n })
+        /* @__PURE__ */ e("span", { className: Pe[d], children: a })
       ] }),
       o ? /* @__PURE__ */ e(
         "button",
@@ -139,25 +139,25 @@ const Ie = w("flex items-center gap-3.5 rounded-list border p-[15px] px-[18px]",
           type: "button",
           onClick: o,
           "aria-label": "Fechar",
-          className: s(
+          className: i(
             "flex-none cursor-pointer opacity-60 transition-opacity hover:opacity-100",
             M[d]
           ),
-          children: /* @__PURE__ */ e(u, { icon: P, className: "size-[17px]" })
+          children: /* @__PURE__ */ e(u, { icon: j, className: "size-[17px]" })
         }
       ) : null
     ] });
   }
 );
-Be.displayName = "Banner";
-const De = w(
+je.displayName = "Banner";
+const _e = y(
   "inline-flex items-center justify-center gap-2 font-sans font-semibold whitespace-nowrap transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/25 disabled:pointer-events-none disabled:opacity-70",
   {
     variants: {
       variant: {
         primary: "bg-primary text-primary-foreground hover:bg-primary-hover",
-        accent: "bg-accent-300 text-accent-foreground hover:bg-accent",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary-hover",
+        accent: "bg-accent text-accent-foreground hover:bg-accent-hover",
+        secondary: "bg-accent-300 text-accent hover:brightness-95",
         ghost: "bg-transparent text-muted-foreground hover:bg-secondary hover:text-foreground",
         destructive: "bg-error-bg text-error hover:bg-error/15"
       },
@@ -172,21 +172,21 @@ const De = w(
       size: "md"
     }
   }
-), Ae = c(
-  ({ className: a, variant: r, size: t, loading: n = !1, disabled: o, children: i, type: p = "button", ...d }, m) => /* @__PURE__ */ e(
+), Ee = p(
+  ({ className: n, variant: r, size: t, loading: a = !1, disabled: o, children: s, type: c = "button", ...d }, m) => /* @__PURE__ */ e(
     "button",
     {
       ref: m,
-      type: p,
-      className: s(De({ variant: r, size: t }), a),
-      disabled: o || n,
+      type: c,
+      className: i(_e({ variant: r, size: t }), n),
+      disabled: o || a,
       ...d,
-      children: n ? /* @__PURE__ */ e(u, { icon: ae, className: "size-[18px] animate-spin-slow" }) : i
+      children: a ? /* @__PURE__ */ e(u, { icon: oe, className: "size-[18px] animate-spin-slow" }) : s
     }
   )
 );
-Ae.displayName = "Button";
-const Pe = w("rounded-card", {
+Ee.displayName = "Button";
+const Re = y("rounded-card", {
   variants: {
     variant: {
       light: "bg-card text-card-foreground shadow-card",
@@ -200,101 +200,102 @@ const Pe = w("rounded-card", {
     }
   },
   defaultVariants: { variant: "light", padding: "md" }
-}), Ee = c(
-  ({ className: a, variant: r, padding: t, ...n }, o) => /* @__PURE__ */ e("div", { ref: o, className: s(Pe({ variant: r, padding: t }), a), ...n })
+}), Ve = p(
+  ({ className: n, variant: r, padding: t, ...a }, o) => /* @__PURE__ */ e("div", { ref: o, className: i(Re({ variant: r, padding: t }), n), ...a })
 );
-Ee.displayName = "Card";
-const je = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e(
+Ve.displayName = "Card";
+const $e = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e(
     "div",
     {
       ref: t,
-      className: s("mb-4 flex items-start justify-between gap-3", a),
+      className: i("mb-4 flex items-start justify-between gap-3", n),
       ...r
     }
   )
 );
-je.displayName = "CardHeader";
-const _e = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e("h3", { ref: t, className: s("text-base font-semibold", a), ...r })
+$e.displayName = "CardHeader";
+const Le = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e("h3", { ref: t, className: i("text-base font-semibold", n), ...r })
 );
-_e.displayName = "CardTitle";
-const Re = c(({ className: a, ...r }, t) => /* @__PURE__ */ e("p", { ref: t, className: s("text-[13px] text-subtle-foreground", a), ...r }));
-Re.displayName = "CardDescription";
-const Ve = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: s(a), ...r })
+Le.displayName = "CardTitle";
+const Me = p(({ className: n, ...r }, t) => /* @__PURE__ */ e("p", { ref: t, className: i("text-[13px] text-muted-foreground", n), ...r }));
+Me.displayName = "CardDescription";
+const We = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: i(n), ...r })
 );
-Ve.displayName = "CardContent";
-const y = {
-  primary: "#1E293B",
+We.displayName = "CardContent";
+const w = {
+  primary: "#16181D",
   primaryForeground: "#FFFFFF",
-  accent: "#A3E635",
-  accent300: "#BEF264",
+  accent: "#2B4BF2",
+  accentHover: "#2540DA",
+  accent300: "#E8ECFD",
   background: "#FFFFFF",
-  foreground: "#1E293B",
-  appBg: "#EEF1F5",
-  muted: "#F8FAFC",
-  mutedForeground: "#64748B",
-  subtleForeground: "#94A3B8",
-  secondary: "#F1F5F9",
-  secondaryForeground: "#0F172A",
-  border: "#E2E8F0",
-  ring: "#1E293B",
+  foreground: "#16181D",
+  appBg: "#F4F6FA",
+  muted: "#F5F7FA",
+  mutedForeground: "#6B7280",
+  subtleForeground: "#8B93A2",
+  secondary: "#EEF0F4",
+  secondaryForeground: "#16181D",
+  border: "#E5E7EB",
+  ring: "#2B4BF2",
   success: "#22C55E",
   warning: "#F59E0B",
-  error: "#EF4444",
-  info: "#3B82F6",
-  protein: "#3B82F6",
-  carbs: "#EAB308",
-  carbsText: "#CA8A04",
+  error: "#F23B47",
+  info: "#2B4BF2",
+  protein: "#2B4BF2",
+  carbs: "#C4C9D2",
+  carbsText: "#6B7280",
   fat: "#F97316",
   cardio: "#22C55E"
-}, F = {
-  protein: y.protein,
-  carbs: y.carbs,
-  fat: y.fat,
-  cardio: y.cardio,
-  accent: y.accent,
-  primary: y.primary,
-  muted: y.secondary,
-  grid: "#F1F5F9"
-}, Ht = {
+}, B = {
+  protein: w.protein,
+  carbs: w.carbs,
+  fat: w.fat,
+  cardio: w.cardio,
+  accent: w.accent,
+  primary: w.primary,
+  muted: w.secondary,
+  grid: "#EEF0F4"
+}, Qt = {
   input: "8px",
-  field: "12px",
-  button: "14px",
-  list: "16px",
-  tile: "18px",
-  card: "24px",
+  field: "10px",
+  button: "10px",
+  list: "12px",
+  tile: "14px",
+  card: "16px",
   pill: "999px"
-}, Ot = {
-  sans: "'Space Grotesk', ui-sans-serif, system-ui, sans-serif",
+}, Yt = {
+  sans: "'Manrope', ui-sans-serif, system-ui, sans-serif",
   mono: "'Space Mono', ui-monospace, monospace"
-}, R = c(
-  ({ className: a, title: r, rows: t, ...n }, o) => /* @__PURE__ */ l(
+}, R = p(
+  ({ className: n, title: r, rows: t, ...a }, o) => /* @__PURE__ */ l(
     "div",
     {
       ref: o,
-      className: s(
+      className: i(
         "min-w-[150px] rounded-[14px] bg-primary px-4 py-3 text-primary-foreground shadow-[0_8px_24px_rgba(15,23,42,0.25)]",
-        a
+        n
       ),
-      ...n,
+      ...a,
       children: [
         r ? /* @__PURE__ */ e("div", { className: "mb-1.5 text-[11px] text-subtle-foreground", children: r }) : null,
-        t.map((i) => /* @__PURE__ */ l("div", { className: "flex items-center gap-2 text-[13px] font-semibold", children: [
-          i.color ? /* @__PURE__ */ e("span", { className: "size-[9px] flex-none rounded-full", style: { background: i.color } }) : null,
-          i.label,
-          /* @__PURE__ */ e("span", { className: "ml-auto", children: i.value })
-        ] }, i.label))
+        t.map((s) => /* @__PURE__ */ l("div", { className: "flex items-center gap-2 text-[13px] font-semibold", children: [
+          s.color ? /* @__PURE__ */ e("span", { className: "size-[9px] flex-none rounded-full", style: { background: s.color } }) : null,
+          s.label,
+          /* @__PURE__ */ e("span", { className: "ml-auto", children: s.value })
+        ] }, s.label))
       ]
     }
   )
 );
 R.displayName = "ChartTooltip";
-function $e(a) {
-  return function({ active: t, payload: n, label: o }) {
-    if (!t || !(n != null && n.length)) return null;
-    const i = n[0];
+function He(n) {
+  return function({ active: t, payload: a, label: o }) {
+    if (!t || !(a != null && a.length)) return null;
+    const s = a[0];
     return /* @__PURE__ */ e(
       R,
       {
@@ -302,47 +303,47 @@ function $e(a) {
         rows: [
           {
             label: "Valor",
-            value: `${(i == null ? void 0 : i.value) ?? 0}${a ? ` ${a}` : ""}`,
-            color: F.accent
+            value: `${(s == null ? void 0 : s.value) ?? 0}${n ? ` ${n}` : ""}`,
+            color: B.accent
           }
         ]
       }
     );
   };
 }
-function Kt({
-  data: a,
+function Zt({
+  data: n,
   height: r = 180,
-  color: t = F.accent,
-  unit: n = "",
+  color: t = B.accent,
+  unit: a = "",
   className: o
 }) {
-  const i = "ezfit-area-gradient";
-  return /* @__PURE__ */ e("div", { className: s("w-full", o), style: { height: r }, children: /* @__PURE__ */ e(_, { width: "100%", height: "100%", children: /* @__PURE__ */ l(xe, { data: a, margin: { top: 8, right: 8, bottom: 0, left: 8 }, children: [
-    /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l("linearGradient", { id: i, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+  const s = "ezfit-area-gradient";
+  return /* @__PURE__ */ e("div", { className: i("w-full", o), style: { height: r }, children: /* @__PURE__ */ e(E, { width: "100%", height: "100%", children: /* @__PURE__ */ l(he, { data: n, margin: { top: 8, right: 8, bottom: 0, left: 8 }, children: [
+    /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l("linearGradient", { id: s, x1: "0", y1: "0", x2: "0", y2: "1", children: [
       /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t, stopOpacity: 0.45 }),
       /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t, stopOpacity: 0 })
     ] }) }),
-    /* @__PURE__ */ e(G, { cursor: !1, content: $e(n) }),
+    /* @__PURE__ */ e(G, { cursor: !1, content: He(a) }),
     /* @__PURE__ */ e(
-      ge,
+      ve,
       {
         type: "monotone",
         dataKey: "value",
         stroke: t,
         strokeWidth: 3,
         strokeLinecap: "round",
-        fill: `url(#${i})`,
+        fill: `url(#${s})`,
         dot: !1,
         activeDot: { r: 5, fill: "#fff", stroke: t, strokeWidth: 3 }
       }
     )
   ] }) }) });
 }
-function Le(a) {
-  return function({ active: t, payload: n, label: o }) {
-    if (!t || !(n != null && n.length)) return null;
-    const i = n[0];
+function Ge(n) {
+  return function({ active: t, payload: a, label: o }) {
+    if (!t || !(a != null && a.length)) return null;
+    const s = a[0];
     return /* @__PURE__ */ e(
       R,
       {
@@ -350,18 +351,18 @@ function Le(a) {
         rows: [
           {
             label: "Valor",
-            value: `${(i == null ? void 0 : i.value) ?? 0}${a ? ` ${a}` : ""}`,
-            color: F.accent
+            value: `${(s == null ? void 0 : s.value) ?? 0}${n ? ` ${n}` : ""}`,
+            color: B.accent
           }
         ]
       }
     );
   };
 }
-function qt({ data: a, activeIndex: r, height: t = 220, unit: n = "", className: o }) {
-  return /* @__PURE__ */ e("div", { className: s("w-full", o), style: { height: t }, children: /* @__PURE__ */ e(_, { width: "100%", height: "100%", children: /* @__PURE__ */ l(fe, { data: a, margin: { top: 24, right: 0, bottom: 0, left: 0 }, children: [
+function er({ data: n, activeIndex: r, height: t = 220, unit: a = "", className: o }) {
+  return /* @__PURE__ */ e("div", { className: i("w-full", o), style: { height: t }, children: /* @__PURE__ */ e(E, { width: "100%", height: "100%", children: /* @__PURE__ */ l(Ne, { data: n, margin: { top: 24, right: 0, bottom: 0, left: 0 }, children: [
     /* @__PURE__ */ e(
-      be,
+      ye,
       {
         dataKey: "label",
         axisLine: !1,
@@ -370,47 +371,47 @@ function qt({ data: a, activeIndex: r, height: t = 220, unit: n = "", className:
         dy: 8
       }
     ),
-    /* @__PURE__ */ e(G, { cursor: !1, content: Le(n) }),
-    /* @__PURE__ */ e(he, { dataKey: "value", radius: [10, 10, 10, 10], maxBarSize: 40, children: a.map((i, p) => /* @__PURE__ */ e(
-      H,
+    /* @__PURE__ */ e(G, { cursor: !1, content: Ge(a) }),
+    /* @__PURE__ */ e(we, { dataKey: "value", radius: [10, 10, 10, 10], maxBarSize: 40, children: n.map((s, c) => /* @__PURE__ */ e(
+      O,
       {
-        fill: p === r ? F.accent : "#CBD5E1"
+        fill: c === r ? B.accent : "#CBD5E1"
       },
-      i.label
+      s.label
     )) })
   ] }) }) });
 }
-const Me = c(
+const Oe = p(
   ({
-    className: a,
-    icon: r = ne,
+    className: n,
+    icon: r = se,
     title: t = "0",
-    description: n = "Sem dados para o periodo",
+    description: a = "Sem dados para o periodo",
     ...o
-  }, i) => /* @__PURE__ */ l(
+  }, s) => /* @__PURE__ */ l(
     "div",
     {
-      ref: i,
-      className: s(
+      ref: s,
+      className: i(
         "flex h-[148px] flex-col items-center justify-center rounded-tile border-2 border-dashed border-border text-center",
-        a
+        n
       ),
       ...o,
       children: [
         /* @__PURE__ */ e("div", { className: "mb-3 flex size-[46px] items-center justify-center rounded-[14px] bg-secondary", children: /* @__PURE__ */ e(u, { icon: r, className: "size-[22px] text-subtle-foreground", strokeWidth: 2 }) }),
         /* @__PURE__ */ e("div", { className: "text-[32px] leading-none font-bold text-[#CBD5E1]", children: t }),
-        /* @__PURE__ */ e("div", { className: "mt-1.5 text-xs text-subtle-foreground", children: n })
+        /* @__PURE__ */ e("div", { className: "mt-1.5 text-xs text-subtle-foreground", children: a })
       ]
     }
   )
 );
-Me.displayName = "ChartEmptyState";
-const We = c(
-  ({ className: a, items: r, ...t }, n) => /* @__PURE__ */ e("div", { ref: n, className: s("flex flex-wrap gap-3", a), ...t, children: r.map((o) => /* @__PURE__ */ l("div", { className: "inline-flex items-center gap-[7px] text-[13px]", children: [
+Oe.displayName = "ChartEmptyState";
+const Ke = p(
+  ({ className: n, items: r, ...t }, a) => /* @__PURE__ */ e("div", { ref: a, className: i("flex flex-wrap gap-3", n), ...t, children: r.map((o) => /* @__PURE__ */ l("div", { className: "inline-flex items-center gap-[7px] text-[13px]", children: [
     /* @__PURE__ */ e(
       "span",
       {
-        className: s(
+        className: i(
           "size-[11px] flex-none",
           o.shape === "square" ? "rounded-[4px]" : "rounded-full"
         ),
@@ -421,20 +422,20 @@ const We = c(
     o.value ? /* @__PURE__ */ e("span", { className: "text-subtle-foreground", children: o.value }) : null
   ] }, o.label)) })
 );
-We.displayName = "ChartLegend";
-function Ut({
-  data: a,
+Ke.displayName = "ChartLegend";
+function tr({
+  data: n,
   size: r = 120,
   thickness: t = 18,
-  centerValue: n,
+  centerValue: a,
   centerCaption: o,
-  className: i
+  className: s
 }) {
-  return /* @__PURE__ */ l("div", { className: s("relative flex-none", i), style: { width: r, height: r }, children: [
-    /* @__PURE__ */ e(_, { width: "100%", height: "100%", children: /* @__PURE__ */ e(Ne, { children: /* @__PURE__ */ e(
-      ve,
+  return /* @__PURE__ */ l("div", { className: i("relative flex-none", s), style: { width: r, height: r }, children: [
+    /* @__PURE__ */ e(E, { width: "100%", height: "100%", children: /* @__PURE__ */ e(Ce, { children: /* @__PURE__ */ e(
+      ke,
       {
-        data: a,
+        data: n,
         dataKey: "value",
         nameKey: "name",
         cx: "50%",
@@ -445,95 +446,136 @@ function Ut({
         endAngle: -270,
         paddingAngle: 0,
         stroke: "none",
-        children: a.map((p) => /* @__PURE__ */ e(H, { fill: p.color }, p.name))
+        children: n.map((c) => /* @__PURE__ */ e(O, { fill: c.color }, c.name))
       }
     ) }) }),
-    n || o ? /* @__PURE__ */ l("div", { className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center", children: [
-      n ? /* @__PURE__ */ e("span", { className: "text-[22px] font-bold", children: n }) : null,
+    a || o ? /* @__PURE__ */ l("div", { className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center", children: [
+      a ? /* @__PURE__ */ e("span", { className: "text-[22px] font-bold", children: a }) : null,
       o ? /* @__PURE__ */ e("span", { className: "text-[10px] tracking-wide text-subtle-foreground uppercase", children: o }) : null
     ] }) : null
   ] });
 }
-const Ge = c(
-  ({ className: a, label: r, id: t, ...n }, o) => {
-    const i = j(), p = t ?? i, d = /* @__PURE__ */ e(
+const qe = p(
+  ({ className: n, label: r, id: t, ...a }, o) => {
+    const s = F(), c = t ?? s, d = /* @__PURE__ */ e(
       $.Root,
       {
         ref: o,
-        id: p,
-        className: s(
+        id: c,
+        className: i(
           "flex size-[22px] flex-none cursor-pointer items-center justify-center rounded-[7px] border-2 transition-colors outline-none",
           "border-input bg-background",
           "data-[state=checked]:border-accent data-[state=checked]:bg-accent",
           "focus-visible:ring-3 focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-60",
-          a
+          n
         ),
-        ...n,
+        ...a,
         children: /* @__PURE__ */ e($.Indicator, { children: /* @__PURE__ */ e(
           u,
           {
-            icon: E,
+            icon: _,
             className: "size-[15px] text-accent-foreground",
             strokeWidth: 3
           }
         ) })
       }
     );
-    return r ? /* @__PURE__ */ l("label", { htmlFor: p, className: "flex cursor-pointer items-center gap-3.5", children: [
+    return r ? /* @__PURE__ */ l("label", { htmlFor: c, className: "flex cursor-pointer items-center gap-3.5", children: [
       d,
       /* @__PURE__ */ e("span", { className: "text-sm font-medium", children: r })
     ] }) : d;
   }
 );
-Ge.displayName = "Checkbox";
-function Xt({ columns: a, data: r, getRowKey: t, className: n, ...o }) {
-  return /* @__PURE__ */ l("table", { className: s("w-full border-collapse", n), ...o, children: [
-    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { children: a.map((i) => /* @__PURE__ */ e(
+qe.displayName = "Checkbox";
+function rr({ columns: n, data: r, getRowKey: t, className: a, ...o }) {
+  return /* @__PURE__ */ l("table", { className: i("w-full border-collapse", a), ...o, children: [
+    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { children: n.map((s) => /* @__PURE__ */ e(
       "th",
       {
-        className: s(
+        className: i(
           "pb-3.5 font-mono text-[11px] font-bold tracking-wider text-subtle-foreground uppercase",
-          i.align === "right" ? "text-right" : "text-left"
+          s.align === "right" ? "text-right" : "text-left"
         ),
-        children: i.header
+        children: s.header
       },
-      i.header
+      s.header
     )) }) }),
-    /* @__PURE__ */ e("tbody", { children: r.map((i, p) => /* @__PURE__ */ e("tr", { className: "border-t border-border-soft", children: a.map((d) => /* @__PURE__ */ e(
+    /* @__PURE__ */ e("tbody", { children: r.map((s, c) => /* @__PURE__ */ e("tr", { className: "border-t border-border-soft", children: n.map((d) => /* @__PURE__ */ e(
       "td",
       {
-        className: s(
+        className: i(
           "py-3.5 text-sm",
           d.align === "right" ? "text-right" : "text-left"
         ),
-        children: d.cell(i)
+        children: d.cell(s)
       },
       d.header
-    )) }, t(i, p))) })
+    )) }, t(s, c))) })
   ] });
 }
-const Jt = N.Root, Qt = N.Trigger, Yt = N.Close, He = N.Portal, K = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
+const W = "flex size-9 flex-none cursor-pointer items-center justify-center rounded-pill text-muted-foreground transition-colors outline-none hover:bg-secondary hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-40", Ue = p(
+  ({ className: n, label: r, onPrev: t, onNext: a, onLabelClick: o, nextDisabled: s = !1, ...c }, d) => /* @__PURE__ */ l(
+    "div",
+    {
+      ref: d,
+      className: i(
+        "inline-flex items-center gap-1 rounded-pill border border-border bg-card p-1.5",
+        n
+      ),
+      ...c,
+      children: [
+        /* @__PURE__ */ e("button", { type: "button", "aria-label": "Dia anterior", onClick: t, className: W, children: /* @__PURE__ */ e(u, { icon: ie, className: "size-[18px]", strokeWidth: 2 }) }),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: o,
+            disabled: !o,
+            className: i(
+              "min-w-20 rounded-pill px-3 py-1.5 text-center font-sans text-sm font-semibold whitespace-nowrap outline-none",
+              o && "cursor-pointer transition-colors hover:bg-secondary focus-visible:ring-3 focus-visible:ring-ring/25"
+            ),
+            children: r
+          }
+        ),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            "aria-label": "Proximo dia",
+            onClick: a,
+            disabled: s,
+            className: W,
+            children: /* @__PURE__ */ e(u, { icon: le, className: "size-[18px]", strokeWidth: 2 })
+          }
+        )
+      ]
+    }
+  )
+);
+Ue.displayName = "DateNavigator";
+const nr = N.Root, ar = N.Trigger, or = N.Close, Xe = N.Portal, q = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
   N.Overlay,
   {
     ref: t,
-    className: s(
+    className: i(
       "fixed inset-0 z-90 flex items-center justify-center bg-[rgba(15,23,42,0.45)] p-6 backdrop-blur-[3px] data-[state=open]:animate-fade-in",
-      a
+      n
     ),
     ...r
   }
 ));
-K.displayName = "DialogOverlay";
-const Oe = c(({ className: a, children: r, showClose: t = !0, ...n }, o) => /* @__PURE__ */ e(He, { children: /* @__PURE__ */ e(K, { children: /* @__PURE__ */ l(
+q.displayName = "DialogOverlay";
+const Je = p(({ className: n, children: r, showClose: t = !0, ...a }, o) => /* @__PURE__ */ e(Xe, { children: /* @__PURE__ */ e(q, { children: /* @__PURE__ */ l(
   N.Content,
   {
     ref: o,
-    className: s(
+    className: i(
       "relative w-full max-w-[420px] rounded-card bg-card p-[30px] shadow-[0_24px_64px_rgba(15,23,42,0.3)] outline-none data-[state=open]:animate-toast-in",
-      a
+      n
     ),
-    onOpenAutoFocus: (i) => i.preventDefault(),
-    ...n,
+    onOpenAutoFocus: (s) => s.preventDefault(),
+    ...a,
     children: [
       r,
       t ? /* @__PURE__ */ e(
@@ -541,36 +583,36 @@ const Oe = c(({ className: a, children: r, showClose: t = !0, ...n }, o) => /* @
         {
           className: "absolute top-[30px] right-[30px] flex size-[34px] cursor-pointer items-center justify-center rounded-[11px] bg-secondary text-muted-foreground transition-colors hover:bg-secondary-hover outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
           "aria-label": "Fechar",
-          children: /* @__PURE__ */ e(u, { icon: P, className: "size-[18px]" })
+          children: /* @__PURE__ */ e(u, { icon: j, className: "size-[18px]" })
         }
       ) : null
     ]
   }
 ) }) }));
-Oe.displayName = "DialogContent";
-const Ke = ({ className: a, ...r }) => /* @__PURE__ */ e("div", { className: s("mb-2 flex items-start justify-between gap-3", a), ...r });
-Ke.displayName = "DialogHeader";
-const qe = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
+Je.displayName = "DialogContent";
+const Qe = ({ className: n, ...r }) => /* @__PURE__ */ e("div", { className: i("mb-2 flex items-start justify-between gap-3", n), ...r });
+Qe.displayName = "DialogHeader";
+const Ye = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
   N.Title,
   {
     ref: t,
-    className: s("mt-3.5 mb-1.5 text-xl font-bold", a),
+    className: i("mt-3.5 mb-1.5 text-xl font-bold", n),
     ...r
   }
 ));
-qe.displayName = "DialogTitle";
-const Ue = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
+Ye.displayName = "DialogTitle";
+const Ze = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
   N.Description,
   {
     ref: t,
-    className: s("mb-6 text-sm leading-relaxed text-muted-foreground", a),
+    className: i("mb-6 text-sm leading-relaxed text-muted-foreground", n),
     ...r
   }
 ));
-Ue.displayName = "DialogDescription";
-const Xe = ({ className: a, ...r }) => /* @__PURE__ */ e("div", { className: s("flex gap-3", a), ...r });
-Xe.displayName = "DialogFooter";
-const Je = w("flex flex-none items-center justify-center", {
+Ze.displayName = "DialogDescription";
+const et = ({ className: n, ...r }) => /* @__PURE__ */ e("div", { className: i("flex gap-3", n), ...r });
+et.displayName = "DialogFooter";
+const tt = y("flex flex-none items-center justify-center", {
   variants: {
     tone: {
       neutral: "bg-secondary text-foreground",
@@ -583,8 +625,8 @@ const Je = w("flex flex-none items-center justify-center", {
       error: "bg-error-bg text-error",
       info: "bg-info-bg text-info",
       accent: "bg-accent text-accent-foreground",
-      onDark: "bg-white/10 text-accent",
-      onAccent: "bg-primary/10 text-primary"
+      onDark: "bg-white/10 text-white",
+      onAccent: "bg-white/15 text-white"
     },
     size: {
       sm: "size-[34px] rounded-[10px]",
@@ -594,66 +636,66 @@ const Je = w("flex flex-none items-center justify-center", {
     }
   },
   defaultVariants: { tone: "neutral", size: "md" }
-}), Qe = {
+}), rt = {
   sm: "size-[18px]",
   md: "size-5",
   lg: "size-[22px]",
   xl: "size-8"
-}, z = c(
-  ({ className: a, tone: r, size: t = "md", icon: n, ...o }, i) => /* @__PURE__ */ e("div", { ref: i, className: s(Je({ tone: r, size: t }), a), ...o, children: /* @__PURE__ */ e(u, { icon: n, className: Qe[t ?? "md"], strokeWidth: 2 }) })
+}, T = p(
+  ({ className: n, tone: r, size: t = "md", icon: a, ...o }, s) => /* @__PURE__ */ e("div", { ref: s, className: i(tt({ tone: r, size: t }), n), ...o, children: /* @__PURE__ */ e(u, { icon: a, className: rt[t ?? "md"], strokeWidth: 2 }) })
 );
-z.displayName = "IconTile";
-const Ye = c(
-  ({ className: a, icon: r, title: t, description: n, action: o, ...i }, p) => /* @__PURE__ */ l(
+T.displayName = "IconTile";
+const nt = p(
+  ({ className: n, icon: r, title: t, description: a, action: o, ...s }, c) => /* @__PURE__ */ l(
     "div",
     {
-      ref: p,
-      className: s(
+      ref: c,
+      className: i(
         "flex flex-col items-center rounded-card bg-card p-12 text-center shadow-card",
-        a
+        n
       ),
-      ...i,
+      ...s,
       children: [
-        /* @__PURE__ */ e(z, { icon: r, tone: "neutral", size: "xl", className: "mb-5 text-subtle-foreground" }),
+        /* @__PURE__ */ e(T, { icon: r, tone: "neutral", size: "xl", className: "mb-5 text-subtle-foreground" }),
         /* @__PURE__ */ e("h3", { className: "mb-1.5 text-lg font-bold", children: t }),
-        n ? /* @__PURE__ */ e("p", { className: "mb-[22px] max-w-[340px] text-sm leading-relaxed text-subtle-foreground", children: n }) : null,
+        a ? /* @__PURE__ */ e("p", { className: "mb-[22px] max-w-[340px] text-sm leading-relaxed text-muted-foreground", children: a }) : null,
         o
       ]
     }
   )
 );
-Ye.displayName = "EmptyState";
-const q = c(
-  ({ className: a, selected: r = !1, ...t }, n) => /* @__PURE__ */ e(
+nt.displayName = "EmptyState";
+const U = p(
+  ({ className: n, selected: r = !1, ...t }, a) => /* @__PURE__ */ e(
     "button",
     {
-      ref: n,
+      ref: a,
       type: "button",
       "aria-pressed": r,
-      className: s(
+      className: i(
         "cursor-pointer rounded-pill px-3.5 py-[7px] font-sans text-[13px] whitespace-nowrap transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
         r ? "bg-primary font-semibold text-primary-foreground" : "bg-secondary font-medium text-muted-foreground hover:bg-secondary-hover",
-        a
+        n
       ),
       ...t
     }
   )
 );
-q.displayName = "FilterChip";
-const Ze = c(
-  ({ className: a, items: r, value: t, onValueChange: n, ...o }, i) => /* @__PURE__ */ e("div", { ref: i, className: s("flex flex-wrap gap-2", a), ...o, children: r.map((p) => /* @__PURE__ */ e(
-    q,
+U.displayName = "FilterChip";
+const at = p(
+  ({ className: n, items: r, value: t, onValueChange: a, ...o }, s) => /* @__PURE__ */ e("div", { ref: s, className: i("flex flex-wrap gap-2", n), ...o, children: r.map((c) => /* @__PURE__ */ e(
+    U,
     {
-      selected: p.value === t,
-      onClick: () => n(p.value),
-      children: p.label
+      selected: c.value === t,
+      onClick: () => a(c.value),
+      children: c.label
     },
-    p.value
+    c.value
   )) })
 );
-Ze.displayName = "FilterChips";
-const et = c(
-  ({ className: a, total: r, filled: t, caption: n, onCupClick: o, ...i }, p) => /* @__PURE__ */ l("div", { ref: p, className: s("flex flex-col", a), ...i, children: [
+at.displayName = "FilterChips";
+const ot = p(
+  ({ className: n, total: r, filled: t, caption: a, onCupClick: o, ...s }, c) => /* @__PURE__ */ l("div", { ref: c, className: i("flex flex-col", n), ...s, children: [
     /* @__PURE__ */ e("div", { className: "flex gap-2.5", children: Array.from({ length: r }).map((d, m) => {
       const x = m < t;
       return /* @__PURE__ */ e(
@@ -663,7 +705,7 @@ const et = c(
           "aria-label": `Copo ${m + 1}${x ? " preenchido" : ""}`,
           onClick: o ? () => o(m) : void 0,
           disabled: !o,
-          className: s(
+          className: i(
             "flex h-11 flex-1 items-center justify-center rounded-[14px] transition-colors",
             o && "cursor-pointer",
             x ? "bg-protein" : "bg-info-bg"
@@ -671,8 +713,8 @@ const et = c(
           children: /* @__PURE__ */ e(
             u,
             {
-              icon: oe,
-              className: s("size-[18px]", x ? "text-white" : "text-[#BFDBFE]"),
+              icon: ce,
+              className: i("size-[18px]", x ? "text-white" : "text-[#BFDBFE]"),
               strokeWidth: 2
             }
           )
@@ -680,29 +722,29 @@ const et = c(
         m
       );
     }) }),
-    n ? /* @__PURE__ */ e("div", { className: "mt-2.5 text-xs text-subtle-foreground", children: n }) : null
+    a ? /* @__PURE__ */ e("div", { className: "mt-2.5 text-xs text-subtle-foreground", children: a }) : null
   ] })
 );
-et.displayName = "HydrationTracker";
-const U = c(
-  ({ className: a, label: r, error: t, hint: n, startIcon: o, suffix: i, id: p, disabled: d, ...m }, x) => {
-    const g = j(), f = p ?? g, v = !!t, B = s(
+ot.displayName = "HydrationTracker";
+const X = p(
+  ({ className: n, label: r, error: t, hint: a, startIcon: o, suffix: s, id: c, disabled: d, ...m }, x) => {
+    const g = F(), f = c ?? g, b = !!t, S = i(
       "flex items-center gap-2.5 rounded-field border bg-background px-3.5 transition-colors",
       "focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/10",
-      v && "border-error ring-3 ring-error/10 focus-within:border-error focus-within:ring-error/10",
-      !v && "border-input",
+      b && "border-error ring-3 ring-error/10 focus-within:border-error focus-within:ring-error/10",
+      !b && "border-input",
       d && "opacity-60"
     );
-    return /* @__PURE__ */ l("div", { className: s("flex flex-col", a), children: [
+    return /* @__PURE__ */ l("div", { className: i("flex flex-col", n), children: [
       r ? /* @__PURE__ */ e(
         "label",
         {
           htmlFor: f,
-          className: s("mb-[7px] text-[13px] font-semibold", v && "text-error"),
+          className: i("mb-[7px] text-[13px] font-semibold", b && "text-error"),
           children: r
         }
       ) : null,
-      /* @__PURE__ */ l("div", { className: B, children: [
+      /* @__PURE__ */ l("div", { className: S, children: [
         o ? /* @__PURE__ */ e(
           u,
           {
@@ -717,64 +759,64 @@ const U = c(
             ref: x,
             id: f,
             disabled: d,
-            "aria-invalid": v,
+            "aria-invalid": b,
             className: "w-full min-w-0 bg-transparent py-3 font-sans text-sm text-foreground outline-none placeholder:text-subtle-foreground",
             ...m
           }
         ),
-        i ? /* @__PURE__ */ e("span", { className: "font-mono text-xs text-subtle-foreground", children: i }) : null
+        s ? /* @__PURE__ */ e("span", { className: "font-mono text-xs text-subtle-foreground", children: s }) : null
       ] }),
       t ? /* @__PURE__ */ e("p", { className: "mt-1.5 text-xs text-error", children: t }) : null,
-      !t && n ? /* @__PURE__ */ e("p", { className: "mt-1.5 text-xs text-subtle-foreground", children: n }) : null
+      !t && a ? /* @__PURE__ */ e("p", { className: "mt-1.5 text-xs text-subtle-foreground", children: a }) : null
     ] });
   }
 );
-U.displayName = "Input";
-const tt = c(
-  ({ placeholder: a = "Buscar...", ...r }, t) => /* @__PURE__ */ e(U, { ref: t, type: "search", startIcon: se, placeholder: a, ...r })
+X.displayName = "Input";
+const st = p(
+  ({ placeholder: n = "Buscar...", ...r }, t) => /* @__PURE__ */ e(X, { ref: t, type: "search", startIcon: de, placeholder: n, ...r })
 );
-tt.displayName = "SearchInput";
-const S = c(
+st.displayName = "SearchInput";
+const D = p(
   ({
-    className: a,
+    className: n,
     icon: r,
     iconTone: t = "neutral",
-    title: n,
+    title: a,
     subtitle: o,
-    trailing: i,
-    interactive: p = !1,
+    trailing: s,
+    interactive: c = !1,
     ...d
   }, m) => /* @__PURE__ */ l(
     "div",
     {
       ref: m,
-      className: s(
+      className: i(
         "flex items-center gap-4 rounded-list bg-muted p-4",
-        p && "cursor-pointer transition-colors hover:bg-secondary",
-        a
+        c && "cursor-pointer transition-colors hover:bg-secondary",
+        n
       ),
       ...d,
       children: [
-        /* @__PURE__ */ e(z, { icon: r, tone: t, size: "lg" }),
+        /* @__PURE__ */ e(T, { icon: r, tone: t, size: "lg" }),
         /* @__PURE__ */ l("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ e("div", { className: "truncate text-[15px] font-semibold", children: n }),
+          /* @__PURE__ */ e("div", { className: "truncate text-[15px] font-semibold", children: a }),
           o ? /* @__PURE__ */ e("div", { className: "truncate text-xs text-subtle-foreground", children: o }) : null
         ] }),
-        i ? /* @__PURE__ */ e("div", { className: "flex items-center gap-3.5", children: i }) : null
+        s ? /* @__PURE__ */ e("div", { className: "flex items-center gap-3.5", children: s }) : null
       ]
     }
   )
 );
-S.displayName = "ListItem";
-const rt = c(
-  ({ protein: a, carbs: r, fat: t, calories: n, ...o }, i) => /* @__PURE__ */ e(
-    S,
+D.displayName = "ListItem";
+const it = p(
+  ({ protein: n, carbs: r, fat: t, calories: a, ...o }, s) => /* @__PURE__ */ e(
+    D,
     {
-      ref: i,
-      trailing: /* @__PURE__ */ l(A, { children: [
+      ref: s,
+      trailing: /* @__PURE__ */ l(P, { children: [
         /* @__PURE__ */ l("span", { className: "text-xs font-semibold text-protein", children: [
           "P ",
-          a,
+          n,
           "g"
         ] }),
         /* @__PURE__ */ l("span", { className: "text-xs font-semibold text-carbs-text", children: [
@@ -788,7 +830,7 @@ const rt = c(
           "g"
         ] }),
         /* @__PURE__ */ l("span", { className: "min-w-16 text-right text-[15px] font-bold", children: [
-          n,
+          a,
           " kcal"
         ] })
       ] }),
@@ -796,14 +838,14 @@ const rt = c(
     }
   )
 );
-rt.displayName = "MealListItem";
-const at = c(
-  ({ duration: a, calories: r, ...t }, n) => /* @__PURE__ */ e(
-    S,
+it.displayName = "MealListItem";
+const lt = p(
+  ({ duration: n, calories: r, ...t }, a) => /* @__PURE__ */ e(
+    D,
     {
-      ref: n,
-      trailing: /* @__PURE__ */ l(A, { children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px] font-semibold text-muted-foreground", children: a }),
+      ref: a,
+      trailing: /* @__PURE__ */ l(P, { children: [
+        /* @__PURE__ */ e("span", { className: "text-[13px] font-semibold text-muted-foreground", children: n }),
         /* @__PURE__ */ l("span", { className: "min-w-20 text-right text-[15px] font-bold", children: [
           r,
           " kcal"
@@ -813,46 +855,46 @@ const at = c(
     }
   )
 );
-at.displayName = "WorkoutListItem";
-const nt = c(
-  ({ amount: a, muted: r = !1, ...t }, n) => /* @__PURE__ */ e(
-    S,
+lt.displayName = "WorkoutListItem";
+const ct = p(
+  ({ amount: n, muted: r = !1, ...t }, a) => /* @__PURE__ */ e(
+    D,
     {
-      ref: n,
-      trailing: /* @__PURE__ */ e("span", { className: s("text-[15px] font-bold", r && "text-subtle-foreground"), children: a }),
+      ref: a,
+      trailing: /* @__PURE__ */ e("span", { className: i("text-[15px] font-bold", r && "text-subtle-foreground"), children: n }),
       ...t
     }
   )
 );
-nt.displayName = "HydrationListItem";
-const ot = {
+ct.displayName = "HydrationListItem";
+const dt = {
   protein: { bg: "bg-protein-bg", text: "text-protein" },
   carbs: { bg: "bg-carbs-bg", text: "text-carbs-text" },
   fat: { bg: "bg-fat-bg", text: "text-fat" },
   cardio: { bg: "bg-cardio-bg", text: "text-cardio" },
-  accent: { bg: "bg-accent/15", text: "text-accent-foreground" },
+  accent: { bg: "bg-accent/10", text: "text-accent" },
   primary: { bg: "bg-secondary", text: "text-foreground" }
-}, st = {
+}, pt = {
   protein: "var(--protein)",
   carbs: "var(--carbs)",
   fat: "var(--fat)",
   cardio: "var(--cardio)",
   accent: "var(--accent)",
   primary: "var(--primary)"
-}, it = c(
-  ({ className: a, items: r, ...t }, n) => /* @__PURE__ */ l("div", { ref: n, className: s("flex flex-col", a), ...t, children: [
+}, mt = p(
+  ({ className: n, items: r, ...t }, a) => /* @__PURE__ */ l("div", { ref: a, className: i("flex flex-col", n), ...t, children: [
     /* @__PURE__ */ e("div", { className: "grid gap-3.5", style: { gridTemplateColumns: `repeat(${r.length}, 1fr)` }, children: r.map((o) => {
-      const i = ot[o.color];
-      return /* @__PURE__ */ l("div", { className: s("rounded-tile p-5 text-center", i.bg), children: [
-        /* @__PURE__ */ e("div", { className: s("text-[26px] font-bold", i.text), children: o.value }),
-        /* @__PURE__ */ e("div", { className: s("mt-0.5 text-[13px] font-semibold", i.text), children: o.label }),
+      const s = dt[o.color];
+      return /* @__PURE__ */ l("div", { className: i("rounded-tile p-5 text-center", s.bg), children: [
+        /* @__PURE__ */ e("div", { className: i("text-[26px] font-bold", s.text), children: o.value }),
+        /* @__PURE__ */ e("div", { className: i("mt-0.5 text-[13px] font-semibold", s.text), children: o.label }),
         o.goal ? /* @__PURE__ */ e("div", { className: "mt-1.5 text-[11px] text-subtle-foreground", children: o.goal }) : null
       ] }, o.label);
     }) }),
     /* @__PURE__ */ e("div", { className: "mt-5 flex h-3 overflow-hidden rounded-pill", children: r.map((o) => /* @__PURE__ */ e(
       "div",
       {
-        style: { width: `${o.percent}%`, background: st[o.color] }
+        style: { width: `${o.percent}%`, background: pt[o.color] }
       },
       o.label
     )) }),
@@ -864,28 +906,28 @@ const ot = {
     ] }, o.label)) })
   ] })
 );
-it.displayName = "MacroBreakdown";
-const lt = c(
-  ({ className: a, name: r, badge: t, online: n = !0, avatar: o, ...i }, p) => /* @__PURE__ */ l(
+mt.displayName = "MacroBreakdown";
+const ut = p(
+  ({ className: n, name: r, badge: t, online: a = !0, avatar: o, ...s }, c) => /* @__PURE__ */ l(
     "div",
     {
-      ref: p,
-      className: s(
+      ref: c,
+      className: i(
         "inline-flex items-center gap-3.5 rounded-pill bg-card py-3 pr-[18px] pl-3 shadow-card",
-        a
+        n
       ),
-      ...i,
+      ...s,
       children: [
         /* @__PURE__ */ l("div", { className: "relative", children: [
-          /* @__PURE__ */ e("div", { className: "flex size-[46px] items-center justify-center overflow-hidden rounded-full bg-linear-[135deg,#BEF264,#A3E635]", children: o ?? /* @__PURE__ */ e(
+          /* @__PURE__ */ e("div", { className: "flex size-[46px] items-center justify-center overflow-hidden rounded-full bg-linear-[135deg,#5B77FF,#2B4BF2]", children: o ?? /* @__PURE__ */ e(
             u,
             {
-              icon: ie,
+              icon: pe,
               className: "size-[22px] text-accent-foreground",
               strokeWidth: 2
             }
           ) }),
-          n ? /* @__PURE__ */ e("span", { className: "absolute right-px bottom-px size-3 rounded-full border-2 border-card bg-success" }) : null
+          a ? /* @__PURE__ */ e("span", { className: "absolute right-px bottom-px size-3 rounded-full border-2 border-card bg-success" }) : null
         ] }),
         /* @__PURE__ */ l("div", { className: "pr-2", children: [
           /* @__PURE__ */ e("div", { className: "text-[15px] font-bold", children: r }),
@@ -895,21 +937,21 @@ const lt = c(
     }
   )
 );
-lt.displayName = "ProfileCard";
-const ct = {
+ut.displayName = "ProfileCard";
+const xt = {
   protein: "var(--protein)",
   carbs: "var(--carbs)",
   fat: "var(--fat)",
   cardio: "var(--cardio)",
   accent: "var(--accent)",
   primary: "var(--primary)"
-}, dt = c(
-  ({ className: a, value: r, label: t, valueLabel: n, color: o = "accent", ...i }, p) => {
+}, gt = p(
+  ({ className: n, value: r, label: t, valueLabel: a, color: o = "accent", ...s }, c) => {
     const d = Math.min(100, Math.max(0, r));
-    return /* @__PURE__ */ l("div", { ref: p, className: s("flex flex-col", a), ...i, children: [
-      t || n ? /* @__PURE__ */ l("div", { className: "mb-2 flex justify-between text-[13px]", children: [
+    return /* @__PURE__ */ l("div", { ref: c, className: i("flex flex-col", n), ...s, children: [
+      t || a ? /* @__PURE__ */ l("div", { className: "mb-2 flex justify-between text-[13px]", children: [
         t ? /* @__PURE__ */ e("span", { className: "font-semibold", children: t }) : /* @__PURE__ */ e("span", {}),
-        n ? /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: n }) : null
+        a ? /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: a }) : null
       ] }) : null,
       /* @__PURE__ */ e(
         "div",
@@ -923,7 +965,7 @@ const ct = {
             "div",
             {
               className: "h-full rounded-pill transition-[width] duration-300",
-              style: { width: `${d}%`, background: ct[o] }
+              style: { width: `${d}%`, background: xt[o] }
             }
           )
         }
@@ -931,25 +973,25 @@ const ct = {
     ] });
   }
 );
-dt.displayName = "ProgressBar";
-const pt = c(
+gt.displayName = "ProgressBar";
+const ft = p(
   ({
-    className: a,
+    className: n,
     value: r,
     size: t = 140,
-    strokeWidth: n = 14,
+    strokeWidth: a = 14,
     color: o = "var(--accent)",
-    trackColor: i = "var(--secondary)",
-    label: p,
+    trackColor: s = "var(--secondary)",
+    label: c,
     caption: d,
     ...m
   }, x) => {
-    const g = Math.min(100, Math.max(0, r)), f = (t - n) / 2, v = 2 * Math.PI * f, B = v * (1 - g / 100);
+    const g = Math.min(100, Math.max(0, r)), f = (t - a) / 2, b = 2 * Math.PI * f, S = b * (1 - g / 100);
     return /* @__PURE__ */ l(
       "div",
       {
         ref: x,
-        className: s("relative", a),
+        className: i("relative", n),
         style: { width: t, height: t },
         role: "progressbar",
         "aria-valuenow": g,
@@ -965,8 +1007,8 @@ const pt = c(
                 cy: t / 2,
                 r: f,
                 fill: "none",
-                stroke: i,
-                strokeWidth: n
+                stroke: s,
+                strokeWidth: a
               }
             ),
             /* @__PURE__ */ e(
@@ -977,16 +1019,16 @@ const pt = c(
                 r: f,
                 fill: "none",
                 stroke: o,
-                strokeWidth: n,
+                strokeWidth: a,
                 strokeLinecap: "round",
-                strokeDasharray: v,
-                strokeDashoffset: B,
+                strokeDasharray: b,
+                strokeDashoffset: S,
                 className: "transition-[stroke-dashoffset] duration-500"
               }
             )
           ] }),
           /* @__PURE__ */ l("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
-            /* @__PURE__ */ e("span", { className: "text-[30px] font-bold", children: p ?? `${Math.round(g)}%` }),
+            /* @__PURE__ */ e("span", { className: "text-[30px] font-bold", children: c ?? `${Math.round(g)}%` }),
             d ? /* @__PURE__ */ e("span", { className: "text-xs text-subtle-foreground", children: d }) : null
           ] })
         ]
@@ -994,109 +1036,216 @@ const pt = c(
     );
   }
 );
-pt.displayName = "ProgressRing";
-const mt = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
-  O.Root,
+ft.displayName = "ProgressRing";
+const bt = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
+  K.Root,
   {
     ref: t,
-    className: s("flex flex-col gap-3.5", a),
+    className: i("flex flex-col gap-3.5", n),
     ...r
   }
 ));
-mt.displayName = "RadioGroup";
-const ut = c(({ className: a, label: r, id: t, ...n }, o) => {
-  const i = j(), p = t ?? i, d = /* @__PURE__ */ e(
-    O.Item,
+bt.displayName = "RadioGroup";
+const ht = p(({ className: n, label: r, id: t, ...a }, o) => {
+  const s = F(), c = t ?? s, d = /* @__PURE__ */ e(
+    K.Item,
     {
       ref: o,
-      id: p,
-      className: s(
+      id: c,
+      className: i(
         "flex size-[22px] flex-none cursor-pointer items-center justify-center rounded-full border-2 bg-background transition-all outline-none",
         "border-input data-[state=checked]:border-[6px] data-[state=checked]:border-primary",
         "focus-visible:ring-3 focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-60",
-        a
+        n
       ),
-      ...n
+      ...a
     }
   );
-  return r ? /* @__PURE__ */ l("label", { htmlFor: p, className: "flex cursor-pointer items-center gap-3.5", children: [
+  return r ? /* @__PURE__ */ l("label", { htmlFor: c, className: "flex cursor-pointer items-center gap-3.5", children: [
     d,
     /* @__PURE__ */ e("span", { className: "text-sm font-medium", children: r })
   ] }) : d;
 });
-ut.displayName = "RadioGroupItem";
-const Zt = b.Root, er = b.Group, tr = b.Value, xt = c(({ className: a, children: r, ...t }, n) => /* @__PURE__ */ l(
-  b.Trigger,
+ht.displayName = "RadioGroupItem";
+const vt = y("inline-grid w-full rounded-pill bg-secondary", {
+  variants: {
+    size: {
+      sm: "gap-1 p-1",
+      md: "gap-1.5 p-1.5"
+    }
+  },
+  defaultVariants: { size: "md" }
+});
+function sr({
+  className: n,
+  options: r,
+  value: t,
+  onValueChange: a,
+  size: o,
+  ...s
+}) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: i(vt({ size: o }), n),
+      style: { gridTemplateColumns: `repeat(${r.length}, minmax(0, 1fr))` },
+      ...s,
+      children: r.map((c) => {
+        const d = c.value === t;
+        return /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            "aria-pressed": d,
+            onClick: () => a(c.value),
+            className: i(
+              "cursor-pointer rounded-pill px-3 py-2 font-sans text-[13px] font-semibold whitespace-nowrap transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
+              d ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
+            ),
+            children: c.label
+          },
+          c.value
+        );
+      })
+    }
+  );
+}
+const ir = h.Root, lr = h.Group, cr = h.Value, Nt = p(({ className: n, children: r, ...t }, a) => /* @__PURE__ */ l(
+  h.Trigger,
   {
-    ref: n,
-    className: s(
+    ref: a,
+    className: i(
       "flex w-full cursor-pointer items-center justify-between gap-2 rounded-field border border-input bg-background px-3.5 py-[11px] font-sans text-sm font-medium text-foreground transition-colors outline-none",
       "hover:border-subtle-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/10 disabled:cursor-not-allowed disabled:opacity-60 data-[placeholder]:text-subtle-foreground",
-      a
+      n
     ),
     ...t,
     children: [
       r,
-      /* @__PURE__ */ e(b.Icon, { asChild: !0, children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e(h.Icon, { asChild: !0, children: /* @__PURE__ */ e(
         u,
         {
-          icon: W,
+          icon: H,
           className: "size-4 text-muted-foreground transition-transform"
         }
       ) })
     ]
   }
 ));
-xt.displayName = "SelectTrigger";
-const gt = c(({ className: a, children: r, position: t = "popper", ...n }, o) => /* @__PURE__ */ e(b.Portal, { children: /* @__PURE__ */ e(
-  b.Content,
+Nt.displayName = "SelectTrigger";
+const yt = p(({ className: n, children: r, position: t = "popper", ...a }, o) => /* @__PURE__ */ e(h.Portal, { children: /* @__PURE__ */ e(
+  h.Content,
   {
     ref: o,
     position: t,
-    className: s(
+    className: i(
       "z-50 min-w-[8rem] overflow-hidden rounded-list border border-border bg-card p-1.5 shadow-[0_12px_32px_rgba(15,23,42,0.14)]",
       t === "popper" && "data-[side=bottom]:translate-y-1",
-      a
+      n
     ),
-    ...n,
+    ...a,
     children: /* @__PURE__ */ e(
-      b.Viewport,
+      h.Viewport,
       {
-        className: s(t === "popper" && "w-full min-w-[var(--radix-select-trigger-width)]"),
+        className: i(t === "popper" && "w-full min-w-[var(--radix-select-trigger-width)]"),
         children: r
       }
     )
   }
 ) }));
-gt.displayName = "SelectContent";
-const ft = c(({ className: a, children: r, ...t }, n) => /* @__PURE__ */ l(
-  b.Item,
+yt.displayName = "SelectContent";
+const wt = p(({ className: n, children: r, ...t }, a) => /* @__PURE__ */ l(
+  h.Item,
   {
-    ref: n,
-    className: s(
+    ref: a,
+    className: i(
       "relative flex cursor-pointer items-center justify-between rounded-[9px] px-3 py-[9px] text-sm outline-none select-none",
       "focus:bg-secondary data-[state=checked]:font-semibold data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      a
+      n
     ),
     ...t,
     children: [
-      /* @__PURE__ */ e(b.ItemText, { children: r }),
-      /* @__PURE__ */ e(b.ItemIndicator, { children: /* @__PURE__ */ e(u, { icon: E, className: "size-4 text-accent-foreground", strokeWidth: 3 }) })
+      /* @__PURE__ */ e(h.ItemText, { children: r }),
+      /* @__PURE__ */ e(h.ItemIndicator, { children: /* @__PURE__ */ e(u, { icon: _, className: "size-4 text-accent", strokeWidth: 3 }) })
     ]
   }
 ));
-ft.displayName = "SelectItem";
-const bt = c(
-  ({ className: a, icon: r, label: t, active: n = !1, ...o }, i) => /* @__PURE__ */ l(
+wt.displayName = "SelectItem";
+const J = p(
+  ({
+    className: n,
+    title: r,
+    description: t,
+    icon: a,
+    iconTone: o = "neutral",
+    selected: s = !1,
+    trailing: c,
+    ...d
+  }, m) => /* @__PURE__ */ l(
+    "button",
+    {
+      ref: m,
+      type: "button",
+      "aria-pressed": s,
+      className: i(
+        "flex w-full cursor-pointer items-center gap-3.5 rounded-tile border-2 bg-card p-4 text-left transition-colors outline-none",
+        "focus-visible:ring-3 focus-visible:ring-ring/25",
+        s ? "border-primary" : "border-border hover:border-input",
+        n
+      ),
+      ...d,
+      children: [
+        a ? /* @__PURE__ */ e(T, { icon: a, tone: s ? "accent" : o, size: "sm" }) : null,
+        /* @__PURE__ */ l("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ e("div", { className: "text-sm font-semibold", children: r }),
+          t ? /* @__PURE__ */ e("div", { className: "mt-0.5 text-[13px] text-muted-foreground", children: t }) : null
+        ] }),
+        c ? /* @__PURE__ */ e("div", { className: "flex-none", children: c }) : null
+      ]
+    }
+  )
+);
+J.displayName = "SelectableCard";
+function dr({
+  className: n,
+  items: r,
+  value: t,
+  onValueChange: a,
+  columns: o = 1,
+  ...s
+}) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: i("grid gap-2.5", n),
+      style: { gridTemplateColumns: `repeat(${o}, minmax(0, 1fr))` },
+      ...s,
+      children: r.map((c) => /* @__PURE__ */ e(
+        J,
+        {
+          title: c.title,
+          description: c.description,
+          icon: c.icon,
+          iconTone: c.iconTone,
+          selected: c.value === t,
+          onClick: () => a(c.value)
+        },
+        c.value
+      ))
+    }
+  );
+}
+const Ct = p(
+  ({ className: n, icon: r, label: t, active: a = !1, ...o }, s) => /* @__PURE__ */ l(
     "button",
     {
-      ref: i,
+      ref: s,
       type: "button",
-      "aria-current": n ? "page" : void 0,
-      className: s(
-        "flex w-full cursor-pointer items-center gap-3 rounded-pill px-4 py-[13px] text-left font-sans text-sm font-semibold transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
-        n ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-secondary hover:text-foreground",
-        a
+      "aria-current": a ? "page" : void 0,
+      className: i(
+        "flex w-full cursor-pointer items-center gap-3 rounded-list px-4 py-[13px] text-left font-sans text-sm font-semibold transition-colors outline-none focus-visible:ring-3 focus-visible:ring-ring/25",
+        a ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-secondary hover:text-foreground",
+        n
       ),
       ...o,
       children: [
@@ -1106,26 +1255,26 @@ const bt = c(
     }
   )
 );
-bt.displayName = "NavItem";
-const ht = c(
-  ({ className: a, children: r, ...t }, n) => /* @__PURE__ */ e(
+Ct.displayName = "NavItem";
+const kt = p(
+  ({ className: n, children: r, ...t }, a) => /* @__PURE__ */ e(
     "nav",
     {
-      ref: n,
-      className: s("rounded-card bg-card p-[18px] pt-[22px] shadow-card", a),
+      ref: a,
+      className: i("rounded-card bg-card p-[18px] pt-[22px] shadow-card", n),
       ...t,
       children: r
     }
   )
 );
-ht.displayName = "Sidebar";
-const Nt = c(
-  ({ className: a, name: r, logo: t, ...n }, o) => /* @__PURE__ */ l(
+kt.displayName = "Sidebar";
+const Tt = p(
+  ({ className: n, name: r, logo: t, ...a }, o) => /* @__PURE__ */ l(
     "div",
     {
       ref: o,
-      className: s("flex items-center gap-3 px-2.5 pt-1.5 pb-[22px]", a),
-      ...n,
+      className: i("flex items-center gap-3 px-2.5 pt-1.5 pb-[22px]", n),
+      ...a,
       children: [
         /* @__PURE__ */ e("div", { className: "flex size-[42px] items-center justify-center rounded-[14px] bg-accent text-lg font-bold text-accent-foreground", children: t ?? r.charAt(0) }),
         /* @__PURE__ */ e("span", { className: "text-lg font-bold", children: r })
@@ -1133,29 +1282,29 @@ const Nt = c(
     }
   )
 );
-Nt.displayName = "SidebarBrand";
-const vt = c(
-  ({ className: a, label: r, children: t, ...n }, o) => /* @__PURE__ */ l("div", { ref: o, className: s("flex flex-col", a), ...n, children: [
+Tt.displayName = "SidebarBrand";
+const It = p(
+  ({ className: n, label: r, children: t, ...a }, o) => /* @__PURE__ */ l("div", { ref: o, className: i("flex flex-col", n), ...a, children: [
     r ? /* @__PURE__ */ e("span", { className: "px-2.5 pt-5 pb-2.5 font-mono text-[11px] tracking-widest text-subtle-foreground uppercase", children: r }) : null,
     /* @__PURE__ */ e("div", { className: "flex flex-col gap-1", children: t })
   ] })
 );
-vt.displayName = "SidebarSection";
-const yt = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: s("skeleton rounded-[7px]", a), ...r })
+It.displayName = "SidebarSection";
+const Ft = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: i("skeleton rounded-[7px]", n), ...r })
 );
-yt.displayName = "Skeleton";
-const wt = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ l(
-    T.Root,
+Ft.displayName = "Skeleton";
+const zt = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ l(
+    I.Root,
     {
       ref: t,
-      className: s("relative flex h-[22px] w-full touch-none items-center select-none", a),
+      className: i("relative flex h-[22px] w-full touch-none items-center select-none", n),
       ...r,
       children: [
-        /* @__PURE__ */ e(T.Track, { className: "relative h-2 w-full grow rounded-pill bg-secondary", children: /* @__PURE__ */ e(T.Range, { className: "absolute h-full rounded-pill bg-accent" }) }),
+        /* @__PURE__ */ e(I.Track, { className: "relative h-2 w-full grow rounded-pill bg-secondary", children: /* @__PURE__ */ e(I.Range, { className: "absolute h-full rounded-pill bg-accent" }) }),
         /* @__PURE__ */ e(
-          T.Thumb,
+          I.Thumb,
           {
             className: "block size-[22px] rounded-full border-[3px] border-primary bg-white shadow-[0_2px_6px_rgba(15,23,42,0.2)] outline-none focus-visible:ring-3 focus-visible:ring-ring/25 disabled:opacity-60",
             "aria-label": "Valor"
@@ -1165,8 +1314,8 @@ const wt = c(
     }
   )
 );
-wt.displayName = "Slider";
-const Ct = w("animate-spin-slow rounded-full border-secondary border-t-accent", {
+zt.displayName = "Slider";
+const Bt = y("animate-spin-slow rounded-full border-secondary border-t-accent", {
   variants: {
     size: {
       sm: "size-6 border-[3px]",
@@ -1175,20 +1324,20 @@ const Ct = w("animate-spin-slow rounded-full border-secondary border-t-accent",
     }
   },
   defaultVariants: { size: "md" }
-}), kt = c(
-  ({ className: a, size: r, ...t }, n) => /* @__PURE__ */ e(
+}), Dt = p(
+  ({ className: n, size: r, ...t }, a) => /* @__PURE__ */ e(
     "div",
     {
-      ref: n,
+      ref: a,
       role: "status",
       "aria-label": "Carregando",
-      className: s(Ct({ size: r }), a),
+      className: i(Bt({ size: r }), n),
       ...t
     }
   )
 );
-kt.displayName = "Spinner";
-const Tt = w("rounded-card p-6", {
+Dt.displayName = "Spinner";
+const St = y("rounded-card p-6", {
   variants: {
     variant: {
       light: "bg-card text-card-foreground shadow-card",
@@ -1197,28 +1346,40 @@ const Tt = w("rounded-card p-6", {
     }
   },
   defaultVariants: { variant: "light" }
-}), D = {
+}), A = {
   light: "text-muted-foreground",
   accent: "text-accent-muted-foreground",
   dark: "text-subtle-foreground"
-}, It = {
+}, At = {
   light: "neutral",
   accent: "onAccent",
   dark: "onDark"
-}, Ft = c(
-  ({ className: a, variant: r = "light", icon: t, iconTone: n, label: o, value: i, unit: p, trend: d, progress: m, ...x }, g) => {
-    const f = r ?? "light";
-    return /* @__PURE__ */ l("div", { ref: g, className: s(Tt({ variant: r }), a), ...x, children: [
+}, Pt = p(
+  ({
+    className: n,
+    variant: r = "light",
+    icon: t,
+    iconTone: a,
+    label: o,
+    value: s,
+    unit: c,
+    trend: d,
+    progress: m,
+    footer: x,
+    ...g
+  }, f) => {
+    const b = r ?? "light";
+    return /* @__PURE__ */ l("div", { ref: f, className: i(St({ variant: r }), n), ...g, children: [
       /* @__PURE__ */ l("div", { className: "mb-[18px] flex items-start justify-between", children: [
-        /* @__PURE__ */ e(z, { icon: t, tone: n ?? It[f] }),
+        /* @__PURE__ */ e(T, { icon: t, tone: a ?? At[b] }),
         d ? /* @__PURE__ */ e("div", { children: d }) : null
       ] }),
-      /* @__PURE__ */ e("div", { className: s("mb-1 text-[13px]", D[f]), children: o }),
+      /* @__PURE__ */ e("div", { className: i("mb-1 text-[13px]", A[b]), children: o }),
       /* @__PURE__ */ l("div", { className: "text-[34px] leading-none font-bold tracking-tight", children: [
-        i,
-        p ? /* @__PURE__ */ e("span", { className: s("ml-1 text-[15px] font-medium", D[f]), children: p }) : null
+        s,
+        c ? /* @__PURE__ */ e("span", { className: i("ml-1 text-[15px] font-medium", A[b]), children: c }) : null
       ] }),
-      m ? /* @__PURE__ */ l(A, { children: [
+      m ? /* @__PURE__ */ l(P, { children: [
         /* @__PURE__ */ e("div", { className: "mt-4 h-1.5 overflow-hidden rounded-pill bg-secondary", children: /* @__PURE__ */ e(
           "div",
           {
@@ -1229,87 +1390,123 @@ const Tt = w("rounded-card p-6", {
             }
           }
         ) }),
-        m.caption ? /* @__PURE__ */ e("div", { className: s("mt-2 text-xs", D[f]), children: m.caption }) : null
-      ] }) : null
+        m.caption ? /* @__PURE__ */ e("div", { className: i("mt-2 text-xs", A[b]), children: m.caption }) : null
+      ] }) : null,
+      x ? /* @__PURE__ */ e("div", { className: "mt-[18px]", children: x }) : null
     ] });
   }
 );
-Ft.displayName = "StatCard";
-const zt = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e(
+Pt.displayName = "StatCard";
+const jt = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e(
     L.Root,
     {
       ref: t,
-      className: s(
+      className: i(
         "peer inline-flex h-[27px] w-[46px] flex-none cursor-pointer items-center rounded-pill p-[3px] transition-colors outline-none",
         "focus-visible:ring-3 focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-60",
         "bg-input data-[state=checked]:bg-accent",
-        a
+        n
       ),
       ...r,
       children: /* @__PURE__ */ e(L.Thumb, { className: "pointer-events-none block size-[21px] rounded-full bg-white shadow-[0_1px_3px_rgba(15,23,42,0.3)] transition-transform data-[state=checked]:translate-x-[19px]" })
     }
   )
 );
-zt.displayName = "Switch";
-const rr = I.Root, St = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
-  I.List,
+jt.displayName = "Switch";
+const pr = z.Root, _t = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
+  z.List,
   {
     ref: t,
-    className: s("inline-flex items-center gap-1.5 rounded-pill bg-secondary p-1.5", a),
+    className: i("inline-flex items-center gap-1.5 rounded-pill bg-secondary p-1.5", n),
     ...r
   }
 ));
-St.displayName = "TabsList";
-const Bt = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
-  I.Trigger,
+_t.displayName = "TabsList";
+const Et = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
+  z.Trigger,
   {
     ref: t,
-    className: s(
+    className: i(
       "cursor-pointer rounded-pill px-[18px] py-[9px] font-sans text-sm font-semibold whitespace-nowrap text-muted-foreground transition-colors outline-none",
       "hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring/25",
       "data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:hover:text-primary-foreground",
-      a
+      n
     ),
     ...r
   }
 ));
-Bt.displayName = "TabsTrigger";
-const Dt = c(({ className: a, ...r }, t) => /* @__PURE__ */ e(
-  I.Content,
+Et.displayName = "TabsTrigger";
+const Rt = p(({ className: n, ...r }, t) => /* @__PURE__ */ e(
+  z.Content,
   {
     ref: t,
-    className: s("mt-5 outline-none focus-visible:ring-3 focus-visible:ring-ring/25", a),
+    className: i("mt-5 outline-none focus-visible:ring-3 focus-visible:ring-ring/25", n),
     ...r
   }
 ));
-Dt.displayName = "TabsContent";
-const X = ue(null);
-function ar() {
-  const a = me(X);
-  if (!a) throw new Error("useToast deve ser usado dentro de ToastProvider");
-  return a;
+Rt.displayName = "TabsContent";
+const Vt = p(
+  ({ className: n, label: r, error: t, hint: a, id: o, disabled: s, rows: c = 3, ...d }, m) => {
+    const x = F(), g = o ?? x, f = !!t;
+    return /* @__PURE__ */ l("div", { className: i("flex flex-col", n), children: [
+      r ? /* @__PURE__ */ e(
+        "label",
+        {
+          htmlFor: g,
+          className: i("mb-[7px] text-[13px] font-semibold", f && "text-error"),
+          children: r
+        }
+      ) : null,
+      /* @__PURE__ */ e(
+        "textarea",
+        {
+          ref: m,
+          id: g,
+          rows: c,
+          disabled: s,
+          "aria-invalid": f,
+          className: i(
+            "w-full min-w-0 resize-y rounded-field border bg-background px-3.5 py-3 font-sans text-sm text-foreground transition-colors outline-none",
+            "placeholder:text-subtle-foreground focus:border-ring focus:ring-3 focus:ring-ring/10",
+            f ? "border-error ring-3 ring-error/10 focus:border-error focus:ring-error/10" : "border-input",
+            s && "opacity-60"
+          ),
+          ...d
+        }
+      ),
+      t ? /* @__PURE__ */ e("p", { className: "mt-1.5 text-xs text-error", children: t }) : null,
+      !t && a ? /* @__PURE__ */ e("p", { className: "mt-1.5 text-xs text-subtle-foreground", children: a }) : null
+    ] });
+  }
+);
+Vt.displayName = "Textarea";
+const Q = be(null);
+function mr() {
+  const n = fe(Q);
+  if (!n) throw new Error("useToast deve ser usado dentro de ToastProvider");
+  return n;
 }
-function nr({ children: a, duration: r = 3600 }) {
-  const [t, n] = de([]), o = V((d) => {
-    n((m) => {
+function ur({ children: n, duration: r = 3600 }) {
+  const [t, a] = xe([]), o = V((d) => {
+    a((m) => {
       var g;
       const x = (((g = m[m.length - 1]) == null ? void 0 : g.id) ?? 0) + 1;
       return [...m, { ...d, id: x, open: !0 }];
     });
-  }, []), i = V((d, m) => {
-    m || n((x) => x.filter((g) => g.id !== d));
-  }, []), p = pe(() => ({ toast: o }), [o]);
-  return /* @__PURE__ */ e(X.Provider, { value: p, children: /* @__PURE__ */ l(C.Provider, { duration: r, swipeDirection: "right", children: [
-    a,
+  }, []), s = V((d, m) => {
+    m || a((x) => x.filter((g) => g.id !== d));
+  }, []), c = ge(() => ({ toast: o }), [o]);
+  return /* @__PURE__ */ e(Q.Provider, { value: c, children: /* @__PURE__ */ l(C.Provider, { duration: r, swipeDirection: "right", children: [
+    n,
     t.map((d) => {
-      const m = d.icon ?? E;
+      const m = d.icon ?? _;
       return /* @__PURE__ */ l(
         C.Root,
         {
           open: d.open,
           duration: d.duration ?? r,
-          onOpenChange: (x) => i(d.id, x),
+          onOpenChange: (x) => s(d.id, x),
           className: "flex items-center gap-3.5 rounded-list bg-primary px-[18px] py-[15px] text-primary-foreground shadow-[0_16px_40px_rgba(15,23,42,0.35)] data-[state=open]:animate-toast-in",
           children: [
             /* @__PURE__ */ e("div", { className: "flex size-[38px] flex-none items-center justify-center rounded-[12px] bg-accent/20", children: /* @__PURE__ */ e(u, { icon: m, className: "size-[19px] text-accent", strokeWidth: 3 }) }),
@@ -1322,7 +1519,7 @@ function nr({ children: a, duration: r = 3600 }) {
               {
                 "aria-label": "Fechar",
                 className: "flex-none cursor-pointer text-muted-foreground transition-colors hover:text-primary-foreground",
-                children: /* @__PURE__ */ e(u, { icon: P, className: "size-[17px]" })
+                children: /* @__PURE__ */ e(u, { icon: j, className: "size-[17px]" })
               }
             )
           ]
@@ -1333,67 +1530,67 @@ function nr({ children: a, duration: r = 3600 }) {
     /* @__PURE__ */ e(
       C.Viewport,
       {
-        className: s(
+        className: i(
           "fixed right-6 bottom-6 z-95 flex w-[340px] max-w-[calc(100vw-2rem)] flex-col gap-3 outline-none"
         )
       }
     )
   ] }) });
 }
-const or = h.Provider, sr = h.Root, ir = h.Trigger, J = c(({ className: a, sideOffset: r = 8, children: t, ...n }, o) => /* @__PURE__ */ e(h.Portal, { children: /* @__PURE__ */ l(
-  h.Content,
+const xr = v.Provider, gr = v.Root, fr = v.Trigger, Y = p(({ className: n, sideOffset: r = 8, children: t, ...a }, o) => /* @__PURE__ */ e(v.Portal, { children: /* @__PURE__ */ l(
+  v.Content,
   {
     ref: o,
     sideOffset: r,
-    className: s(
+    className: i(
       "z-95 rounded-[10px] bg-primary px-3 py-2 text-xs font-medium text-primary-foreground shadow-[0_6px_18px_rgba(15,23,42,0.25)] data-[state=delayed-open]:animate-fade-in",
-      a
+      n
     ),
-    ...n,
+    ...a,
     children: [
       t,
-      /* @__PURE__ */ e(h.Arrow, { className: "fill-primary", width: 10, height: 5 })
+      /* @__PURE__ */ e(v.Arrow, { className: "fill-primary", width: 10, height: 5 })
     ]
   }
 ) }));
-J.displayName = "TooltipContent";
-function lr({ content: a, children: r, side: t = "top", delayDuration: n = 150 }) {
-  return /* @__PURE__ */ e(h.Provider, { delayDuration: n, children: /* @__PURE__ */ l(h.Root, { children: [
-    /* @__PURE__ */ e(h.Trigger, { asChild: !0, children: r }),
-    /* @__PURE__ */ e(J, { side: t, children: a })
+Y.displayName = "TooltipContent";
+function br({ content: n, children: r, side: t = "top", delayDuration: a = 150 }) {
+  return /* @__PURE__ */ e(v.Provider, { delayDuration: a, children: /* @__PURE__ */ l(v.Root, { children: [
+    /* @__PURE__ */ e(v.Trigger, { asChild: !0, children: r }),
+    /* @__PURE__ */ e(Y, { side: t, children: n })
   ] }) });
 }
-const At = c(
-  ({ className: a, brand: r, actions: t, title: n, subtitle: o, children: i, ...p }, d) => /* @__PURE__ */ l(
+const $t = p(
+  ({ className: n, brand: r, actions: t, title: a, subtitle: o, children: s, ...c }, d) => /* @__PURE__ */ l(
     "div",
     {
       ref: d,
-      className: s("overflow-hidden rounded-card bg-card shadow-card", a),
-      ...p,
+      className: i("overflow-hidden rounded-card bg-card shadow-card", n),
+      ...c,
       children: [
         /* @__PURE__ */ l("div", { className: "flex items-center justify-between border-b border-border-soft px-6 py-[18px]", children: [
           /* @__PURE__ */ e("div", { className: "text-[15px] font-bold tracking-wide", children: r }),
           t ? /* @__PURE__ */ e("div", { className: "flex items-center gap-[18px] text-muted-foreground", children: t }) : null
         ] }),
-        n || o || i ? /* @__PURE__ */ l("div", { className: "p-6", children: [
-          n ? /* @__PURE__ */ e("h3", { className: "mb-1 text-[28px] font-bold tracking-tight", children: n }) : null,
+        a || o || s ? /* @__PURE__ */ l("div", { className: "p-6", children: [
+          a ? /* @__PURE__ */ e("h3", { className: "mb-1 text-[28px] font-bold tracking-tight", children: a }) : null,
           o ? /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground", children: o }) : null,
-          i
+          s
         ] }) : null
       ]
     }
   )
 );
-At.displayName = "Topbar";
-const Pt = c(
-  ({ className: a, label: r, delta: t, direction: n, positiveIsUp: o = !0, ...i }, p) => {
-    const d = n === "up" ? o : !o, m = n === "up" ? le : ce;
-    return /* @__PURE__ */ l("div", { ref: p, className: s("flex items-center justify-between", a), ...i, children: [
+$t.displayName = "Topbar";
+const Lt = p(
+  ({ className: n, label: r, delta: t, direction: a, positiveIsUp: o = !0, ...s }, c) => {
+    const d = a === "up" ? o : !o, m = a === "up" ? me : ue;
+    return /* @__PURE__ */ l("div", { ref: c, className: i("flex items-center justify-between", n), ...s, children: [
       /* @__PURE__ */ e("span", { className: "text-sm font-semibold", children: r }),
       /* @__PURE__ */ l(
         "span",
         {
-          className: s(
+          className: i(
             "inline-flex items-center gap-1.5 text-sm font-bold",
             d ? "text-success" : "text-error"
           ),
@@ -1406,96 +1603,101 @@ const Pt = c(
     ] });
   }
 );
-Pt.displayName = "TrendItem";
-const Et = c(
-  ({ className: a, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: s("flex flex-col gap-4", a), ...r })
+Lt.displayName = "TrendItem";
+const Mt = p(
+  ({ className: n, ...r }, t) => /* @__PURE__ */ e("div", { ref: t, className: i("flex flex-col gap-4", n), ...r })
 );
-Et.displayName = "TrendList";
+Mt.displayName = "TrendList";
 export {
-  Gt as Accordion,
-  Ce as AccordionContent,
-  ye as AccordionItem,
-  we as AccordionTrigger,
-  Kt as AreaChart,
-  Te as Badge,
-  Be as Banner,
-  qt as BarChart,
-  Ae as Button,
-  Ee as Card,
-  Ve as CardContent,
-  Re as CardDescription,
-  je as CardHeader,
-  _e as CardTitle,
-  Me as ChartEmptyState,
-  We as ChartLegend,
+  Jt as Accordion,
+  Fe as AccordionContent,
+  Te as AccordionItem,
+  Ie as AccordionTrigger,
+  Zt as AreaChart,
+  Be as Badge,
+  je as Banner,
+  er as BarChart,
+  Ee as Button,
+  Ve as Card,
+  We as CardContent,
+  Me as CardDescription,
+  $e as CardHeader,
+  Le as CardTitle,
+  Oe as ChartEmptyState,
+  Ke as ChartLegend,
   R as ChartTooltip,
-  Ge as Checkbox,
-  Xt as DataTable,
-  Jt as Dialog,
-  Yt as DialogClose,
-  Oe as DialogContent,
-  Ue as DialogDescription,
-  Xe as DialogFooter,
-  Ke as DialogHeader,
-  K as DialogOverlay,
-  He as DialogPortal,
-  qe as DialogTitle,
-  Qt as DialogTrigger,
-  Ut as DonutChart,
-  Ye as EmptyState,
-  q as FilterChip,
-  Ze as FilterChips,
-  nt as HydrationListItem,
-  et as HydrationTracker,
-  z as IconTile,
-  U as Input,
-  S as ListItem,
-  it as MacroBreakdown,
-  rt as MealListItem,
-  Jt as Modal,
-  bt as NavItem,
-  lt as ProfileCard,
-  dt as ProgressBar,
-  pt as ProgressRing,
-  mt as RadioGroup,
-  ut as RadioGroupItem,
-  tt as SearchInput,
-  Zt as Select,
-  gt as SelectContent,
-  er as SelectGroup,
-  ft as SelectItem,
-  xt as SelectTrigger,
-  tr as SelectValue,
-  ht as Sidebar,
-  Nt as SidebarBrand,
-  vt as SidebarSection,
-  yt as Skeleton,
-  wt as Slider,
-  kt as Spinner,
-  Ft as StatCard,
-  zt as Switch,
-  rr as Tabs,
-  Dt as TabsContent,
-  St as TabsList,
-  Bt as TabsTrigger,
-  nr as ToastProvider,
-  lr as Tooltip,
-  J as TooltipContent,
-  or as TooltipProvider,
-  sr as TooltipRoot,
-  ir as TooltipTrigger,
-  At as Topbar,
-  Pt as TrendItem,
-  Et as TrendList,
-  at as WorkoutListItem,
-  ke as badgeVariants,
-  De as buttonVariants,
-  Pe as cardVariants,
-  F as chartColors,
-  s as cn,
-  y as colors,
-  Ot as fontFamily,
-  Je as iconTileVariants,
-  Ht as radius,
-  ar as useToast
+  qe as Checkbox,
+  rr as DataTable,
+  Ue as DateNavigator,
+  nr as Dialog,
+  or as DialogClose,
+  Je as DialogContent,
+  Ze as DialogDescription,
+  et as DialogFooter,
+  Qe as DialogHeader,
+  q as DialogOverlay,
+  Xe as DialogPortal,
+  Ye as DialogTitle,
+  ar as DialogTrigger,
+  tr as DonutChart,
+  nt as EmptyState,
+  U as FilterChip,
+  at as FilterChips,
+  ct as HydrationListItem,
+  ot as HydrationTracker,
+  T as IconTile,
+  X as Input,
+  D as ListItem,
+  mt as MacroBreakdown,
+  it as MealListItem,
+  nr as Modal,
+  Ct as NavItem,
+  ut as ProfileCard,
+  gt as ProgressBar,
+  ft as ProgressRing,
+  bt as RadioGroup,
+  ht as RadioGroupItem,
+  st as SearchInput,
+  sr as SegmentedControl,
+  ir as Select,
+  yt as SelectContent,
+  lr as SelectGroup,
+  wt as SelectItem,
+  Nt as SelectTrigger,
+  cr as SelectValue,
+  J as SelectableCard,
+  dr as SelectableCardGroup,
+  kt as Sidebar,
+  Tt as SidebarBrand,
+  It as SidebarSection,
+  Ft as Skeleton,
+  zt as Slider,
+  Dt as Spinner,
+  Pt as StatCard,
+  jt as Switch,
+  pr as Tabs,
+  Rt as TabsContent,
+  _t as TabsList,
+  Et as TabsTrigger,
+  Vt as Textarea,
+  ur as ToastProvider,
+  br as Tooltip,
+  Y as TooltipContent,
+  xr as TooltipProvider,
+  gr as TooltipRoot,
+  fr as TooltipTrigger,
+  $t as Topbar,
+  Lt as TrendItem,
+  Mt as TrendList,
+  lt as WorkoutListItem,
+  ze as badgeVariants,
+  _e as buttonVariants,
+  Re as cardVariants,
+  B as chartColors,
+  i as cn,
+  w as colors,
+  Yt as fontFamily,
+  tt as iconTileVariants,
+  Qt as radius,
+  mr as useToast
 };