strapi-plugin-magic-mail 2.6.3 → 2.6.5

package/dist/_chunks/{App-DvwmedNr.mjs → App-CaT5U0uM.mjs}

@@ -4013,7 +4013,7 @@ const CopyButton = styled(Button)`
     height: 14px;
   }
 `;
-const InfoBox$1 = styled(Box)`
+const InfoBox$2 = styled(Box)`
   background: linear-gradient(135deg, ${"rgba(2, 132, 199, 0.06)"}, ${"rgba(2, 132, 199, 0.12)"});
   border-left: 4px solid ${"var(--colors-primary600, #0EA5E9)"};
   border-radius: 8px;
@@ -5329,7 +5329,7 @@ const TemplateList = () => {
         selectedTemplate.name
       ] }) }),
       /* @__PURE__ */ jsxs(ScrollableDialogBody, { children: [
-        /* @__PURE__ */ jsx(InfoBox$1, { style: { marginTop: 0, marginBottom: "20px" }, children: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", justifyContent: "space-between", children: [
+        /* @__PURE__ */ jsx(InfoBox$2, { style: { marginTop: 0, marginBottom: "20px" }, children: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", justifyContent: "space-between", children: [
           /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { color: "var(--colors-primary600, #075985)" }, children: [
             /* @__PURE__ */ jsx("strong", { children: "Template ID:" }),
             " #",
@@ -7526,7 +7526,7 @@ const ConnectedCard = styled(Box)`
   padding: 32px;
   text-align: center;
 `;
-const InfoBox = styled(Box)`
+const InfoBox$1 = styled(Box)`
   background: linear-gradient(135deg, rgba(2, 132, 199, 0.06) 0%, ${colors.whatsappLight} 100%);
   border: 1px solid rgba(2, 132, 199, 0.2);
   border-radius: 12px;
@@ -7642,7 +7642,7 @@ const AlertIcon = styled.div`
   font-weight: bold;
   flex-shrink: 0;
 `;
-const SuccessBox = styled(Box)`
+const SuccessBox$1 = styled(Box)`
   background: rgba(22, 163, 74, 0.06);
   border: 1px solid rgba(22, 163, 74, 0.2);
   border-radius: 12px;
@@ -7903,7 +7903,7 @@ const WhatsAppPage = () => {
     currentStep === 1 && /* @__PURE__ */ jsxs(ContentCard, { children: [
       /* @__PURE__ */ jsx(Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Check Installation" }),
       /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "First, we need to verify that the required dependencies are installed." }),
-      isAvailable ? /* @__PURE__ */ jsxs(SuccessBox, { children: [
+      isAvailable ? /* @__PURE__ */ jsxs(SuccessBox$1, { children: [
         /* @__PURE__ */ jsx(SuccessIcon, { children: /* @__PURE__ */ jsx(Check, { style: { width: 14, height: 14 } }) }),
         /* @__PURE__ */ jsxs(Box, { children: [
           /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "semiBold", style: { display: "block", marginBottom: "4px", color: "var(--colors-success600, #15803D)" }, children: "Dependencies Installed" }),
@@ -7954,7 +7954,7 @@ const WhatsAppPage = () => {
     currentStep === 2 && /* @__PURE__ */ jsxs(ContentCard, { children: [
       /* @__PURE__ */ jsx(Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Connect Your WhatsApp" }),
       /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "Click the button below to start the connection process. A QR code will be generated for you to scan." }),
-      /* @__PURE__ */ jsxs(InfoBox, { children: [
+      /* @__PURE__ */ jsxs(InfoBox$1, { children: [
         /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", style: { display: "block", marginBottom: "16px", color: "var(--colors-primary600, #075985)" }, children: "How it works" }),
         /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 3, children: [
           /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral700", children: '1. Click "Connect WhatsApp" to generate a QR code' }),
@@ -8000,7 +8000,7 @@ const WhatsAppPage = () => {
         /* @__PURE__ */ jsx(SpinningLoader, { style: { width: "40px", height: "40px" } }),
         /* @__PURE__ */ jsx(Typography, { variant: "omega", children: "Generating QR code..." })
       ] }) }),
-      /* @__PURE__ */ jsxs(InfoBox, { children: [
+      /* @__PURE__ */ jsxs(InfoBox$1, { children: [
         /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", style: { display: "block", marginBottom: "16px", color: "var(--colors-primary600, #075985)" }, children: "Instructions" }),
         /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
           /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral700", children: "1. Open WhatsApp on your phone" }),
@@ -8167,7 +8167,7 @@ const ModalContent = styled(Box)`
   overflow: hidden;
 `;
 const GradientHeader = styled(Box)`
-  background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9) 0%, var(--colors-secondary500, #A855F7) 100%);
+  background: linear-gradient(135deg, #4945ff 0%, #7c3aed 100%);
   padding: 32px 40px;
   position: relative;
   overflow: hidden;
@@ -8233,17 +8233,17 @@ const CloseButton = styled.button`
 `;
 const GradientButton = styled(Button)`
   && {
-    background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9) 0%, var(--colors-secondary500, #A855F7) 100%);
+    background: linear-gradient(135deg, #4945ff 0%, #7c3aed 100%);
     color: white;
     font-weight: 600;
     border: none;
-    box-shadow: 0 4px 12px rgba(14, 165, 233, 0.4);
+    box-shadow: 0 4px 12px rgba(73, 69, 255, 0.4);
     padding: 12px 24px;
     min-height: 44px;
     
     &:hover:not(:disabled) {
-      background: linear-gradient(135deg, var(--colors-primary700, #0284C7) 0%, var(--colors-secondary600, #9333EA) 100%);
-      box-shadow: 0 6px 16px rgba(14, 165, 233, 0.5);
+      background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
+      box-shadow: 0 6px 16px rgba(73, 69, 255, 0.5);
     }
     
     &:disabled {
@@ -8254,22 +8254,22 @@ const GradientButton = styled(Button)`
 `;
 styled(Button)`
   && {
-    background: rgba(14, 165, 233, 0.06);
-    color: var(--colors-primary600, #0EA5E9);
+    background: rgba(73, 69, 255, 0.06);
+    color: #4945ff;
     font-weight: 600;
-    border: 2px solid var(--colors-primary600, #0EA5E9);
+    border: 2px solid #4945ff;
     padding: 12px 24px;
     min-height: 44px;
     
     &:hover:not(:disabled) {
-      background: rgba(14, 165, 233, 0.12);
+      background: rgba(73, 69, 255, 0.12);
     }
   }
 `;
 const ToggleButton = styled.button`
   background: none;
   border: none;
-  color: var(--colors-primary600, #0EA5E9);
+  color: #4945ff;
   font-size: 13px;
   font-weight: 600;
   cursor: pointer;
@@ -8278,7 +8278,7 @@ const ToggleButton = styled.button`
   transition: color 0.2s;
   
   &:hover {
-    color: var(--colors-secondary600, #A855F7);
+    color: #7c3aed;
   }
   
   &:disabled {
@@ -8286,6 +8286,25 @@ const ToggleButton = styled.button`
     cursor: not-allowed;
   }
 `;
+const InfoBox = styled(Box)`
+  background: rgba(73, 69, 255, 0.06);
+  border: 2px solid rgba(73, 69, 255, 0.3);
+  border-radius: 8px;
+  padding: 16px;
+  width: 100%;
+`;
+const SuccessBox = styled(Box)`
+  background: rgba(34, 197, 94, 0.06);
+  border: 2px solid rgba(34, 197, 94, 0.3);
+  border-radius: 8px;
+  padding: 20px;
+  text-align: center;
+`;
+const InfoText = styled(Typography)`
+  font-size: 13px;
+  line-height: 1.6;
+  color: ${(p) => p.theme.colors.neutral800};
+`;
 const LicenseGuard = ({ children }) => {
   const { get, post } = useFetchClient();
   const { toggleNotification } = useNotification();
@@ -8442,19 +8461,7 @@ const LicenseGuard = ({ children }) => {
             children: useExistingKey ? "← Create new license" : "Have a license key? →"
           }
         ) }),
-        /* @__PURE__ */ jsx(
-          Box,
-          {
-            background: "primary100",
-            padding: 4,
-            style: {
-              borderRadius: "8px",
-              border: "2px solid rgba(14, 165, 233, 0.3)",
-              width: "100%"
-            },
-            children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { fontSize: "13px", lineHeight: "1.6" }, children: useExistingKey ? "🔑 Enter your email and license key to activate." : adminUser && adminUser.email ? `✨ Click "Activate" to auto-create a license with your account (${adminUser.email})` : '✨ Click "Activate" to auto-create a license with your admin account' })
-          }
-        ),
+        /* @__PURE__ */ jsx(InfoBox, { children: /* @__PURE__ */ jsx(InfoText, { variant: "omega", children: useExistingKey ? "Enter your email and license key to activate." : adminUser && adminUser.email ? `Click "Activate" to auto-create a license with your account (${adminUser.email})` : 'Click "Activate" to auto-create a license with your admin account' }) }),
         useExistingKey ? (
           // Existing License Key Input
           /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -8506,31 +8513,15 @@ const LicenseGuard = ({ children }) => {
           ] })
         ) : adminUser ? (
           // Auto-create mode - Show user info
-          /* @__PURE__ */ jsxs(
-            Box,
-            {
-              background: "success100",
-              padding: 5,
-              style: {
-                borderRadius: "8px",
-                border: "2px solid rgba(34, 197, 94, 0.3)",
-                textAlign: "center"
-              },
-              children: [
-                /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "bold", style: { marginBottom: "12px", display: "block" }, children: "Ready to activate with your account:" }),
-                /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { marginBottom: "4px", display: "block" }, children: [
-                  "👤 ",
-                  adminUser.firstname || "Admin",
-                  " ",
-                  adminUser.lastname || "User"
-                ] }),
-                /* @__PURE__ */ jsxs(Typography, { variant: "pi", textColor: "neutral600", children: [
-                  "📧 ",
-                  adminUser.email || "Loading..."
-                ] })
-              ]
-            }
-          )
+          /* @__PURE__ */ jsxs(SuccessBox, { children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "bold", style: { marginBottom: "12px", display: "block" }, children: "Ready to activate with your account:" }),
+            /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { marginBottom: "4px", display: "block" }, children: [
+              adminUser.firstname || "Admin",
+              " ",
+              adminUser.lastname || "User"
+            ] }),
+            /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: adminUser.email || "Loading..." })
+          ] })
         ) : /* @__PURE__ */ jsxs(Box, { padding: 4, background: "neutral100", hasRadius: true, style: { textAlign: "center" }, children: [
           /* @__PURE__ */ jsx(Loader, { small: true }),
           /* @__PURE__ */ jsx(Typography, { variant: "pi", marginTop: 2, children: "Loading admin user data..." })

package/dist/_chunks/{App-Cp6QQAHt.js → App-DGGqHEPC.js}

@@ -4036,7 +4036,7 @@ const CopyButton = styled__default.default(designSystem.Button)`
     height: 14px;
   }
 `;
-const InfoBox$1 = styled__default.default(designSystem.Box)`
+const InfoBox$2 = styled__default.default(designSystem.Box)`
   background: linear-gradient(135deg, ${"rgba(2, 132, 199, 0.06)"}, ${"rgba(2, 132, 199, 0.12)"});
   border-left: 4px solid ${"var(--colors-primary600, #0EA5E9)"};
   border-radius: 8px;
@@ -5352,7 +5352,7 @@ const TemplateList = () => {
         selectedTemplate.name
       ] }) }),
       /* @__PURE__ */ jsxRuntime.jsxs(ScrollableDialogBody, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(InfoBox$1, { style: { marginTop: 0, marginBottom: "20px" }, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { alignItems: "center", justifyContent: "space-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(InfoBox$2, { style: { marginTop: 0, marginBottom: "20px" }, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { alignItems: "center", justifyContent: "space-between", children: [
           /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { variant: "pi", style: { color: "var(--colors-primary600, #075985)" }, children: [
             /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Template ID:" }),
             " #",
@@ -7549,7 +7549,7 @@ const ConnectedCard = styled__default.default(designSystem.Box)`
   padding: 32px;
   text-align: center;
 `;
-const InfoBox = styled__default.default(designSystem.Box)`
+const InfoBox$1 = styled__default.default(designSystem.Box)`
   background: linear-gradient(135deg, rgba(2, 132, 199, 0.06) 0%, ${colors.whatsappLight} 100%);
   border: 1px solid rgba(2, 132, 199, 0.2);
   border-radius: 12px;
@@ -7665,7 +7665,7 @@ const AlertIcon = styled__default.default.div`
   font-weight: bold;
   flex-shrink: 0;
 `;
-const SuccessBox = styled__default.default(designSystem.Box)`
+const SuccessBox$1 = styled__default.default(designSystem.Box)`
   background: rgba(22, 163, 74, 0.06);
   border: 1px solid rgba(22, 163, 74, 0.2);
   border-radius: 12px;
@@ -7926,7 +7926,7 @@ const WhatsAppPage = () => {
     currentStep === 1 && /* @__PURE__ */ jsxRuntime.jsxs(ContentCard, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Check Installation" }),
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "First, we need to verify that the required dependencies are installed." }),
-      isAvailable ? /* @__PURE__ */ jsxRuntime.jsxs(SuccessBox, { children: [
+      isAvailable ? /* @__PURE__ */ jsxRuntime.jsxs(SuccessBox$1, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(SuccessIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, { style: { width: 14, height: 14 } }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", fontWeight: "semiBold", style: { display: "block", marginBottom: "4px", color: "var(--colors-success600, #15803D)" }, children: "Dependencies Installed" }),
@@ -7977,7 +7977,7 @@ const WhatsAppPage = () => {
     currentStep === 2 && /* @__PURE__ */ jsxRuntime.jsxs(ContentCard, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Connect Your WhatsApp" }),
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "Click the button below to start the connection process. A QR code will be generated for you to scan." }),
-      /* @__PURE__ */ jsxRuntime.jsxs(InfoBox, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(InfoBox$1, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", style: { display: "block", marginBottom: "16px", color: "var(--colors-primary600, #075985)" }, children: "How it works" }),
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 3, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral700", children: '1. Click "Connect WhatsApp" to generate a QR code' }),
@@ -8023,7 +8023,7 @@ const WhatsAppPage = () => {
         /* @__PURE__ */ jsxRuntime.jsx(SpinningLoader, { style: { width: "40px", height: "40px" } }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", children: "Generating QR code..." })
       ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs(InfoBox, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(InfoBox$1, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", style: { display: "block", marginBottom: "16px", color: "var(--colors-primary600, #075985)" }, children: "Instructions" }),
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 2, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral700", children: "1. Open WhatsApp on your phone" }),
@@ -8190,7 +8190,7 @@ const ModalContent = styled__default.default(designSystem.Box)`
   overflow: hidden;
 `;
 const GradientHeader = styled__default.default(designSystem.Box)`
-  background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9) 0%, var(--colors-secondary500, #A855F7) 100%);
+  background: linear-gradient(135deg, #4945ff 0%, #7c3aed 100%);
   padding: 32px 40px;
   position: relative;
   overflow: hidden;
@@ -8256,17 +8256,17 @@ const CloseButton = styled__default.default.button`
 `;
 const GradientButton = styled__default.default(designSystem.Button)`
   && {
-    background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9) 0%, var(--colors-secondary500, #A855F7) 100%);
+    background: linear-gradient(135deg, #4945ff 0%, #7c3aed 100%);
     color: white;
     font-weight: 600;
     border: none;
-    box-shadow: 0 4px 12px rgba(14, 165, 233, 0.4);
+    box-shadow: 0 4px 12px rgba(73, 69, 255, 0.4);
     padding: 12px 24px;
     min-height: 44px;
     
     &:hover:not(:disabled) {
-      background: linear-gradient(135deg, var(--colors-primary700, #0284C7) 0%, var(--colors-secondary600, #9333EA) 100%);
-      box-shadow: 0 6px 16px rgba(14, 165, 233, 0.5);
+      background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
+      box-shadow: 0 6px 16px rgba(73, 69, 255, 0.5);
     }
     
     &:disabled {
@@ -8277,22 +8277,22 @@ const GradientButton = styled__default.default(designSystem.Button)`
 `;
 styled__default.default(designSystem.Button)`
   && {
-    background: rgba(14, 165, 233, 0.06);
-    color: var(--colors-primary600, #0EA5E9);
+    background: rgba(73, 69, 255, 0.06);
+    color: #4945ff;
     font-weight: 600;
-    border: 2px solid var(--colors-primary600, #0EA5E9);
+    border: 2px solid #4945ff;
     padding: 12px 24px;
     min-height: 44px;
     
     &:hover:not(:disabled) {
-      background: rgba(14, 165, 233, 0.12);
+      background: rgba(73, 69, 255, 0.12);
     }
   }
 `;
 const ToggleButton = styled__default.default.button`
   background: none;
   border: none;
-  color: var(--colors-primary600, #0EA5E9);
+  color: #4945ff;
   font-size: 13px;
   font-weight: 600;
   cursor: pointer;
@@ -8301,7 +8301,7 @@ const ToggleButton = styled__default.default.button`
   transition: color 0.2s;
   
   &:hover {
-    color: var(--colors-secondary600, #A855F7);
+    color: #7c3aed;
   }
   
   &:disabled {
@@ -8309,6 +8309,25 @@ const ToggleButton = styled__default.default.button`
     cursor: not-allowed;
   }
 `;
+const InfoBox = styled__default.default(designSystem.Box)`
+  background: rgba(73, 69, 255, 0.06);
+  border: 2px solid rgba(73, 69, 255, 0.3);
+  border-radius: 8px;
+  padding: 16px;
+  width: 100%;
+`;
+const SuccessBox = styled__default.default(designSystem.Box)`
+  background: rgba(34, 197, 94, 0.06);
+  border: 2px solid rgba(34, 197, 94, 0.3);
+  border-radius: 8px;
+  padding: 20px;
+  text-align: center;
+`;
+const InfoText = styled__default.default(designSystem.Typography)`
+  font-size: 13px;
+  line-height: 1.6;
+  color: ${(p) => p.theme.colors.neutral800};
+`;
 const LicenseGuard = ({ children }) => {
   const { get, post } = admin.useFetchClient();
   const { toggleNotification } = admin.useNotification();
@@ -8465,19 +8484,7 @@ const LicenseGuard = ({ children }) => {
             children: useExistingKey ? "← Create new license" : "Have a license key? →"
           }
         ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          designSystem.Box,
-          {
-            background: "primary100",
-            padding: 4,
-            style: {
-              borderRadius: "8px",
-              border: "2px solid rgba(14, 165, 233, 0.3)",
-              width: "100%"
-            },
-            children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", style: { fontSize: "13px", lineHeight: "1.6" }, children: useExistingKey ? "🔑 Enter your email and license key to activate." : adminUser && adminUser.email ? `✨ Click "Activate" to auto-create a license with your account (${adminUser.email})` : '✨ Click "Activate" to auto-create a license with your admin account' })
-          }
-        ),
+        /* @__PURE__ */ jsxRuntime.jsx(InfoBox, { children: /* @__PURE__ */ jsxRuntime.jsx(InfoText, { variant: "omega", children: useExistingKey ? "Enter your email and license key to activate." : adminUser && adminUser.email ? `Click "Activate" to auto-create a license with your account (${adminUser.email})` : 'Click "Activate" to auto-create a license with your admin account' }) }),
         useExistingKey ? (
           // Existing License Key Input
           /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -8529,31 +8536,15 @@ const LicenseGuard = ({ children }) => {
           ] })
         ) : adminUser ? (
           // Auto-create mode - Show user info
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            designSystem.Box,
-            {
-              background: "success100",
-              padding: 5,
-              style: {
-                borderRadius: "8px",
-                border: "2px solid rgba(34, 197, 94, 0.3)",
-                textAlign: "center"
-              },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", fontWeight: "bold", style: { marginBottom: "12px", display: "block" }, children: "Ready to activate with your account:" }),
-                /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { variant: "pi", style: { marginBottom: "4px", display: "block" }, children: [
-                  "👤 ",
-                  adminUser.firstname || "Admin",
-                  " ",
-                  adminUser.lastname || "User"
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { variant: "pi", textColor: "neutral600", children: [
-                  "📧 ",
-                  adminUser.email || "Loading..."
-                ] })
-              ]
-            }
-          )
+          /* @__PURE__ */ jsxRuntime.jsxs(SuccessBox, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", fontWeight: "bold", style: { marginBottom: "12px", display: "block" }, children: "Ready to activate with your account:" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { variant: "pi", style: { marginBottom: "4px", display: "block" }, children: [
+              adminUser.firstname || "Admin",
+              " ",
+              adminUser.lastname || "User"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", textColor: "neutral600", children: adminUser.email || "Loading..." })
+          ] })
         ) : /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { padding: 4, background: "neutral100", hasRadius: true, style: { textAlign: "center" }, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Loader, { small: true }),
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", marginTop: 2, children: "Loading admin user data..." })

package/dist/_chunks/{LicensePage-DTrGRpi7.mjs → LicensePage-B61HnhyD.mjs}

@@ -21,14 +21,14 @@ const Title = styled(Typography)`
   font-size: 2.5rem;
   font-weight: 700;
   margin-bottom: 8px;
-  background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9), var(--colors-secondary500, #A855F7));
+  background: linear-gradient(135deg, #4945ff, #7c3aed);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   display: block;
 `;
 const Subtitle = styled(Typography)`
   font-size: 1.125rem;
-  color: var(--colors-neutral600);
+  color: ${(p) => p.theme.colors.neutral600};
   line-height: 1.6;
   display: block;
 `;
@@ -50,24 +50,24 @@ const TierCard = styled(Box)`
   background: ${(p) => p.theme.colors.neutral0};
   border-radius: 16px;
   padding: 32px;
-  border: 2px solid ${(props) => props.$featured ? "var(--colors-primary600, #0EA5E9)" : "rgba(128, 128, 128, 0.2)"};
+  border: 2px solid ${(props) => props.$featured ? "#4945ff" : props.theme.colors.neutral200};
   position: relative;
   transition: all 0.3s ease;
-  box-shadow: ${(props) => props.$featured ? "0 20px 25px -5px rgba(14, 165, 233, 0.25), 0 8px 10px -6px rgba(14, 165, 233, 0.2)" : "0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05)"};
+  box-shadow: ${(props) => props.$featured ? "0 20px 25px -5px rgba(73, 69, 255, 0.25), 0 8px 10px -6px rgba(73, 69, 255, 0.2)" : "0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05)"};
   display: flex;
   flex-direction: column;
   width: 100%;
 
   &:hover {
     transform: translateY(-4px);
-    box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.15), 0 8px 10px -6px rgba(15, 23, 42, 0.1);
+    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.15), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
   }
 `;
 const PopularBadge = styled(Badge)`
   position: absolute;
   top: -12px;
   right: 24px;
-  background: linear-gradient(135deg, var(--colors-primary600, #0EA5E9), var(--colors-primary700, #0284C7));
+  background: linear-gradient(135deg, #4945ff, #4338ca);
   color: white;
   padding: 4px 16px;
   font-size: 12px;
@@ -93,16 +93,36 @@ const TierName = styled(Typography)`
   font-size: 1.5rem;
   font-weight: 700;
   margin-bottom: 8px;
+  color: ${(p) => p.theme.colors.neutral800};
 `;
 const TierPrice = styled(Typography)`
   font-size: 2rem;
   font-weight: 800;
   margin-bottom: 4px;
+  color: ${(p) => p.theme.colors.neutral800};
 `;
 const TierDescription = styled(Typography)`
-  color: var(--colors-neutral600);
+  color: ${(p) => p.theme.colors.neutral600};
   margin-bottom: 24px;
 `;
+const LimitsBox = styled(Box)`
+  background: ${(p) => p.theme.colors.neutral100};
+  border-radius: 8px;
+  padding: 12px;
+  margin-bottom: 20px;
+`;
+const LimitText = styled(Typography)`
+  font-size: 13px;
+  color: ${(p) => p.theme.colors.neutral800};
+`;
+const PeriodText = styled(Typography)`
+  color: ${(p) => p.theme.colors.neutral600};
+`;
+const FeatureText = styled(Typography)`
+  font-size: 14px;
+  color: ${(p) => p.$included ? p.theme.colors.neutral800 : p.theme.colors.neutral500};
+  text-decoration: ${(p) => p.$included ? "none" : "line-through"};
+`;
 const FeatureList = styled(Box)`
   margin-bottom: 24px;
   flex: 1;
@@ -124,10 +144,10 @@ const FeatureIcon = styled(Box)`
   
   ${(props) => props.$included ? `
     background: rgba(34, 197, 94, 0.15);
-    svg { color: var(--colors-success600, #16A34A); }
+    svg { color: #16A34A; }
   ` : `
     background: rgba(220, 38, 38, 0.12);
-    svg { color: var(--colors-danger600, #DC2626); }
+    svg { color: #DC2626; }
   `}
 `;
 const UpgradeButton = styled(Button)`
@@ -150,8 +170,8 @@ const CurrentPlanBadge = styled(Badge)`
   display: flex;
   align-items: center;
   justify-content: center;
-  background: var(--colors-neutral100);
-  color: var(--colors-neutral600);
+  background: ${(p) => p.theme.colors.neutral100};
+  color: ${(p) => p.theme.colors.neutral600};
   font-weight: 600;
   font-size: 15px;
 `;
@@ -292,26 +312,21 @@ const LicensePage = () => {
       /* @__PURE__ */ jsx(TierName, { variant: "beta", children: tier.name }),
       /* @__PURE__ */ jsxs(Flex, { alignItems: "baseline", gap: 1, children: [
         /* @__PURE__ */ jsx(TierPrice, { variant: "alpha", children: tier.price }),
-        /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: "var(--colors-neutral600)" }, children: tier.period })
+        /* @__PURE__ */ jsx(PeriodText, { variant: "omega", children: tier.period })
       ] }),
       /* @__PURE__ */ jsx(TierDescription, { variant: "omega", children: tier.description }),
-      /* @__PURE__ */ jsx(Box, { style: {
-        background: "var(--colors-neutral100, #F9FAFB)",
-        borderRadius: "8px",
-        padding: "12px",
-        marginBottom: "20px"
-      }, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
-        /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { fontSize: "13px" }, children: [
+      /* @__PURE__ */ jsx(LimitsBox, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
+        /* @__PURE__ */ jsxs(LimitText, { variant: "pi", children: [
           /* @__PURE__ */ jsx("strong", { children: "Templates:" }),
           " ",
           tier.limits.templates
         ] }),
-        /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { fontSize: "13px" }, children: [
+        /* @__PURE__ */ jsxs(LimitText, { variant: "pi", children: [
           /* @__PURE__ */ jsx("strong", { children: "Accounts:" }),
           " ",
           tier.limits.accounts
         ] }),
-        /* @__PURE__ */ jsxs(Typography, { variant: "pi", style: { fontSize: "13px" }, children: [
+        /* @__PURE__ */ jsxs(LimitText, { variant: "pi", children: [
           /* @__PURE__ */ jsx("strong", { children: "Routing Rules:" }),
           " ",
           tier.limits.rules
@@ -319,18 +334,7 @@ const LicensePage = () => {
       ] }) }),
       /* @__PURE__ */ jsx(FeatureList, { children: tier.features.map((feature, index) => /* @__PURE__ */ jsxs(Feature, { children: [
         /* @__PURE__ */ jsx(FeatureIcon, { $included: feature.included, children: feature.included ? /* @__PURE__ */ jsx(Check, { style: { width: 14, height: 14 } }) : /* @__PURE__ */ jsx(Cross, { style: { width: 14, height: 14 } }) }),
-        /* @__PURE__ */ jsx(
-          Typography,
-          {
-            variant: "omega",
-            style: {
-              fontSize: "14px",
-              color: feature.included ? "var(--colors-neutral800)" : "var(--colors-neutral500)",
-              textDecoration: feature.included ? "none" : "line-through"
-            },
-            children: feature.name
-          }
-        )
+        /* @__PURE__ */ jsx(FeatureText, { variant: "omega", $included: feature.included, children: feature.name })
       ] }, index)) }),
       currentTier === tier.id ? /* @__PURE__ */ jsx(CurrentPlanBadge, { children: "Current Plan" }) : /* @__PURE__ */ jsx(
         UpgradeButton,