@nice2dev/icons 1.0.8 → 1.0.10

package/dist/esm/icons/business.js

@@ -1,188 +1,234 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { createIcon } from '../createIcon.js';
 
-const NtdBriefcase = createIcon({ displayName: 'NtdBriefcase',
+const NtdBriefcase = createIcon({
+    displayName: 'NtdBriefcase',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("path", { d: "M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "13", x2: "22", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity * 0.5 })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "13", x2: "22", y2: "13", stroke: primaryColor, strokeWidth: "1.5" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "13", x2: "22", y2: "13", stroke: primaryColor, strokeWidth: "1.5" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("path", { d: "M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "13", x2: "22", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity * 0.5 })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", fill: "white", opacity: "0.1" }), jsx("path", { d: "M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsx("line", { x1: "2", y1: "13", x2: "22", y2: "13", stroke: "#3B82F6", strokeWidth: "1.5" })] })),
     },
 });
-const NtdDollar = createIcon({ displayName: 'NtdDollar',
+const NtdDollar = createIcon({
+    displayName: 'NtdDollar',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "12", y1: "1", x2: "12", y2: "23", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "12", y1: "1", x2: "12", y2: "23", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6", stroke: secondaryColor, strokeWidth: strokeWidth, fill: "none", opacity: secondaryOpacity + 0.2 }), jsx("line", { x1: "12", y1: "1", x2: "12", y2: "23", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("line", { x1: "12", y1: "1", x2: "12", y2: "23", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("line", { x1: "12", y1: "1", x2: "12", y2: "23", stroke: primaryColor, strokeWidth: "2" }), jsx("path", { d: "M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6", stroke: secondaryColor, strokeWidth: "2", fill: "none" })] })),
     },
 });
-const NtdWallet = createIcon({ displayName: 'NtdWallet',
+const NtdWallet = createIcon({
+    displayName: 'NtdWallet',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", fill: primaryColor }), jsx("path", { d: "M2 5a2 2 0 012-2h12l4 4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "18", cy: "13", r: "1.5", fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M2 5a2 2 0 012-2h12l4 4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "18", cy: "13", r: "1.5", fill: primaryColor })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "18", cy: "13", r: "1.5", fill: primaryColor })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", fill: primaryColor }), jsx("path", { d: "M2 5a2 2 0 012-2h12l4 4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "18", cy: "13", r: "1.5", fill: accentColor, opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", fill: primaryColor }), jsx("rect", { x: "2", y: "5", width: "20", height: "16", rx: "2", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "18", cy: "13", r: "1.5", fill: secondaryColor }), jsx("path", { d: "M2 5a2 2 0 012-2h12l4 4", stroke: "white", strokeWidth: "1", fill: "none" })] })),
     },
 });
-const NtdReceipt = createIcon({ displayName: 'NtdReceipt',
+const NtdReceipt = createIcon({
+    displayName: 'NtdReceipt',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", fill: primaryColor }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "16", x2: "12", y2: "16", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "16", x2: "12", y2: "16", stroke: primaryColor, strokeWidth: "1.5" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "16", x2: "12", y2: "16", stroke: primaryColor, strokeWidth: "1.5" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", fill: primaryColor }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "16", x2: "12", y2: "16", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", fill: primaryColor }), jsx("path", { d: "M4 2v20l3-2 3 2 3-2 3 2 3-2 3 2V2H4z", fill: "white", opacity: "0.1" }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: "#3B82F6", strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "16", x2: "12", y2: "16", stroke: "#3B82F6", strokeWidth: "1.5" })] })),
     },
 });
-const NtdBank = createIcon({ displayName: 'NtdBank',
+const NtdBank = createIcon({
+    displayName: 'NtdBank',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 2,8 22,8", fill: primaryColor }), jsx("rect", { x: "2", y: "20", width: "20", height: "2", rx: "0.5", fill: primaryColor }), jsx("rect", { x: "4", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "9", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "14", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "19", y: "10", width: "2", height: "10", fill: primaryColor })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 2,8 22,8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "20", x2: "22", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "5", y1: "8", x2: "5", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "10", y1: "8", x2: "10", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "15", y1: "8", x2: "15", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "20", y1: "8", x2: "20", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 2,8 22,8", fill: secondaryColor, opacity: secondaryOpacity }), jsx("polygon", { points: "12,2 2,8 22,8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "2", y1: "20", x2: "22", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "5", y1: "8", x2: "5", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "10", y1: "8", x2: "10", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "15", y1: "8", x2: "15", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "20", y1: "8", x2: "20", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("polygon", { points: "12,2 2,8 22,8", fill: primaryColor }), jsx("rect", { x: "2", y: "20", width: "20", height: "2", rx: "0.5", fill: primaryColor }), jsx("rect", { x: "4", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "9", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "14", y: "10", width: "2", height: "10", fill: primaryColor }), jsx("rect", { x: "19", y: "10", width: "2", height: "10", fill: primaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 2,8 22,8", fill: primaryColor }), jsx("polygon", { points: "12,2 2,8 22,8", fill: "white", opacity: "0.08" }), jsx("rect", { x: "2", y: "20", width: "20", height: "2", rx: "0.5", fill: secondaryColor }), jsx("rect", { x: "4", y: "10", width: "2", height: "10", fill: "#3B82F6" }), jsx("rect", { x: "9", y: "10", width: "2", height: "10", fill: "#10B981" }), jsx("rect", { x: "14", y: "10", width: "2", height: "10", fill: "#F59E0B" }), jsx("rect", { x: "19", y: "10", width: "2", height: "10", fill: "#F59E0B" })] })),
     },
 });
