@planetaexo/design-system 0.2.0 → 0.2.10

package/dist/index.cjs

@@ -1,11 +1,16 @@
 'use strict';
 
-var React3 = require('react');
+var React4 = require('react');
+var dateFns = require('date-fns');
 var lucideReact = require('lucide-react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var separator = require('@base-ui/react/separator');
 var jsxRuntime = require('react/jsx-runtime');
+var dialog = require('@base-ui/react/dialog');
+var button = require('@base-ui/react/button');
+var classVarianceAuthority = require('class-variance-authority');
+var reactDayPicker = require('react-day-picker');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -25,7 +30,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -81,10 +86,346 @@ function Separator(_a) {
     }, props)
   );
 }
-var FloatingInput = React3__namespace.forwardRef(
+var buttonVariants = classVarianceAuthority.cva(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+        outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
+        icon: "size-8",
+        "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+        "icon-lg": "size-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button(_a) {
+  var _b = _a, {
+    className,
+    variant = "default",
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "variant",
+    "size"
+  ]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    button.Button,
+    __spreadValues({
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className }))
+    }, props)
+  );
+}
+function Dialog(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
+}
+function DialogPortal(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
+}
+function DialogClose(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Close, __spreadValues({ "data-slot": "dialog-close" }, props));
+}
+function DialogOverlay(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    dialog.Dialog.Backdrop,
+    __spreadValues({
+      "data-slot": "dialog-overlay",
+      className: cn(
+        "fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
+        className
+      )
+    }, props)
+  );
+}
+function DialogContent(_a) {
+  var _b = _a, {
+    className,
+    children,
+    showCloseButton = true
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children",
+    "showCloseButton"
+  ]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      dialog.Dialog.Popup,
+      __spreadProps(__spreadValues({
+        "data-slot": "dialog-content",
+        className: cn(
+          "fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 text-sm ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+          className
+        )
+      }, props), {
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ jsxRuntime.jsxs(
+            dialog.Dialog.Close,
+            {
+              "data-slot": "dialog-close",
+              render: /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  className: "absolute top-2 right-2",
+                  size: "icon-sm"
+                }
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  lucideReact.XIcon,
+                  {}
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      })
+    )
+  ] });
+}
+function DialogHeader(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    __spreadValues({
+      "data-slot": "dialog-header",
+      className: cn("flex flex-col gap-2", className)
+    }, props)
+  );
+}
+function DialogTitle(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    dialog.Dialog.Title,
+    __spreadValues({
+      "data-slot": "dialog-title",
+      className: cn("text-base leading-none font-medium", className)
+    }, props)
+  );
+}
+function Calendar(_a) {
+  var _b = _a, {
+    className,
+    classNames,
+    showOutsideDays = true,
+    captionLayout = "label",
+    buttonVariant = "ghost",
+    locale,
+    formatters,
+    components
+  } = _b, props = __objRest(_b, [
+    "className",
+    "classNames",
+    "showOutsideDays",
+    "captionLayout",
+    "buttonVariant",
+    "locale",
+    "formatters",
+    "components"
+  ]);
+  const defaultClassNames = reactDayPicker.getDefaultClassNames();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactDayPicker.DayPicker,
+    __spreadValues({
+      showOutsideDays,
+      className: cn(
+        "group/calendar bg-background p-2 [--cell-radius:var(--radius-md)] [--cell-size:--spacing(7)] in-data-[slot=card-content]:bg-transparent in-data-[slot=popover-content]:bg-transparent",
+        String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
+        String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
+        className
+      ),
+      captionLayout,
+      locale,
+      formatters: __spreadValues({
+        formatMonthDropdown: (date) => date.toLocaleString(locale == null ? void 0 : locale.code, { month: "short" })
+      }, formatters),
+      classNames: __spreadValues({
+        root: cn("w-fit", defaultClassNames.root),
+        months: cn(
+          "relative flex flex-col gap-4 md:flex-row",
+          defaultClassNames.months
+        ),
+        month: cn("flex w-full flex-col gap-4", defaultClassNames.month),
+        nav: cn(
+          "absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1",
+          defaultClassNames.nav
+        ),
+        button_previous: cn(
+          buttonVariants({ variant: buttonVariant }),
+          "size-(--cell-size) p-0 select-none aria-disabled:opacity-50",
+          defaultClassNames.button_previous
+        ),
+        button_next: cn(
+          buttonVariants({ variant: buttonVariant }),
+          "size-(--cell-size) p-0 select-none aria-disabled:opacity-50",
+          defaultClassNames.button_next
+        ),
+        month_caption: cn(
+          "flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)",
+          defaultClassNames.month_caption
+        ),
+        dropdowns: cn(
+          "flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium",
+          defaultClassNames.dropdowns
+        ),
+        dropdown_root: cn(
+          "relative rounded-(--cell-radius)",
+          defaultClassNames.dropdown_root
+        ),
+        dropdown: cn(
+          "absolute inset-0 bg-popover opacity-0",
+          defaultClassNames.dropdown
+        ),
+        caption_label: cn(
+          "font-medium select-none",
+          captionLayout === "label" ? "text-sm" : "flex items-center gap-1 rounded-(--cell-radius) text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground",
+          defaultClassNames.caption_label
+        ),
+        table: "w-full border-collapse",
+        weekdays: cn("flex", defaultClassNames.weekdays),
+        weekday: cn(
+          "flex-1 rounded-(--cell-radius) text-[0.8rem] font-normal text-muted-foreground select-none",
+          defaultClassNames.weekday
+        ),
+        week: cn("mt-2 flex w-full", defaultClassNames.week),
+        week_number_header: cn(
+          "w-(--cell-size) select-none",
+          defaultClassNames.week_number_header
+        ),
+        week_number: cn(
+          "text-[0.8rem] text-muted-foreground select-none",
+          defaultClassNames.week_number
+        ),
+        day: cn(
+          "group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)",
+          props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)" : "[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)",
+          defaultClassNames.day
+        ),
+        range_start: cn(
+          "relative isolate z-0 rounded-l-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:right-0 after:w-4 after:bg-muted",
+          defaultClassNames.range_start
+        ),
+        range_middle: cn("rounded-none", defaultClassNames.range_middle),
+        range_end: cn(
+          "relative isolate z-0 rounded-r-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:left-0 after:w-4 after:bg-muted",
+          defaultClassNames.range_end
+        ),
+        today: cn(
+          "rounded-(--cell-radius) bg-muted text-foreground data-[selected=true]:rounded-none",
+          defaultClassNames.today
+        ),
+        outside: cn(
+          "text-muted-foreground aria-selected:text-muted-foreground",
+          defaultClassNames.outside
+        ),
+        disabled: cn(
+          "text-muted-foreground opacity-50",
+          defaultClassNames.disabled
+        ),
+        hidden: cn("invisible", defaultClassNames.hidden)
+      }, classNames),
+      components: __spreadValues({
+        Root: (_a2) => {
+          var _b2 = _a2, { className: className2, rootRef } = _b2, props2 = __objRest(_b2, ["className", "rootRef"]);
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            __spreadValues({
+              "data-slot": "calendar",
+              ref: rootRef,
+              className: cn(className2)
+            }, props2)
+          );
+        },
+        Chevron: (_c) => {
+          var _d = _c, { className: className2, orientation } = _d, props2 = __objRest(_d, ["className", "orientation"]);
+          if (orientation === "left") {
+            return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeftIcon, __spreadValues({ className: cn("size-4", className2) }, props2));
+          }
+          if (orientation === "right") {
+            return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, __spreadValues({ className: cn("size-4", className2) }, props2));
+          }
+          return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, __spreadValues({ className: cn("size-4", className2) }, props2));
+        },
+        DayButton: (_e) => {
+          var props2 = __objRest(_e, []);
+          return /* @__PURE__ */ jsxRuntime.jsx(CalendarDayButton, __spreadValues({ locale }, props2));
+        },
+        WeekNumber: (_f) => {
+          var _g = _f, { children } = _g, props2 = __objRest(_g, ["children"]);
+          return /* @__PURE__ */ jsxRuntime.jsx("td", __spreadProps(__spreadValues({}, props2), { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) }));
+        }
+      }, components)
+    }, props)
+  );
+}
+function CalendarDayButton(_a) {
+  var _b = _a, {
+    className,
+    day,
+    modifiers,
+    locale
+  } = _b, props = __objRest(_b, [
+    "className",
+    "day",
+    "modifiers",
+    "locale"
+  ]);
+  const defaultClassNames = reactDayPicker.getDefaultClassNames();
+  const ref = React4__namespace.useRef(null);
+  React4__namespace.useEffect(() => {
+    var _a2;
+    if (modifiers.focused) (_a2 = ref.current) == null ? void 0 : _a2.focus();
+  }, [modifiers.focused]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Button,
+    __spreadValues({
+      variant: "ghost",
+      size: "icon",
+      "data-day": day.date.toLocaleDateString(locale == null ? void 0 : locale.code),
+      "data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
+      "data-range-start": modifiers.range_start,
+      "data-range-end": modifiers.range_end,
+      "data-range-middle": modifiers.range_middle,
+      className: cn(
+        "relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70",
+        defaultClassNames.day,
+        className
+      )
+    }, props)
+  );
+}
+var FloatingInput = React4__namespace.forwardRef(
   (_a, ref) => {
     var _b = _a, { label, error, id, className, required } = _b, props = __objRest(_b, ["label", "error", "id", "className", "required"]);
-    const inputId = id != null ? id : React3__namespace.useId();
+    const inputId = id != null ? id : React4__namespace.useId();
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
@@ -124,10 +465,10 @@ var FloatingInput = React3__namespace.forwardRef(
   }
 );
 FloatingInput.displayName = "FloatingInput";
-var FloatingSelect = React3__namespace.forwardRef(
+var FloatingSelect = React4__namespace.forwardRef(
   (_a, ref) => {
     var _b = _a, { label, error, id, className, required, children } = _b, props = __objRest(_b, ["label", "error", "id", "className", "required", "children"]);
-    const inputId = id != null ? id : React3__namespace.useId();
+    const inputId = id != null ? id : React4__namespace.useId();
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "select",
@@ -388,11 +729,11 @@ function PhoneCountrySelect({
   className
 }) {
   var _a;
-  const [open, setOpen] = React3__namespace.useState(false);
-  const containerRef = React3__namespace.useRef(null);
-  const listRef = React3__namespace.useRef(null);
+  const [open, setOpen] = React4__namespace.useState(false);
+  const containerRef = React4__namespace.useRef(null);
+  const listRef = React4__namespace.useRef(null);
   const selected = (_a = PHONE_COUNTRIES.find((c) => c.code === value)) != null ? _a : PHONE_COUNTRIES[0];
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     if (!open) return;
     const handler = (e) => {
       var _a2;
@@ -403,7 +744,7 @@ function PhoneCountrySelect({
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open]);
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     if (!open || !listRef.current) return;
     const activeEl = listRef.current.querySelector("[data-selected=true]");
     activeEl == null ? void 0 : activeEl.scrollIntoView({ block: "nearest" });
@@ -499,9 +840,9 @@ function PhoneCountrySelect({
     )
   ] });
 }
-function OfferAdventureCard({ adventure }) {
+function AdventureCard({ adventure }) {
   var _a, _b, _c;
-  const [checked, setChecked] = React3__namespace.useState(
+  const [checked, setChecked] = React4__namespace.useState(
     new Set((_b = (_a = adventure.optionals) == null ? void 0 : _a.filter((o) => o.defaultChecked).map((o) => o.id)) != null ? _b : [])
   );
   const toggleOptional = (id) => setChecked((prev) => {
@@ -521,13 +862,16 @@ function OfferAdventureCard({ adventure }) {
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5 lg:p-6 flex flex-col gap-2.5", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2 min-h-[22px]", children: [
         adventure.reference ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center rounded-md bg-primary/10 px-2 py-0.5 text-xs font-semibold text-primary font-heading tracking-wide", children: adventure.reference }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
-        adventure.onRemove && /* @__PURE__ */ jsxRuntime.jsx(
+        adventure.onRemove && /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
             type: "button",
             onClick: adventure.onRemove,
-            className: "text-[11px] text-destructive/60 hover:text-destructive transition-colors font-sans leading-none",
-            children: "Remove from proposal"
+            className: "flex items-center gap-1.5 rounded-full border border-border px-3 py-1 text-xs text-muted-foreground font-ui hover:border-destructive hover:text-destructive transition-colors",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "w-3 h-3" }),
+              "Remove"
+            ]
           }
         )
       ] }),
@@ -542,12 +886,12 @@ function OfferAdventureCard({ adventure }) {
         /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapPinIcon, { className: "w-3.5 h-3.5 text-primary shrink-0" }),
         adventure.location
       ] }),
