@opensite/ui 0.8.8 → 0.8.9

package/dist/hero-video-dialog-gradient.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/hero-video-overlay-stars.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import 'react/jsx-runtime';
 import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';

package/dist/hero-video-overlay-stars.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import 'react/jsx-runtime';
 import './blocks-k17uluAz.js';
 import 'class-variance-authority';

package/dist/hero-welcome-asymmetric-images.d.cts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { A as ActionConfig, I as ImageItem } from './blocks-Cohq4eio.cjs';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';

package/dist/hero-welcome-asymmetric-images.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { A as ActionConfig, I as ImageItem } from './blocks-k17uluAz.js';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';

package/dist/index.cjs

@@ -1719,7 +1719,7 @@ function AboutSplitHero({
       case "dark":
         return "bg-foreground text-background";
       case "gray":
-        return "bg-muted";
+        return cn(getNestedCardBg(background), getNestedCardTextColor(background));
       case "white":
         return "bg-background";
       default:
@@ -1956,7 +1956,9 @@ function AboutMissionPrinciples({
           "div",
           {
             className: cn(
-              "mt-6 md:mt-24 rounded-lg bg-muted p-8 lg:p-12",
+              "mt-6 md:mt-24 rounded-lg p-8 lg:p-12",
+              getNestedCardBg(background),
+              getNestedCardTextColor(background),
               visionClassName
             ),
             children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-center gap-8 lg:grid-cols-3", children: [
@@ -2043,7 +2045,9 @@ function AboutExpandableValues({
       "div",
       {
         className: cn(
-          "group overflow-hidden rounded-xl border bg-card text-card-foreground transition-all duration-300",
+          "group overflow-hidden rounded-xl border transition-all duration-300",
+          getNestedCardBg(background, "card"),
+          getNestedCardTextColor(background),
           expandedValue === value.id ? "col-span-1 shadow-lg md:col-span-2 lg:col-span-3" : ""
         ),
         children: [
@@ -2076,7 +2080,10 @@ function AboutExpandableValues({
             }
           ),
           expandedValue === value.id && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6 px-6 pb-6", children: [
-            value.longDescription && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-muted/50 p-4", children: typeof value.longDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: value.longDescription }) : value.longDescription }),
+            value.longDescription && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+              "rounded-lg p-4",
+              getNestedCardBg(background, "subtle")
+            ), children: typeof value.longDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: value.longDescription }) : value.longDescription }),
             value.examples && value.examples.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
               /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "mb-2 text-sm font-semibold text-muted-foreground", children: "How we put this into practice:" }),
               /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-2", children: value.examples.map((example, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2", children: [
@@ -2153,7 +2160,9 @@ function AboutExpandableValues({
           "div",
           {
             className: cn(
-              "relative mt-8 rounded-lg bg-accent/50 p-8",
+              "relative mt-8 rounded-lg p-8",
+              getNestedCardBg(background, "accent"),
+              getNestedCardTextColor(background),
               ctaClassName
             ),
             children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center", children: [
@@ -2386,7 +2395,10 @@ function CommunityInitiatives({
                             "flex h-full items-center justify-center md:col-span-5",
                             isEven ? "md:order-2" : "md:order-1"
                           ),
-                          children: /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "flex h-full min-h-[280px] w-full items-center justify-center bg-muted/30", children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-6 text-center", children: [
+                          children: /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn(
+                            "flex h-full min-h-[280px] w-full items-center justify-center",
+                            getNestedCardBg(background, "subtle")
+                          ), children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-6 text-center", children: [
                             /* @__PURE__ */ jsxRuntime.jsx(
                               DynamicIcon,
                               {
@@ -2469,7 +2481,10 @@ function CommunityInitiatives({
         ),
         categoriesContent,
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-20 text-center", ctaClassName), children: [
-          ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-8 inline-flex items-center justify-center rounded-full bg-muted p-1", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText }) }),
+          ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+            "mb-8 inline-flex items-center justify-center rounded-full p-1",
+            getNestedCardBg(background)
+          ), children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText }) }),
           ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", ctaHeadingClassName), children: ctaHeading })),
           ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
@@ -2894,7 +2909,12 @@ function FooterSocialNewsletter({
             )) })
           ] }, sectionIdx)),
           (socialLinks && socialLinks.length > 0 || newsletterLabel || newsletterButtonText) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("lg:col-span-2 xl:col-span-1", socialColumnClassName), children: [
-            socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("mb-10 flex items-center gap-2 text-muted-foreground", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", socialLinkClassName), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx)) }),
+            socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("mb-10 flex items-center gap-2 text-muted-foreground", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+              "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+              getNestedCardBg(background),
+              getNestedCardTextColor(background),
+              socialLinkClassName
+            ), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx)) }),
             (newsletterLabel || newsletterButtonText) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("grid w-full max-w-sm items-center gap-1.5", newsletterClassName), children: [
               newsletterLabel && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "newsletter-email", className: "text-sm font-medium", children: newsletterLabel }),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-sm items-center space-x-2", children: [