-const NtdTrendUp = createIcon({ displayName: 'NtdTrendUp',
+const NtdTrendUp = createIcon({
+    displayName: 'NtdTrendUp',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,6 13.5,15.5 8.5,10.5 1,18", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,6 23,6 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,6 13.5,15.5 8.5,10.5 1,18", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,6 23,6 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,6 13.5,15.5 8.5,10.5 1,18", stroke: secondaryColor, strokeWidth: strokeWidth, fill: "none", opacity: secondaryOpacity + 0.3 }), jsx("polyline", { points: "17,6 23,6 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("polyline", { points: "23,6 13.5,15.5 8.5,10.5 1,18", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,6 23,6 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,6 13.5,15.5 8.5,10.5 1,18", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsx("polyline", { points: "17,6 23,6 23,12", stroke: secondaryColor, strokeWidth: "2", fill: "none" })] })),
     },
 });
-const NtdTrendDown = createIcon({ displayName: 'NtdTrendDown',
+const NtdTrendDown = createIcon({
+    displayName: 'NtdTrendDown',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,18 13.5,8.5 8.5,13.5 1,6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,18 23,18 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,18 13.5,8.5 8.5,13.5 1,6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,18 23,18 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,18 13.5,8.5 8.5,13.5 1,6", stroke: secondaryColor, strokeWidth: strokeWidth, fill: "none", opacity: secondaryOpacity + 0.3 }), jsx("polyline", { points: "17,18 23,18 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("polyline", { points: "23,18 13.5,8.5 8.5,13.5 1,6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("polyline", { points: "17,18 23,18 23,12", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("polyline", { points: "23,18 13.5,8.5 8.5,13.5 1,6", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsx("polyline", { points: "17,18 23,18 23,12", stroke: secondaryColor, strokeWidth: "2", fill: "none" })] })),
     },
 });
-const NtdPercent = createIcon({ displayName: 'NtdPercent',
+const NtdPercent = createIcon({
+    displayName: 'NtdPercent',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", fill: primaryColor }), jsx("circle", { cx: "17.5", cy: "17.5", r: "2.5", fill: primaryColor })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "17.5", cy: "17.5", r: "2.5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19", stroke: secondaryColor, strokeWidth: strokeWidth, opacity: secondaryOpacity + 0.2 }), jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", fill: primaryColor }), jsx("circle", { cx: "17.5", cy: "17.5", r: "2.5", fill: primaryColor })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", fill: primaryColor }), jsx("circle", { cx: "17.5", cy: "17.5", r: "2.5", fill: primaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", fill: primaryColor }), jsx("circle", { cx: "6.5", cy: "6.5", r: "2.5", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "17.5", cy: "17.5", r: "2.5", fill: secondaryColor }), jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19", stroke: "white", strokeWidth: "1" })] })),
     },
 });
-const NtdInvoice = createIcon({ displayName: 'NtdInvoice',
+const NtdInvoice = createIcon({
+    displayName: 'NtdInvoice',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", fill: primaryColor }), jsx("path", { d: "M14 2v6h6", fill: primaryColor, opacity: 0.6 }), jsx("line", { x1: "8", y1: "13", x2: "12", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "14", y1: "13", x2: "16", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity * 0.6 })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M14 2v6h6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "13", x2: "12", y2: "13", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "14", y1: "13", x2: "16", y2: "13", stroke: primaryColor, strokeWidth: "1.5" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M14 2v6h6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "13", x2: "12", y2: "13", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: primaryColor, strokeWidth: "1.5" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", fill: primaryColor }), jsx("path", { d: "M14 2v6h6", fill: primaryColor, opacity: 0.6 }), jsx("line", { x1: "8", y1: "13", x2: "12", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "14", y1: "13", x2: "16", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity * 0.6 })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", fill: primaryColor }), jsx("path", { d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z", fill: "white", opacity: "0.08" }), jsx("path", { d: "M14 2v6h6", fill: secondaryColor }), jsx("line", { x1: "8", y1: "13", x2: "12", y2: "13", stroke: "white", strokeWidth: "1", opacity: "0.4" }), jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: "white", strokeWidth: "1", opacity: "0.4" }), jsx("line", { x1: "14", y1: "13", x2: "16", y2: "13", stroke: "white", strokeWidth: "1", opacity: "0.4" })] })),
     },
 });