-      adventure.optionals && adventure.optionals.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 mt-1", children: [
+      adventure.optionals && adventure.optionals.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 rounded-xl border border-border bg-muted/30 p-4 flex flex-col gap-3", children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[10px] font-bold text-muted-foreground font-heading uppercase tracking-widest", children: "Available optionals" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-1.5", children: adventure.optionals.map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: adventure.optionals.map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: "flex items-center gap-2.5 cursor-pointer group",
+            className: "flex items-center gap-3 cursor-pointer group",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(
                 "input",
@@ -561,7 +905,7 @@ function OfferAdventureCard({ adventure }) {
               /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-sans text-foreground/80 group-hover:text-foreground transition-colors leading-snug", children: [
                 opt.label,
                 " ",
-                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground font-semibold", children: [
                   "(",
                   opt.pricePerPerson,
                   ")"
@@ -579,26 +923,30 @@ function OfferAdventureCard({ adventure }) {
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-foreground/80 leading-relaxed font-sans", children: adventure.description })
         ] })
       ] }),
-      adventure.included && adventure.included.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 mt-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-bold text-foreground font-heading", children: "O que est\xE1 incluso" }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1", children: adventure.included.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-sm text-foreground/80 font-sans", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "w-4 h-4 text-primary shrink-0 mt-0.5" }),
+      adventure.included && adventure.included.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2.5 mt-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-base font-bold text-foreground font-heading", children: "O que est\xE1 incluso" }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1.5", children: adventure.included.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-base text-foreground/80 font-sans", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "w-4 h-4 text-primary shrink-0 mt-1" }),
           item
         ] }, i)) })
       ] }),