@@ -2974,11 +2994,19 @@ function FooterSocialApps({
   }, [sections]);
   const socialLinksContent = React4.useMemo(() => {
     if (!socialLinks || socialLinks.length === 0) return null;
-    return socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx));
+    return socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+      "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+      getNestedCardBg(background),
+      getNestedCardTextColor(background)
+    ), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx));
   }, [socialLinks]);
   const appLinksContent = React4.useMemo(() => {
     if (!appLinks || appLinks.length === 0) return null;
-    return appLinks.map((app, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: app.icon, size: 24 }) }) }) }, idx));
+    return appLinks.map((app, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+      "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+      getNestedCardBg(background),
+      getNestedCardTextColor(background)
+    ), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: app.icon, size: 24 }) }) }) }, idx));
   }, [appLinks]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -3110,7 +3138,11 @@ function FooterSimpleCentered({
                       logoWrapperClassName
                     ),
                     children: [
-                      logo?.src && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 items-center justify-center rounded-lg border border-border bg-accent p-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+                      logo?.src && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+                        "flex size-12 items-center justify-center rounded-lg border border-border p-2",
+                        getNestedCardBg(background, "accent"),
+                        getNestedCardTextColor(background)
+                      ), children: /* @__PURE__ */ jsxRuntime.jsx(
                         img.Img,
                         {
                           src: logo.src,
@@ -3652,7 +3684,12 @@ function FooterContactCard({
                 {
                   href: social.href,
                   "aria-label": social.label,
-                  className: cn("flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground transition-colors hover:bg-primary hover:text-primary-foreground", socialLinkClassName),
+                  className: cn(
+                    "flex size-12 items-center justify-center rounded-full transition-colors hover:bg-primary hover:text-primary-foreground",
+                    getNestedCardBg(background),
+                    getNestedCardTextColor(background),
+                    socialLinkClassName
+                  ),
                   children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: social.icon, size: 20 })
                 }
               ) }, idx)) })

package/dist/index.d.cts

@@ -11,7 +11,7 @@ export { DynamicIcon } from './dynamic-icon.cjs';
 export { CarouselPagination, CarouselPaginationProps } from './carousel-pagination.cjs';
 export { Pressable, PressableProps } from './pressable.cjs';
 export { AlternatingBlocks } from './alternating-blocks.cjs';
-export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, D as DirectionConfig, F as FeatureShowcaseItem, s as FeatureShowcaseProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, D as DirectionConfig, F as FeatureShowcaseItem, s as FeatureShowcaseProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-Bz_A5vLU.cjs';
 export { MediaHoverCtas } from './media-hover-ctas.cjs';
 export { FooterLinksGrid } from './footer-links-grid.cjs';
 export { FooterSocialNewsletter } from './footer-social-newsletter.cjs';
@@ -35,6 +35,5 @@ import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@radix-ui/react-popover';
-import './pattern-background-a7gKHzHy.cjs';
 import './forms-BCcwNFhk.cjs';
 import 'clsx';

package/dist/index.d.ts

@@ -11,7 +11,7 @@ export { DynamicIcon } from './dynamic-icon.js';
 export { CarouselPagination, CarouselPaginationProps } from './carousel-pagination.js';
 export { Pressable, PressableProps } from './pressable.js';
 export { AlternatingBlocks } from './alternating-blocks.js';