-const NtdStore = createIcon({ displayName: 'NtdStore',
+const NtdStore = createIcon({
+    displayName: 'NtdStore',
     paths: {
         solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M3 9l1-5h16l1 5", fill: secondaryColor }), jsx("path", { d: "M3 9h18", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M3 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M15 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", fill: primaryColor }), jsx("rect", { x: "9", y: "17", width: "6", height: "5", fill: secondaryColor, opacity: 0.5 })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M3 9l1-5h16l1 5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M3 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M15 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "9", y: "17", width: "6", height: "5", stroke: primaryColor, strokeWidth: "1.5", fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M3 9l1-5h16l1 5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M3 9l1-5h16l1 5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M3 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M15 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M3 9l1-5h16l1 5", fill: secondaryColor }), jsx("path", { d: "M3 9h18", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M3 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M15 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", fill: primaryColor }), jsx("rect", { x: "9", y: "17", width: "6", height: "5", fill: secondaryColor, opacity: 0.5 })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M3 9l1-5h16l1 5", fill: primaryColor }), jsx("path", { d: "M3 9l1-5h16l1 5", fill: "white", opacity: "0.08" }), jsx("rect", { x: "5", y: "14", width: "14", height: "8", fill: secondaryColor }), jsx("rect", { x: "9", y: "17", width: "6", height: "5", fill: "#3B82F6" }), jsx("path", { d: "M3 9h18", stroke: "white", strokeWidth: "1" }), jsx("path", { d: "M3 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: "white", strokeWidth: "1", fill: "none" }), jsx("path", { d: "M9 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: "white", strokeWidth: "1", fill: "none" }), jsx("path", { d: "M15 9c0 1.66 1.34 3 3 3s3-1.34 3-3", stroke: "white", strokeWidth: "1", fill: "none" })] })),
     },
 });
-const NtdBarcode = createIcon({ displayName: 'NtdBarcode',
+const NtdBarcode = createIcon({
+    displayName: 'NtdBarcode',
     paths: {
         solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "6", y: "4", width: "1", height: "16", fill: primaryColor }), jsx("rect", { x: "9", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "13", y: "4", width: "1", height: "16", fill: primaryColor }), jsx("rect", { x: "15", y: "4", width: "3", height: "16", fill: primaryColor }), jsx("rect", { x: "20", y: "4", width: "2", height: "16", fill: primaryColor })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "3", y1: "4", x2: "3", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "7", y1: "4", x2: "7", y2: "20", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "10", y1: "4", x2: "10", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "13.5", y1: "4", x2: "13.5", y2: "20", stroke: primaryColor, strokeWidth: "1" }), jsx("line", { x1: "16.5", y1: "4", x2: "16.5", y2: "20", stroke: primaryColor, strokeWidth: "3" }), jsx("line", { x1: "21", y1: "4", x2: "21", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "6", y: "4", width: "1", height: "16", fill: secondaryColor, opacity: secondaryOpacity + 0.2 }), jsx("rect", { x: "13", y: "4", width: "1", height: "16", fill: secondaryColor, opacity: secondaryOpacity + 0.2 }), jsx("rect", { x: "2", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "9", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "15", y: "4", width: "3", height: "16", fill: primaryColor }), jsx("rect", { x: "20", y: "4", width: "2", height: "16", fill: primaryColor })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "2", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "6", y: "4", width: "1", height: "16", fill: primaryColor }), jsx("rect", { x: "9", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "13", y: "4", width: "1", height: "16", fill: primaryColor }), jsx("rect", { x: "15", y: "4", width: "3", height: "16", fill: primaryColor }), jsx("rect", { x: "20", y: "4", width: "2", height: "16", fill: primaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "4", width: "2", height: "16", fill: primaryColor }), jsx("rect", { x: "2", y: "4", width: "2", height: "16", fill: "white", opacity: "0.08" }), jsx("rect", { x: "6", y: "4", width: "1", height: "16", fill: secondaryColor }), jsx("rect", { x: "9", y: "4", width: "2", height: "16", fill: "#3B82F6" }), jsx("rect", { x: "13", y: "4", width: "1", height: "16", fill: "#10B981" }), jsx("rect", { x: "15", y: "4", width: "3", height: "16", fill: "#F59E0B" }), jsx("rect", { x: "20", y: "4", width: "2", height: "16", fill: "#F59E0B" })] })),
     },
 });