-      adventure.notIncluded && adventure.notIncluded.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 mt-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-bold text-foreground font-heading", children: "O que n\xE3o est\xE1 incluso" }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1", children: adventure.notIncluded.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-sm text-foreground/80 font-sans", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "w-4 h-4 text-destructive shrink-0 mt-0.5" }),
+      adventure.notIncluded && adventure.notIncluded.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2.5 mt-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-base font-bold text-foreground font-heading", children: "O que n\xE3o est\xE1 incluso" }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1.5", children: adventure.notIncluded.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-base text-foreground/80 font-sans", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "w-4 h-4 text-destructive shrink-0 mt-1" }),
           item
         ] }, i)) })
       ] }),
-      adventure.cancellationPolicy && adventure.cancellationPolicy.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 mt-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-bold text-foreground font-heading", children: "Pol\xEDtica de cancelamento" }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1", children: adventure.cancellationPolicy.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-sm text-muted-foreground font-sans", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-primary shrink-0 mt-2" }),
+      adventure.cancellationPolicy && adventure.cancellationPolicy.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2.5 mt-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-base font-bold text-foreground font-heading", children: "Pol\xEDtica de cancelamento" }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1.5", children: adventure.cancellationPolicy.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-base text-muted-foreground font-sans", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-primary shrink-0 mt-2.5" }),
           item
         ] }, i)) })
+      ] }),
+      adventure.detailsSlot && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "my-1" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-3 text-foreground", children: adventure.detailsSlot })
       ] })
     ] })
   ] });
@@ -607,10 +955,11 @@ function OfferSidebar({
   total,
   agent,
   onBook,
-  bookLabel
+  bookLabel,
+  bookDisabled
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-2xl border border-border bg-card p-5 flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex rounded-2xl border border-border bg-card p-5 flex-col gap-4", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs uppercase tracking-widest text-muted-foreground font-heading mb-1", children: "Booking Total" }),
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-3xl font-black text-primary font-heading leading-none", children: total })
@@ -619,11 +968,13 @@ function OfferSidebar({
         "button",
         {
           type: "button",
+          disabled: bookDisabled,
           onClick: onBook,
           className: cn(
             "w-full rounded-full bg-primary py-3 text-sm font-bold tracking-wide uppercase",
             "text-primary-foreground font-heading transition-colors hover:bg-primary/90",
-            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+            bookDisabled && "opacity-50 pointer-events-none"
           ),
           children: bookLabel
         }
@@ -643,8 +994,8 @@ function OfferSidebar({
           )
         ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 rounded-full bg-primary/10 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xl font-bold text-primary font-heading", children: agent.name.charAt(0) }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground font-sans", children: "Need help with your offer?" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-sans text-foreground/80 mt-0.5", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground font-sans", children: "Need help with your offer?" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-sans text-foreground mt-0.5", children: [
             "Contact",
             " ",
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold text-foreground font-heading", children: agent.name }),
@@ -653,7 +1004,7 @@ function OfferSidebar({
               " ",
               "at",
               " ",
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-primary", children: agent.company })
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold text-foreground font-heading", children: agent.company })
             ] })
           ] })
         ] })