-export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, D as DirectionConfig, F as FeatureShowcaseItem, s as FeatureShowcaseProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, D as DirectionConfig, F as FeatureShowcaseItem, s as FeatureShowcaseProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-Bi_ClKrO.js';
 export { MediaHoverCtas } from './media-hover-ctas.js';
 export { FooterLinksGrid } from './footer-links-grid.js';
 export { FooterSocialNewsletter } from './footer-social-newsletter.js';
@@ -35,6 +35,5 @@ import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@radix-ui/react-popover';
-import './pattern-background-a7gKHzHy.js';
 import './forms-BCcwNFhk.js';
 import 'clsx';

package/dist/index.js

@@ -1696,7 +1696,7 @@ function AboutSplitHero({
       case "dark":
         return "bg-foreground text-background";
       case "gray":
-        return "bg-muted";
+        return cn(getNestedCardBg(background), getNestedCardTextColor(background));
       case "white":
         return "bg-background";
       default:
@@ -1933,7 +1933,9 @@ function AboutMissionPrinciples({
           "div",
           {
             className: cn(
-              "mt-6 md:mt-24 rounded-lg bg-muted p-8 lg:p-12",
+              "mt-6 md:mt-24 rounded-lg p-8 lg:p-12",
+              getNestedCardBg(background),
+              getNestedCardTextColor(background),
               visionClassName
             ),
             children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-8 lg:grid-cols-3", children: [
@@ -2020,7 +2022,9 @@ function AboutExpandableValues({
       "div",
       {
         className: cn(
-          "group overflow-hidden rounded-xl border bg-card text-card-foreground transition-all duration-300",
+          "group overflow-hidden rounded-xl border transition-all duration-300",
+          getNestedCardBg(background, "card"),
+          getNestedCardTextColor(background),
           expandedValue === value.id ? "col-span-1 shadow-lg md:col-span-2 lg:col-span-3" : ""
         ),
         children: [
@@ -2053,7 +2057,10 @@ function AboutExpandableValues({
             }
           ),
           expandedValue === value.id && /* @__PURE__ */ jsxs("div", { className: "space-y-6 px-6 pb-6", children: [
-            value.longDescription && /* @__PURE__ */ jsx("div", { className: "rounded-lg bg-muted/50 p-4", children: typeof value.longDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: value.longDescription }) : value.longDescription }),
+            value.longDescription && /* @__PURE__ */ jsx("div", { className: cn(
+              "rounded-lg p-4",
+              getNestedCardBg(background, "subtle")
+            ), children: typeof value.longDescription === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: value.longDescription }) : value.longDescription }),
             value.examples && value.examples.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
               /* @__PURE__ */ jsx("h4", { className: "mb-2 text-sm font-semibold text-muted-foreground", children: "How we put this into practice:" }),
               /* @__PURE__ */ jsx("ul", { className: "space-y-2", children: value.examples.map((example, index) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
@@ -2130,7 +2137,9 @@ function AboutExpandableValues({
           "div",
           {
             className: cn(
-              "relative mt-8 rounded-lg bg-accent/50 p-8",
+              "relative mt-8 rounded-lg p-8",
+              getNestedCardBg(background, "accent"),
+              getNestedCardTextColor(background),
               ctaClassName
             ),
             children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center", children: [
@@ -2363,7 +2372,10 @@ function CommunityInitiatives({
                             "flex h-full items-center justify-center md:col-span-5",
                             isEven ? "md:order-2" : "md:order-1"
                           ),
-                          children: /* @__PURE__ */ jsx(Card, { className: "flex h-full min-h-[280px] w-full items-center justify-center bg-muted/30", children: /* @__PURE__ */ jsxs(CardContent, { className: "p-6 text-center", children: [
+                          children: /* @__PURE__ */ jsx(Card, { className: cn(
+                            "flex h-full min-h-[280px] w-full items-center justify-center",
+                            getNestedCardBg(background, "subtle")
+                          ), children: /* @__PURE__ */ jsxs(CardContent, { className: "p-6 text-center", children: [
                             /* @__PURE__ */ jsx(
                               DynamicIcon,
                               {
@@ -2446,7 +2458,10 @@ function CommunityInitiatives({
         ),
         categoriesContent,
         /* @__PURE__ */ jsxs("div", { className: cn("mt-20 text-center", ctaClassName), children: [
-          ctaBadgeText && /* @__PURE__ */ jsx("div", { className: "mb-8 inline-flex items-center justify-center rounded-full bg-muted p-1", children: /* @__PURE__ */ jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText }) }),
+          ctaBadgeText && /* @__PURE__ */ jsx("div", { className: cn(
+            "mb-8 inline-flex items-center justify-center rounded-full p-1",
+            getNestedCardBg(background)
+          ), children: /* @__PURE__ */ jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText }) }),
           ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", ctaHeadingClassName), children: ctaHeading })),
           ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx(
             "p",
@@ -2871,7 +2886,12 @@ function FooterSocialNewsletter({
             )) })
           ] }, sectionIdx)),
           (socialLinks && socialLinks.length > 0 || newsletterLabel || newsletterButtonText) && /* @__PURE__ */ jsxs("div", { className: cn("lg:col-span-2 xl:col-span-1", socialColumnClassName), children: [
-            socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: cn("mb-10 flex items-center gap-2 text-muted-foreground", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsx("span", { className: cn("flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", socialLinkClassName), children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx)) }),
+            socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: cn("mb-10 flex items-center gap-2 text-muted-foreground", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsx("span", { className: cn(
+              "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+              getNestedCardBg(background),
+              getNestedCardTextColor(background),
+              socialLinkClassName
+            ), children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx)) }),
             (newsletterLabel || newsletterButtonText) && /* @__PURE__ */ jsxs("div", { className: cn("grid w-full max-w-sm items-center gap-1.5", newsletterClassName), children: [
               newsletterLabel && /* @__PURE__ */ jsx("label", { htmlFor: "newsletter-email", className: "text-sm font-medium", children: newsletterLabel }),
               /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-sm items-center space-x-2", children: [
@@ -2951,11 +2971,19 @@ function FooterSocialApps({
   }, [sections]);
   const socialLinksContent = useMemo(() => {
     if (!socialLinks || socialLinks.length === 0) return null;
-    return socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsx("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx));
+    return socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: social.href, "aria-label": social.label, children: /* @__PURE__ */ jsx("span", { className: cn(
+      "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+      getNestedCardBg(background),
+      getNestedCardTextColor(background)
+    ), children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 24 }) }) }) }, idx));
   }, [socialLinks]);
   const appLinksContent = useMemo(() => {
     if (!appLinks || appLinks.length === 0) return null;
-    return appLinks.map((app, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsx("span", { className: "flex size-12 items-center justify-center rounded-full bg-muted transition-colors hover:text-primary", children: /* @__PURE__ */ jsx(DynamicIcon, { name: app.icon, size: 24 }) }) }) }, idx));
+    return appLinks.map((app, idx) => /* @__PURE__ */ jsx("li", { className: "font-medium", children: /* @__PURE__ */ jsx(Pressable, { href: app.href, "aria-label": app.label, children: /* @__PURE__ */ jsx("span", { className: cn(
+      "flex size-12 items-center justify-center rounded-full transition-colors hover:text-primary",
+      getNestedCardBg(background),
+      getNestedCardTextColor(background)
+    ), children: /* @__PURE__ */ jsx(DynamicIcon, { name: app.icon, size: 24 }) }) }) }, idx));
   }, [appLinks]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -3087,7 +3115,11 @@ function FooterSimpleCentered({
                       logoWrapperClassName
                     ),
                     children: [
-                      logo?.src && /* @__PURE__ */ jsx("div", { className: "flex size-12 items-center justify-center rounded-lg border border-border bg-accent p-2", children: /* @__PURE__ */ jsx(
+                      logo?.src && /* @__PURE__ */ jsx("div", { className: cn(
+                        "flex size-12 items-center justify-center rounded-lg border border-border p-2",
+                        getNestedCardBg(background, "accent"),
+                        getNestedCardTextColor(background)
+                      ), children: /* @__PURE__ */ jsx(
                         Img,
                         {
                           src: logo.src,
@@ -3629,7 +3661,12 @@ function FooterContactCard({
                 {
                   href: social.href,
                   "aria-label": social.label,
-                  className: cn("flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground transition-colors hover:bg-primary hover:text-primary-foreground", socialLinkClassName),
+                  className: cn(
+                    "flex size-12 items-center justify-center rounded-full transition-colors hover:bg-primary hover:text-primary-foreground",
+                    getNestedCardBg(background),
+                    getNestedCardTextColor(background),
+                    socialLinkClassName
+                  ),
                   children: /* @__PURE__ */ jsx(DynamicIcon, { name: social.icon, size: 20 })
                 }
               ) }, idx)) })

package/dist/industries-badge-list-bordered.cjs

@@ -17,6 +17,36 @@ var React__default = /*#__PURE__*/_interopDefault(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getNestedCardBg(parentBg, variant = "muted", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "muted":
+        return "bg-background";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-background/50";
+    }
+  } else {
+    switch (variant) {
+      case "muted":
+        return "bg-muted";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-muted/50";
+    }
+  }
+}
+function getNestedCardTextColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-foreground" : "";
+}
 var badgeVariants = classVarianceAuthority.cva(
   "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
   {
@@ -453,7 +483,9 @@ function IndustriesBadgeListBordered({
       {
         variant: "outline",
         className: cn(
-          "mb-4 rounded-none border-0 bg-muted p-2  uppercase",
+          "mb-4 rounded-none border-0 p-2 uppercase",
+          getNestedCardBg(background),
+          getNestedCardTextColor(background),
           badgeClassName
         ),
         children: badge

package/dist/industries-badge-list-bordered.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-badge-list-bordered.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-badge-list-bordered.js

@@ -11,6 +11,36 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function getNestedCardBg(parentBg, variant = "muted", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "muted":
+        return "bg-background";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-background/50";
+    }
+  } else {
+    switch (variant) {
+      case "muted":
+        return "bg-muted";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-muted/50";
+    }
+  }
+}
+function getNestedCardTextColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-foreground" : "";
+}
 var badgeVariants = cva(
   "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
   {
@@ -447,7 +477,9 @@ function IndustriesBadgeListBordered({
       {
         variant: "outline",
         className: cn(
-          "mb-4 rounded-none border-0 bg-muted p-2  uppercase",
+          "mb-4 rounded-none border-0 p-2 uppercase",
+          getNestedCardBg(background),
+          getNestedCardTextColor(background),
           badgeClassName
         ),
         children: badge

package/dist/industries-expandable-showcase.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-expandable-showcase.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-hover-reveal-grid.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-hover-reveal-grid.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-timeline-table.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/industries-timeline-table.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/interior-carousel.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/interior-carousel.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';

package/dist/link-page-bento-layout.cjs

@@ -32,6 +32,36 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function getNestedCardBg(parentBg, variant = "muted", options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  if (isDark) {
+    switch (variant) {
+      case "muted":
+        return "bg-background";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-background/50";
+    }
+  } else {
+    switch (variant) {
+      case "muted":
+        return "bg-muted";
+      case "card":
+        return "bg-card";
+      case "accent":
+        return "bg-accent";
+      case "subtle":
+        return "bg-muted/50";
+    }
+  }
+}
+function getNestedCardTextColor(parentBg, options) {
+  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
+  return isDark ? "text-foreground" : "";
+}
 function normalizePhoneNumber(input) {
   const trimmed = input.trim();
   if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -1180,7 +1210,8 @@ function LinkPageBentoLayout({
               {
                 className: cn(
                   "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg",
-                  isDark ? "bg-muted/10" : "bg-card",
+                  getNestedCardBg(resolvedBackground, "card"),
+                  getNestedCardTextColor(resolvedBackground),
                   regularLinkIconWrapperClassName
                 ),
                 children: iconElement

package/dist/link-page-bento-layout.d.cts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { I as ImageItem, A as ActionConfig, a as SocialLinkItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';