-const NtdCalculator = createIcon({ displayName: 'NtdCalculator',
+const NtdCalculator = createIcon({
+    displayName: 'NtdCalculator',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", fill: primaryColor }), jsx("rect", { x: "7", y: "5", width: "10", height: "4", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "8", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "16", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "8", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "16", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "7", y: "5", width: "10", height: "4", rx: "1", stroke: primaryColor, strokeWidth: "1.5", fill: "none" }), jsx("circle", { cx: "8", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "12", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "16", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "8", cy: "17", r: "1", fill: primaryColor }), jsx("circle", { cx: "12", cy: "17", r: "1", fill: primaryColor }), jsx("circle", { cx: "16", cy: "17", r: "1", fill: primaryColor })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "7", y: "5", width: "10", height: "4", rx: "1", stroke: primaryColor, strokeWidth: "1.5", fill: "none" }), jsx("circle", { cx: "8", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "12", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "16", cy: "13", r: "1", fill: primaryColor }), jsx("circle", { cx: "8", cy: "17", r: "1", fill: primaryColor }), jsx("circle", { cx: "12", cy: "17", r: "1", fill: primaryColor }), jsx("circle", { cx: "16", cy: "17", r: "1", fill: primaryColor })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", fill: primaryColor }), jsx("rect", { x: "7", y: "5", width: "10", height: "4", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "8", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "16", cy: "13", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "8", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity }), jsx("circle", { cx: "16", cy: "17", r: "1", fill: accentColor, opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", fill: primaryColor }), jsx("rect", { x: "4", y: "2", width: "16", height: "20", rx: "2", fill: "white", opacity: "0.08" }), jsx("rect", { x: "7", y: "5", width: "10", height: "4", rx: "1", fill: secondaryColor }), jsx("circle", { cx: "8", cy: "13", r: "1", fill: "#3B82F6" }), jsx("circle", { cx: "12", cy: "13", r: "1", fill: "#10B981" }), jsx("circle", { cx: "16", cy: "13", r: "1", fill: "#F59E0B" }), jsx("circle", { cx: "8", cy: "17", r: "1", fill: "#F59E0B" }), jsx("circle", { cx: "12", cy: "17", r: "1", fill: "#F59E0B" }), jsx("circle", { cx: "16", cy: "17", r: "1", fill: "#F59E0B" })] })),
     },
 });
-const NtdPresentation = createIcon({ displayName: 'NtdPresentation',
+const NtdPresentation = createIcon({
+    displayName: 'NtdPresentation',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("line", { x1: "12", y1: "17", x2: "12", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "8", y1: "22", x2: "16", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("polyline", { points: "7,13 10,9 13,11 17,7", stroke: accentColor, strokeWidth: "1.5", fill: "none", opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "12", y1: "17", x2: "12", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "8", y1: "22", x2: "16", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("polyline", { points: "7,13 10,9 13,11 17,7", stroke: primaryColor, strokeWidth: "1.5", fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "12", y1: "17", x2: "12", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "8", y1: "22", x2: "16", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("polyline", { points: "7,13 10,9 13,11 17,7", stroke: primaryColor, strokeWidth: "1.5", fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("line", { x1: "12", y1: "17", x2: "12", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "8", y1: "22", x2: "16", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("polyline", { points: "7,13 10,9 13,11 17,7", stroke: accentColor, strokeWidth: "1.5", fill: "none", opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", fill: primaryColor }), jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", fill: "white", opacity: "0.1" }), jsx("line", { x1: "12", y1: "17", x2: "12", y2: "22", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("line", { x1: "8", y1: "22", x2: "16", y2: "22", stroke: "#3B82F6", strokeWidth: "1.5" }), jsx("polyline", { points: "7,13 10,9 13,11 17,7", stroke: "#3B82F6", strokeWidth: "1.5", fill: "none" })] })),
     },
 });
-const NtdClipboardCheck = createIcon({ displayName: 'NtdClipboardCheck',
+const NtdClipboardCheck = createIcon({
+    displayName: 'NtdClipboardCheck',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", fill: primaryColor }), jsx("rect", { x: "8", y: "2", width: "8", height: "4", rx: "1", fill: primaryColor, stroke: accentColor, strokeWidth: "1", opacity: accentOpacity }), jsx("path", { d: "M9 14l2 2 4-4", stroke: accentColor, strokeWidth: strokeWidth, fill: "none", opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "8", y: "2", width: "8", height: "4", rx: "1", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 14l2 2 4-4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("rect", { x: "8", y: "2", width: "8", height: "4", rx: "1", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9 14l2 2 4-4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", fill: primaryColor }), jsx("rect", { x: "8", y: "2", width: "8", height: "4", rx: "1", fill: primaryColor, stroke: accentColor, strokeWidth: "1", opacity: accentOpacity }), jsx("path", { d: "M9 14l2 2 4-4", stroke: accentColor, strokeWidth: strokeWidth, fill: "none", opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", fill: primaryColor }), jsx("path", { d: "M16 4h2a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2h2", fill: "white", opacity: "0.08" }), jsx("rect", { x: "8", y: "2", width: "8", height: "4", rx: "1", fill: secondaryColor, stroke: secondaryColor, strokeWidth: "1" }), jsx("path", { d: "M9 14l2 2 4-4", stroke: "white", strokeWidth: "1", fill: "none", opacity: "0.4" })] })),
     },
 });
-const NtdPiggyBank = createIcon({ displayName: 'NtdPiggyBank',
+const NtdPiggyBank = createIcon({
+    displayName: 'NtdPiggyBank',
     paths: {
         solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", fill: primaryColor }), jsx("circle", { cx: "9", cy: "11", r: "1", fill: secondaryColor }), jsx("path", { d: "M20 13c1 0 2 .5 2 2s-1 2-2 2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M7 19l-1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 19l1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M14 7c-1-1-2.5-1.5-4-1.5S7 6 6 7", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "10", y1: "5", x2: "10", y2: "3", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "9", cy: "11", r: "1", fill: primaryColor }), jsx("path", { d: "M20 13c1 0 2 .5 2 2s-1 2-2 2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M7 19l-1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 19l1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "10", y1: "7", x2: "10", y2: "4", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", fill: secondaryColor, opacity: secondaryOpacity }), jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "9", cy: "11", r: "1", fill: primaryColor }), jsx("path", { d: "M20 13c1 0 2 .5 2 2s-1 2-2 2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M7 19l-1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 19l1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "10", y1: "7", x2: "10", y2: "4", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", fill: primaryColor }), jsx("circle", { cx: "9", cy: "11", r: "1", fill: secondaryColor }), jsx("path", { d: "M20 13c1 0 2 .5 2 2s-1 2-2 2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M7 19l-1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 19l1 3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M14 7c-1-1-2.5-1.5-4-1.5S7 6 6 7", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "10", y1: "5", x2: "10", y2: "3", stroke: primaryColor, strokeWidth: strokeWidth })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", fill: primaryColor }), jsx("ellipse", { cx: "12", cy: "13", rx: "8", ry: "6", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "9", cy: "11", r: "1", fill: secondaryColor }), jsx("path", { d: "M20 13c1 0 2 .5 2 2s-1 2-2 2", stroke: "white", strokeWidth: "1", fill: "none" }), jsx("path", { d: "M7 19l-1 3", stroke: "white", strokeWidth: "1" }), jsx("path", { d: "M17 19l1 3", stroke: "white", strokeWidth: "1" }), jsx("path", { d: "M14 7c-1-1-2.5-1.5-4-1.5S7 6 6 7", stroke: "white", strokeWidth: "1", fill: "none" }), jsx("line", { x1: "10", y1: "5", x2: "10", y2: "3", stroke: "white", strokeWidth: "1" })] })),
     },
 });
-const NtdCoins = createIcon({ displayName: 'NtdCoins',
+const NtdCoins = createIcon({
+    displayName: 'NtdCoins',
     paths: {
         solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "10", cy: "14", r: "7", fill: primaryColor }), jsx("circle", { cx: "10", cy: "14", r: "4", fill: secondaryColor, opacity: 0.3 }), jsx("circle", { cx: "16", cy: "8", r: "5", fill: primaryColor, opacity: 0.7 }), jsx("circle", { cx: "16", cy: "8", r: "2.5", fill: secondaryColor, opacity: 0.3 })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "10", cy: "14", r: "7", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "16", cy: "8", r: "5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "10", cy: "14", r: "7", fill: secondaryColor, opacity: secondaryOpacity }), jsx("circle", { cx: "10", cy: "14", r: "7", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "16", cy: "8", r: "5", fill: secondaryColor, opacity: secondaryOpacity * 0.7 }), jsx("circle", { cx: "16", cy: "8", r: "5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("circle", { cx: "10", cy: "14", r: "7", fill: primaryColor }), jsx("circle", { cx: "10", cy: "14", r: "4", fill: secondaryColor, opacity: 0.3 }), jsx("circle", { cx: "16", cy: "8", r: "5", fill: primaryColor, opacity: 0.7 }), jsx("circle", { cx: "16", cy: "8", r: "2.5", fill: secondaryColor, opacity: 0.3 })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "10", cy: "14", r: "7", fill: primaryColor }), jsx("circle", { cx: "10", cy: "14", r: "7", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "10", cy: "14", r: "4", fill: secondaryColor }), jsx("circle", { cx: "16", cy: "8", r: "5", fill: "#3B82F6" }), jsx("circle", { cx: "16", cy: "8", r: "2.5", fill: "#10B981" })] })),
     },
 });
-createIcon({ displayName: 'NtdBudgetPlanner',
+createIcon({
+    displayName: 'NtdBudgetPlanner',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", fill: primaryColor }), jsx("rect", { x: "7", y: "7", width: "10", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("rect", { x: "7", y: "11", width: "5", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("rect", { x: "14", y: "11", width: "3", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity * 0.7 }), jsx("rect", { x: "7", y: "15", width: "7", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "7", y1: "8", x2: "17", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "7", y1: "12", x2: "12", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "14", y1: "12", x2: "17", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "7", y1: "16", x2: "14", y2: "16", stroke: primaryColor, strokeWidth: "1.5" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "7", y1: "8", x2: "17", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "7", y1: "12", x2: "12", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "14", y1: "12", x2: "17", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "7", y1: "16", x2: "14", y2: "16", stroke: primaryColor, strokeWidth: "1.5" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", fill: primaryColor }), jsx("rect", { x: "7", y: "7", width: "10", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("rect", { x: "7", y: "11", width: "5", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity }), jsx("rect", { x: "14", y: "11", width: "3", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity * 0.7 }), jsx("rect", { x: "7", y: "15", width: "7", height: "2", rx: "1", fill: accentColor, opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", fill: primaryColor }), jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", fill: "white", opacity: "0.08" }), jsx("rect", { x: "7", y: "7", width: "10", height: "2", rx: "1", fill: secondaryColor }), jsx("rect", { x: "7", y: "11", width: "5", height: "2", rx: "1", fill: "#3B82F6" }), jsx("rect", { x: "14", y: "11", width: "3", height: "2", rx: "1", fill: "#10B981" }), jsx("rect", { x: "7", y: "15", width: "7", height: "2", rx: "1", fill: "#F59E0B" })] })),
     },
 });