@@ -707,7 +1058,10 @@ function OfferSummarySection({
   total,
   depositInfo,
   onContinue,
-  continueLabel
+  continueLabel,
+  summaryNotesSlot,
+  summaryDiscountLine,
+  continueDisabled
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-2xl border border-border bg-card p-5 flex flex-col gap-4", children: [
     /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-bold text-foreground font-heading text-base", children: "Summary" }),
@@ -726,11 +1080,19 @@ function OfferSummarySection({
       ] }, j)) }),
       i < adventures.length - 1 && /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "mt-4" })
     ] }, adventure.id)) }),
+    summaryNotesSlot,
     /* @__PURE__ */ jsxRuntime.jsx(Separator, {}),
     subtotal && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground font-sans", children: "Subtotal" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground font-sans", children: subtotal })
     ] }),
+    summaryDiscountLine && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-success", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-sans", children: summaryDiscountLine.label }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-semibold font-sans shrink-0", children: [
+        "\u2212",
+        summaryDiscountLine.amount
+      ] })
+    ] }),
     depositInfo && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5 rounded-lg bg-muted/50 border border-border p-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground font-sans", children: [
@@ -757,17 +1119,322 @@ function OfferSummarySection({
       "button",
       {
         type: "button",
+        disabled: continueDisabled,
         onClick: onContinue,
         className: cn(
           "w-full rounded-full bg-primary py-3.5 text-center text-sm font-bold uppercase tracking-wide",
           "text-primary-foreground font-heading transition-colors hover:bg-primary/90",
-          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          continueDisabled && "opacity-50 pointer-events-none"
         ),
         children: continueLabel
       }
     )
   ] });
 }
