@bergetai/ui 0.1.80 → 0.1.82

package/dist/index.cjs

@@ -77,6 +77,8 @@ __export(index_exports, {
   Select: () => Select2,
   Switch: () => Switch,
   TextArea: () => TextArea,
+  ThemeProvider: () => ThemeProvider,
+  ThemeToggle: () => ThemeToggle,
   Typography: () => Typography,
   alertVariants: () => alertVariants2,
   badgeVariants: () => badgeVariants,
@@ -92,13 +94,95 @@ __export(index_exports, {
   switchRootVariants: () => switchRootVariants,
   switchThumbVariants: () => switchThumbVariants,
   textAreaVariants: () => textAreaVariants,
-  typographyVariants: () => typographyVariants
+  typographyVariants: () => typographyVariants,
+  useTheme: () => useTheme
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/components/button/Button.tsx
-var React3 = __toESM(require("react"), 1);
-var import_class_variance_authority2 = require("class-variance-authority");
+// src/components/theme-provider/ThemeProvider.tsx
+var React = __toESM(require("react"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+var ThemeProviderContext = React.createContext(void 0);
+var STORAGE_KEY = "berget-theme";
+function getSystemTheme() {
+  return window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark";
+}
+function resolveTheme(theme) {
+  return {
+    theme,
+    resolvedTheme: theme === "system" ? getSystemTheme() : theme
+  };
+}
+var ThemeProvider = React.memo(function ThemeProvider2({
+  children,
+  theme: controlledTheme
+}) {
+  const isControlled = controlledTheme !== void 0;
+  const [state, setState] = React.useState(() => {
+    if (isControlled) {
+      return resolveTheme(controlledTheme);
+    }
+    let theme = "system";
+    try {
+      const stored = localStorage.getItem(STORAGE_KEY);
+      if (stored && ["dark", "light", "system"].includes(stored)) {
+        theme = stored;
+      }
+    } catch {
+    }
+    return resolveTheme(theme);
+  });
+  React.useEffect(() => {
+    document.documentElement.setAttribute("data-theme", state.resolvedTheme);
+  }, [state.resolvedTheme]);
+  React.useEffect(() => {
+    if (isControlled && state.theme !== controlledTheme) {
+      setState(resolveTheme(controlledTheme));
+    }
+  }, [isControlled, controlledTheme, state.theme]);
+  const setTheme = React.useCallback(
+    (theme) => {
+      if (isControlled) return;
+      const next = resolveTheme(theme);
+      setState(next);
+      try {
+        localStorage.setItem(STORAGE_KEY, theme);
+      } catch {
+      }
+    },
+    [isControlled]
+  );
+  React.useEffect(() => {
+    if (isControlled || state.theme !== "system") return;
+    const media = window.matchMedia("(prefers-color-scheme: light)");
+    const handler = () => {
+      setState((prev) => ({
+        ...prev,
+        resolvedTheme: getSystemTheme()
+      }));
+    };
+    media.addEventListener("change", handler);
+    return () => media.removeEventListener("change", handler);
+  }, [isControlled, state.theme]);
+  const value = React.useMemo(
+    () => ({
+      ...state,
+      setTheme
+    }),
+    [state, setTheme]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ThemeProviderContext.Provider, { value, children });
+});
+function useTheme() {
+  const context = React.useContext(ThemeProviderContext);
+  if (!context) {
+    throw new Error("useTheme must be used within a ThemeProvider.");
+  }
+  return context;
+}
+
+// src/components/theme-provider/ThemeToggle.tsx
+var React2 = __toESM(require("react"), 1);
 
 // src/lib/utils.ts
 var import_clsx = require("clsx");
@@ -122,11 +206,102 @@ function cn(...inputs) {
   return twMerge((0, import_clsx.clsx)(inputs));
 }
 
+// src/components/theme-provider/ThemeToggle.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var ThemeToggle = React2.forwardRef(
+  ({ className, label = "Toggle theme", size = "md", ...props }, ref) => {
+    const { theme, resolvedTheme, setTheme } = useTheme();
+    const toggle = React2.useCallback(() => {
+      setTheme(theme === "dark" ? "light" : "dark");
+    }, [theme, setTheme]);
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick: toggle,
+        "aria-label": label,
+        title: `Toggle ${resolvedTheme === "dark" ? "light" : "dark"} mode`,
+        className: cn(
+          "relative inline-flex items-center justify-center rounded-full cursor-pointer",
+          "transition-colors duration-200",
+          "hover:bg-berget-surface-hover",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-berget-ring",
+          size === "sm" && "w-7 h-7",
+          size === "md" && "w-9 h-9",
+          size === "lg" && "w-11 h-11",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+            "svg",
+            {
+              className: cn(
+                "absolute transition-all duration-200",
+                resolvedTheme === "dark" ? "opacity-100 scale-100 rotate-0" : "opacity-0 scale-0 -rotate-90",
+                size === "sm" && "w-3.5 h-3.5",
+                size === "md" && "w-4 h-4",
+                size === "lg" && "w-5 h-5"
+              ),
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 2,
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "4" }),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                  "path",
+                  {
+                    strokeLinecap: "round",
+                    d: "M12 2v2m0 16v2m9-10h-2M5 12H3m15.36 6.36-1.41-1.41M6.05 6.05 4.64 4.64m12.72 0-1.41 1.41M6.05 17.95l-1.41 1.41"
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "svg",
+            {
+              className: cn(
+                "absolute transition-all duration-200",
+                resolvedTheme === "light" ? "opacity-100 scale-100 rotate-0" : "opacity-0 scale-0 rotate-90",
+                size === "sm" && "w-3.5 h-3.5",
+                size === "md" && "w-4 h-4",
+                size === "lg" && "w-5 h-5"
+              ),
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 2,
+              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  d: "M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+ThemeToggle.displayName = "ThemeToggle";
+
+// src/components/button/Button.tsx
+var React5 = __toESM(require("react"), 1);
+var import_class_variance_authority2 = require("class-variance-authority");
+
 // src/primitives/button.tsx
-var React = __toESM(require("react"), 1);
+var React3 = __toESM(require("react"), 1);
 var import_react_slot = require("@radix-ui/react-slot");
 var import_class_variance_authority = require("class-variance-authority");
-var import_jsx_runtime = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority.cva)(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm  ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
@@ -152,23 +327,23 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
     }
   }
 );
-var Button = React.forwardRef(
+var Button = React3.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? import_react_slot.Slot : "button";
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Comp, { className: cn(buttonVariants({ variant, size }), className), ref, ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Comp, { className: cn(buttonVariants({ variant, size }), className), ref, ...props });
   }
 );
 Button.displayName = "Button";
 
 // src/components/icon/Icon.tsx
-var React2 = __toESM(require("react"), 1);
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var React4 = __toESM(require("react"), 1);
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var iconStrokeMap = {
   16: 1.4,
   24: 1.6,
   32: 1.8
 };
-var Icon = React2.forwardRef(
+var Icon = React4.forwardRef(
   ({
     icon: IconComponent,
     size,
@@ -180,7 +355,7 @@ var Icon = React2.forwardRef(
     const strokeWidth = iconStrokeMap[size];
     const sizeClass = size === 16 ? "w-4 h-4" : size === 24 ? "w-6 h-6" : "w-8 h-8";
     const ariaAttributes = ariaLabel ? { "aria-label": ariaLabel } : { "aria-hidden": ariaHidden };
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       IconComponent,
       {
         ref,
@@ -196,7 +371,7 @@ Icon.displayName = "Icon";
 
 // src/components/button/Button.tsx
 var import_lucide_react = require("lucide-react");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var buttonVariants2 = (0, import_class_variance_authority2.cva)(
   "inline-flex items-center justify-center whitespace-nowrap rounded-full text-sm font-medium cursor-pointer transition-all duration-200 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-berget-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
@@ -227,7 +402,7 @@ var buttonVariants2 = (0, import_class_variance_authority2.cva)(
     }
   }
 );
-var Button2 = React3.forwardRef(
+var Button2 = React5.forwardRef(
   ({
     className,
     variant,
@@ -242,7 +417,7 @@ var Button2 = React3.forwardRef(
     const isHighlight = variant === "highlight";
     const isIcon = variant === "icon";
     if (asChild) {
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         Button,
         {
           className: cn(buttonVariants2({ variant, size, width }), className),
@@ -256,7 +431,7 @@ var Button2 = React3.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
       Button,
       {
         className: cn(buttonVariants2({ variant, size, width }), className),
@@ -266,11 +441,11 @@ var Button2 = React3.forwardRef(
         "aria-busy": isLoading || void 0,
         ...props,
         children: [
-          isHighlight && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "absolute inset-0 top-[1px] h-[calc(100%-1px)] w-full bg-[radial-gradient(100%_100%_at_49.87%_0%,color-mix(in_oklch,var(--berget-foreground)_4%,transparent)_0%,transparent_100%)] pointer-events-none" }),
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "absolute top-0 left-0 right-0 h-[1px] bg-[radial-gradient(55.66%_112.5%_at_50%_0%,var(--berget-foreground)_0%,transparent_92.4%)] opacity-[0.3] pointer-events-none" })
+          isHighlight && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute inset-0 top-[1px] h-[calc(100%-1px)] w-full bg-[radial-gradient(100%_100%_at_49.87%_0%,color-mix(in_oklch,var(--berget-foreground)_4%,transparent)_0%,transparent_100%)] pointer-events-none" }),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "absolute top-0 left-0 right-0 h-[1px] bg-[radial-gradient(55.66%_112.5%_at_50%_0%,var(--berget-foreground)_0%,transparent_92.4%)] opacity-[0.3] pointer-events-none" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
             "span",
             {
               className: cn(
@@ -278,8 +453,8 @@ var Button2 = React3.forwardRef(
                 !isIcon && "gap-2",
                 isHighlight && "relative z-10"
               ),
-              children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { icon: import_lucide_react.Loader2, size: 16, className: "animate-spin", "aria-hidden": true }),
+              children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { icon: import_lucide_react.Loader2, size: 16, className: "animate-spin", "aria-hidden": true }),
                 !isIcon && children
               ] }) : children
             }
@@ -292,9 +467,9 @@ var Button2 = React3.forwardRef(
 Button2.displayName = "Button";
 
 // src/components/typography/Typography.tsx
-var React4 = __toESM(require("react"), 1);
+var React6 = __toESM(require("react"), 1);
 var import_class_variance_authority3 = require("class-variance-authority");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var typographyVariants = (0, import_class_variance_authority3.cva)("", {
   variants: {
     variant: {
@@ -339,10 +514,10 @@ var defaultElementMap = {
   mono: "p",
   code: "span"
 };
-var Typography = React4.forwardRef(
+var Typography = React6.forwardRef(
   ({ className, variant = "body", color = "default", as, children, ...props }, ref) => {
     const Component = as ?? defaultElementMap[variant ?? "body"] ?? "p";
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       Component,
       {
         className: cn(typographyVariants({ variant, color }), className),
@@ -356,14 +531,14 @@ var Typography = React4.forwardRef(
 Typography.displayName = "Typography";
 
 // src/components/card/Card.tsx
-var React6 = __toESM(require("react"), 1);
+var React8 = __toESM(require("react"), 1);
 var import_class_variance_authority4 = require("class-variance-authority");
 
 // src/primitives/card.tsx
-var React5 = __toESM(require("react"), 1);
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var Card = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+var React7 = __toESM(require("react"), 1);
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var Card = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "div",
     {
       ref,
@@ -373,29 +548,29 @@ var Card = React5.forwardRef(
   )
 );
 Card.displayName = "Card";
-var CardHeader = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref, className: cn("flex flex-col space-y-1.5 p-6", className), ...props })
+var CardHeader = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref, className: cn("flex flex-col space-y-1.5 p-6", className), ...props })
 );
 CardHeader.displayName = "CardHeader";
-var CardTitle = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h2", { ref, className: cn("text-2xl leading-none tracking-tight", className), ...props })
+var CardTitle = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h2", { ref, className: cn("text-2xl leading-none tracking-tight", className), ...props })
 );
 CardTitle.displayName = "CardTitle";
-var CardDescription = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref, className: cn("text-sm text-muted-foreground", className), ...props })
+var CardDescription = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref, className: cn("text-sm text-muted-foreground", className), ...props })
 );
 CardDescription.displayName = "CardDescription";
-var CardContent = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref, className: cn("p-6 pt-0", className), ...props })
+var CardContent = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref, className: cn("p-6 pt-0", className), ...props })
 );
 CardContent.displayName = "CardContent";
-var CardFooter = React5.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref, className: cn("flex items-center p-6 pt-0", className), ...props })
+var CardFooter = React7.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref, className: cn("flex items-center p-6 pt-0", className), ...props })
 );
 CardFooter.displayName = "CardFooter";
 
 // src/components/card/Card.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var cardVariants = (0, import_class_variance_authority4.cva)("rounded-berget-sm", {
   variants: {
     variant: {
@@ -414,9 +589,9 @@ var cardVariants = (0, import_class_variance_authority4.cva)("rounded-berget-sm"
     padding: "md"
   }
 });
-var Card2 = React6.forwardRef(
+var Card2 = React8.forwardRef(
   ({ className, variant, padding, children, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       Card,
       {
         ref,
@@ -430,9 +605,9 @@ var Card2 = React6.forwardRef(
 Card2.displayName = "Card";
 
 // src/components/badge/Badge.tsx
-var React7 = __toESM(require("react"), 1);
+var React9 = __toESM(require("react"), 1);
 var import_class_variance_authority5 = require("class-variance-authority");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var badgeVariants = (0, import_class_variance_authority5.cva)(
   "inline-flex items-center whitespace-nowrap rounded-full  transition-colors focus:outline-none focus:ring-1 focus:ring-ring focus:ring-offset-2",
   {
@@ -465,10 +640,10 @@ var badgeVariants = (0, import_class_variance_authority5.cva)(
     }
   }
 );
-var Badge = React7.forwardRef(
+var Badge = React9.forwardRef(
   ({ className, variant, status, size, icon, iconGap = 2, children, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn(badgeVariants({ variant, status, size }), className), ref, ...props, children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { marginRight: children ? `${iconGap * 0.25}rem` : "0" }, children: icon }),
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: cn(badgeVariants({ variant, status, size }), className), ref, ...props, children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { style: { marginRight: children ? `${iconGap * 0.25}rem` : "0" }, children: icon }),
       children
     ] });
   }
@@ -476,13 +651,13 @@ var Badge = React7.forwardRef(
 Badge.displayName = "Badge";
 
 // src/components/alert/Alert.tsx
-var React9 = __toESM(require("react"), 1);
+var React11 = __toESM(require("react"), 1);
 var import_class_variance_authority7 = require("class-variance-authority");
 
 // src/primitives/alert.tsx
-var React8 = __toESM(require("react"), 1);
+var React10 = __toESM(require("react"), 1);
 var import_class_variance_authority6 = require("class-variance-authority");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var alertVariants = (0, import_class_variance_authority6.cva)(
   "relative w-full rounded-lg p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4",
   {
@@ -497,17 +672,17 @@ var alertVariants = (0, import_class_variance_authority6.cva)(
     }
   }
 );
-var Alert = React8.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
+var Alert = React10.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
 Alert.displayName = "Alert";
-var AlertTitle = React8.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h5", { ref, className: cn("mb-1 leading-none tracking-tight", className), ...props })
+var AlertTitle = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h5", { ref, className: cn("mb-1 leading-none tracking-tight", className), ...props })
 );
 AlertTitle.displayName = "AlertTitle";
-var AlertDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props }));
+var AlertDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props }));
 AlertDescription.displayName = "AlertDescription";
 
 // src/components/alert/Alert.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var alertVariants2 = (0, import_class_variance_authority7.cva)("", {
   variants: {
     variant: {
@@ -522,20 +697,20 @@ var alertVariants2 = (0, import_class_variance_authority7.cva)("", {
     variant: "default"
   }
 });
-var Alert2 = React9.forwardRef(
-  ({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Alert, { ref, className: cn(alertVariants2({ variant }), className), ...props })
+var Alert2 = React11.forwardRef(
+  ({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Alert, { ref, className: cn(alertVariants2({ variant }), className), ...props })
 );
 Alert2.displayName = "Alert";
 
 // src/components/input/Input.tsx
-var React11 = __toESM(require("react"), 1);
+var React13 = __toESM(require("react"), 1);
 
 // src/primitives/input.tsx
-var React10 = __toESM(require("react"), 1);
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var Input = React10.forwardRef(
+var React12 = __toESM(require("react"), 1);
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var Input = React12.forwardRef(
   ({ className, type, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "input",
       {
         type,
@@ -552,14 +727,14 @@ var Input = React10.forwardRef(
 Input.displayName = "Input";
 
 // src/components/input/Input.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var Input2 = React11.forwardRef(
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var Input2 = React13.forwardRef(
   ({ className, icon, actionButton, label, description, error, id, disabled, ...props }, ref) => {
-    const generatedId = React11.useId();
+    const generatedId = React13.useId();
     const inputId = id || generatedId;
     const errorId = `${inputId}-error`;
     const descriptionId = `${inputId}-description`;
-    const inputElement = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const inputElement = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Input,
       {
         ref,
@@ -579,8 +754,8 @@ var Input2 = React11.forwardRef(
       }
     );
     if (!icon && !actionButton) {
-      return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-2", children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-2", children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "label",
           {
             htmlFor: inputId,
@@ -593,9 +768,9 @@ var Input2 = React11.forwardRef(
           }
         ),
         inputElement,
-        (description || error) && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-1", children: [
-          description && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
-          error && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        (description || error) && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-1", children: [
+          description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
+          error && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
             Typography,
             {
               variant: "xs",
@@ -607,8 +782,8 @@ var Input2 = React11.forwardRef(
         ] })
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -620,14 +795,14 @@ var Input2 = React11.forwardRef(
           children: label
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "relative w-full", children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute left-3 top-1/2 -translate-y-1/2", children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "relative w-full", children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "absolute left-3 top-1/2 -translate-y-1/2", children: icon }),
         inputElement,
-        actionButton && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: actionButton })
+        actionButton && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: actionButton })
       ] }),
-      (description || error) && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-1", children: [
-        description && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
-        error && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
+      (description || error) && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-1", children: [
+        description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
       ] })
     ] });
   }