-createIcon({ displayName: 'NtdCreditScore',
+createIcon({
+    displayName: 'NtdCreditScore',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 3a9 9 0 109 9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M12 6a6 6 0 106 6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none", opacity: 0.75 }), jsx("line", { x1: "12", y1: "12", x2: "17", y2: "9", stroke: accentColor, strokeWidth: "1.8", opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 3a9 9 0 109 9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M12 6a6 6 0 106 6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "12", y1: "12", x2: "17", y2: "9", stroke: primaryColor, strokeWidth: "1.8" }), jsx("circle", { cx: "12", cy: "12", r: "1.3", fill: primaryColor })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 3a9 9 0 109 9", stroke: secondaryColor, strokeWidth: strokeWidth, fill: "none", opacity: secondaryOpacity + 0.2 }), jsx("path", { d: "M12 6a6 6 0 106 6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "12", y1: "12", x2: "17", y2: "9", stroke: primaryColor, strokeWidth: "1.8" }), jsx("circle", { cx: "12", cy: "12", r: "1.3", fill: primaryColor })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M12 3a9 9 0 109 9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M12 6a6 6 0 106 6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none", opacity: 0.75 }), jsx("line", { x1: "12", y1: "12", x2: "17", y2: "9", stroke: accentColor, strokeWidth: "1.8", opacity: accentOpacity }), jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: accentColor, opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: primaryColor }), jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: "white", opacity: "0.1" }), jsx("path", { d: "M12 3a9 9 0 109 9", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsx("path", { d: "M12 6a6 6 0 106 6", stroke: "#3B82F6", strokeWidth: "1.5", fill: "none" }), jsx("line", { x1: "12", y1: "12", x2: "17", y2: "9", stroke: "#3B82F6", strokeWidth: "1.5" })] })),
     },
 });