+var COUNTRIES = [
+  { code: "AF", name: "Afghanistan" },
+  { code: "AL", name: "Albania" },
+  { code: "DZ", name: "Algeria" },
+  { code: "AO", name: "Angola" },
+  { code: "AR", name: "Argentina" },
+  { code: "AM", name: "Armenia" },
+  { code: "AU", name: "Australia" },
+  { code: "AT", name: "Austria" },
+  { code: "AZ", name: "Azerbaijan" },
+  { code: "BE", name: "Belgium" },
+  { code: "BO", name: "Bolivia" },
+  { code: "BA", name: "Bosnia" },
+  { code: "BR", name: "Brazil" },
+  { code: "BG", name: "Bulgaria" },
+  { code: "KH", name: "Cambodia" },
+  { code: "CA", name: "Canada" },
+  { code: "CL", name: "Chile" },
+  { code: "CN", name: "China" },
+  { code: "CO", name: "Colombia" },
+  { code: "CR", name: "Costa Rica" },
+  { code: "HR", name: "Croatia" },
+  { code: "CU", name: "Cuba" },
+  { code: "CZ", name: "Czech Republic" },
+  { code: "DK", name: "Denmark" },
+  { code: "DO", name: "Dominican Republic" },
+  { code: "EC", name: "Ecuador" },
+  { code: "EG", name: "Egypt" },
+  { code: "SV", name: "El Salvador" },
+  { code: "ET", name: "Ethiopia" },
+  { code: "FI", name: "Finland" },
+  { code: "FR", name: "France" },
+  { code: "GE", name: "Georgia" },
+  { code: "DE", name: "Germany" },
+  { code: "GH", name: "Ghana" },
+  { code: "GR", name: "Greece" },
+  { code: "GT", name: "Guatemala" },
+  { code: "HN", name: "Honduras" },
+  { code: "HK", name: "Hong Kong" },
+  { code: "HU", name: "Hungary" },
+  { code: "IS", name: "Iceland" },
+  { code: "IN", name: "India" },
+  { code: "ID", name: "Indonesia" },
+  { code: "IR", name: "Iran" },
+  { code: "IQ", name: "Iraq" },
+  { code: "IE", name: "Ireland" },
+  { code: "IL", name: "Israel" },
+  { code: "IT", name: "Italy" },
+  { code: "JM", name: "Jamaica" },
+  { code: "JP", name: "Japan" },
+  { code: "JO", name: "Jordan" },
+  { code: "KZ", name: "Kazakhstan" },
+  { code: "KE", name: "Kenya" },
+  { code: "KW", name: "Kuwait" },
+  { code: "LB", name: "Lebanon" },
+  { code: "LY", name: "Libya" },
+  { code: "MY", name: "Malaysia" },
+  { code: "MX", name: "Mexico" },
+  { code: "MA", name: "Morocco" },
+  { code: "MZ", name: "Mozambique" },
+  { code: "NP", name: "Nepal" },
+  { code: "NL", name: "Netherlands" },
+  { code: "NZ", name: "New Zealand" },
+  { code: "NI", name: "Nicaragua" },
+  { code: "NG", name: "Nigeria" },
+  { code: "NO", name: "Norway" },
+  { code: "PK", name: "Pakistan" },
+  { code: "PA", name: "Panama" },
+  { code: "PY", name: "Paraguay" },
+  { code: "PE", name: "Peru" },
+  { code: "PH", name: "Philippines" },
+  { code: "PL", name: "Poland" },
+  { code: "PT", name: "Portugal" },
+  { code: "QA", name: "Qatar" },
+  { code: "RO", name: "Romania" },
+  { code: "RU", name: "Russia" },
+  { code: "SA", name: "Saudi Arabia" },
+  { code: "SN", name: "Senegal" },
+  { code: "RS", name: "Serbia" },
+  { code: "SG", name: "Singapore" },
+  { code: "ZA", name: "South Africa" },
+  { code: "KR", name: "South Korea" },
+  { code: "ES", name: "Spain" },
+  { code: "LK", name: "Sri Lanka" },
+  { code: "SE", name: "Sweden" },
+  { code: "CH", name: "Switzerland" },
+  { code: "TW", name: "Taiwan" },
+  { code: "TZ", name: "Tanzania" },
+  { code: "TH", name: "Thailand" },
+  { code: "TN", name: "Tunisia" },
+  { code: "TR", name: "Turkey" },
+  { code: "UA", name: "Ukraine" },
+  { code: "AE", name: "United Arab Emirates" },
+  { code: "GB", name: "United Kingdom" },
+  { code: "US", name: "United States" },
+  { code: "UY", name: "Uruguay" },
+  { code: "UZ", name: "Uzbekistan" },
+  { code: "VE", name: "Venezuela" },
+  { code: "VN", name: "Vietnam" },
+  { code: "YE", name: "Yemen" },
+  { code: "ZW", name: "Zimbabwe" }
+];
+function CountrySearchField({
+  value,
+  onChange,
+  required
+}) {
+  var _a;
+  const [query, setQuery] = React4__namespace.useState("");
+  const [open, setOpen] = React4__namespace.useState(false);
+  const containerRef = React4__namespace.useRef(null);
+  const searchRef = React4__namespace.useRef(null);
+  const selected = COUNTRIES.find((c) => c.code === value);
+  const isFloated = open || !!selected;
+  const filtered = query.trim() ? COUNTRIES.filter((c) => c.name.toLowerCase().includes(query.toLowerCase())) : COUNTRIES;
+  React4__namespace.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      var _a2;
+      if (!((_a2 = containerRef.current) == null ? void 0 : _a2.contains(e.target))) {
+        setOpen(false);
+        setQuery("");
+      }
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open]);
+  const handleOpen = () => {
+    setOpen(true);
+    setQuery("");
+    setTimeout(() => {
+      var _a2;
+      return (_a2 = searchRef.current) == null ? void 0 : _a2.focus();
+    }, 0);
+  };
+  const handleSelect = (code) => {
+    onChange(code);
+    setOpen(false);
+    setQuery("");
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: "relative w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: handleOpen,
+        className: cn(
+          "relative flex w-full items-center rounded-lg border border-border bg-background h-14 px-3 text-left transition-colors",
+          open && "border-primary ring-1 ring-primary"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "span",
+            {
+              className: cn(
+                "pointer-events-none absolute left-3 transition-all duration-150 font-ui",
+                isFloated ? "top-2 text-xs text-primary" : "top-1/2 -translate-y-1/2 text-base text-muted-foreground"
+              ),
+              children: [
+                "Country",
+                required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary ml-0.5", children: "*" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("flex-1 pt-3 text-base font-ui truncate", selected ? "text-foreground" : "invisible"), children: (_a = selected == null ? void 0 : selected.name) != null ? _a : "\u2014" }),
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: cn("h-4 w-4 shrink-0 text-muted-foreground transition-transform", open && "rotate-180") })
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-[calc(100%+4px)] left-0 right-0 z-50 rounded-xl border border-border bg-background shadow-lg overflow-hidden", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border-b border-border", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            ref: searchRef,
+            type: "text",
+            value: query,
+            onChange: (e) => setQuery(e.target.value),
+            placeholder: "Search country\u2026",
+            className: "flex-1 bg-transparent text-sm font-ui text-foreground placeholder:text-muted-foreground focus:outline-none"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-52 overflow-y-auto py-1", children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-3 py-2 text-sm font-ui text-muted-foreground", children: "No countries found" }) : filtered.map((c) => /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => handleSelect(c.code),
+          className: cn(
+            "flex w-full items-center px-3 py-2 text-sm font-ui text-left transition-colors hover:bg-muted",
+            c.code === value && "bg-primary/10 text-primary font-semibold"
+          ),
+          children: c.name
+        },
+        c.code
+      )) })
+    ] })
+  ] });
+}
+function BirthDateField({
+  label,
+  required,
+  value,
+  onChange
+}) {
+  const [open, setOpen] = React4__namespace.useState(false);
+  const [text, setText] = React4__namespace.useState(value ? dateFns.format(value, "dd/MM/yyyy") : "");
+  const containerRef = React4__namespace.useRef(null);
+  const inputId = React4__namespace.useId();
+  React4__namespace.useEffect(() => {
+    setText(value ? dateFns.format(value, "dd/MM/yyyy") : "");
+  }, [value]);
+  React4__namespace.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      var _a;
+      if (!((_a = containerRef.current) == null ? void 0 : _a.contains(e.target))) setOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open]);
+  const handleTextChange = (e) => {
+    const digits = e.target.value.replace(/\D/g, "").slice(0, 8);
+    let formatted = digits.slice(0, 2);
+    if (digits.length > 2) formatted += "/" + digits.slice(2, 4);
+    if (digits.length > 4) formatted += "/" + digits.slice(4, 8);
+    setText(formatted);
+    if (formatted.length === 10) {
+      const [dd, mm, yyyy] = formatted.split("/").map(Number);
+      const d = new Date(yyyy, mm - 1, dd);
+      if (!isNaN(d.getTime()) && d.getFullYear() === yyyy && d <= /* @__PURE__ */ new Date()) {
+        onChange(d);
+        return;
+      }
+    }
+    onChange(void 0);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: "relative w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center rounded-lg border border-border bg-background h-14 transition-colors",
+          open ? "border-primary ring-1 ring-primary" : "focus-within:border-primary focus-within:ring-1 focus-within:ring-primary"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 h-full", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "label",
+              {
+                htmlFor: inputId,
+                className: "pointer-events-none absolute left-3 top-2 text-xs text-muted-foreground font-ui",
+                children: [
+                  label,
+                  required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary ml-0.5", children: "*" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                id: inputId,
+                type: "text",
+                inputMode: "numeric",
+                value: text,
+                onChange: handleTextChange,
+                placeholder: "dd/mm/yyyy",
+                className: "block h-full w-full bg-transparent px-3 pt-5 pb-2 text-base text-foreground font-ui focus:outline-none placeholder:text-muted-foreground/50"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => setOpen((v) => !v),
+              tabIndex: -1,
+              "aria-label": "Open calendar",
+              className: "px-3 h-full flex items-center text-muted-foreground hover:text-primary transition-colors focus:outline-none",
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "h-4 w-4" })
+            }
+          )
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[calc(100%+4px)] left-0 right-0 z-50 rounded-xl border border-border bg-background shadow-lg overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+      Calendar,
+      {
+        mode: "single",
+        selected: value,
+        onSelect: (date) => {
+          onChange(date);
+          setOpen(false);
+        },
+        defaultMonth: value != null ? value : new Date(1990, 0, 1),
+        disabled: { after: /* @__PURE__ */ new Date() },
+        className: "font-ui w-full",
+        autoFocus: true
+      }
+    ) })
+  ] });
+}
 var WIZARD_STEPS = [
   { id: "responsible", label: "Responsible party details" },
   { id: "travellers", label: "Travellers" },
@@ -779,9 +1446,9 @@ function BookingWizard({
   depositInfo,
   onCancel
 }) {
-  const [step, setStep] = React3__namespace.useState("responsible");
-  const [error, setError] = React3__namespace.useState(null);
-  const [responsible, setResponsible] = React3__namespace.useState({
+  const [step, setStep] = React4__namespace.useState("responsible");
+  const [error, setError] = React4__namespace.useState(null);
+  const [responsible, setResponsible] = React4__namespace.useState({
     firstName: "",
     lastName: "",
     email: "",
@@ -800,18 +1467,21 @@ function BookingWizard({
     return s + ((_b = (_a = a.slots) == null ? void 0 : _a.children) != null ? _b : 0);
   }, 0);
   const totalPax = totalAdults + totalChildren;
-  const [travellers, setTravellers] = React3__namespace.useState(
+  const [travellers, setTravellers] = React4__namespace.useState(
     Array.from({ length: Math.max(totalPax, 1) }, () => ({
       firstName: "",
       lastName: "",
-      dateOfBirth: "",
+      dateOfBirth: void 0,
       email: ""
     }))
   );
-  const [payAmount, setPayAmount] = React3__namespace.useState("full");
-  const [termsAccepted, setTermsAccepted] = React3__namespace.useState(false);
+  const [payAmount, setPayAmount] = React4__namespace.useState("full");
+  const [payMethod, setPayMethod] = React4__namespace.useState("stripe");
+  const [termsAccepted, setTermsAccepted] = React4__namespace.useState(false);
+  const [termsModalOpen, setTermsModalOpen] = React4__namespace.useState(false);
   const setR = (k, v) => setResponsible((p) => __spreadProps(__spreadValues({}, p), { [k]: v }));
   const setT = (i, k, v) => setTravellers((prev) => prev.map((t, idx) => idx === i ? __spreadProps(__spreadValues({}, t), { [k]: v }) : t));
+  const setTDob = (i, v) => setTravellers((prev) => prev.map((t, idx) => idx === i ? __spreadProps(__spreadValues({}, t), { dateOfBirth: v }) : t));
   const stepIndex = WIZARD_STEPS.findIndex((s) => s.id === step);
   const goNext = () => {
     setError(null);
@@ -880,7 +1550,7 @@ function BookingWizard({
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-2xl border border-border bg-card overflow-hidden", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-border px-5 py-4 bg-muted/20", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-bold text-foreground font-heading mb-2", children: "Booking details" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1.5 flex-wrap", children: WIZARD_STEPS.map((s, i) => /* @__PURE__ */ jsxRuntime.jsxs(React3__namespace.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1.5 flex-wrap", children: WIZARD_STEPS.map((s, i) => /* @__PURE__ */ jsxRuntime.jsxs(React4__namespace.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
@@ -914,22 +1584,14 @@ function BookingWizard({
                   placeholder: " ",
                   value: responsible.phone,
                   onChange: (e) => setR("phone", e.target.value),
-                  className: "peer block h-14 w-full rounded-r-lg border border-border bg-background px-3 pt-5 pb-2 text-base text-foreground font-sans transition-colors placeholder-transparent focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary"
+                  className: "peer block h-14 w-full rounded-r-lg border border-border bg-background px-3 pt-5 pb-2 text-base text-foreground font-ui transition-colors placeholder-transparent focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary"
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "wiz-phone", className: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-base text-muted-foreground font-sans transition-all duration-150 peer-focus:top-3 peer-focus:translate-y-0 peer-focus:text-xs peer-focus:text-primary peer-not-placeholder-shown:top-3 peer-not-placeholder-shown:translate-y-0 peer-not-placeholder-shown:text-xs", children: "Phone" })
+              /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "wiz-phone", className: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-base text-muted-foreground font-ui transition-all duration-150 peer-focus:top-3 peer-focus:translate-y-0 peer-focus:text-xs peer-focus:text-primary peer-not-placeholder-shown:top-3 peer-not-placeholder-shown:translate-y-0 peer-not-placeholder-shown:text-xs", children: "Phone" })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(FloatingSelect, { label: "Country", required: true, value: responsible.country, onChange: (e) => setR("country", e.target.value), children: [
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, hidden: true }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "BR", children: "Brazil" }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "FR", children: "France" }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "US", children: "United States" }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "UK", children: "United Kingdom" }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "AR", children: "Argentina" }),
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "PT", children: "Portugal" })
-        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(CountrySearchField, { required: true, value: responsible.country, onChange: (code) => setR("country", code) }),
         /* @__PURE__ */ jsxRuntime.jsx(FloatingInput, { label: "Passport / CPF", required: true, value: responsible.passport, onChange: (e) => setR("passport", e.target.value) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -940,10 +1602,10 @@ function BookingWizard({
               rows: 3,
               value: responsible.notes,
               onChange: (e) => setR("notes", e.target.value),
-              className: "peer block w-full resize-none rounded-lg border border-border bg-background px-3 pt-6 pb-3 text-base text-foreground font-sans transition-colors placeholder-transparent focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary"
+              className: "peer block w-full resize-none rounded-lg border border-border bg-background px-3 pt-6 pb-3 text-base text-foreground font-ui transition-colors placeholder-transparent focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary"
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "wiz-notes", className: "pointer-events-none absolute left-3 top-4 text-base text-muted-foreground font-sans transition-all duration-150 peer-focus:top-2 peer-focus:text-xs peer-focus:text-primary peer-not-placeholder-shown:top-2 peer-not-placeholder-shown:text-xs", children: "Notes (optional)" })
+          /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "wiz-notes", className: "pointer-events-none absolute left-3 top-4 text-base text-muted-foreground font-ui transition-all duration-150 peer-focus:top-2 peer-focus:text-xs peer-focus:text-primary peer-not-placeholder-shown:top-2 peer-not-placeholder-shown:text-xs", children: "Notes (optional)" })
         ] })
       ] }),
       step === "travellers" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-5", children: [