@@ -635,17 +810,17 @@ var Input2 = React11.forwardRef(
 Input2.displayName = "Input";
 
 // src/components/checkbox/Checkbox.tsx
-var React13 = __toESM(require("react"), 1);
+var React15 = __toESM(require("react"), 1);
 var CheckboxPrimitive2 = __toESM(require("@radix-ui/react-checkbox"), 1);
 var import_lucide_react3 = require("lucide-react");
 var import_class_variance_authority8 = require("class-variance-authority");
 
 // src/primitives/checkbox.tsx
-var React12 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
 var import_lucide_react2 = require("lucide-react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var Checkbox = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var Checkbox = React14.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -654,23 +829,23 @@ var Checkbox = React12.forwardRef(({ className, children, ...props }, ref) => /*
       className
     ),
     ...props,
-    children: children ?? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CheckboxPrimitive.Indicator, { className: cn("grid place-content-center"), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react2.Check, { className: "h-4 w-4" }) })
+    children: children ?? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CheckboxPrimitive.Indicator, { className: cn("grid place-content-center"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react2.Check, { className: "h-4 w-4" }) })
   }
 ));
 Checkbox.displayName = CheckboxPrimitive.Root.displayName;
-var CheckboxIndicator = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var CheckboxIndicator = React14.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   CheckboxPrimitive.Indicator,
   {
     ref,
     className: cn("grid place-content-center", className),
     ...props,
-    children: children ?? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react2.Check, { className: "h-4 w-4" })
+    children: children ?? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react2.Check, { className: "h-4 w-4" })
   }
 ));
 CheckboxIndicator.displayName = CheckboxPrimitive.Indicator.displayName;
 
 // src/components/checkbox/Checkbox.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var checkboxVariants = (0, import_class_variance_authority8.cva)(
   "inline-flex items-center justify-center rounded-md transition-all duration-200 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
   {
@@ -692,13 +867,13 @@ var checkboxVariants = (0, import_class_variance_authority8.cva)(
     }
   }
 );