-createIcon({ displayName: 'NtdTaxStamp',
+createIcon({
+    displayName: 'NtdTaxStamp',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", fill: primaryColor }), jsx("path", { d: "M8 11h8v7a4 4 0 11-8 0v-7z", fill: primaryColor, opacity: 0.9 }), jsx("line", { x1: "9", y1: "7", x2: "15", y2: "7", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M8 11h8v7a4 4 0 11-8 0v-7z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "9", y1: "7", x2: "15", y2: "7", stroke: primaryColor, strokeWidth: "1.5" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M8 11h8v7a4 4 0 11-8 0v-7z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", fill: primaryColor }), jsx("path", { d: "M8 11h8v7a4 4 0 11-8 0v-7z", fill: primaryColor, opacity: 0.9 }), jsx("line", { x1: "9", y1: "7", x2: "15", y2: "7", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", fill: primaryColor }), jsx("rect", { x: "5", y: "3", width: "14", height: "8", rx: "2", fill: "white", opacity: "0.08" }), jsx("path", { d: "M8 11h8v7a4 4 0 11-8 0v-7z", fill: secondaryColor }), jsx("line", { x1: "9", y1: "7", x2: "15", y2: "7", stroke: "white", strokeWidth: "1", opacity: "0.4" })] })),
     },
 });
-createIcon({ displayName: 'NtdPortfolio',
+createIcon({
+    displayName: 'NtdPortfolio',
     paths: {
         solid: ({ primaryColor, secondaryColor, secondaryOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", fill: primaryColor }), jsx("rect", { x: "6", y: "8", width: "4", height: "9", fill: secondaryColor, opacity: secondaryOpacity + 0.15 }), jsx("rect", { x: "11", y: "11", width: "3", height: "6", fill: secondaryColor, opacity: secondaryOpacity + 0.15 }), jsx("rect", { x: "15", y: "6", width: "3", height: "11", fill: secondaryColor, opacity: secondaryOpacity + 0.15 })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "6", y1: "17", x2: "6", y2: "8", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "11", y1: "17", x2: "11", y2: "11", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "16", y1: "17", x2: "16", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "6", y1: "17", x2: "6", y2: "8", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "11", y1: "17", x2: "11", y2: "11", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "16", y1: "17", x2: "16", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         flat: ({ primaryColor, secondaryColor, secondaryOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", fill: primaryColor }), jsx("rect", { x: "6", y: "8", width: "4", height: "9", fill: secondaryColor, opacity: secondaryOpacity + 0.15 }), jsx("rect", { x: "11", y: "11", width: "3", height: "6", fill: secondaryColor, opacity: secondaryOpacity + 0.15 }), jsx("rect", { x: "15", y: "6", width: "3", height: "11", fill: secondaryColor, opacity: secondaryOpacity + 0.15 })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", fill: primaryColor }), jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2", fill: "white", opacity: "0.08" }), jsx("rect", { x: "6", y: "8", width: "4", height: "9", fill: secondaryColor }), jsx("rect", { x: "11", y: "11", width: "3", height: "6", fill: "#3B82F6" }), jsx("rect", { x: "15", y: "6", width: "3", height: "11", fill: "#10B981" })] })),
     },
 });