@@ -969,23 +1631,15 @@ function BookingWizard({
               /* @__PURE__ */ jsxRuntime.jsx(FloatingInput, { label: "Last name", required: true, value: t.lastName, onChange: (e) => setT(i, "lastName", e.target.value) })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "input",
-                  {
-                    id: `dob-${i}`,
-                    type: "date",
-                    required: isChild,
-                    value: t.dateOfBirth,
-                    onChange: (e) => setT(i, "dateOfBirth", e.target.value),
-                    className: "peer block h-14 w-full rounded-lg border border-border bg-background px-3 pt-5 pb-2 text-base text-foreground font-sans transition-colors focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: `dob-${i}`, className: "pointer-events-none absolute left-3 top-3 text-xs text-muted-foreground font-sans", children: [
-                  "Date of birth",
-                  isChild && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary ml-0.5", children: "*" })
-                ] })
-              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                BirthDateField,
+                {
+                  label: "Date of birth",
+                  required: isChild,
+                  value: t.dateOfBirth,
+                  onChange: (d) => setTDob(i, d)
+                }
+              ),
               /* @__PURE__ */ jsxRuntime.jsx(
                 FloatingInput,
                 {
@@ -1022,20 +1676,38 @@ function BookingWizard({
             /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$" }),
             " Payment method"
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: [
+            { id: "stripe", label: "Credit / Debit card", sub: "Secure payment via Stripe" },
+            { id: "pix", label: "PIX", sub: "Instant transfer \u2014 Brazil only" },
+            { id: "bank", label: "Bank transfer", sub: "Wire / TED / DOC" }
+          ].map((m) => /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
               type: "button",
-              className: "w-full rounded-lg border-2 border-primary bg-primary/5 px-4 py-3 text-sm text-center text-primary font-semibold font-sans",
-              children: "Stripe (cart\xE3o)"
-            }
-          )
+              onClick: () => setPayMethod(m.id),
+              className: cn(
+                "flex items-start gap-3 rounded-lg border-2 px-4 py-3 text-left transition-colors",
+                payMethod === m.id ? "border-primary bg-primary/5" : "border-border bg-background hover:border-primary/40"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+                  "mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors",
+                  payMethod === m.id ? "border-primary" : "border-border"
+                ), children: payMethod === m.id && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-2 w-2 rounded-full bg-primary" }) }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col gap-0.5", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+                    "text-sm font-semibold font-sans",
+                    payMethod === m.id ? "text-primary" : "text-foreground"
+                  ), children: m.label }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-sans", children: m.sub })
+                ] })
+              ]
+            },
+            m.id
+          )) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border border-border p-4 flex flex-col gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest flex items-center gap-1.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "w-3.5 h-3.5" }),
-            " Terms and conditions"
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: "Terms and conditions" }),
           /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-start gap-2.5 cursor-pointer", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               "input",