-var Checkbox2 = React13.forwardRef(
+var Checkbox2 = React15.forwardRef(
   ({ className, variant, size, label, description, error, id, disabled, ...props }, ref) => {
-    const generatedId = React13.useId();
+    const generatedId = React15.useId();
     const checkboxId = id || generatedId;
     const errorId = `${checkboxId}-error`;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-start gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "relative flex items-start pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "relative flex items-start pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         Checkbox,
         {
           ref,
@@ -713,7 +888,7 @@ var Checkbox2 = React13.forwardRef(
             className
           ),
           ...props,
-          children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CheckboxPrimitive2.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CheckboxPrimitive2.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             import_lucide_react3.Check,
             {
               className: "h-4 w-4 text-current stroke-current",
@@ -722,8 +897,8 @@ var Checkbox2 = React13.forwardRef(
           ) })
         }
       ) }),
-      (label || description || error) && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-1", children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      (label || description || error) && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-col gap-1", children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "label",
           {
             htmlFor: checkboxId,
@@ -735,8 +910,8 @@ var Checkbox2 = React13.forwardRef(
             children: label
           }
         ),
-        description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Typography, { variant: "xs", color: "muted", children: description }),
-        error && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
+        description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Typography, { variant: "xs", color: "muted", children: description }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
       ] })
     ] });
   }
@@ -744,10 +919,10 @@ var Checkbox2 = React13.forwardRef(
 Checkbox2.displayName = "Checkbox";
 
 // src/components/switch/Switch.tsx
-var React14 = __toESM(require("react"), 1);
+var React16 = __toESM(require("react"), 1);
 var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
 var import_class_variance_authority9 = require("class-variance-authority");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var switchRootVariants = (0, import_class_variance_authority9.cva)(
   "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-berget-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
   {
@@ -784,13 +959,13 @@ var switchThumbVariants = (0, import_class_variance_authority9.cva)(
     }
   }
 );
-var Switch = React14.forwardRef(
+var Switch = React16.forwardRef(
   ({ className, variant, size, label, description, error, id, disabled, ...props }, ref) => {
-    const generatedId = React14.useId();
+    const generatedId = React16.useId();
     const switchId = id || generatedId;
     const errorId = `${switchId}-error`;
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         SwitchPrimitives.Root,
         {
           ref,
@@ -804,11 +979,11 @@ var Switch = React14.forwardRef(
             className
           ),
           ...props,
-          children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SwitchPrimitives.Thumb, { className: cn(switchThumbVariants({ size })) })
+          children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SwitchPrimitives.Thumb, { className: cn(switchThumbVariants({ size })) })
         }
       ),
-      (label || description || error) && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col gap-1", children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      (label || description || error) && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-1", children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           "label",
           {
             htmlFor: switchId,
@@ -819,8 +994,8 @@ var Switch = React14.forwardRef(
             children: label
           }
         ),
-        description && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography, { variant: "xs", color: "muted", children: description }),
-        error && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
+        description && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Typography, { variant: "xs", color: "muted", children: description }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
       ] })
     ] });
   }
@@ -828,17 +1003,17 @@ var Switch = React14.forwardRef(
 Switch.displayName = "Switch";
 
 // src/components/select/Select.tsx
-var React16 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 var import_class_variance_authority10 = require("class-variance-authority");
 
 // src/primitives/select.tsx
-var React15 = __toESM(require("react"), 1);
+var React17 = __toESM(require("react"), 1);
 var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
 var import_lucide_react4 = require("lucide-react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var Select = SelectPrimitive.Root;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var SelectTrigger = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -849,32 +1024,32 @@ var SelectTrigger = React15.forwardRef(({ className, children, ...props }, ref)
     ...props,
     children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react4.ChevronDown, { className: "h-4 w-4 opacity-50" }) })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react4.ChevronDown, { className: "h-4 w-4 opacity-50" }) })
     ]
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var SelectScrollUpButton = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
     className: cn("flex cursor-default items-center justify-center py-1", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react4.ChevronUp, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react4.ChevronUp, { className: "h-4 w-4" })
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var SelectScrollDownButton = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
     className: cn("flex cursor-default items-center justify-center py-1", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react4.ChevronDown, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react4.ChevronDown, { className: "h-4 w-4" })
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React15.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var SelectContent = React17.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
   SelectPrimitive.Content,
   {
     ref,
@@ -886,8 +1061,8 @@ var SelectContent = React15.forwardRef(({ className, children, position = "poppe
     position,
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectScrollUpButton, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectScrollUpButton, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         SelectPrimitive.Viewport,
         {
           className: cn(
@@ -897,12 +1072,12 @@ var SelectContent = React15.forwardRef(({ className, children, position = "poppe
           children
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectScrollDownButton, {})
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectScrollDownButton, {})
     ]
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var SelectLabel = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   SelectPrimitive.Label,
   {
     ref,
@@ -911,7 +1086,7 @@ var SelectLabel = React15.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var SelectItem = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
   SelectPrimitive.Item,
   {
     ref,
@@ -921,13 +1096,13 @@ var SelectItem = React15.forwardRef(({ className, children, ...props }, ref) =>
     ),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react4.Check, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SelectPrimitive.ItemText, { children })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react4.Check, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SelectPrimitive.ItemText, { children })
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var SelectSeparator = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   SelectPrimitive.Separator,
   {
     ref,
@@ -938,7 +1113,7 @@ var SelectSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @_
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/components/select/Select.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var selectVariants = (0, import_class_variance_authority10.cva)(
   "flex w-full items-center justify-between rounded-berget-xs border bg-card px-4 py-3 text-sm transition-colors duration-200 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:border-berget-form-focus-border disabled:cursor-not-allowed disabled:opacity-50",
   {
@@ -961,7 +1136,7 @@ var selectVariants = (0, import_class_variance_authority10.cva)(
     }
   }
 );
-var Select2 = React16.forwardRef(
+var Select2 = React18.forwardRef(
   ({
     className,
     variant,
@@ -979,12 +1154,12 @@ var Select2 = React16.forwardRef(
     name,
     required
   }, ref) => {
-    const generatedId = React16.useId();
+    const generatedId = React18.useId();
     const selectId = id || generatedId;
     const errorId = `${selectId}-error`;
     const descriptionId = `${selectId}-description`;
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "label",
         {
           htmlFor: selectId,
@@ -996,7 +1171,7 @@ var Select2 = React16.forwardRef(
           children: label
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
         Select,
         {
           value,
@@ -1006,7 +1181,7 @@ var Select2 = React16.forwardRef(
           name,
           required,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
               SelectTrigger,
               {
                 ref,
@@ -1018,30 +1193,30 @@ var Select2 = React16.forwardRef(
                   error && "border-berget-destructive-foreground/50 bg-berget-destructive",
                   className
                 ),
-                children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectValue, { placeholder })
+                children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SelectValue, { placeholder })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectContent, { children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value)) })
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SelectContent, { children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SelectItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value)) })
           ]
         }
       ),
-      description && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
+      description && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
+      error && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typography, { variant: "xs", id: errorId, className: "text-berget-destructive-foreground", children: error })
     ] });
   }
 );
 Select2.displayName = "Select";
 
 // src/components/text-area/TextArea.tsx