-createIcon({ displayName: 'NtdHandshakeDeal',
+createIcon({
+    displayName: 'NtdHandshakeDeal',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", fill: primaryColor }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", fill: primaryColor }), jsx("path", { d: "M8 12l2 2a2 2 0 002.8 0l3.2-3.2", stroke: accentColor, strokeWidth: strokeWidth, fill: "none", opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M8 12l2 2a2 2 0 002.8 0l3.2-3.2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M8 12l2 2a2 2 0 002.8 0l3.2-3.2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", fill: primaryColor }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", fill: primaryColor }), jsx("path", { d: "M8 12l2 2a2 2 0 002.8 0l3.2-3.2", stroke: accentColor, strokeWidth: strokeWidth, fill: "none", opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", fill: primaryColor }), jsx("path", { d: "M2 10l4-3 4 3-4 3-4-3z", fill: "white", opacity: "0.08" }), jsx("path", { d: "M22 10l-4-3-4 3 4 3 4-3z", fill: secondaryColor }), jsx("path", { d: "M8 12l2 2a2 2 0 002.8 0l3.2-3.2", stroke: "white", strokeWidth: "1", fill: "none", opacity: "0.4" })] })),
     },
 });
-createIcon({ displayName: 'NtdAuditTrail',
+createIcon({
+    displayName: 'NtdAuditTrail',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", fill: primaryColor }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("path", { d: "M8 16h5", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("circle", { cx: "17", cy: "16", r: "2", fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("path", { d: "M8 16h5", stroke: primaryColor, strokeWidth: "1.5" }), jsx("circle", { cx: "17", cy: "16", r: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: primaryColor, strokeWidth: "1.5" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: primaryColor, strokeWidth: "1.5" }), jsx("path", { d: "M8 16h5", stroke: primaryColor, strokeWidth: "1.5" }), jsx("circle", { cx: "17", cy: "16", r: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", fill: primaryColor }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("path", { d: "M8 16h5", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("circle", { cx: "17", cy: "16", r: "2", fill: accentColor, opacity: accentOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", fill: primaryColor }), jsx("path", { d: "M6 3h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5a2 2 0 012-2z", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "17", cy: "16", r: "2", fill: secondaryColor }), jsx("line", { x1: "8", y1: "8", x2: "16", y2: "8", stroke: "white", strokeWidth: "1", opacity: "0.4" }), jsx("line", { x1: "8", y1: "12", x2: "16", y2: "12", stroke: "white", strokeWidth: "1", opacity: "0.4" }), jsx("path", { d: "M8 16h5", stroke: "white", strokeWidth: "1", opacity: "0.4" })] })),
     },
 });
-createIcon({ displayName: 'NtdGrowthTarget',
+createIcon({
+    displayName: 'NtdGrowthTarget',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "9", fill: primaryColor, opacity: 0.35 }), jsx("circle", { cx: "12", cy: "12", r: "6", fill: primaryColor, opacity: 0.7 }), jsx("circle", { cx: "12", cy: "12", r: "2.8", fill: primaryColor }), jsx("path", { d: "M14 10l6-6", stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity }), jsx("path", { d: "M17 4h3v3", stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity, fill: "none" })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "12", cy: "12", r: "6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "12", cy: "12", r: "2.8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M14 10l6-6", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 4h3v3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "9", fill: secondaryColor, opacity: secondaryOpacity }), jsx("circle", { cx: "12", cy: "12", r: "9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "12", cy: "12", r: "6", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("circle", { cx: "12", cy: "12", r: "2.8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M14 10l6-6", stroke: primaryColor, strokeWidth: strokeWidth })] })),
         flat: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("circle", { cx: "12", cy: "12", r: "9", fill: primaryColor, opacity: 0.35 }), jsx("circle", { cx: "12", cy: "12", r: "6", fill: primaryColor, opacity: 0.7 }), jsx("circle", { cx: "12", cy: "12", r: "2.8", fill: primaryColor }), jsx("path", { d: "M14 10l6-6", stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity }), jsx("path", { d: "M17 4h3v3", stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity, fill: "none" })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "9", fill: primaryColor }), jsx("circle", { cx: "12", cy: "12", r: "9", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "12", cy: "12", r: "6", fill: secondaryColor }), jsx("circle", { cx: "12", cy: "12", r: "2.8", fill: "#3B82F6" }), jsx("path", { d: "M14 10l6-6", stroke: "white", strokeWidth: "1", opacity: "0.35" }), jsx("path", { d: "M17 4h3v3", stroke: "white", strokeWidth: "1", opacity: "0.35", fill: "none" })] })),
     },
 });
 // ── Relocated from brand packs ──