@@ -1046,9 +1718,52 @@ function BookingWizard({
                 className: "h-4 w-4 shrink-0 mt-0.5 rounded border-border accent-primary cursor-pointer"
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-sans text-foreground/80 leading-snug", children: "I have read and accept the terms and conditions of the reservation." })
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-sans text-foreground/80 leading-snug", children: [
+              "I have read and accept the",
+              " ",
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setTermsModalOpen(true),
+                  className: "underline underline-offset-2 text-primary hover:text-primary/80 transition-colors font-semibold",
+                  children: "terms and conditions"
+                }
+              ),
+              " ",
+              "of the reservation."
+            ] })
           ] })
-        ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: termsModalOpen, onOpenChange: setTermsModalOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "!max-w-[80vw] w-[80vw] max-h-[85vh] overflow-y-auto", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "font-heading text-xl", children: "Terms and Conditions" }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 text-sm font-sans text-foreground/80 leading-relaxed", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: 'These terms and conditions ("Terms") govern the booking of travel experiences offered through Planeta EXO ("Company"). By confirming a booking, you agree to these Terms in full.' }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-bold text-foreground font-heading text-base", children: "1. Bookings and payments" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "A booking is confirmed upon receipt of the required deposit or full payment. The deposit amount is specified in your offer. The remaining balance must be paid by the balance due date stated in your offer." }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-bold text-foreground font-heading text-base", children: "2. Cancellation policy" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Cancellations made more than 60 days before departure are eligible for a full refund of the deposit. Cancellations between 30 and 60 days forfeit 50% of the deposit. Cancellations within 30 days of departure are non-refundable." }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-bold text-foreground font-heading text-base", children: "3. Changes and modifications" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "The Company reserves the right to modify itineraries due to weather, safety, or operational reasons. Equivalent alternatives will be offered wherever possible." }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-bold text-foreground font-heading text-base", children: "4. Travel insurance" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Comprehensive travel insurance is strongly recommended. The Company is not liable for costs arising from trip interruption, medical emergencies, or personal loss." }),
+            /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-bold text-foreground font-heading text-base", children: "5. Liability" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Participation in adventure activities carries inherent risk. By booking, you acknowledge and accept these risks. The Company's liability is limited to the total booking amount." }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+              DialogClose,
+              {
+                render: /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: "rounded-full bg-primary px-6 py-2.5 text-sm font-bold text-primary-foreground font-heading hover:bg-primary/90 transition-colors"
+                  }
+                ),
+                children: "Close"
+              }
+            ) })
+          ] })
+        ] }) })
       ] }),
       error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive font-sans", children: error }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