-var React18 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 var import_class_variance_authority11 = require("class-variance-authority");
 
 // src/primitives/textarea.tsx
-var React17 = __toESM(require("react"), 1);
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var Textarea = React17.forwardRef(
+var React19 = __toESM(require("react"), 1);
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var Textarea = React19.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       "textarea",
       {
         className: cn(
@@ -1057,7 +1232,7 @@ var Textarea = React17.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/text-area/TextArea.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var textAreaVariants = (0, import_class_variance_authority11.cva)(
   "rounded-berget-xs bg-card px-4 py-3 transition-colors duration-200 focus-visible:border-berget-form-focus-border focus-visible:ring-0 focus-visible:ring-offset-0 resize-y",
   {
@@ -1080,7 +1255,7 @@ var textAreaVariants = (0, import_class_variance_authority11.cva)(
     }
   }
 );
-var TextArea = React18.forwardRef(
+var TextArea = React20.forwardRef(
   ({
     className,
     variant,
@@ -1100,13 +1275,13 @@ var TextArea = React18.forwardRef(
     actionButton,
     ...props
   }, ref) => {
-    const generatedId = React18.useId();
+    const generatedId = React20.useId();
     const textareaId = id || generatedId;
     const errorId = `${textareaId}-error`;
     const descriptionId = `${textareaId}-description`;
     const characterCount = typeof value === "string" ? value.length : 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col gap-2", children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "label",
         {
           htmlFor: textareaId,
@@ -1118,9 +1293,9 @@ var TextArea = React18.forwardRef(
           children: label
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "relative", children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "absolute left-2 top-1/2 -translate-y-1/2", children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative", children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute left-2 top-1/2 -translate-y-1/2", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           Textarea,
           {
             ref,
@@ -1145,13 +1320,13 @@ var TextArea = React18.forwardRef(
             ...props
           }
         ),
-        secondaryIcon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "absolute right-12 top-1/2 -translate-y-1/2", children: secondaryIcon }),
-        actionButton && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: actionButton })
+        secondaryIcon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute right-12 top-1/2 -translate-y-1/2", children: secondaryIcon }),
+        actionButton && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: actionButton })
       ] }),
-      (description || error || showCount && maxLength) && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-        description && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
-        (error || showCount && maxLength) && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center gap-2 ml-auto", children: [
-          showCount && maxLength && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      (description || error || showCount && maxLength) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+        description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "xs", color: "muted", id: descriptionId, children: description }),
+        (error || showCount && maxLength) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-2 ml-auto", children: [
+          showCount && maxLength && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
             Typography,
             {
               variant: "xs",
@@ -1165,7 +1340,7 @@ var TextArea = React18.forwardRef(
               ]
             }
           ),
-          error && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             Typography,
             {
               variant: "xs",
@@ -1182,14 +1357,14 @@ var TextArea = React18.forwardRef(
 TextArea.displayName = "TextArea";
 
 // src/primitives/label.tsx
-var React19 = __toESM(require("react"), 1);
+var React21 = __toESM(require("react"), 1);
 var LabelPrimitive = __toESM(require("@radix-ui/react-label"), 1);
 var import_class_variance_authority12 = require("class-variance-authority");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var labelVariants = (0, import_class_variance_authority12.cva)(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
 );
-var Label2 = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props }));
+var Label2 = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props }));
 Label2.displayName = LabelPrimitive.Root.displayName;
 
 // src/primitives/field.tsx
@@ -1197,10 +1372,10 @@ var import_react = require("react");
 var import_class_variance_authority13 = require("class-variance-authority");
 
 // src/primitives/separator.tsx