@@ -190,18 +236,20 @@ const NtdKanban = createIcon({
     displayName: 'NtdKanban',
     paths: {
         solid: ({ primaryColor, secondaryColor, secondaryOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "5", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "10", y: "4", width: "5", height: "16", rx: "1.5", fill: primaryColor, opacity: "0.8" }), jsx("rect", { x: "17", y: "4", width: "4", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity })] })),
-        outline: ({ primaryColor, strokeWidth }) => jsx("path", { d: "M3 4h5v16H3zM10 4h5v16h-5zM17 4h4v16h-4z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }),
+        outline: ({ primaryColor, strokeWidth }) => (jsx("path", { d: "M3 4h5v16H3zM10 4h5v16h-5zM17 4h4v16h-4z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "5", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "17", y: "4", width: "4", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M3 4h5v16H3zM10 4h5v16h-5zM17 4h4v16h-4z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, secondaryOpacity }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("rect", { x: "3", y: "4", width: "5", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("rect", { x: "10", y: "4", width: "5", height: "16", rx: "1.5", fill: primaryColor, opacity: "0.8" }), jsx("rect", { x: "17", y: "4", width: "4", height: "16", rx: "1.5", fill: secondaryColor, opacity: secondaryOpacity })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("rect", { x: "3", y: "4", width: "5", height: "16", rx: "1.5", fill: primaryColor }), jsx("rect", { x: "3", y: "4", width: "5", height: "16", rx: "1.5", fill: "white", opacity: "0.08" }), jsx("rect", { x: "10", y: "4", width: "5", height: "16", rx: "1.5", fill: secondaryColor, opacity: "0.8" }), jsx("rect", { x: "17", y: "4", width: "4", height: "16", rx: "1.5", fill: "#3B82F6" })] })),
     },
 });
 const NtdMilestone = createIcon({
     displayName: 'NtdMilestone',
     paths: {
         solid: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("line", { x1: "5", y1: "4", x2: "5", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        outline: ({ primaryColor, strokeWidth }) => jsx("path", { d: "M5 4v16M5 5h13l-3 4 3 4H5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }),
+        outline: ({ primaryColor, strokeWidth }) => (jsx("path", { d: "M5 4v16M5 5h13l-3 4 3 4H5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M5 5h13l-3 4 3 4H5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M5 4v16M5 5h13l-3 4 3 4H5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         flat: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "4", fill: secondaryColor }), jsx("line", { x1: "5", y1: "4", x2: "5", y2: "20", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", fill: secondaryColor, opacity: secondaryOpacity }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M5 5h13l-3 4 3 4H5", fill: primaryColor }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", fill: "white", opacity: "0.1" }), jsx("line", { x1: "5", y1: "4", x2: "5", y2: "20", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("path", { d: "M5 5h13l-3 4 3 4H5", stroke: "#3B82F6", strokeWidth: "1.5", fill: "none" })] })),
     },
 });