@@ -1092,10 +1807,14 @@ function BookingWizard({
     ] })
   ] });
 }
+function OfferAdventureCard({ adventure }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(AdventureCard, { adventure });
+}
 function Offer({
   logo = "/logo-planetaexo.png",
   logoAlt = "Planeta EXO",
   title,
+  subtitle,
   adventures,
   subtotal,
   total,
@@ -1103,16 +1822,21 @@ function Offer({
   agent,
   onContinue,
   continueLabel = "Book now",
+  externalBookingFlow,
+  summaryNotesSlot,
+  summaryDiscountLine,
+  continueDisabled,
   className
 }) {
-  const [showBooking, setShowBooking] = React3__namespace.useState(false);
+  const [showBooking, setShowBooking] = React4__namespace.useState(false);
   const handleBook = () => {
-    setShowBooking(true);
+    if (!externalBookingFlow) setShowBooking(true);
     onContinue == null ? void 0 : onContinue();
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("w-full max-w-5xl mx-auto flex flex-col gap-6", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: logoAlt, className: "w-[200px] h-auto object-contain" }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("w-full max-w-5xl mx-auto flex flex-col gap-6 pb-20 lg:pb-0", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: logoAlt, className: "w-[150px] h-auto object-contain mx-auto block" }),
     /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-black text-foreground font-heading leading-tight", children: title }),
+    subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground font-sans space-y-1 leading-relaxed", children: subtitle }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-[1fr_280px] gap-6 lg:gap-8 items-start", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "flex flex-col gap-5", children: [
@@ -1120,7 +1844,7 @@ function Offer({
             /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapIcon, { className: "w-5 h-5 text-primary shrink-0" }),
             /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-bold text-foreground font-heading text-base", children: "Included Adventures" })
           ] }),
-          adventures.map((adventure) => /* @__PURE__ */ jsxRuntime.jsx(OfferAdventureCard, { adventure }, adventure.id))
+          adventures.map((adventure) => /* @__PURE__ */ jsxRuntime.jsx(AdventureCard, { adventure }, adventure.id))
         ] }),
         !showBooking && /* @__PURE__ */ jsxRuntime.jsx(
           OfferSummarySection,
@@ -1130,10 +1854,13 @@ function Offer({
             total,
             depositInfo,
             onContinue: handleBook,
-            continueLabel
+            continueLabel,
+            summaryNotesSlot,
+            summaryDiscountLine,
+            continueDisabled
           }
         ),
-        showBooking && /* @__PURE__ */ jsxRuntime.jsx(
+        showBooking && !externalBookingFlow && /* @__PURE__ */ jsxRuntime.jsx(
           BookingWizard,
           {
             adventures,
@@ -1149,10 +1876,30 @@ function Offer({
           total,
           agent,
           onBook: handleBook,
-          bookLabel: continueLabel
+          bookLabel: continueLabel,
+          bookDisabled: continueDisabled
         }
       ) })
-    ] })
+    ] }),
+    !showBooking && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed bottom-0 inset-x-0 z-40 border-t border-border bg-background/95 backdrop-blur-sm px-4 py-3 lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 max-w-5xl mx-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] uppercase tracking-widest text-muted-foreground font-heading", children: "Total" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xl font-black text-primary font-heading leading-tight", children: total })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleBook,
+          className: cn(
+            "rounded-full bg-primary px-6 py-3 text-sm font-bold tracking-wide uppercase",
+            "text-primary-foreground font-heading transition-colors hover:bg-primary/90",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          ),
+          children: continueLabel
+        }
+      )
+    ] }) })
   ] });
 }