@riverbankcms/sdk 0.60.9 → 0.60.11

package/dist/client/bookings.mjs

@@ -86,7 +86,7 @@ function ze() {
     /* @__PURE__ */ Te(P)
   );
 }
-function z3(e) {
+function z5(e) {
   if (L) {
     if (/* @__PURE__ */ Te(P) !== null)
       throw Tt(), Je;
@@ -2115,12 +2115,12 @@ function ha(e, t) {
   var mt = we(Dr, 2);
   let Pr;
   var We = X(mt);
-  en(We), We.__change = ui, z3(mt);
+  en(We), We.__change = ui, z5(mt);
   var Ut = we(mt, 2), wi = X(Ut);
   {
     var pi = (n) => {
       var u = na(), _ = Gr(u), y = X(_);
-      Ge(y, () => c(re).verified), z3(_);
+      Ge(y, () => c(re).verified), z5(_);
       var T = we(_, 2);
       en(T), Pe(() => {
         se(T, "name", V()), jo(T, c(Le));
@@ -2129,10 +2129,10 @@ function ha(e, t) {
       {
         var _ = (T) => {
           var E = ia(), p = X(E);
-          Ge(p, () => c(re).verifying), z3(E), ne(T, E);
+          Ge(p, () => c(re).verifying), z5(E), ne(T, E);
         }, y = (T) => {
           var E = oa(), p = X(E);
-          Ge(p, () => c(re).label), z3(E), Pe(() => se(E, "for", c(cr))), ne(T, E);
+          Ge(p, () => c(re).label), z5(E), Pe(() => se(E, "for", c(cr))), ne(T, E);
         };
         $e(
           n,
@@ -2147,18 +2147,18 @@ function ha(e, t) {
       c(C) === b.VERIFIED ? n(pi) : n(bi, false);
     });
   }
-  z3(Ut);
+  z5(Ut);
   var yi = we(Ut, 2);
   {
     var Ei = (n) => {
       var u = aa(), _ = X(u);
-      se(_, "href", sr), z3(u), Pe(() => se(_, "aria-label", c(re).ariaLinkLabel)), ne(n, u);
+      se(_, "href", sr), z5(u), Pe(() => se(_, "aria-label", c(re).ariaLinkLabel)), ne(n, u);
     };
     $e(yi, (n) => {
       (N() !== true || c(Dt)) && n(Ei);
     });
   }
-  z3(Mt);
+  z5(Mt);
   var Or = we(Mt, 2);
   {
     var xi = (n) => {
@@ -2166,16 +2166,16 @@ function ha(e, t) {
       {
         var y = (E) => {
           var p = la(), x = X(p);
-          Ge(x, () => c(re).expired), z3(p), Pe(() => se(p, "title", c(He))), ne(E, p);
+          Ge(x, () => c(re).expired), z5(p), Pe(() => se(p, "title", c(He))), ne(E, p);
         }, T = (E) => {
           var p = sa(), x = X(p);
-          Ge(x, () => c(re).error), z3(p), Pe(() => se(p, "title", c(He))), ne(E, p);
+          Ge(x, () => c(re).error), z5(p), Pe(() => se(p, "title", c(He))), ne(E, p);
         };
         $e(_, (E) => {
           c(C) === b.EXPIRED ? E(y) : E(T, false);
         });
       }
-      z3(u), ne(n, u);
+      z5(u), ne(n, u);
     };
     $e(Or, (n) => {
       (c(He) || c(C) === b.EXPIRED) && n(xi);
@@ -2185,7 +2185,7 @@ function ha(e, t) {
   {
     var $i = (n) => {
       var u = ua(), _ = X(u), y = X(_);
-      Ge(y, () => c(re).footer), z3(_), z3(u), ne(n, u);
+      Ge(y, () => c(re).footer), z5(_), z5(u), ne(n, u);
     };
     $e(Fr, (n) => {
       c(re).footer && (k() !== true || c(Dt)) && n($i);
@@ -2201,7 +2201,7 @@ function ha(e, t) {
       v() && n(Ci);
     });
   }
-  return z3(ot), nn(ot, (n) => D(B, n), () => c(B)), Pe(
+  return z5(ot), nn(ot, (n) => D(B, n), () => c(B)), Pe(
     (n) => {
       se(ot, "data-state", c(C)), se(ot, "data-floating", v()), Pr = Fo(mt, 1, "altcha-checkbox", null, Pr, n), se(We, "id", c(cr)), We.required = r2() !== "onsubmit" && (!v() || r2() !== "off");
     },
@@ -2817,6 +2817,7 @@ var VARIANT_ROLES = [
   "tertiary",
   "accent"
 ];
+var DEFAULT_VARIANT_ALIAS_ID = "default";
 var cornerStyleSchema = z.enum(["square", "rounded", "pill"]);
 var shadowSizeSchema = z.enum(["none", "low", "medium", "high"]);
 var textTransformSchema = z.enum(["none", "uppercase", "lowercase", "capitalize"]);
@@ -2953,9 +2954,595 @@ var buttonSystemSchema = z.object({
   sizes: buttonSizesSchema.optional()
 });
 
+// ../theme-core/src/buttons/classNames.ts
+function themeButtonVariantClassNames(variant) {
+  if (variant === DEFAULT_VARIANT_ALIAS_ID) {
+    return [variant];
+  }
+  return [variant, `button-${variant}`];
+}
+function themeButtonSizeClassName(size) {
+  return `btn-${size}`;
+}
+function themeButtonClassName(spec) {
+  const classes = [
+    ...themeButtonVariantClassNames(spec.variant),
+    themeButtonSizeClassName(spec.size),
+    spec.extraClassName
+  ];
+  return classes.filter(Boolean).join(" ");
+}
+
 // ../theme-core/src/buttons/generateButtonCss.ts
 var BUTTON_SIZE_NAMES = buttonSizeNameSchema.options;
 
+// ../theme-core/src/buttons/personalities/types.ts
+import { z as z3 } from "zod";
+
+// ../theme-core/src/site-styles/styleTags.ts
+import { z as z2 } from "zod";
+var STYLE_AXIS_VALUES = {
+  tone: ["minimal", "classic", "bold"],
+  energy: ["calm", "vibrant"],
+  motion: ["subtle", "standard", "expressive"],
+  era: ["editorial", "modern", "organic", "technical", "retro"]
+};
+var styleTagsSchema = z2.object({
+  tone: z2.enum(STYLE_AXIS_VALUES.tone).optional(),
+  energy: z2.enum(STYLE_AXIS_VALUES.energy).optional(),
+  motion: z2.enum(STYLE_AXIS_VALUES.motion).optional(),
+  era: z2.enum(STYLE_AXIS_VALUES.era).optional()
+});
+
+// ../theme-core/src/buttons/personalities/types.ts
+function asButtonPersonalityId(value) {
+  if (value.length === 0) {
+    throw new Error("ButtonPersonalityId must be a non-empty string");
+  }
+  return value;
+}
+var buttonPersonalityIdSchema = z3.string().min(1).transform((value) => asButtonPersonalityId(value));
+var buttonPersonalitySchema = z3.object({
+  id: buttonPersonalityIdSchema,
+  name: z3.string().min(1),
+  description: z3.string().min(1),
+  tags: styleTagsSchema,
+  buttonSystem: buttonSystemSchema
+});
+function defineButtonPersonality(input) {
+  return {
+    id: asButtonPersonalityId(input.id),
+    name: input.name,
+    description: input.description,
+    tags: input.tags,
+    buttonSystem: input.buttonSystem
+  };
+}
+
+// ../theme-core/src/buttons/personalities/brushed-wash.ts
+var brushedWash = defineButtonPersonality({
+  id: "brushed-wash",
+  name: "Brushed Wash",
+  description: "Watercolour-gradient buttons with soft shadows and generous padding.",
+  tags: { tone: "classic", energy: "vibrant", motion: "standard", era: "organic" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "rounded",
+      shadow: "low",
+      textTransform: "none",
+      fontWeight: 500,
+      borderWidth: 1,
+      hoverTransform: "none",
+      hoverColor: "none"
+    },
+    sizes: {
+      sm: { padding: "0.75rem 2rem", fontSize: "text-sm" },
+      md: { padding: "1rem 2.5rem" },
+      lg: { padding: "1.25rem 3rem", fontSize: "text-lg" },
+      xl: { padding: "1.625rem 3.75rem", fontSize: "text-xl" }
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: {
+          type: "gradient",
+          stops: ["primary", "accent"],
+          direction: "to-r"
+        },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-lg",
+        shadow: { elevation: "low", softness: "soft", position: "bottom" },
+        effects: {
+          hover: [{ effectId: "opacity-reduce", options: { reduction: -15 } }]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: {
+          type: "gradient",
+          stops: ["secondary", "accent"],
+          direction: "to-br"
+        },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-lg",
+        shadow: { elevation: "low", softness: "soft", position: "bottom" },
+        effects: {
+          hover: [{ effectId: "opacity-reduce", options: { reduction: -15 } }]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-lg",
+        border: { widthClass: "border", colorToken: "primary" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-lg",
+        effects: {
+          hover: [
+            { effectId: "background-on-hover", options: { colorToken: "surface" } }
+          ]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/confident-chip.ts
+var confidentChip = defineButtonPersonality({
+  id: "confident-chip",
+  name: "Confident Chip",
+  description: "Mid-radius solid buttons with a crisp hover.",
+  tags: { tone: "classic", energy: "calm", motion: "standard", era: "modern" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "rounded",
+      shadow: "medium",
+      textTransform: "none",
+      fontWeight: 600,
+      borderWidth: 1,
+      hoverTransform: "none",
+      hoverColor: "none"
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: { type: "solid", colorToken: "primary" },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-md",
+        shadow: { elevation: "medium", softness: "soft", position: "bottom" },
+        effects: {
+          hover: [{ effectId: "darken-background", options: { amount: 60 } }],
+          active: [{ effectId: "scale-down", options: { scale: "0.97" } }]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: { type: "solid", colorToken: "surface" },
+        textColorToken: "text",
+        borderRadius: "rounded-md",
+        border: { widthClass: "border", colorToken: "border" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "background" } }]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-md",
+        border: { widthClass: "border", colorToken: "primary" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-md",
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/editorial-link.ts
+var editorialLink = defineButtonPersonality({
+  id: "editorial-link",
+  name: "Editorial Link",
+  description: "Link-style with a growing underline. Refined, typographic.",
+  tags: { tone: "minimal", energy: "calm", motion: "subtle", era: "editorial" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "square",
+      shadow: "none",
+      textTransform: "none",
+      fontWeight: 500,
+      borderWidth: 1,
+      hoverTransform: "none",
+      hoverColor: "none"
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-none",
+        shadow: { elevation: "none", softness: null, position: "bottom" },
+        sizes: {
+          sm: { padding: "0.25rem 0" },
+          md: { padding: "0.5rem 0" },
+          lg: { padding: "0.625rem 0" },
+          xl: { padding: "0.75rem 0" }
+        },
+        effects: {
+          base: [
+            { effectId: "border-bottom-grow", options: { height: 2, colorToken: "text", origin: "left" } }
+          ]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: { type: "transparent" },
+        textColorToken: "mutedText",
+        borderRadius: "rounded-none",
+        shadow: { elevation: "none", softness: null, position: "bottom" },
+        sizes: {
+          sm: { padding: "0.25rem 0" },
+          md: { padding: "0.5rem 0" },
+          lg: { padding: "0.625rem 0" },
+          xl: { padding: "0.75rem 0" }
+        },
+        effects: {
+          base: [
+            { effectId: "border-bottom-grow", options: { height: 1, colorToken: "mutedText", origin: "left" } }
+          ]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "accent",
+        borderRadius: "rounded-none",
+        shadow: { elevation: "none", softness: null, position: "bottom" },
+        sizes: {
+          sm: { padding: "0.25rem 0" },
+          md: { padding: "0.5rem 0" },
+          lg: { padding: "0.625rem 0" },
+          xl: { padding: "0.75rem 0" }
+        },
+        effects: {
+          base: [
+            { effectId: "border-bottom-grow", options: { height: 1, colorToken: "accent", origin: "left" } }
+          ]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "mutedText",
+        borderRadius: "rounded-none",
+        shadow: { elevation: "none", softness: null, position: "bottom" },
+        sizes: {
+          sm: { padding: "0.25rem 0" },
+          md: { padding: "0.5rem 0" },
+          lg: { padding: "0.625rem 0" },
+          xl: { padding: "0.75rem 0" }
+        },
+        effects: {
+          hover: [{ effectId: "opacity-reduce", options: { reduction: -20 } }]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/ink-stamp.ts
+var inkStamp = defineButtonPersonality({
+  id: "ink-stamp",
+  name: "Ink Stamp",
+  description: "Hand-stamped block-print buttons with a slight lift on hover.",
+  tags: { tone: "bold", energy: "vibrant", motion: "standard", era: "organic" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "rounded",
+      shadow: "none",
+      textTransform: "uppercase",
+      fontWeight: 600,
+      borderWidth: 1,
+      hoverTransform: "none",
+      hoverColor: "none",
+      letterSpacing: "loose"
+    },
+    sizes: {
+      sm: { padding: "0.5rem 1.25rem", fontSize: "text-xs" },
+      md: { padding: "0.75rem 1.75rem", fontSize: "text-sm" },
+      lg: { padding: "0.875rem 2.25rem", fontSize: "text-base" },
+      xl: { padding: "1.125rem 2.75rem", fontSize: "text-lg" }
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: { type: "solid", colorToken: "primary" },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-md",
+        effects: {
+          hover: [
+            { effectId: "drop-shadow", options: { intensity: "medium" } },
+            { effectId: "scale-up", options: { scale: "1.02" } }
+          ],
+          active: [{ effectId: "scale-down", options: { scale: "0.98" } }]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-md",
+        border: { widthClass: "border-2", colorToken: "primary" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-md",
+        border: { widthClass: "border-2", colorToken: "border" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "accent",
+        borderRadius: "rounded-none",
+        sizes: {
+          sm: { padding: "0.375rem 0", fontSize: "text-xs" },
+          md: { padding: "0.5rem 0", fontSize: "text-sm" },
+          lg: { padding: "0.625rem 0", fontSize: "text-base" },
+          xl: { padding: "0.75rem 0", fontSize: "text-lg" }
+        },
+        effects: {
+          base: [{ effectId: "border-bottom-grow", options: { height: 1, colorToken: "accent", origin: "left" } }]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/pebble.ts
+var pebble = defineButtonPersonality({
+  id: "pebble",
+  name: "Pebble",
+  description: "Generous pill buttons with a soft hover lift.",
+  tags: { tone: "classic", energy: "calm", motion: "standard", era: "organic" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "pill",
+      shadow: "none",
+      textTransform: "none",
+      fontWeight: 500,
+      borderWidth: 2,
+      hoverTransform: "none",
+      hoverColor: "none"
+    },
+    sizes: {
+      sm: { padding: "0.625rem 1.75rem", fontSize: "text-sm" },
+      md: { padding: "0.875rem 2.25rem" },
+      lg: { padding: "1.125rem 2.75rem", fontSize: "text-lg" },
+      xl: { padding: "1.5rem 3.5rem", fontSize: "text-xl" }
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: { type: "solid", colorToken: "primary" },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-full",
+        effects: {
+          hover: [
+            { effectId: "scale-up", options: { scale: "1.03" } },
+            { effectId: "drop-shadow", options: { intensity: "medium" } }
+          ]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-full",
+        border: { widthClass: "border-2", colorToken: "accent" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "accent" } }]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-full",
+        border: { widthClass: "border", colorToken: "border" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-full",
+        sizes: {
+          sm: { padding: "0.375rem 0.875rem", fontSize: "text-sm" },
+          md: { padding: "0.5rem 1rem" },
+          lg: { padding: "0.625rem 1.25rem", fontSize: "text-lg" },
+          xl: { padding: "0.75rem 1.5rem", fontSize: "text-xl" }
+        },
+        effects: {
+          hover: [{ effectId: "opacity-reduce", options: { reduction: 30 } }]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/soft-pill.ts
+var softPill = defineButtonPersonality({
+  id: "soft-pill",
+  name: "Soft Pill",
+  description: "Rounded pills with a gentle lift on hover. Quietly modern.",
+  tags: { tone: "classic", energy: "calm", motion: "subtle", era: "organic" },
+  buttonSystem: {
+    global: {
+      cornerStyle: "pill",
+      shadow: "low",
+      textTransform: "none",
+      fontWeight: 500,
+      borderWidth: 2,
+      hoverTransform: "lift",
+      hoverColor: "none"
+    },
+    variants: [
+      {
+        id: "primary",
+        name: "Primary",
+        enabled: true,
+        priority: 1,
+        background: { type: "solid", colorToken: "primary" },
+        textColorToken: "primaryForeground",
+        borderRadius: "rounded-full",
+        shadow: { elevation: "low", softness: "soft", position: "bottom" },
+        effects: {
+          hover: [{ effectId: "lift", options: { translateY: "-1px" } }],
+          active: [{ effectId: "scale-down", options: { scale: "0.98" } }]
+        }
+      },
+      {
+        id: "secondary",
+        name: "Secondary",
+        enabled: true,
+        priority: 2,
+        background: { type: "transparent" },
+        textColorToken: "primary",
+        borderRadius: "rounded-full",
+        border: { widthClass: "border-2", colorToken: "primary" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "outline",
+        name: "Outline",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-full",
+        border: { widthClass: "border", colorToken: "border" },
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      },
+      {
+        id: "ghost",
+        name: "Ghost",
+        enabled: true,
+        priority: 3,
+        background: { type: "transparent" },
+        textColorToken: "text",
+        borderRadius: "rounded-full",
+        effects: {
+          hover: [{ effectId: "background-on-hover", options: { colorToken: "surface" } }]
+        }
+      }
+    ]
+  }
+});
+
+// ../theme-core/src/buttons/personalities/index.ts
+var buttonPersonalities = [
+  softPill,
+  confidentChip,
+  editorialLink,
+  pebble,
+  inkStamp,
+  brushedWash
+];
+var personalitiesById = new Map(
+  buttonPersonalities.map((p) => [p.id, p])
+);
+
 // ../core/src/branded.ts
 var asAppointmentResourceId = (id) => id;
 
@@ -3166,8 +3753,8 @@ function addLocalScheduleDays(date, days) {
 }
 
 // ../theme-core/src/accordions/types.ts
-import { z as z2 } from "zod";
-var accordionIconSchema = z2.enum([
+import { z as z4 } from "zod";
+var accordionIconSchema = z4.enum([
   "plus-minus",
   // + becomes - (swap or rotate 90°)
   "chevron",
@@ -3179,49 +3766,49 @@ var accordionIconSchema = z2.enum([
   "circle-plus-minus"
   // ⊕ becomes ⊖ (swap with fade)
 ]);
-var accordionSystemSchema = z2.object({
+var accordionSystemSchema = z4.object({
   // Visual styling (solid color only - gradients can be added later if needed)
-  background: z2.object({
-    type: z2.literal("solid"),
-    colorToken: z2.string()
+  background: z4.object({
+    type: z4.literal("solid"),
+    colorToken: z4.string()
   }),
   // Spacing (padding inside items)
-  spacing: z2.enum(["none", "compact", "cozy", "medium", "comfortable", "spacious"]),
+  spacing: z4.enum(["none", "compact", "cozy", "medium", "comfortable", "spacious"]),
   // Border radius (null = inherit from theme.corners)
-  corners: z2.enum(["square", "soft", "rounded", "pill"]).nullable(),
+  corners: z4.enum(["square", "soft", "rounded", "pill"]).nullable(),
   // Border styling (null = inherit from theme.border)
-  border: z2.object({
-    widthClass: z2.string(),
+  border: z4.object({
+    widthClass: z4.string(),
     // e.g., 'border', 'border-2', 'border-0'
-    colorToken: z2.string()
+    colorToken: z4.string()
   }).nullable(),
   // Shadow (null = inherit from theme.shadow)
-  shadow: z2.object({
-    elevation: z2.enum(["none", "low", "medium", "high"]),
-    softness: z2.enum(["soft", "crisp", "hard"]).nullable(),
-    position: z2.enum(["bottom", "bottom-right"])
+  shadow: z4.object({
+    elevation: z4.enum(["none", "low", "medium", "high"]),
+    softness: z4.enum(["soft", "crisp", "hard"]).nullable(),
+    position: z4.enum(["bottom", "bottom-right"])
   }).nullable(),
   // Icon style and animation
-  icon: z2.object({
+  icon: z4.object({
     style: accordionIconSchema,
-    position: z2.enum(["left", "right"]),
-    size: z2.enum(["sm", "md", "lg"])
+    position: z4.enum(["left", "right"]),
+    size: z4.enum(["sm", "md", "lg"])
   }),
   // Trigger (question) styling
-  trigger: z2.object({
-    textColorToken: z2.string(),
-    fontWeight: z2.enum(["regular", "medium", "semibold", "bold"]).nullable()
+  trigger: z4.object({
+    textColorToken: z4.string(),
+    fontWeight: z4.enum(["regular", "medium", "semibold", "bold"]).nullable()
     // null = inherit from theme
   }),
   // Hover state styling
-  hover: z2.object({
-    backgroundColorToken: z2.string().optional(),
-    textColorToken: z2.string().optional(),
-    borderColorToken: z2.string().optional()
+  hover: z4.object({
+    backgroundColorToken: z4.string().optional(),
+    textColorToken: z4.string().optional(),
+    borderColorToken: z4.string().optional()
   }),
   // Content (answer) styling
-  content: z2.object({
-    textColorToken: z2.string()
+  content: z4.object({
+    textColorToken: z4.string()
   })
 });
 
@@ -4219,7 +4806,7 @@ function MultiStepForm({
           type: "button",
           onClick: goToPrevious,
           disabled: !canGoBack,
-          className: "outline btn-md",
+          className: themeButtonClassName({ variant: "outline", size: "md" }),
           children: backButtonLabel
         }
       ),
@@ -4229,7 +4816,11 @@ function MultiStepForm({
           type: "button",
           onClick: goToNext,
           disabled: !canGoNext,
-          className: "primary btn-md rb-flex-1",
+          className: themeButtonClassName({
+            variant: "primary",
+            size: "md",
+            extraClassName: "rb-flex-1"
+          }),
           children: [
             (isValidating || isSubmitting) && /* @__PURE__ */ jsx4(
               SpinnerNode,
@@ -5503,7 +6094,10 @@ function PaymentOptionSelectionStep({
           "button",
           {
             type: "button",
-            className: isSelected ? "primary btn-md" : "outline btn-md",
+            className: themeButtonClassName({
+              variant: isSelected ? "primary" : "outline",
+              size: "md"
+            }),
             style: paymentOptionLayoutStyle,
             onClick: () => updateData({
               selectedAppointmentPackageId: appointmentPackage.customerPassId,
@@ -5552,7 +6146,10 @@ function PaymentOptionSelectionStep({
           "button",
           {
             type: "button",
-            className: isSelected ? "primary btn-md" : "outline btn-md",
+            className: themeButtonClassName({
+              variant: isSelected ? "primary" : "outline",
+              size: "md"
+            }),
             style: paymentOptionLayoutStyle,
             onClick: () => updateData({
               selectedAppointmentPackageId: void 0,
@@ -6703,7 +7300,7 @@ var BookingFormClient = ({
         "button",
         {
           type: "button",
-          className: "secondary btn-sm",
+          className: themeButtonClassName({ variant: "secondary", size: "sm" }),
           onClick: clearFeedback,
           children: "Dismiss"
         }
@@ -6723,116 +7320,116 @@ var BookingFormClient = ({
 import { useMemo as useMemo6 } from "react";
 
 // ../theme-core/src/inputs/types.ts
-import { z as z4 } from "zod";
-var inputSystemSchema = z4.object({
+import { z as z6 } from "zod";
+var inputSystemSchema = z6.object({
   // Base styling (applied to all inputs)
-  base: z4.object({
-    background: z4.union([
-      z4.object({
-        type: z4.literal("solid"),
-        colorToken: z4.string()
+  base: z6.object({
+    background: z6.union([
+      z6.object({
+        type: z6.literal("solid"),
+        colorToken: z6.string()
       }),
-      z4.object({
-        type: z4.literal("transparent")
+      z6.object({
+        type: z6.literal("transparent")
       })
     ]),
-    textColorToken: z4.string(),
-    border: z4.object({
-      widthClass: z4.string(),
+    textColorToken: z6.string(),
+    border: z6.object({
+      widthClass: z6.string(),
       // e.g., 'border', 'border-2'
-      colorToken: z4.string(),
-      style: z4.enum(["all", "underline"]).optional()
+      colorToken: z6.string(),
+      style: z6.enum(["all", "underline"]).optional()
     }),
-    corners: z4.enum(["square", "soft", "rounded", "pill"]).nullable(),
+    corners: z6.enum(["square", "soft", "rounded", "pill"]).nullable(),
     // null = inherit from theme.corners
-    shadow: z4.object({
-      elevation: z4.enum(["none", "low", "medium"]),
-      softness: z4.enum(["soft", "crisp", "hard"]).nullable()
+    shadow: z6.object({
+      elevation: z6.enum(["none", "low", "medium"]),
+      softness: z6.enum(["soft", "crisp", "hard"]).nullable()
     }).nullable(),
-    spacing: z4.enum(["compact", "cozy", "medium", "comfortable"]),
+    spacing: z6.enum(["compact", "cozy", "medium", "comfortable"]),
     // padding inside inputs
-    fontSize: z4.enum(["sm", "base", "lg"])
+    fontSize: z6.enum(["sm", "base", "lg"])
   }),
   // Label styling
-  label: z4.object({
-    textColorToken: z4.string(),
-    fontWeight: z4.enum(["regular", "medium", "semibold", "bold", "black"]),
-    fontSize: z4.enum(["2xs", "xs", "sm", "base"]),
-    textTransform: z4.enum(["none", "uppercase", "lowercase", "capitalize"]).optional(),
-    letterSpacing: z4.enum(["normal", "wide", "wider", "widest"]).optional(),
-    opacity: z4.number().min(0.2).max(1).optional()
+  label: z6.object({
+    textColorToken: z6.string(),
+    fontWeight: z6.enum(["regular", "medium", "semibold", "bold", "black"]),
+    fontSize: z6.enum(["2xs", "xs", "sm", "base"]),
+    textTransform: z6.enum(["none", "uppercase", "lowercase", "capitalize"]).optional(),
+    letterSpacing: z6.enum(["normal", "wide", "wider", "widest"]).optional(),
+    opacity: z6.number().min(0.2).max(1).optional()
   }),
   // Focus state
-  focus: z4.object({
-    ringColorToken: z4.string(),
-    ringWidth: z4.enum(["0", "1", "2", "3"]),
-    borderColorToken: z4.string().optional()
+  focus: z6.object({
+    ringColorToken: z6.string(),
+    ringWidth: z6.enum(["0", "1", "2", "3"]),
+    borderColorToken: z6.string().optional()
     // Change border color on focus
   }),
   // Error state (for validation feedback)
-  error: z4.object({
-    borderColorToken: z4.string(),
-    textColorToken: z4.string()
+  error: z6.object({
+    borderColorToken: z6.string(),
+    textColorToken: z6.string()
   }),
   // Disabled state
-  disabled: z4.object({
-    backgroundColorToken: z4.string(),
-    textColorToken: z4.string(),
-    opacity: z4.number().min(0.3).max(0.7)
+  disabled: z6.object({
+    backgroundColorToken: z6.string(),
+    textColorToken: z6.string(),
+    opacity: z6.number().min(0.3).max(0.7)
   })
 });
 
 // ../theme-core/src/navigation/types.ts
-import { z as z6 } from "zod";
+import { z as z8 } from "zod";
 
 // ../theme-core/src/interactive/baseSchema.ts
-import { z as z5 } from "zod";
-var interactiveTypographySchema = z5.object({
+import { z as z7 } from "zod";
+var interactiveTypographySchema = z7.object({
   /** Font family source */
-  typography: z5.enum(["body", "heading"]).default("body"),
+  typography: z7.enum(["body", "heading"]).default("body"),
   /** Font weight */
-  fontWeight: z5.enum(["regular", "medium", "semibold", "bold"]).default("medium"),
+  fontWeight: z7.enum(["regular", "medium", "semibold", "bold"]).default("medium"),
   /** Text transform */
-  textTransform: z5.enum(["none", "uppercase", "capitalize"]).default("none"),
+  textTransform: z7.enum(["none", "uppercase", "capitalize"]).default("none"),
   /** Italic style */
-  italic: z5.boolean().default(false)
+  italic: z7.boolean().default(false)
 });
-var effectApplicationSchema2 = z5.object({
+var effectApplicationSchema2 = z7.object({
   /** Effect preset ID */
-  effectId: z5.string(),
+  effectId: z7.string(),
   /** User-provided customization options */
-  options: z5.record(z5.string(), z5.any()).optional()
+  options: z7.record(z7.string(), z7.any()).optional()
 });
-var effectCompositionSchema = z5.object({
+var effectCompositionSchema = z7.object({
   /** Effects always applied */
-  base: z5.array(effectApplicationSchema2).optional(),
+  base: z7.array(effectApplicationSchema2).optional(),
   /** Effects applied on hover */
-  hover: z5.array(effectApplicationSchema2).optional(),
+  hover: z7.array(effectApplicationSchema2).optional(),
   /** Effects applied on active/pressed */
-  active: z5.array(effectApplicationSchema2).optional(),
+  active: z7.array(effectApplicationSchema2).optional(),
   /** Effects applied on focus */
-  focus: z5.array(effectApplicationSchema2).optional()
+  focus: z7.array(effectApplicationSchema2).optional()
 });
 
 // ../theme-core/src/navigation/types.ts
-var navLinkPaddingSchema = z6.enum(["none", "compact", "default"]);
-var navLinkPaddingXSchema = z6.enum(["none", "tight", "compact", "default", "relaxed", "spacious"]);
-var navLinkBorderRadiusSchema = z6.enum(["none", "sm", "md", "full"]);
-var navLinkTextSizeSchema = z6.enum(["xs", "sm", "base", "lg"]);
-var navLinkLetterSpacingSchema = z6.enum(["normal", "wide", "wider", "widest"]);
-var navLinkStyleSchema = z6.object({
+var navLinkPaddingSchema = z8.enum(["none", "compact", "default"]);
+var navLinkPaddingXSchema = z8.enum(["none", "tight", "compact", "default", "relaxed", "spacious"]);
+var navLinkBorderRadiusSchema = z8.enum(["none", "sm", "md", "full"]);
+var navLinkTextSizeSchema = z8.enum(["xs", "sm", "base", "lg"]);
+var navLinkLetterSpacingSchema = z8.enum(["normal", "wide", "wider", "widest"]);
+var navLinkStyleSchema = z8.object({
   /** Display name for the style */
-  name: z6.string().min(1).max(30).optional(),
+  name: z8.string().min(1).max(30).optional(),
   /** Typography settings (inherited from interactive base) */
   ...interactiveTypographySchema.shape,
   /** Text color token */
-  colorToken: z6.string().default("text"),
+  colorToken: z8.string().default("text"),
   /** Optional text size override */
   textSize: navLinkTextSizeSchema.optional(),
   /** Optional letter spacing override */
   letterSpacing: navLinkLetterSpacingSchema.optional(),
   /** Hover/active color token (for color-change effects) */
-  hoverColorToken: z6.string().nullable().optional(),
+  hoverColorToken: z8.string().nullable().optional(),
   /** Padding preset */
   padding: navLinkPaddingSchema.default("compact"),
   /** Horizontal padding override (overrides horizontal component of padding preset) */
@@ -6988,15 +7585,15 @@ var NAV_LINK_PRESETS = {
 var NAV_LINK_PRESET_IDS = Object.keys(NAV_LINK_PRESETS);
 
 // ../theme-core/src/shared/componentStyles.ts
-import { z as z7 } from "zod";
-var componentBorderSchema = z7.object({
-  width: z7.enum(["none", "hairline", "thin", "medium", "thick"]).default("none"),
-  style: z7.enum(["solid", "dashed"]).default("solid"),
-  colorToken: z7.string().optional()
+import { z as z9 } from "zod";
+var componentBorderSchema = z9.object({
+  width: z9.enum(["none", "hairline", "thin", "medium", "thick"]).default("none"),
+  style: z9.enum(["solid", "dashed"]).default("solid"),
+  colorToken: z9.string().optional()
   // defaults to "border" if not set
 });
-var componentShadowSchema = z7.object({
-  elevation: z7.enum(["none", "sm", "md", "lg", "xl", "2xl"]).default("sm")
+var componentShadowSchema = z9.object({
+  elevation: z9.enum(["none", "sm", "md", "lg", "xl", "2xl"]).default("sm")
 });
 
 // ../theme-core/src/blocks/vars/event-registration.ts
@@ -7450,7 +8047,7 @@ blockVarRegistry.set("course-details", generateCourseDetailsVars);
 blockVarRegistry.set("course-registration", generateCourseRegistrationVars);
 
 // ../theme-core/src/customCss/validation.ts
-import { z as z8 } from "zod";
+import { z as z10 } from "zod";
 var FORBIDDEN_SELECTORS = [":root", "html", "body"];
 var UNIVERSAL_SELECTOR = "*";
 var REMOTE_URL_PATTERN = /url\s*\(\s*['"]?(https?:|\/\/)/i;
@@ -7492,7 +8089,7 @@ function containsForbiddenSelector(selector) {
   }
   return false;
 }
-var selectorSchema = z8.string().min(1, "Selector cannot be empty").max(200, "Selector too long (max 200 characters)").refine(
+var selectorSchema = z10.string().min(1, "Selector cannot be empty").max(200, "Selector too long (max 200 characters)").refine(
   (s) => !containsForbiddenSelector(s),
   { message: "Global selectors (:root, html, body, *) are not allowed" }
 );
@@ -7502,38 +8099,38 @@ function containsRemoteUrl(value) {
 function containsJavascriptUrl(value) {
   return JAVASCRIPT_URL_PATTERN.test(value);
 }
-var declarationValueSchema = z8.string().max(500, "Declaration value too long (max 500 characters)").refine(
+var declarationValueSchema = z10.string().max(500, "Declaration value too long (max 500 characters)").refine(
   (v) => !containsRemoteUrl(v),
   { message: "Remote url() references are not allowed. Use local paths, data URIs, or fragment IDs." }
 ).refine(
   (v) => !containsJavascriptUrl(v),
   { message: "javascript: URLs are not allowed" }
 );
-var declarationsSchema = z8.record(
-  z8.string().min(1).max(100),
+var declarationsSchema = z10.record(
+  z10.string().min(1).max(100),
   // property name
   declarationValueSchema
   // property value
 );
-var customCssRuleSchema = z8.object({
-  id: z8.string().min(1, "Rule ID is required").max(50, "Rule ID too long"),
+var customCssRuleSchema = z10.object({
+  id: z10.string().min(1, "Rule ID is required").max(50, "Rule ID too long"),
   selector: selectorSchema,
   declarations: declarationsSchema
 });
 var blockCustomCssRuleSchema = customCssRuleSchema.extend({
-  blockKind: z8.string().min(1, "Block kind is required").max(50, "Block kind too long")
+  blockKind: z10.string().min(1, "Block kind is required").max(50, "Block kind too long")
 });
-var customCssRulesSchema = z8.array(customCssRuleSchema).optional();
-var blockCustomCssRulesSchema = z8.array(blockCustomCssRuleSchema).optional();
+var customCssRulesSchema = z10.array(customCssRuleSchema).optional();
+var blockCustomCssRulesSchema = z10.array(blockCustomCssRuleSchema).optional();
 
 // ../theme-core/src/customCss/atRuleValidation.ts
-import { z as z9 } from "zod";
+import { z as z11 } from "zod";
 var KEYFRAME_OFFSET_PATTERN = /^(from|to|\d{1,3}%)$/i;
 var ANIMATION_NAME_PATTERN = /^[a-zA-Z_-][a-zA-Z0-9_-]*$/;
 var BLOCKED_AT_RULES = ["@import", "@charset"];
 var BLOCKED_AT_RULE_PATTERN = /@(?:import|charset)\b/i;
-var ruleIdSchema = z9.string().min(1, "Rule ID is required").max(50, "Rule ID too long");
-var nestedRuleSchema = z9.object({
+var ruleIdSchema = z11.string().min(1, "Rule ID is required").max(50, "Rule ID too long");
+var nestedRuleSchema = z11.object({
   selector: selectorSchema,
   declarations: declarationsSchema
 });
@@ -7545,73 +8142,73 @@ function isValidKeyframeOffset(offset) {
   const value = parseInt(match[1], 10);
   return value >= 0 && value <= 100;
 }
-var keyframeOffsetSchema = z9.string().transform((offset) => offset.trim()).refine(
+var keyframeOffsetSchema = z11.string().transform((offset) => offset.trim()).refine(
   (offset) => KEYFRAME_OFFSET_PATTERN.test(offset),
   { message: 'Invalid keyframe offset. Use percentages (0%, 50%, 100%) or "from"/"to"' }
 ).refine(
   isValidKeyframeOffset,
   { message: "Keyframe offset must be between 0% and 100%" }
 );
-var animationNameSchema = z9.string().min(1, "Animation name is required").max(50, "Animation name too long").refine(
+var animationNameSchema = z11.string().min(1, "Animation name is required").max(50, "Animation name too long").refine(
   (name) => ANIMATION_NAME_PATTERN.test(name),
   { message: "Invalid animation name. Use letters, numbers, dashes, underscores (start with letter, dash, or underscore)" }
 );
-var keyframeSchema = z9.object({
+var keyframeSchema = z11.object({
   offset: keyframeOffsetSchema,
   declarations: declarationsSchema
 });
-var keyframesAtRuleSchema = z9.object({
+var keyframesAtRuleSchema = z11.object({
   id: ruleIdSchema,
-  type: z9.literal("keyframes"),
+  type: z11.literal("keyframes"),
   name: animationNameSchema,
-  frames: z9.array(keyframeSchema).min(1, "At least one keyframe is required")
+  frames: z11.array(keyframeSchema).min(1, "At least one keyframe is required")
 });
-var fontFaceDeclarationsSchema = z9.record(z9.string().min(1).max(100), declarationValueSchema).refine(
+var fontFaceDeclarationsSchema = z11.record(z11.string().min(1).max(100), declarationValueSchema).refine(
   (decls) => "fontFamily" in decls || "font-family" in decls,
   { message: "font-family is required in @font-face" }
 );
-var fontFaceAtRuleSchema = z9.object({
+var fontFaceAtRuleSchema = z11.object({
   id: ruleIdSchema,
-  type: z9.literal("font-face"),
+  type: z11.literal("font-face"),
   declarations: fontFaceDeclarationsSchema
 });
-var mediaQuerySchema = z9.string().min(1, "Media query is required").max(200, "Media query too long");
-var mediaAtRuleSchema = z9.object({
+var mediaQuerySchema = z11.string().min(1, "Media query is required").max(200, "Media query too long");
+var mediaAtRuleSchema = z11.object({
   id: ruleIdSchema,
-  type: z9.literal("media"),
+  type: z11.literal("media"),
   query: mediaQuerySchema,
-  rules: z9.array(nestedRuleSchema).min(1, "At least one rule is required")
+  rules: z11.array(nestedRuleSchema).min(1, "At least one rule is required")
 });
-var supportsConditionSchema = z9.string().min(1, "Supports condition is required").max(200, "Supports condition too long");
-var supportsAtRuleSchema = z9.object({
+var supportsConditionSchema = z11.string().min(1, "Supports condition is required").max(200, "Supports condition too long");
+var supportsAtRuleSchema = z11.object({
   id: ruleIdSchema,
-  type: z9.literal("supports"),
+  type: z11.literal("supports"),
   condition: supportsConditionSchema,
-  rules: z9.array(nestedRuleSchema).min(1, "At least one rule is required")
+  rules: z11.array(nestedRuleSchema).min(1, "At least one rule is required")
 });
 function containsBlockedAtRule(css) {
   return BLOCKED_AT_RULE_PATTERN.test(css);
 }
-var rawCssSchema = z9.string().min(1, "CSS is required").max(5e3, "Raw CSS too long (max 5000 characters)").refine(
+var rawCssSchema = z11.string().min(1, "CSS is required").max(5e3, "Raw CSS too long (max 5000 characters)").refine(
   (css) => css.trim().startsWith("@"),
   { message: "Raw at-rule must start with @" }
 ).refine(
   (css) => !containsBlockedAtRule(css),
   { message: `Blocked at-rules: ${BLOCKED_AT_RULES.join(", ")}. Use typed at-rules or local assets instead.` }
 );
-var rawAtRuleSchema = z9.object({
+var rawAtRuleSchema = z11.object({
   id: ruleIdSchema,
-  type: z9.literal("raw"),
+  type: z11.literal("raw"),
   css: rawCssSchema
 });
-var customCssAtRuleSchema = z9.discriminatedUnion("type", [
+var customCssAtRuleSchema = z11.discriminatedUnion("type", [
   keyframesAtRuleSchema,
   fontFaceAtRuleSchema,
   mediaAtRuleSchema,
   supportsAtRuleSchema,
   rawAtRuleSchema
 ]);
-var customCssAtRulesSchema = z9.array(customCssAtRuleSchema).optional();
+var customCssAtRulesSchema = z11.array(customCssAtRuleSchema).optional();
 
 // ../theme-core/src/responsiveMode.ts
 var THEME_RESPONSIVE_MODE_ATTR = "data-rb-responsive-mode";