-var React20 = __toESM(require("react"), 1);
+var React22 = __toESM(require("react"), 1);
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var Separator2 = React20.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var Separator2 = React22.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
   SeparatorPrimitive.Root,
   {
     ref,
@@ -1217,9 +1392,9 @@ var Separator2 = React20.forwardRef(({ className, orientation = "horizontal", de
 Separator2.displayName = SeparatorPrimitive.Root.displayName;
 
 // src/primitives/field.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function FieldSet({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "fieldset",
     {
       "data-slot": "field-set",
@@ -1237,7 +1412,7 @@ function FieldLegend({
   variant = "legend",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "legend",
     {
       "data-slot": "field-legend",
@@ -1253,7 +1428,7 @@ function FieldLegend({
   );
 }
 function FieldGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       "data-slot": "field-group",
@@ -1290,7 +1465,7 @@ function Field({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       role: "group",
@@ -1302,7 +1477,7 @@ function Field({
   );
 }
 function FieldContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       "data-slot": "field-content",
@@ -1312,12 +1487,12 @@ function FieldContent({ className, ...props }) {
   );
 }
 function FieldLabel({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     Label2,
     {
       "data-slot": "field-label",
       className: cn(
-        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50",
+        "group/field-label peer/field-label flex w-fit gap-2 leading-snug text-berget-foreground group-data-[disabled=true]/field:text-berget-muted-foreground",
         "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>[data-slot=field]]:p-4",
         "has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10",
         className
@@ -1327,7 +1502,7 @@ function FieldLabel({ className, ...props }) {
   );
 }
 function FieldTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       "data-slot": "field-label",
@@ -1340,12 +1515,12 @@ function FieldTitle({ className, ...props }) {
   );
 }
 function FieldDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "p",
     {
       "data-slot": "field-description",
       className: cn(
-        "text-muted-foreground text-sm font-normal leading-normal group-has-[[data-orientation=horizontal]]/field:text-balance",
+        "text-berget-muted-foreground text-sm font-normal leading-normal group-has-[[data-orientation=horizontal]]/field:text-balance",
         "nth-last-2:-mt-1 last:mt-0 [[data-variant=legend]+&]:-mt-1.5",
         "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
         className
@@ -1359,7 +1534,7 @@ function FieldSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
       "data-slot": "field-separator",
@@ -1370,11 +1545,11 @@ function FieldSeparator({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Separator2, { className: "absolute inset-0 top-1/2" }),
-        children && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Separator2, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "span",
           {
-            className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2",
+            className: "bg-berget-background text-berget-muted-foreground relative mx-auto block w-fit px-2",
             "data-slot": "field-separator-content",
             children
           }
@@ -1399,12 +1574,12 @@ function FieldError({
     if (errors?.length === 1 && errors[0]?.message) {
       return errors[0].message;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map((error, index) => error?.message && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: error.message }, index)) });
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map((error, index) => error?.message && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("li", { children: error.message }, index)) });
   }, [children, errors]);
   if (!content) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       role: "alert",
@@ -1417,10 +1592,10 @@ function FieldError({
 }
 
 // src/components/link/Link.tsx
-var React21 = __toESM(require("react"), 1);
+var React23 = __toESM(require("react"), 1);
 var import_class_variance_authority14 = require("class-variance-authority");
 var import_lucide_react5 = require("lucide-react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var linkVariants = (0, import_class_variance_authority14.cva)(
   "inline-flex items-center gap-2 transition-all duration-200 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
   {
@@ -1445,7 +1620,7 @@ var linkVariants = (0, import_class_variance_authority14.cva)(
     }
   }
 );
-var Link = React21.forwardRef(
+var Link = React23.forwardRef(
   ({
     className,
     variant,
@@ -1458,7 +1633,7 @@ var Link = React21.forwardRef(
     ...props
   }, ref) => {
     const isExternal = external || typeof props.href === "string" && (props.href.startsWith("http://") || props.href.startsWith("https://") || props.href.startsWith("mailto:") || props.href.startsWith("tel:"));
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       "a",
       {
         ref,
@@ -1474,8 +1649,8 @@ var Link = React21.forwardRef(
         },
         children: [
           children,
-          icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "inline-flex items-center", children: icon }),
-          showExternalIcon && isExternal && !disabled && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "inline-flex items-center ml-1 opacity-60", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { icon: import_lucide_react5.ExternalLink, size: 16 }) })
+          icon && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "inline-flex items-center", children: icon }),
+          showExternalIcon && isExternal && !disabled && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "inline-flex items-center ml-1 opacity-60", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { icon: import_lucide_react5.ExternalLink, size: 16 }) })
         ]
       }
     );
@@ -1484,14 +1659,14 @@ var Link = React21.forwardRef(
 Link.displayName = "Link";
 
 // src/components/section/Section.tsx
-var React23 = __toESM(require("react"), 1);
+var React25 = __toESM(require("react"), 1);
 var import_class_variance_authority16 = require("class-variance-authority");
 
 // src/components/container/Container.tsx
-var React22 = __toESM(require("react"), 1);
+var React24 = __toESM(require("react"), 1);
 var import_react_slot2 = require("@radix-ui/react-slot");
 var import_class_variance_authority15 = require("class-variance-authority");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var containerVariants = (0, import_class_variance_authority15.cva)("w-full mx-auto", {
   variants: {
     size: {
@@ -1513,10 +1688,10 @@ var containerVariants = (0, import_class_variance_authority15.cva)("w-full mx-au
     padding: "md"
   }
 });
-var Container = React22.forwardRef(
+var Container = React24.forwardRef(
   ({ className, size, padding, asChild = false, children, ...props }, ref) => {
     const Component = asChild ? import_react_slot2.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       Component,
       {
         ref,
@@ -1530,7 +1705,7 @@ var Container = React22.forwardRef(
 Container.displayName = "Container";
 
 // src/components/section/Section.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var sectionVariants = (0, import_class_variance_authority16.cva)("relative", {
   variants: {
     padding: {
@@ -1550,15 +1725,15 @@ var sectionVariants = (0, import_class_variance_authority16.cva)("relative", {
     background: "transparent"
   }
 });
-var Section = React23.forwardRef(
+var Section = React25.forwardRef(
   ({ className, padding, background, children, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       "section",
       {
         ref,
         className: cn(sectionVariants({ padding, background }), className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Container, { children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Container, { children })
       }
     );
   }
@@ -1566,9 +1741,9 @@ var Section = React23.forwardRef(
 Section.displayName = "Section";
 
 // src/components/section-header/SectionHeader.tsx
-var React24 = __toESM(require("react"), 1);
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var SectionHeader = React24.forwardRef(
+var React26 = __toESM(require("react"), 1);
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var SectionHeader = React26.forwardRef(
   ({
     className,
     title,
@@ -1580,22 +1755,22 @@ var SectionHeader = React24.forwardRef(
     id,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       "div",
       {
         id,
         ref,
         className: cn("w-full px-fluid-md py-fluid-xl text-center", className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col items-center gap-fluid-lg", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "max-w-3xl mx-auto flex flex-col items-center gap-fluid-lg", children: [
-            tagline && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Badge, { variant: "default", className: "text-sm", children: tagline }),
-            /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col items-center gap-fluid-sm", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: headingLevel, children: title }),
-              description && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: descriptionVariant, color: "muted", children: description })
+        children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col items-center gap-fluid-lg", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "max-w-3xl mx-auto flex flex-col items-center gap-fluid-lg", children: [
+            tagline && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "default", className: "text-sm", children: tagline }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col items-center gap-fluid-sm", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Typography, { variant: headingLevel, children: title }),
+              description && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Typography, { variant: descriptionVariant, color: "muted", children: description })
             ] })
           ] }),
-          action && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "mt-4", children: action })
+          action && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "mt-4", children: action })
         ] })
       }
     );
@@ -1604,10 +1779,10 @@ var SectionHeader = React24.forwardRef(
 SectionHeader.displayName = "SectionHeader";
 
 // src/components/grid/Grid.tsx
-var React25 = __toESM(require("react"), 1);
+var React27 = __toESM(require("react"), 1);
 var import_class_variance_authority17 = require("class-variance-authority");
 var import_react_slot3 = require("@radix-ui/react-slot");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var gridVariants = (0, import_class_variance_authority17.cva)("grid", {
   variants: {
     align: {
@@ -1630,10 +1805,10 @@ var gridVariants = (0, import_class_variance_authority17.cva)("grid", {
     justify: "start"
   }
 });
-var Grid = React25.forwardRef(
+var Grid = React27.forwardRef(
   ({ className, align, justify, cols, rows, gap, gapX, gapY, asChild = false, children, ...props }, ref) => {
     const Component = asChild ? import_react_slot3.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       Component,
       {
         ref,
@@ -1655,10 +1830,10 @@ var Grid = React25.forwardRef(
 Grid.displayName = "Grid";
 
 // src/components/box/Box.tsx
-var React26 = __toESM(require("react"), 1);
+var React28 = __toESM(require("react"), 1);
 var import_class_variance_authority18 = require("class-variance-authority");
 var import_react_slot4 = require("@radix-ui/react-slot");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var boxVariants = (0, import_class_variance_authority18.cva)("flex", {
   variants: {
     direction: {
@@ -1695,10 +1870,10 @@ var boxVariants = (0, import_class_variance_authority18.cva)("flex", {
     wrap: "nowrap"
   }
 });
-var Box = React26.forwardRef(
+var Box = React28.forwardRef(
   ({ className, direction, align, justify, wrap, gap, asChild = false, children, ...props }, ref) => {
     const Component = asChild ? import_react_slot4.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       Component,
       {
         ref,
@@ -1716,16 +1891,16 @@ var Box = React26.forwardRef(
 Box.displayName = "Box";
 
 // src/components/berget-logo/BergetLogo.tsx
-var React27 = __toESM(require("react"), 1);
-var import_jsx_runtime28 = require("react/jsx-runtime");
-var BergetLogo = React27.forwardRef(
-  ({ variant = "logotype", color = "white", size = 48, className, ...props }, ref) => {
-    const fillColor = color === "white" ? "var(--berget-logo-light)" : "var(--berget-logo-dark)";
+var React29 = __toESM(require("react"), 1);
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var BergetLogo = React29.forwardRef(
+  ({ variant = "logotype", color = "auto", size = 48, className, ...props }, ref) => {
+    const fillColor = color === "auto" ? "var(--berget-logo-light)" : color === "white" ? "var(--berget-logo-light)" : "var(--berget-logo-dark)";
     if (variant === "symbol") {
       const aspectRatio2 = 463 / 419;
       const width2 = size * aspectRatio2;
       const height2 = size;
-      return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
         "svg",
         {
           ref,
@@ -1738,7 +1913,7 @@ var BergetLogo = React27.forwardRef(
           "aria-label": "Berget symbol",
           className: cn("inline-block", className),
           ...props,
-          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
             "path",
             {
               d: "M208.739 17L255.261 17L446 403L398 403L313.5 255L261.5 176L233.163 96.1677L237.815 98.6522H226.185L230.837 96.1677L113 331L64.5 403L18 403L208.739 17Z",
@@ -1751,7 +1926,7 @@ var BergetLogo = React27.forwardRef(
     const aspectRatio = 793.63 / 204.37;
     const width = size * aspectRatio;
     const height = size;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
       "svg",
       {
         ref,
@@ -1765,59 +1940,59 @@ var BergetLogo = React27.forwardRef(
         className: cn("inline-block", className),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("g", { style: { fill: fillColor }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("g", { style: { fill: fillColor }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M268.78,172.54v-96.04h37.74c10.39,0,18.26,2.33,23.6,7,5.33,4.67,8.01,10.52,8.01,17.56,0,6.13-1.72,11-5.15,14.61-3.43,3.61-7.58,6.06-12.44,7.34,3.81.73,7.22,2.2,10.22,4.39,3.01,2.2,5.36,4.94,7.08,8.23,1.72,3.29,2.58,6.86,2.58,10.7,0,4.94-1.27,9.4-3.79,13.38-2.53,3.98-6.22,7.11-11.08,9.4-4.86,2.29-10.82,3.43-17.87,3.43h-38.89ZM283.93,117.66h20.74c5.81,0,10.24-1.3,13.29-3.91,3.05-2.61,4.58-6.19,4.58-10.77s-1.51-8.05-4.51-10.7c-3-2.65-7.55-3.98-13.65-3.98h-20.45v29.36ZM283.93,160.61h21.74c6.1,0,10.84-1.37,14.22-4.11,3.38-2.75,5.08-6.59,5.08-11.53s-1.76-8.85-5.29-11.73-8.29-4.32-14.3-4.32h-21.45v31.69Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M382.45,174.19c-6.96,0-13.13-1.49-18.52-4.46-5.39-2.97-9.6-7.11-12.65-12.42-3.05-5.3-4.57-11.48-4.57-18.52s1.5-13.4,4.5-18.79,7.19-9.61,12.58-12.62c5.39-3.02,11.65-4.53,18.81-4.53s13,1.48,18.15,4.46c5.15,2.97,9.16,6.93,12.01,11.87,2.86,4.94,4.29,10.38,4.29,16.33,0,.92-.02,1.9-.07,2.95-.05,1.05-.12,2.22-.22,3.5h-55.19c.48,6.59,2.75,11.59,6.79,15.02,4.05,3.43,8.75,5.14,14.09,5.14,4.29,0,7.89-.93,10.79-2.81,2.91-1.88,5.08-4.41,6.51-7.61h15.16c-1.91,6.4-5.7,11.75-11.37,16.05-5.68,4.3-12.71,6.45-21.09,6.45ZM382.45,114.78c-5.05,0-9.54,1.44-13.44,4.32-3.91,2.88-6.29,7.2-7.15,12.97h40.04c-.29-5.3-2.24-9.51-5.87-12.62-3.62-3.11-8.15-4.67-13.58-4.67Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M425.62,172.54v-68.05h13.59l1.29,12.9c2.47-4.48,5.93-8.03,10.37-10.63,4.43-2.61,9.79-3.91,16.08-3.91v15.23h-4.15c-4.19,0-7.93.67-11.22,1.99-3.29,1.33-5.91,3.57-7.86,6.72-1.96,3.16-2.93,7.53-2.93,13.1v32.65h-15.16Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M500.25,151.69c-3.72,0-7.14-.41-10.29-1.24l-6.15,5.76c1.05.64,2.34,1.19,3.86,1.65,1.52.46,3.66.87,6.43,1.23,2.76.37,6.53.73,11.29,1.1,9.43.82,16.25,3,20.44,6.52,4.2,3.52,6.29,8.21,6.29,14.06,0,4.02-1.12,7.84-3.35,11.45-2.24,3.61-5.72,6.54-10.44,8.78s-10.74,3.36-18.09,3.36c-9.91,0-17.94-1.8-24.09-5.42-6.15-3.62-9.22-9.08-9.22-16.4,0-2.84.78-5.65,2.35-8.44,1.57-2.79,4.08-5.42,7.51-7.89-2-.83-3.74-1.72-5.22-2.68-1.48-.96-2.79-1.94-3.94-2.95v-3.29l12.3-12.07c-5.53-4.57-8.29-10.56-8.29-17.97,0-4.48,1.12-8.58,3.36-12.28,2.24-3.7,5.5-6.65,9.79-8.85,4.29-2.2,9.43-3.29,15.44-3.29,4.01,0,7.72.55,11.15,1.64h26.45v9.6l-12.58.69c2.28,3.75,3.43,7.91,3.43,12.49s-1.13,8.69-3.36,12.35c-2.24,3.66-5.48,6.59-9.72,8.78-4.25,2.2-9.37,3.29-15.37,3.29ZM481.24,181.19c0,3.93,1.81,6.88,5.44,8.85,3.62,1.97,8.15,2.95,13.58,2.95s9.48-1.07,12.72-3.22c3.24-2.15,4.86-5,4.86-8.57,0-2.65-1.09-4.92-3.29-6.79-2.19-1.87-6.34-3.04-12.44-3.5-4.57-.27-8.63-.68-12.15-1.23-3.34,1.74-5.63,3.61-6.86,5.63-1.25,2.01-1.86,3.98-1.86,5.9ZM500.25,140.3c4.38,0,7.93-1.12,10.66-3.36,2.71-2.24,4.07-5.42,4.07-9.53s-1.36-7.41-4.07-9.6c-2.72-2.2-6.27-3.29-10.66-3.29s-8.08,1.1-10.79,3.29c-2.71,2.2-4.08,5.4-4.08,9.6s1.36,7.3,4.08,9.53c2.71,2.24,6.31,3.36,10.79,3.36Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M574.61,174.19c-6.96,0-13.13-1.49-18.52-4.46-5.39-2.97-9.6-7.11-12.65-12.42-3.05-5.3-4.57-11.48-4.57-18.52s1.5-13.4,4.5-18.79c3-5.4,7.19-9.61,12.58-12.62c5.39-3.02,11.65-4.53,18.81-4.53s13,1.48,18.15,4.46c5.15,2.97,9.16,6.93,12.01,11.87,2.86,4.94,4.29,10.38,4.29,16.33,0,.92-.02,1.9-.07,2.95-.05,1.05-.12,2.22-.22,3.5h-55.19c.48,6.59,2.75,11.59,6.79,15.02,4.05,3.43,8.75,5.14,14.09,5.14,4.29,0,7.89-.93,10.79-2.81s5.08-4.41,6.51-7.61h15.16c-1.91,6.4-5.7,11.75-11.37,16.05-5.68,4.3-12.71,6.45-21.09,6.45ZM574.61,114.78c-5.05,0-9.54,1.44-13.44,4.32-3.91,2.88-6.29,7.2-7.15,12.97h40.04c-.29-5.3-2.24-9.51-5.87-12.62-3.62-3.11-8.15-4.67-13.58-4.67Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M646.23,172.54c-6.96,0-12.49-1.62-16.59-4.87-4.1-3.25-6.15-9.03-6.15-17.36v-33.61h-12.16v-12.21h12.16l1.86-17.29h13.29v17.29h20.02v12.21h-20.02v33.61c0,3.75.84,6.33,2.51,7.75,1.67,1.42,4.55,2.13,8.65,2.13h8.14v12.35h-11.72Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
               "path",
               {
                 className: "berget-logotype-fill",
                 d: "M684.4,172.54l36.89-96.04h16.59l36.6,96.04h-16.01l-8.58-23.46h-40.88l-8.58,23.46h-16.01ZM713.28,137.56h32.31l-16.16-43.77-16.16,43.77Z"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { className: "berget-logotype-fill", d: "M778.48,172.54v-96.04h15.15v96.04h-15.15Z" })
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("path", { className: "berget-logotype-fill", d: "M778.48,172.54v-96.04h15.15v96.04h-15.15Z" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
             "path",
             {
               style: { fill: fillColor },
@@ -1832,18 +2007,18 @@ var BergetLogo = React27.forwardRef(
 BergetLogo.displayName = "BergetLogo";
 
 // src/components/header/Header.tsx
-var React29 = __toESM(require("react"), 1);
+var React31 = __toESM(require("react"), 1);
 var import_class_variance_authority19 = require("class-variance-authority");
 var import_lucide_react7 = require("lucide-react");
 
 // src/components/language-select/LanguageSelect.tsx
-var React28 = __toESM(require("react"), 1);
+var React30 = __toESM(require("react"), 1);
 var SelectPrimitive2 = __toESM(require("@radix-ui/react-select"), 1);
 var import_lucide_react6 = require("lucide-react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
-var LanguageSelect = React28.forwardRef(({ className, options, value, onValueChange }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(SelectPrimitive2.Root, { value, onValueChange, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var LanguageSelect = React30.forwardRef(({ className, options, value, onValueChange }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(SelectPrimitive2.Root, { value, onValueChange, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       SelectPrimitive2.Trigger,
       {
         ref,
@@ -1864,10 +2039,10 @@ var LanguageSelect = React28.forwardRef(({ className, options, value, onValueCha
           "disabled:cursor-not-allowed disabled:opacity-50",
           className
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Icon, { icon: import_lucide_react6.Globe, size: 16 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Icon, { icon: import_lucide_react6.Globe, size: 16 })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectPrimitive2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectPrimitive2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       SelectPrimitive2.Content,
       {
         className: cn(
@@ -1895,7 +2070,7 @@ var LanguageSelect = React28.forwardRef(({ className, options, value, onValueCha
           "origin-[--radix-select-content-transform-origin]"
         ),
         position: "popper",
-        children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectPrimitive2.Viewport, { className: "p-1", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectPrimitive2.Viewport, { className: "p-1", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           SelectPrimitive2.Item,
           {
             value: option.value,
@@ -1912,7 +2087,7 @@ var LanguageSelect = React28.forwardRef(({ className, options, value, onValueCha
               // Disabled state
               "data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectPrimitive2.ItemText, { children: option.label })
+            children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectPrimitive2.ItemText, { children: option.label })
           },
           option.value
         )) })
@@ -1923,7 +2098,7 @@ var LanguageSelect = React28.forwardRef(({ className, options, value, onValueCha
 LanguageSelect.displayName = "LanguageSelect";
 
 // src/components/header/Header.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var headerVariants = (0, import_class_variance_authority19.cva)(
   "sticky top-0 z-50 header-backdrop backdrop-blur-xl border-b border-berget-border transition-all duration-200",
   {
@@ -1938,18 +2113,18 @@ var headerVariants = (0, import_class_variance_authority19.cva)(
     }
   }
 );
-var HeaderContext = React29.createContext({
+var HeaderContext = React31.createContext({
   isMobileMenuOpen: false,
   setIsMobileMenuOpen: () => {
   }
 });
-var useHeaderContext = () => React29.useContext(HeaderContext);
-var HeaderLogo = React29.forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { ref, className: cn("flex items-center", className), ...props, children })
+var useHeaderContext = () => React31.useContext(HeaderContext);
+var HeaderLogo = React31.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { ref, className: cn("flex items-center", className), ...props, children })
 );
 HeaderLogo.displayName = "HeaderLogo";
-var HeaderNav = React29.forwardRef(({ className, links, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("nav", { ref, className: cn("hidden md:flex items-center gap-fluid-lg", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("ul", { className: "flex items-center gap-fluid-lg", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+var HeaderNav = React31.forwardRef(({ className, links, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("nav", { ref, className: cn("hidden md:flex items-center gap-fluid-lg", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("ul", { className: "flex items-center gap-fluid-lg", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
     Link,
     {
       href: link.href,
@@ -1957,14 +2132,14 @@ var HeaderNav = React29.forwardRef(({ className, links, ...props }, ref) => {
       size: "sm",
       className: cn("relative transition-all duration-200", link.active && "font-medium"),
       children: [
-        link.icon && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "inline-flex items-center mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon, { icon: link.icon, size: 16 }) }),
+        link.icon && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "inline-flex items-center mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Icon, { icon: link.icon, size: 16 }) }),
         link.label
       ]
     }
   ) }, link.href)) }) });
 });
 HeaderNav.displayName = "HeaderNav";
-var HeaderActions = React29.forwardRef(
+var HeaderActions = React31.forwardRef(
   ({
     className,
     languageOptions,
@@ -1974,8 +2149,8 @@ var HeaderActions = React29.forwardRef(
     ctaButton,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { ref, className: cn("hidden md:flex items-center gap-2", className), ...props, children: [
-      languageOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { ref, className: cn("hidden md:flex items-center gap-2", className), ...props, children: [
+      languageOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         LanguageSelect,
         {
           options: languageOptions,
@@ -1989,16 +2164,16 @@ var HeaderActions = React29.forwardRef(
   }
 );
 HeaderActions.displayName = "HeaderActions";
-var MobileMenuButton = React29.forwardRef(({ className, ...props }, ref) => {
+var MobileMenuButton = React31.forwardRef(({ className, ...props }, ref) => {
   const { isMobileMenuOpen, setIsMobileMenuOpen } = useHeaderContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     "button",
     {
       ref,
       className: cn(
         "md:hidden flex items-center justify-center w-8 h-8 rounded-full",
         "cursor-pointer transition-all duration-200",
-        "hover:bg-berget-surface-hover-dark",
+        "hover:bg-berget-surface-hover",
         className
       ),
       onClick: () => setIsMobileMenuOpen(!isMobileMenuOpen),
@@ -2006,12 +2181,12 @@ var MobileMenuButton = React29.forwardRef(({ className, ...props }, ref) => {
       "aria-expanded": isMobileMenuOpen,
       "aria-controls": "mobile-menu",
       ...props,
-      children: isMobileMenuOpen ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon, { icon: import_lucide_react7.X, size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon, { icon: import_lucide_react7.Menu, size: 16 })
+      children: isMobileMenuOpen ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Icon, { icon: import_lucide_react7.X, size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Icon, { icon: import_lucide_react7.Menu, size: 16 })
     }
   );
 });
 MobileMenuButton.displayName = "MobileMenuButton";
-var MobileMenu = React29.forwardRef(
+var MobileMenu = React31.forwardRef(
   ({
     className,
     links,
@@ -2024,7 +2199,7 @@ var MobileMenu = React29.forwardRef(
   }, ref) => {
     const { isMobileMenuOpen, setIsMobileMenuOpen } = useHeaderContext();
     if (!isMobileMenuOpen) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       "nav",
       {
         ref,
@@ -2035,8 +2210,8 @@ var MobileMenu = React29.forwardRef(
           className
         ),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Box, { direction: "column", gap: 0, className: "py-fluid-md", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("ul", { className: "px-fluid-md pb-fluid-md border-b border-berget-border/50", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(Box, { direction: "column", gap: 0, className: "py-fluid-md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("ul", { className: "px-fluid-md pb-fluid-md border-b border-berget-border/50", children: links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
             Link,
             {
               href: link.href,
@@ -2047,13 +2222,13 @@ var MobileMenu = React29.forwardRef(
               ),
               onClick: () => setIsMobileMenuOpen(false),
               children: [
-                link.icon && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "inline-flex items-center mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon, { icon: link.icon, size: 16 }) }),
+                link.icon && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "inline-flex items-center mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Icon, { icon: link.icon, size: 16 }) }),
                 link.label
               ]
             }
           ) }, link.href)) }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "px-fluid-md py-fluid-md", children: [
-            languageOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "mb-fluid-md", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "px-fluid-md py-fluid-md", children: [
+            languageOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "mb-fluid-md", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
               LanguageSelect,
               {
                 options: languageOptions,
@@ -2061,8 +2236,8 @@ var MobileMenu = React29.forwardRef(
                 onValueChange: onLanguageChange
               }
             ) }),
-            loginButton && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "mb-fluid-md w-full", children: loginButton }),
-            ctaButton && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "w-full", children: ctaButton })
+            loginButton && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "mb-fluid-md w-full", children: loginButton }),
+            ctaButton && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "w-full", children: ctaButton })
           ] })
         ] })
       }
@@ -2070,7 +2245,7 @@ var MobileMenu = React29.forwardRef(
   }
 );
 MobileMenu.displayName = "MobileMenu";
-var Header = React29.forwardRef(
+var Header = React31.forwardRef(
   ({
     className,
     variant,
@@ -2083,8 +2258,8 @@ var Header = React29.forwardRef(
     onLanguageChange,
     ...props
   }, ref) => {
-    const [isMobileMenuOpen, setIsMobileMenuOpen] = React29.useState(false);
-    React29.useEffect(() => {
+    const [isMobileMenuOpen, setIsMobileMenuOpen] = React31.useState(false);
+    React31.useEffect(() => {
       if (isMobileMenuOpen) {
         document.body.style.overflow = "hidden";
       } else {
@@ -2094,12 +2269,12 @@ var Header = React29.forwardRef(
         document.body.style.overflow = "unset";
       };
     }, [isMobileMenuOpen]);
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(HeaderContext.Provider, { value: { isMobileMenuOpen, setIsMobileMenuOpen }, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("header", { ref, className: cn(headerVariants({ variant }), className), ...props, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Container, { size: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Box, { direction: "row", align: "center", justify: "between", className: "h-16", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(HeaderLogo, { children: logo || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(BergetLogo, { variant: "logotype", color: "white", size: 32 }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(HeaderNav, { links }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Box, { direction: "row", align: "center", gap: 3, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(HeaderContext.Provider, { value: { isMobileMenuOpen, setIsMobileMenuOpen }, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("header", { ref, className: cn(headerVariants({ variant }), className), ...props, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Container, { size: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(Box, { direction: "row", align: "center", justify: "between", className: "h-16", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(HeaderLogo, { children: logo || /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(BergetLogo, { variant: "logotype", color: "auto", size: 32 }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(HeaderNav, { links }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(Box, { direction: "row", align: "center", gap: 3, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
             HeaderActions,
             {
               languageOptions,
@@ -2109,11 +2284,11 @@ var Header = React29.forwardRef(
               ctaButton
             }
           ),
-          ctaButton && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "md:hidden", children: ctaButton }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MobileMenuButton, {})
+          ctaButton && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "md:hidden", children: ctaButton }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(MobileMenuButton, {})
         ] })
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         MobileMenu,
         {
           links,
@@ -2130,16 +2305,16 @@ var Header = React29.forwardRef(
 Header.displayName = "Header";
 
 // src/components/feature-cards/FeatureCards.tsx
-var React32 = __toESM(require("react"), 1);
+var React34 = __toESM(require("react"), 1);
 var import_class_variance_authority21 = require("class-variance-authority");
 
 // src/components/list/List.tsx
-var React31 = __toESM(require("react"), 1);
+var React33 = __toESM(require("react"), 1);
 
 // src/components/divider/Divider.tsx
-var React30 = __toESM(require("react"), 1);
+var React32 = __toESM(require("react"), 1);
 var import_class_variance_authority20 = require("class-variance-authority");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var dividerVariants = (0, import_class_variance_authority20.cva)("", {
   variants: {
     variant: {
@@ -2160,7 +2335,7 @@ var dividerVariants = (0, import_class_variance_authority20.cva)("", {
     size: "thin"
   }
 });
-var Divider = React30.forwardRef(
+var Divider = React32.forwardRef(
   ({
     className,
     orientation = "horizontal",
@@ -2171,16 +2346,16 @@ var Divider = React30.forwardRef(
     ...props
   }, ref) => {
     if (label) {
-      return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { ref, className: cn("flex items-center w-full", className), ...props, children: [
-        labelPosition !== "right" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { ref, className: cn("flex items-center w-full", className), ...props, children: [
+        labelPosition !== "right" && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           Separator2,
           {
             orientation: "horizontal",
             className: cn(dividerVariants({ variant, size }), "flex-1")
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Typography, { variant: "small", color: "muted", className: "px-4 whitespace-nowrap", children: label }),
-        labelPosition !== "left" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Typography, { variant: "small", color: "muted", className: "px-4 whitespace-nowrap", children: label }),
+        labelPosition !== "left" && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           Separator2,
           {
             orientation: "horizontal",
@@ -2189,7 +2364,7 @@ var Divider = React30.forwardRef(
         )
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       Separator2,
       {
         ref,
@@ -2207,19 +2382,19 @@ Divider.displayName = "Divider";
 
 // src/components/list/List.tsx
 var import_lucide_react8 = require("lucide-react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
-var List = React31.forwardRef(
+var import_jsx_runtime34 = require("react/jsx-runtime");
+var List = React33.forwardRef(
   ({ className, children, ...props }, ref) => {
-    const childrenArray = React31.Children.toArray(children);
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { ref, className: cn("flex flex-col", className), ...props, children: childrenArray.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(React31.Fragment, { children: [
+    const childrenArray = React33.Children.toArray(children);
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { ref, className: cn("flex flex-col", className), ...props, children: childrenArray.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(React33.Fragment, { children: [
       child,
-      index < childrenArray.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Divider, { variant: "subtle" })
+      index < childrenArray.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Divider, { variant: "subtle" })
     ] }, index)) });
   }
 );
 List.displayName = "List";
-var ListItem = React31.forwardRef(
-  ({ className, icon, children, interactive = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+var ListItem = React33.forwardRef(
+  ({ className, icon, children, interactive = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
     "div",
     {
       ref,
@@ -2230,15 +2405,15 @@ var ListItem = React31.forwardRef(
       ),
       ...props,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-shrink-0 flex items-center justify-center", children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-1 min-w-0", children })
+        icon && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex-shrink-0 flex items-center justify-center", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex-1 min-w-0", children })
       ]
     }
   )
 );
 ListItem.displayName = "ListItem";
-var ListHeader = React31.forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+var ListHeader = React33.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     {
       ref,
@@ -2249,18 +2424,18 @@ var ListHeader = React31.forwardRef(
   )
 );
 ListHeader.displayName = "ListHeader";
-var FeatureList = React31.forwardRef(
+var FeatureList = React33.forwardRef(
   ({ items, variant = "bullet", className, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("ul", { ref, className: cn("flex flex-col gap-fluid-md", className), ...props, children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("li", { className: "flex items-start gap-fluid-md", children: [
-      variant === "bullet" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "w-1.5 h-1.5 rounded-full bg-berget-icon-muted flex-shrink-0 mt-2" }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-shrink-0 mt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Icon, { icon: import_lucide_react8.Check, size: 24, className: "text-berget-logo-light" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Typography, { variant: "body", color: "muted", children: item })
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("ul", { ref, className: cn("flex flex-col gap-fluid-md", className), ...props, children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("li", { className: "flex items-start gap-fluid-md", children: [
+      variant === "bullet" ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "w-1.5 h-1.5 rounded-full bg-berget-icon-muted flex-shrink-0 mt-2" }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex-shrink-0 mt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Icon, { icon: import_lucide_react8.Check, size: 24, className: "text-berget-logo-light" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Typography, { variant: "body", color: "muted", children: item })
     ] }, index)) });
   }
 );
 FeatureList.displayName = "FeatureList";
 
 // src/components/feature-cards/FeatureCards.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var featureCardVariants = (0, import_class_variance_authority21.cva)("", {
   variants: {
     variant: {
@@ -2273,7 +2448,7 @@ var featureCardVariants = (0, import_class_variance_authority21.cva)("", {
     variant: "highlight"
   }
 });
-var FeatureCard = React32.forwardRef(
+var FeatureCard = React34.forwardRef(
   ({
     className,
     variant = "highlight",
@@ -2288,23 +2463,23 @@ var FeatureCard = React32.forwardRef(
     columns: _columns,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       Card2,
       {
         ref,
         variant,
         className: cn("w-full py-fluid-lg px-fluid-md", className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col items-start gap-fluid-md", children: [
-          (Icon3 || badge) && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex items-center justify-between w-full", children: [
-            Icon3 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex h-7 w-7 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-col items-start gap-fluid-md", children: [
+          (Icon3 || badge) && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center justify-between w-full", children: [
+            Icon3 && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex h-7 w-7 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               Icon3,
               {
                 className: cn("h-7 w-7", iconColor || "text-foreground"),
                 strokeWidth: 1.5
               }
             ) }),
-            badge && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex h-6 items-center justify-start px-6 bg-berget-feature-card-badge-bg rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+            badge && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex h-6 items-center justify-start px-6 bg-berget-feature-card-badge-bg rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               Typography,
               {
                 variant: "body",
@@ -2314,10 +2489,10 @@ var FeatureCard = React32.forwardRef(
               }
             ) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Typography, { variant: "h3", className: "text-foreground", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Typography, { variant: "body", className: "text-foreground/80", children: description }),
-          items && items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(FeatureList, { items, variant: "bullet" }),
-          linkText && linkHref && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("a", { href: linkHref, className: "text-p font-p leading-p text-berget-accent", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Typography, { variant: "h3", className: "text-foreground", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Typography, { variant: "body", className: "text-foreground/80", children: description }),
+          items && items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(FeatureList, { items, variant: "bullet" }),
+          linkText && linkHref && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("a", { href: linkHref, className: "text-p font-p leading-p text-berget-accent", children: [
             linkText,
             " \u2192"
           ] })
@@ -2327,9 +2502,9 @@ var FeatureCard = React32.forwardRef(
   }
 );
 FeatureCard.displayName = "FeatureCard";
-var FeatureCards = React32.forwardRef(
+var FeatureCards = React34.forwardRef(
   ({ features, columns = 3, className }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       "div",
       {
         ref,
@@ -2342,7 +2517,7 @@ var FeatureCards = React32.forwardRef(
           columns === 4 && "grid-cols-1 md:grid-cols-2 lg:grid-cols-4",
           className
         ),
-        children: features.map((feature, index) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(FeatureCard, { ...feature }, index))
+        children: features.map((feature, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(FeatureCard, { ...feature }, index))
       }
     );
   }
@@ -2350,9 +2525,9 @@ var FeatureCards = React32.forwardRef(
 FeatureCards.displayName = "FeatureCards";
 
 // src/components/hero-block/HeroBlock.tsx
-var React33 = __toESM(require("react"), 1);
+var React35 = __toESM(require("react"), 1);
 var import_class_variance_authority22 = require("class-variance-authority");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var heroBlockVariants = (0, import_class_variance_authority22.cva)(
   "relative overflow-hidden min-h-[40dvh] flex items-center py-fluid-2xl",
   {
@@ -2373,7 +2548,7 @@ var heroBlockVariants = (0, import_class_variance_authority22.cva)(
     }
   }
 );
-var HeroBlock = React33.forwardRef(
+var HeroBlock = React35.forwardRef(
   ({
     className,
     variant,
@@ -2385,26 +2560,26 @@ var HeroBlock = React33.forwardRef(
     actions,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
       "div",
       {
         ref,
         className: cn(heroBlockVariants({ variant, withPattern }), className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mx-auto text-center max-w-4xl", children: [
-          tagline && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "mx-auto text-center max-w-4xl", children: [
+          tagline && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             Badge,
             {
               variant: "default",
-              icon: TaglineIcon ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Icon, { icon: TaglineIcon, size: 16 }) : void 0,
+              icon: TaglineIcon ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { icon: TaglineIcon, size: 16 }) : void 0,
               iconGap: 2,
               className: "mb-fluid-md",
               children: tagline
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Typography, { variant: "h1", className: "mb-fluid-md", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Typography, { variant: "h3", color: "muted", className: "mb-fluid-lg", children: description }),
-          actions && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex flex-wrap gap-fluid-md justify-center", children: actions })
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Typography, { variant: "h1", className: "mb-fluid-md", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Typography, { variant: "h3", color: "muted", className: "mb-fluid-lg", children: description }),
+          actions && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "flex flex-wrap gap-fluid-md justify-center", children: actions })
         ] }) })
       }
     );
@@ -2540,7 +2715,7 @@ function getHighlighter() {
 }
 
 // src/components/code-block/CodeBlock.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 function CodeBlock({ code, language = "text", title, className }) {
   const [html, setHtml] = (0, import_react2.useState)(null);
   const [copied, setCopied] = (0, import_react2.useState)(false);
@@ -2556,16 +2731,16 @@ function CodeBlock({ code, language = "text", title, className }) {
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   }, [code]);
-  const copyButton = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  const copyButton = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "button",
     {
       onClick: handleCopy,
       className: "flex items-center justify-center w-6 h-6 text-berget-muted-foreground hover:text-berget-foreground transition-colors",
       "aria-label": "Copy code",
-      children: copied ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react9.Check, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react9.Copy, { className: "w-3.5 h-3.5" })
+      children: copied ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react9.Check, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react9.Copy, { className: "w-3.5 h-3.5" })
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
     "div",
     {
       className: cn(
@@ -2573,15 +2748,15 @@ function CodeBlock({ code, language = "text", title, className }) {
         className
       ),
       children: [
-        title && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "!h-10 flex items-center !px-4 !text-xs !leading-normal border-b border-berget-border bg-berget-codeblock-header-bg", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-berget-muted-foreground", children: title }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "absolute right-2 top-2 z-10", children: copyButton }),
-        html ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+        title && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "!h-10 flex items-center !px-4 !text-xs !leading-normal border-b border-berget-border bg-berget-codeblock-header-bg", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "text-berget-muted-foreground", children: title }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "absolute right-2 top-2 z-10", children: copyButton }),
+        html ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
           "div",
           {
             className: "[&_.shiki]:!p-4 [&_.shiki]:!m-0 [&_.shiki]:overflow-x-auto [&_.shiki]:!text-sm [&_.shiki]:!leading-relaxed [&_.shiki]:bg-transparent",
             dangerouslySetInnerHTML: { __html: html }
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("pre", { className: "!p-4 !m-0 overflow-x-auto !text-sm !leading-relaxed text-berget-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("code", { children: code }) })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("pre", { className: "!p-4 !m-0 overflow-x-auto !text-sm !leading-relaxed text-berget-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("code", { children: code }) })
       ]
     }
   );
@@ -2635,6 +2810,8 @@ function CodeBlock({ code, language = "text", title, className }) {
   Select,
   Switch,
   TextArea,
+  ThemeProvider,
+  ThemeToggle,
   Typography,
   alertVariants,
   badgeVariants,
@@ -2650,6 +2827,7 @@ function CodeBlock({ code, language = "text", title, className }) {
   switchRootVariants,
   switchThumbVariants,
   textAreaVariants,
-  typographyVariants
+  typographyVariants,
+  useTheme
 });
 //# sourceMappingURL=index.cjs.map