@abumble/design-system 0.0.47 → 0.0.48

package/dist/components/List.js

@@ -6,7 +6,7 @@ const l = i(
   {
     variants: {
       variant: {
-        default: "bg-background border-container py-2",
+        default: "bg-card border-container py-2",
         clear: ""
       }
     },
@@ -24,12 +24,12 @@ function u({ variant: r, className: a, ...t }) {
     }
   );
 }
-const o = i(
+const s = i(
   "list-decimal pl-8 pr-2 my-4 rounded",
   {
     variants: {
       variant: {
-        default: "bg-background border-container py-2",
+        default: "bg-card border-container py-2",
         clear: ""
       }
     },
@@ -42,7 +42,7 @@ function m({ variant: r, className: a, ...t }) {
   return /* @__PURE__ */ n(
     "ol",
     {
-      className: e(o({ variant: r, className: a })),
+      className: e(s({ variant: r, className: a })),
       ...t
     }
   );

package/dist/components/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../src/components/List/List.tsx"],"sourcesContent":["import { cn } from \"@/utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\n\nconst ulVariants = cva(\n    \"list-disc pl-8 pr-2 my-4 rounded\",\n    {\n        variants: {\n            variant: {\n                default: \"bg-background border-container py-2\",\n                clear: \"\"\n            },\n        },\n        defaultVariants: {\n            variant: \"default\",\n        },\n    }\n);\n\nfunction UnorderedList({ variant, className, ...props }: React.ComponentProps<\"ul\"> & VariantProps<typeof ulVariants>) {\n    return (\n        <ul\n            className={cn(ulVariants({ variant, className }))}\n            {...props}\n        />\n    )\n}\n\nconst olVariants = cva(\n    \"list-decimal pl-8 pr-2 my-4 rounded\",\n    {\n        variants: {\n            variant: {\n                default: \"bg-background border-container py-2\",\n                clear: \"\"\n            },\n        },\n        defaultVariants: {\n            variant: \"default\",\n        },\n    }\n);\n\nfunction OrderedList({ variant, className, ...props }: React.ComponentProps<\"ol\"> & VariantProps<typeof olVariants>) {\n    return (\n        <ol\n            className={cn(olVariants({ variant, className }))}\n            {...props}\n        />\n    )\n}\n\nfunction InnerUnorderedList({ className, ...props }: React.ComponentProps<\"ul\">) {\n    return (\n        <ul\n            className={cn(\"list-circle pl-8 pr-2 mb-2\", className)}\n            {...props}\n        />\n    )\n}\n\nexport { InnerUnorderedList, OrderedList, UnorderedList };\n\n"],"names":["ulVariants","cva","UnorderedList","variant","className","props","jsx","cn","olVariants","OrderedList","InnerUnorderedList"],"mappings":";;;AAIA,MAAMA,IAAaC;AAAA,EACf;AAAA,EACA;AAAA,IACI,UAAU;AAAA,MACN,SAAS;AAAA,QACL,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACX;AAAA,IAEJ,iBAAiB;AAAA,MACb,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAEA,SAASC,EAAc,EAAE,SAAAC,GAAS,WAAAC,GAAW,GAAGC,KAAuE;AACnH,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGP,EAAW,EAAE,SAAAG,GAAS,WAAAC,EAAA,CAAW,CAAC;AAAA,MAC/C,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,MAAMG,IAAaP;AAAA,EACf;AAAA,EACA;AAAA,IACI,UAAU;AAAA,MACN,SAAS;AAAA,QACL,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACX;AAAA,IAEJ,iBAAiB;AAAA,MACb,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAEA,SAASQ,EAAY,EAAE,SAAAN,GAAS,WAAAC,GAAW,GAAGC,KAAuE;AACjH,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGC,EAAW,EAAE,SAAAL,GAAS,WAAAC,EAAA,CAAW,CAAC;AAAA,MAC/C,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,SAASK,EAAmB,EAAE,WAAAN,GAAW,GAAGC,KAAqC;AAC7E,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAG,8BAA8BH,CAAS;AAAA,MACpD,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;"}
+{"version":3,"file":"List.js","sources":["../../src/components/List/List.tsx"],"sourcesContent":["import { cn } from \"@/utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\n\nconst ulVariants = cva(\n    \"list-disc pl-8 pr-2 my-4 rounded\",\n    {\n        variants: {\n            variant: {\n                default: \"bg-card border-container py-2\",\n                clear: \"\"\n            },\n        },\n        defaultVariants: {\n            variant: \"default\",\n        },\n    }\n);\n\nfunction UnorderedList({ variant, className, ...props }: React.ComponentProps<\"ul\"> & VariantProps<typeof ulVariants>) {\n    return (\n        <ul\n            className={cn(ulVariants({ variant, className }))}\n            {...props}\n        />\n    )\n}\n\nconst olVariants = cva(\n    \"list-decimal pl-8 pr-2 my-4 rounded\",\n    {\n        variants: {\n            variant: {\n                default: \"bg-card border-container py-2\",\n                clear: \"\"\n            },\n        },\n        defaultVariants: {\n            variant: \"default\",\n        },\n    }\n);\n\nfunction OrderedList({ variant, className, ...props }: React.ComponentProps<\"ol\"> & VariantProps<typeof olVariants>) {\n    return (\n        <ol\n            className={cn(olVariants({ variant, className }))}\n            {...props}\n        />\n    )\n}\n\nfunction InnerUnorderedList({ className, ...props }: React.ComponentProps<\"ul\">) {\n    return (\n        <ul\n            className={cn(\"list-circle pl-8 pr-2 mb-2\", className)}\n            {...props}\n        />\n    )\n}\n\nexport { InnerUnorderedList, OrderedList, UnorderedList };\n\n"],"names":["ulVariants","cva","UnorderedList","variant","className","props","jsx","cn","olVariants","OrderedList","InnerUnorderedList"],"mappings":";;;AAIA,MAAMA,IAAaC;AAAA,EACf;AAAA,EACA;AAAA,IACI,UAAU;AAAA,MACN,SAAS;AAAA,QACL,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACX;AAAA,IAEJ,iBAAiB;AAAA,MACb,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAEA,SAASC,EAAc,EAAE,SAAAC,GAAS,WAAAC,GAAW,GAAGC,KAAuE;AACnH,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGP,EAAW,EAAE,SAAAG,GAAS,WAAAC,EAAA,CAAW,CAAC;AAAA,MAC/C,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,MAAMG,IAAaP;AAAA,EACf;AAAA,EACA;AAAA,IACI,UAAU;AAAA,MACN,SAAS;AAAA,QACL,SAAS;AAAA,QACT,OAAO;AAAA,MAAA;AAAA,IACX;AAAA,IAEJ,iBAAiB;AAAA,MACb,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAEA,SAASQ,EAAY,EAAE,SAAAN,GAAS,WAAAC,GAAW,GAAGC,KAAuE;AACjH,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGC,EAAW,EAAE,SAAAL,GAAS,WAAAC,EAAA,CAAW,CAAC;AAAA,MAC/C,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,SAASK,EAAmB,EAAE,WAAAN,GAAW,GAAGC,KAAqC;AAC7E,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAG,8BAA8BH,CAAS;AAAA,MACpD,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGhB;"}

package/dist/components/Table.js

@@ -6,7 +6,7 @@ function s({ className: t, ...e }) {
     "div",
     {
       "data-slot": "table-container",
-      className: "relative w-full overflow-x-auto",
+      className: "relative w-full overflow-x-auto bg-card border-container rounded",
       children: /* @__PURE__ */ a(
         "table",
         {
@@ -79,7 +79,7 @@ function m({ className: t, ...e }) {
     {
       "data-slot": "table-head",
       className: o(
-        "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap first:pl-4 last:pr-4 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
         t
       ),
       ...e
@@ -92,7 +92,7 @@ function u({ className: t, ...e }) {
     {
       "data-slot": "table-cell",
       className: o(
-        "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        "p-2 align-middle whitespace-nowrap first:pl-4 last:pr-4 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
         t
       ),
       ...e

package/dist/components/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../src/components/Table/Table.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\nexport function Table({ className, ...props }: React.ComponentProps<'table'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"table-container\"\n\t\t\tclassName=\"relative w-full overflow-x-auto\"\n\t\t>\n\t\t\t<table\n\t\t\t\tdata-slot=\"table\"\n\t\t\t\tclassName={cn('w-full caption-bottom text-sm', className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n\nexport function TableHeader({\n\tclassName,\n\t...props\n}: React.ComponentProps<'thead'>) {\n\treturn (\n\t\t<thead\n\t\t\tdata-slot=\"table-header\"\n\t\t\tclassName={cn('[&_tr]:border-b', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableBody({\n\tclassName,\n\t...props\n}: React.ComponentProps<'tbody'>) {\n\treturn (\n\t\t<tbody\n\t\t\tdata-slot=\"table-body\"\n\t\t\tclassName={cn('[&_tr:last-child]:border-0', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableFooter({\n\tclassName,\n\t...props\n}: React.ComponentProps<'tfoot'>) {\n\treturn (\n\t\t<tfoot\n\t\t\tdata-slot=\"table-footer\"\n\t\t\tclassName={cn(\n\t\t\t\t'bg-muted/50 border-t font-medium [&>tr]:last:border-b-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {\n\treturn (\n\t\t<tr\n\t\t\tdata-slot=\"table-row\"\n\t\t\tclassName={cn(\n\t\t\t\t'hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableHead({ className, ...props }: React.ComponentProps<'th'>) {\n\treturn (\n\t\t<th\n\t\t\tdata-slot=\"table-head\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableCell({ className, ...props }: React.ComponentProps<'td'>) {\n\treturn (\n\t\t<td\n\t\t\tdata-slot=\"table-cell\"\n\t\t\tclassName={cn(\n\t\t\t\t'p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: React.ComponentProps<'caption'>) {\n\treturn (\n\t\t<caption\n\t\t\tdata-slot=\"table-caption\"\n\t\t\tclassName={cn('text-muted-foreground mt-4 text-sm', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Table","className","props","jsx","cn","TableHeader","TableBody","TableFooter","TableRow","TableHead","TableCell","TableCaption"],"mappings":";;;AAIO,SAASA,EAAM,EAAE,WAAAC,GAAW,GAAGC,KAAwC;AAC7E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAU;AAAA,MAEV,UAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,WAAWC,EAAG,iCAAiCH,CAAS;AAAA,UACvD,GAAGC;AAAA,QAAA;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGH;AAEO,SAASG,EAAY;AAAA,EAC3B,WAAAJ;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,mBAAmBH,CAAS;AAAA,MACzC,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASI,EAAU;AAAA,EACzB,WAAAL;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,8BAA8BH,CAAS;AAAA,MACpD,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASK,EAAY;AAAA,EAC3B,WAAAN;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASM,EAAS,EAAE,WAAAP,GAAW,GAAGC,KAAqC;AAC7E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASO,EAAU,EAAE,WAAAR,GAAW,GAAGC,KAAqC;AAC9E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASQ,EAAU,EAAE,WAAAT,GAAW,GAAGC,KAAqC;AAC9E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASS,EAAa;AAAA,EAC5B,WAAAV;AAAA,EACA,GAAGC;AACJ,GAAoC;AACnC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,sCAAsCH,CAAS;AAAA,MAC5D,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Table.js","sources":["../../src/components/Table/Table.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\nexport function Table({ className, ...props }: React.ComponentProps<'table'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"table-container\"\n\t\t\tclassName=\"relative w-full overflow-x-auto bg-card border-container rounded\"\n\t\t>\n\t\t\t<table\n\t\t\t\tdata-slot=\"table\"\n\t\t\t\tclassName={cn('w-full caption-bottom text-sm', className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n\nexport function TableHeader({\n\tclassName,\n\t...props\n}: React.ComponentProps<'thead'>) {\n\treturn (\n\t\t<thead\n\t\t\tdata-slot=\"table-header\"\n\t\t\tclassName={cn('[&_tr]:border-b', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableBody({\n\tclassName,\n\t...props\n}: React.ComponentProps<'tbody'>) {\n\treturn (\n\t\t<tbody\n\t\t\tdata-slot=\"table-body\"\n\t\t\tclassName={cn('[&_tr:last-child]:border-0', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableFooter({\n\tclassName,\n\t...props\n}: React.ComponentProps<'tfoot'>) {\n\treturn (\n\t\t<tfoot\n\t\t\tdata-slot=\"table-footer\"\n\t\t\tclassName={cn(\n\t\t\t\t'bg-muted/50 border-t font-medium [&>tr]:last:border-b-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {\n\treturn (\n\t\t<tr\n\t\t\tdata-slot=\"table-row\"\n\t\t\tclassName={cn(\n\t\t\t\t'hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableHead({ className, ...props }: React.ComponentProps<'th'>) {\n\treturn (\n\t\t<th\n\t\t\tdata-slot=\"table-head\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap first:pl-4 last:pr-4 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableCell({ className, ...props }: React.ComponentProps<'td'>) {\n\treturn (\n\t\t<td\n\t\t\tdata-slot=\"table-cell\"\n\t\t\tclassName={cn(\n\t\t\t\t'p-2 align-middle whitespace-nowrap first:pl-4 last:pr-4 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: React.ComponentProps<'caption'>) {\n\treturn (\n\t\t<caption\n\t\t\tdata-slot=\"table-caption\"\n\t\t\tclassName={cn('text-muted-foreground mt-4 text-sm', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Table","className","props","jsx","cn","TableHeader","TableBody","TableFooter","TableRow","TableHead","TableCell","TableCaption"],"mappings":";;;AAIO,SAASA,EAAM,EAAE,WAAAC,GAAW,GAAGC,KAAwC;AAC7E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAU;AAAA,MAEV,UAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,WAAWC,EAAG,iCAAiCH,CAAS;AAAA,UACvD,GAAGC;AAAA,QAAA;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGH;AAEO,SAASG,EAAY;AAAA,EAC3B,WAAAJ;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,mBAAmBH,CAAS;AAAA,MACzC,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASI,EAAU;AAAA,EACzB,WAAAL;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,8BAA8BH,CAAS;AAAA,MACpD,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASK,EAAY;AAAA,EAC3B,WAAAN;AAAA,EACA,GAAGC;AACJ,GAAkC;AACjC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASM,EAAS,EAAE,WAAAP,GAAW,GAAGC,KAAqC;AAC7E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASO,EAAU,EAAE,WAAAR,GAAW,GAAGC,KAAqC;AAC9E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASQ,EAAU,EAAE,WAAAT,GAAW,GAAGC,KAAqC;AAC9E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,SAASS,EAAa;AAAA,EAC5B,WAAAV;AAAA,EACA,GAAGC;AACJ,GAAoC;AACnC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC,EAAG,sCAAsCH,CAAS;AAAA,MAC5D,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/Textarea.js

@@ -1,7 +1,7 @@
 import { jsx as i } from "react/jsx-runtime";
 import "react";
 import { c as t } from "../shared/utils.js";
-function d({
+function n({
   className: r,
   ...e
 }) {
@@ -10,7 +10,7 @@ function d({
     {
       "data-slot": "textarea",
       className: t(
-        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full rounded border bg-card px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         r
       ),
       ...e
@@ -18,6 +18,6 @@ function d({
   );
 }
 export {
-  d as Textarea
+  n as Textarea
 };
 //# sourceMappingURL=Textarea.js.map

package/dist/components/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\nexport function Textarea({\n\tclassName,\n\t...props\n}: React.ComponentProps<'textarea'>) {\n\treturn (\n\t\t<textarea\n\t\t\tdata-slot=\"textarea\"\n\t\t\tclassName={cn(\n\t\t\t\t'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Textarea","className","props","jsx","cn"],"mappings":";;;AAIO,SAASA,EAAS;AAAA,EACxB,WAAAC;AAAA,EACA,GAAGC;AACJ,GAAqC;AACpC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Textarea.js","sources":["../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\nexport function Textarea({\n\tclassName,\n\t...props\n}: React.ComponentProps<'textarea'>) {\n\treturn (\n\t\t<textarea\n\t\t\tdata-slot=\"textarea\"\n\t\t\tclassName={cn(\n\t\t\t\t'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full rounded border bg-card px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Textarea","className","props","jsx","cn"],"mappings":";;;AAIO,SAASA,EAAS;AAAA,EACxB,WAAAC;AAAA,EACA,GAAGC;AACJ,GAAqC;AACpC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/ThemeSelector/ThemeSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSelector/ThemeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AASlC,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAmBxF"}
+{"version":3,"file":"ThemeSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSelector/ThemeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAUlC,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAmBxF"}

package/dist/components/ThemeSelector.js

@@ -1,25 +1,26 @@
 import { jsx as l } from "react/jsx-runtime";
 import "react";
 import { u as m } from "../shared/useTheme.js";
-import { S as i } from "../shared/Select.js";
-const s = [
+import { S as u } from "../shared/Select.js";
+const c = [
   { value: "linen", label: "Linen" },
   { value: "steel", label: "Steel" },
   { value: "sage", label: "Sage" },
-  { value: "dusk", label: "Dusk" }
+  { value: "dusk", label: "Dusk" },
+  { value: "canopy", label: "Canopy" }
 ];
-function S({ onChange: o, ...a }) {
+function S({ onChange: a, ...o }) {
   const { colorTheme: t, setColorTheme: r } = m();
   return /* @__PURE__ */ l(
-    i,
+    u,
     {
       value: t,
       "aria-label": "Select color theme",
       onChange: (e) => {
-        r(e.target.value), o?.(e);
+        r(e.target.value), a?.(e);
       },
-      ...a,
-      children: s.map(({ value: e, label: n }) => /* @__PURE__ */ l("option", { value: e, children: n }, e))
+      ...o,
+      children: c.map(({ value: e, label: n }) => /* @__PURE__ */ l("option", { value: e, children: n }, e))
     }
   );
 }

package/dist/components/ThemeSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeSelector.js","sources":["../../src/components/ThemeSelector/ThemeSelector.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useTheme } from '@/themes'\nimport type { ColorTheme } from '@/themes'\nimport { Select } from '../Select'\n\nconst COLOR_THEMES: { value: ColorTheme; label: string }[] = [\n\t{ value: 'linen', label: 'Linen' },\n\t{ value: 'steel', label: 'Steel' },\n\t{ value: 'sage', label: 'Sage' },\n\t{ value: 'dusk', label: 'Dusk' },\n]\n\nexport function ThemeSelector({ onChange, ...props }: React.ComponentProps<typeof Select>) {\n\tconst { colorTheme, setColorTheme } = useTheme()\n\treturn (\n\t\t<Select\n\t\t\tvalue={colorTheme}\n\t\t\taria-label=\"Select color theme\"\n\t\t\tonChange={(e) => {\n\t\t\t\tsetColorTheme(e.target.value as ColorTheme)\n\t\t\t\tonChange?.(e)\n\t\t\t}}\n\t\t\t{...props}\n\t\t>\n\t\t\t{COLOR_THEMES.map(({ value, label }) => (\n\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t{label}\n\t\t\t\t</option>\n\t\t\t))}\n\t\t</Select>\n\t)\n}\n"],"names":["COLOR_THEMES","ThemeSelector","onChange","props","colorTheme","setColorTheme","useTheme","jsx","Select","value","label"],"mappings":";;;;AAKA,MAAMA,IAAuD;AAAA,EAC5D,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,QAAQ,OAAO,OAAA;AAAA,EACxB,EAAE,OAAO,QAAQ,OAAO,OAAA;AACzB;AAEO,SAASC,EAAc,EAAE,UAAAC,GAAU,GAAGC,KAA8C;AAC1F,QAAM,EAAE,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAAA;AACtC,SACC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,OAAOJ;AAAA,MACP,cAAW;AAAA,MACX,UAAU,CAAC,MAAM;AAChB,QAAAC,EAAc,EAAE,OAAO,KAAmB,GAC1CH,IAAW,CAAC;AAAA,MACb;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH,EAAa,IAAI,CAAC,EAAE,OAAAS,GAAO,OAAAC,EAAA,MAC3B,gBAAAH,EAAC,UAAA,EAAmB,OAAAE,GAClB,UAAAC,EAAA,GADWD,CAEb,CACA;AAAA,IAAA;AAAA,EAAA;AAGJ;"}
+{"version":3,"file":"ThemeSelector.js","sources":["../../src/components/ThemeSelector/ThemeSelector.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useTheme } from '@/themes'\nimport type { ColorTheme } from '@/themes'\nimport { Select } from '../Select'\n\nconst COLOR_THEMES: { value: ColorTheme; label: string }[] = [\n\t{ value: 'linen', label: 'Linen' },\n\t{ value: 'steel', label: 'Steel' },\n\t{ value: 'sage', label: 'Sage' },\n\t{ value: 'dusk', label: 'Dusk' },\n\t{ value: 'canopy', label: 'Canopy' },\n]\n\nexport function ThemeSelector({ onChange, ...props }: React.ComponentProps<typeof Select>) {\n\tconst { colorTheme, setColorTheme } = useTheme()\n\treturn (\n\t\t<Select\n\t\t\tvalue={colorTheme}\n\t\t\taria-label=\"Select color theme\"\n\t\t\tonChange={(e) => {\n\t\t\t\tsetColorTheme(e.target.value as ColorTheme)\n\t\t\t\tonChange?.(e)\n\t\t\t}}\n\t\t\t{...props}\n\t\t>\n\t\t\t{COLOR_THEMES.map(({ value, label }) => (\n\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t{label}\n\t\t\t\t</option>\n\t\t\t))}\n\t\t</Select>\n\t)\n}\n"],"names":["COLOR_THEMES","ThemeSelector","onChange","props","colorTheme","setColorTheme","useTheme","jsx","Select","value","label"],"mappings":";;;;AAKA,MAAMA,IAAuD;AAAA,EAC5D,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,QAAQ,OAAO,OAAA;AAAA,EACxB,EAAE,OAAO,QAAQ,OAAO,OAAA;AAAA,EACxB,EAAE,OAAO,UAAU,OAAO,SAAA;AAC3B;AAEO,SAASC,EAAc,EAAE,UAAAC,GAAU,GAAGC,KAA8C;AAC1F,QAAM,EAAE,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAAA;AACtC,SACC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,OAAOJ;AAAA,MACP,cAAW;AAAA,MACX,UAAU,CAAC,MAAM;AAChB,QAAAC,EAAc,EAAE,OAAO,KAAmB,GAC1CH,IAAW,CAAC;AAAA,MACb;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH,EAAa,IAAI,CAAC,EAAE,OAAAS,GAAO,OAAAC,EAAA,MAC3B,gBAAAH,EAAC,UAAA,EAAmB,OAAAE,GAClB,UAAAC,EAAA,GADWD,CAEb,CACA;AAAA,IAAA;AAAA,EAAA;AAGJ;"}

package/dist/index.css

@@ -1 +1 @@
-:root{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}[data-theme=linen]{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}:root.dark,[data-theme=linen].dark{--background: oklch(.14 .01 80);--foreground: oklch(.93 .01 85);--card: oklch(.19 .012 80 / .75);--card-foreground: oklch(.93 .01 85);--popover: oklch(.17 .01 80);--popover-foreground: oklch(.93 .01 85);--primary: oklch(.86 .05 85);--primary-foreground: oklch(.14 .01 80);--secondary: oklch(.24 .01 80);--secondary-foreground: oklch(.86 .05 85);--muted: oklch(.24 .01 80);--muted-foreground: oklch(.6 .01 85);--accent: oklch(.24 .01 80);--accent-foreground: oklch(.86 .05 85);--destructive: oklch(.48 .15 25);--destructive-foreground: oklch(.93 .01 85);--border: oklch(.28 .01 80);--input: oklch(.28 .01 80);--ring: oklch(.86 .05 85 / .3);--sidebar: oklch(.17 .01 80);--sidebar-foreground: oklch(.93 .01 85);--sidebar-primary: oklch(.86 .05 85);--sidebar-primary-foreground: oklch(.14 .01 80);--sidebar-accent: oklch(.23 .01 80);--sidebar-accent-foreground: oklch(.93 .01 85);--sidebar-border: oklch(.28 .01 80);--banner-info: oklch(.22 .04 230);--banner-info-foreground: oklch(.88 .05 230);--banner-info-border: oklch(.48 .16 235);--banner-note: oklch(.22 .04 155);--banner-note-foreground: oklch(.88 .06 155);--banner-note-border: oklch(.44 .1 155);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.44 .12 150);--badge-success-foreground: oklch(.93 .01 85);--checkbox-checked: oklch(.86 .05 85);--checkbox-checked-foreground: oklch(.14 .01 80);--checkbox-unchecked-bg: oklch(.22 .01 80);--checkbox-unchecked-border: oklch(.35 .01 80)}[data-theme=steel]{--background: oklch(.95 .005 250);--foreground: oklch(.2 .02 250);--card: oklch(.98 .005 250 / .85);--card-foreground: oklch(.2 .02 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 250);--primary: oklch(.3 .05 250);--primary-foreground: oklch(.98 .005 250);--secondary: oklch(.97 .005 250);--secondary-foreground: oklch(.3 .05 250);--muted: oklch(.93 .005 250);--muted-foreground: oklch(.5 .02 250);--accent: oklch(.91 .008 250);--accent-foreground: oklch(.3 .05 250);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.88 .005 250);--input: oklch(.88 .005 250);--ring: oklch(.3 .05 250 / .15);--sidebar: oklch(.97 .005 250);--sidebar-foreground: oklch(.25 .02 250);--sidebar-primary: oklch(.3 .05 250);--sidebar-primary-foreground: oklch(.98 .005 250);--sidebar-accent: oklch(.93 .008 250);--sidebar-accent-foreground: oklch(.25 .02 250);--sidebar-border: oklch(.9 .005 250);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 162);--banner-note-foreground: oklch(.24 .1 162);--banner-note-border: oklch(.48 .16 162);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .05 250);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.85 .01 250)}[data-theme=steel].dark{--background: oklch(.18 .015 260);--foreground: oklch(.985 0 0);--card: oklch(.23 .02 260 / .75);--card-foreground: oklch(.985 0 0);--popover: oklch(.21 .015 260);--popover-foreground: oklch(.985 0 0);--primary: oklch(.9 .1 220);--primary-foreground: oklch(.18 .015 260);--secondary: oklch(.28 .02 260);--secondary-foreground: oklch(.9 .1 220);--muted: oklch(.28 .02 260);--muted-foreground: oklch(.705 .015 260);--accent: oklch(.28 .02 260);--accent-foreground: oklch(.9 .1 220);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.985 0 0);--border: oklch(.32 .02 260);--input: oklch(.32 .02 260);--ring: oklch(.9 .1 220 / .3);--sidebar: oklch(.21 .015 260);--sidebar-foreground: oklch(.985 0 0);--sidebar-primary: oklch(.9 .1 220);--sidebar-primary-foreground: oklch(.18 .015 260);--sidebar-accent: oklch(.28 .02 260);--sidebar-accent-foreground: oklch(.985 0 0);--sidebar-border: oklch(.32 .02 260);--banner-info: oklch(.274 .079 260);--banner-info-foreground: oklch(.925 .033 260);--banner-info-border: oklch(.488 .2 260);--banner-note: oklch(.266 .065 152);--banner-note-foreground: oklch(.962 .044 156);--banner-note-border: oklch(.45 .1 152);--banner-warning: oklch(.55 .22 100);--banner-warning-foreground: oklch(.99 .15 102);--banner-warning-border: oklch(.75 .25 100);--banner-alert: oklch(.293 .084 27);--banner-alert-foreground: oklch(.969 .071 27);--banner-alert-border: oklch(.45 .12 27);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.9 .1 220);--checkbox-checked-foreground: oklch(.18 .015 260);--checkbox-unchecked-bg: oklch(.25 .01 260);--checkbox-unchecked-border: oklch(.4 .01 260)}[data-theme=sage]{--background: oklch(.965 .007 145);--foreground: oklch(.18 .02 145);--card: oklch(.99 .004 145 / .75);--card-foreground: oklch(.18 .02 145);--popover: oklch(1 0 0);--popover-foreground: oklch(.18 .02 145);--primary: oklch(.25 .06 145);--primary-foreground: oklch(.97 .005 145);--secondary: oklch(.97 .006 145);--secondary-foreground: oklch(.25 .06 145);--muted: oklch(.94 .006 145);--muted-foreground: oklch(.5 .02 145);--accent: oklch(.92 .008 145);--accent-foreground: oklch(.25 .06 145);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.9 .006 145);--input: oklch(.9 .006 145);--ring: oklch(.25 .06 145 / .15);--sidebar: oklch(.97 .006 145);--sidebar-foreground: oklch(.22 .02 145);--sidebar-primary: oklch(.25 .06 145);--sidebar-primary-foreground: oklch(.97 .005 145);--sidebar-accent: oklch(.93 .008 145);--sidebar-accent-foreground: oklch(.22 .02 145);--sidebar-border: oklch(.91 .006 145);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.24 .09 240);--banner-info-border: oklch(.52 .18 240);--banner-note: oklch(.94 .02 145);--banner-note-foreground: oklch(.24 .1 145);--banner-note-border: oklch(.48 .16 145);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 145);--badge-success-foreground: oklch(.98 .01 145);--checkbox-checked: oklch(.25 .06 145);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.87 .008 145)}[data-theme=sage].dark{--background: oklch(.14 .015 145);--foreground: oklch(.93 .01 145);--card: oklch(.19 .018 145 / .75);--card-foreground: oklch(.93 .01 145);--popover: oklch(.17 .015 145);--popover-foreground: oklch(.93 .01 145);--primary: oklch(.8 .1 145);--primary-foreground: oklch(.14 .015 145);--secondary: oklch(.24 .015 145);--secondary-foreground: oklch(.8 .1 145);--muted: oklch(.24 .015 145);--muted-foreground: oklch(.62 .015 145);--accent: oklch(.24 .015 145);--accent-foreground: oklch(.8 .1 145);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.93 .01 145);--border: oklch(.28 .015 145);--input: oklch(.28 .015 145);--ring: oklch(.8 .1 145 / .3);--sidebar: oklch(.17 .015 145);--sidebar-foreground: oklch(.93 .01 145);--sidebar-primary: oklch(.8 .1 145);--sidebar-primary-foreground: oklch(.14 .015 145);--sidebar-accent: oklch(.23 .015 145);--sidebar-accent-foreground: oklch(.93 .01 145);--sidebar-border: oklch(.28 .015 145);--banner-info: oklch(.22 .04 240);--banner-info-foreground: oklch(.88 .05 240);--banner-info-border: oklch(.48 .16 240);--banner-note: oklch(.22 .05 145);--banner-note-foreground: oklch(.88 .06 145);--banner-note-border: oklch(.5 .12 145);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 145);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.8 .1 145);--checkbox-checked-foreground: oklch(.14 .015 145);--checkbox-unchecked-bg: oklch(.22 .01 145);--checkbox-unchecked-border: oklch(.38 .01 145)}[data-theme=dusk]{--background: oklch(.965 .006 295);--foreground: oklch(.2 .02 295);--card: oklch(.99 .004 295 / .85);--card-foreground: oklch(.2 .02 295);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 295);--primary: oklch(.3 .06 295);--primary-foreground: oklch(.98 .005 295);--secondary: oklch(.97 .005 295);--secondary-foreground: oklch(.3 .06 295);--muted: oklch(.94 .005 295);--muted-foreground: oklch(.52 .02 295);--accent: oklch(.92 .008 295);--accent-foreground: oklch(.3 .06 295);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.89 .006 295);--input: oklch(.89 .006 295);--ring: oklch(.3 .06 295 / .15);--sidebar: oklch(.97 .005 295);--sidebar-foreground: oklch(.25 .02 295);--sidebar-primary: oklch(.3 .06 295);--sidebar-primary-foreground: oklch(.98 .005 295);--sidebar-accent: oklch(.93 .008 295);--sidebar-accent-foreground: oklch(.25 .02 295);--sidebar-border: oklch(.91 .006 295);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 295);--banner-note-foreground: oklch(.24 .1 295);--banner-note-border: oklch(.48 .16 295);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .06 295);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.86 .008 295)}[data-theme=dusk].dark{--background: oklch(.17 .015 280);--foreground: oklch(.95 .005 295);--card: oklch(.22 .018 280 / .75);--card-foreground: oklch(.95 .005 295);--popover: oklch(.2 .015 280);--popover-foreground: oklch(.95 .005 295);--primary: oklch(.88 .08 295);--primary-foreground: oklch(.17 .015 280);--secondary: oklch(.27 .02 280);--secondary-foreground: oklch(.88 .08 295);--muted: oklch(.27 .02 280);--muted-foreground: oklch(.68 .015 295);--accent: oklch(.27 .02 280);--accent-foreground: oklch(.88 .08 295);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.95 .005 295);--border: oklch(.31 .02 280);--input: oklch(.31 .02 280);--ring: oklch(.88 .08 295 / .3);--sidebar: oklch(.2 .015 280);--sidebar-foreground: oklch(.95 .005 295);--sidebar-primary: oklch(.88 .08 295);--sidebar-primary-foreground: oklch(.17 .015 280);--sidebar-accent: oklch(.27 .02 280);--sidebar-accent-foreground: oklch(.95 .005 295);--sidebar-border: oklch(.31 .02 280);--banner-info: oklch(.22 .04 260);--banner-info-foreground: oklch(.88 .05 260);--banner-info-border: oklch(.48 .16 260);--banner-note: oklch(.22 .05 295);--banner-note-foreground: oklch(.88 .06 295);--banner-note-border: oklch(.5 .12 295);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.88 .08 295);--checkbox-checked-foreground: oklch(.17 .015 280);--checkbox-unchecked-bg: oklch(.24 .01 280);--checkbox-unchecked-border: oklch(.38 .01 280)}
+:root{--background: oklch(.992 .008 85);--foreground: oklch(.2 .01 85);--color-canopy: oklch(.16 .015 85);--color-hive: oklch(.68 .18 75);--color-parchment: oklch(.975 .006 85);--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.58 .18 70);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.58 .18 70);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(.97 .01 85);--accent-foreground: oklch(.58 .18 70);--destructive: oklch(.55 .19 15);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.58 .18 70 / .3);--sidebar: oklch(1 0 0);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.58 .18 70);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.96 .015 75);--sidebar-accent-foreground: oklch(.35 .1 70);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.58 .18 70);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}[data-theme=linen]{--background: oklch(.992 .008 85);--foreground: oklch(.2 .01 85);--color-canopy: oklch(.16 .015 85);--color-hive: oklch(.68 .18 75);--color-parchment: oklch(.975 .006 85);--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.58 .18 70);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.58 .18 70);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(.97 .01 85);--accent-foreground: oklch(.58 .18 70);--destructive: oklch(.55 .19 15);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.58 .18 70 / .3);--sidebar: oklch(1 0 0);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.58 .18 70);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.96 .015 75);--sidebar-accent-foreground: oklch(.35 .1 70);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.58 .18 70);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}:root.dark,[data-theme=linen].dark{--background: oklch(.14 .01 80);--foreground: oklch(.93 .01 85);--color-canopy: oklch(.09 .01 85);--color-hive: oklch(.78 .18 75);--color-parchment: oklch(.17 .012 80);--chart-1: oklch(.72 .2 142);--chart-2: oklch(.78 .18 72);--chart-3: oklch(.75 .2 38);--chart-4: oklch(.65 .22 25);--chart-5: oklch(.65 .22 264);--chart-6: oklch(.63 .22 290);--chart-7: oklch(.7 .2 314);--chart-8: oklch(.7 .2 340);--card: oklch(.19 .012 80 / .75);--card-foreground: oklch(.93 .01 85);--popover: oklch(.17 .01 80);--popover-foreground: oklch(.93 .01 85);--primary: oklch(.86 .05 85);--primary-foreground: oklch(.14 .01 80);--secondary: oklch(.24 .01 80);--secondary-foreground: oklch(.86 .05 85);--muted: oklch(.24 .01 80);--muted-foreground: oklch(.6 .01 85);--accent: oklch(.24 .01 80);--accent-foreground: oklch(.86 .05 85);--destructive: oklch(.48 .15 25);--destructive-foreground: oklch(.93 .01 85);--border: oklch(.28 .01 80);--input: oklch(.28 .01 80);--ring: oklch(.86 .05 85 / .3);--sidebar: oklch(.19 .012 80);--sidebar-foreground: oklch(.93 .01 85);--sidebar-primary: oklch(.86 .05 85);--sidebar-primary-foreground: oklch(.14 .01 80);--sidebar-accent: oklch(.23 .01 80);--sidebar-accent-foreground: oklch(.93 .01 85);--sidebar-border: oklch(.28 .01 80);--banner-info: oklch(.22 .04 230);--banner-info-foreground: oklch(.88 .05 230);--banner-info-border: oklch(.48 .16 235);--banner-note: oklch(.22 .04 155);--banner-note-foreground: oklch(.88 .06 155);--banner-note-border: oklch(.44 .1 155);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.44 .12 150);--badge-success-foreground: oklch(.93 .01 85);--checkbox-checked: oklch(.86 .05 85);--checkbox-checked-foreground: oklch(.14 .01 80);--checkbox-unchecked-bg: oklch(.22 .01 80);--checkbox-unchecked-border: oklch(.35 .01 80)}[data-theme=steel]{--background: oklch(.95 .015 250);--foreground: oklch(.2 .02 250);--color-canopy: #0f172a;--color-hive: #0ea5e9;--color-parchment: #f1f5f9;--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(.98 .005 250 / .85);--card-foreground: oklch(.2 .02 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 250);--primary: oklch(.3 .05 250);--primary-foreground: oklch(.98 .005 250);--secondary: oklch(.97 .005 250);--secondary-foreground: oklch(.3 .05 250);--muted: oklch(.93 .005 250);--muted-foreground: oklch(.5 .02 250);--accent: oklch(.91 .008 250);--accent-foreground: oklch(.3 .05 250);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.88 .005 250);--input: oklch(.88 .005 250);--ring: oklch(.3 .05 250 / .15);--sidebar: oklch(.98 .005 250);--sidebar-foreground: oklch(.25 .02 250);--sidebar-primary: oklch(.3 .05 250);--sidebar-primary-foreground: oklch(.98 .005 250);--sidebar-accent: oklch(.93 .008 250);--sidebar-accent-foreground: oklch(.25 .02 250);--sidebar-border: oklch(.9 .005 250);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 162);--banner-note-foreground: oklch(.24 .1 162);--banner-note-border: oklch(.48 .16 162);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .05 250);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.85 .01 250)}[data-theme=steel].dark{--background: oklch(.18 .02 225);--foreground: oklch(.985 0 0);--color-canopy: #020617;--color-hive: #38bdf8;--color-parchment: #0f172a;--chart-1: oklch(.72 .2 142);--chart-2: oklch(.78 .18 72);--chart-3: oklch(.75 .2 38);--chart-4: oklch(.65 .22 25);--chart-5: oklch(.65 .22 264);--chart-6: oklch(.63 .22 290);--chart-7: oklch(.7 .2 314);--chart-8: oklch(.7 .2 340);--card: oklch(.23 .025 225 / .75);--card-foreground: oklch(.985 0 0);--popover: oklch(.21 .02 225);--popover-foreground: oklch(.985 0 0);--primary: oklch(.9 .1 220);--primary-foreground: oklch(.18 .02 225);--secondary: oklch(.28 .025 225);--secondary-foreground: oklch(.9 .1 220);--muted: oklch(.28 .025 225);--muted-foreground: oklch(.705 .015 225);--accent: oklch(.28 .025 225);--accent-foreground: oklch(.9 .1 220);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.985 0 0);--border: oklch(.32 .025 225);--input: oklch(.32 .025 225);--ring: oklch(.9 .1 220 / .3);--sidebar: oklch(.23 .025 225);--sidebar-foreground: oklch(.985 0 0);--sidebar-primary: oklch(.9 .1 220);--sidebar-primary-foreground: oklch(.18 .02 225);--sidebar-accent: oklch(.28 .025 225);--sidebar-accent-foreground: oklch(.985 0 0);--sidebar-border: oklch(.32 .025 225);--banner-info: oklch(.274 .079 260);--banner-info-foreground: oklch(.925 .033 260);--banner-info-border: oklch(.488 .2 260);--banner-note: oklch(.266 .065 152);--banner-note-foreground: oklch(.962 .044 156);--banner-note-border: oklch(.45 .1 152);--banner-warning: oklch(.55 .22 100);--banner-warning-foreground: oklch(.99 .15 102);--banner-warning-border: oklch(.75 .25 100);--banner-alert: oklch(.293 .084 27);--banner-alert-foreground: oklch(.969 .071 27);--banner-alert-border: oklch(.45 .12 27);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.9 .1 220);--checkbox-checked-foreground: oklch(.18 .015 260);--checkbox-unchecked-bg: oklch(.25 .01 260);--checkbox-unchecked-border: oklch(.4 .01 260)}[data-theme=sage]{--background: oklch(.965 .015 145);--foreground: oklch(.18 .02 145);--color-canopy: oklch(.16 .04 145);--color-hive: oklch(.62 .2 145);--color-parchment: oklch(.975 .008 145);--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(.99 .004 145 / .75);--card-foreground: oklch(.18 .02 145);--popover: oklch(1 0 0);--popover-foreground: oklch(.18 .02 145);--primary: oklch(.25 .06 145);--primary-foreground: oklch(.97 .005 145);--secondary: oklch(.97 .006 145);--secondary-foreground: oklch(.25 .06 145);--muted: oklch(.94 .006 145);--muted-foreground: oklch(.5 .02 145);--accent: oklch(.92 .008 145);--accent-foreground: oklch(.25 .06 145);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.9 .006 145);--input: oklch(.9 .006 145);--ring: oklch(.25 .06 145 / .15);--sidebar: oklch(.99 .004 145);--sidebar-foreground: oklch(.22 .02 145);--sidebar-primary: oklch(.25 .06 145);--sidebar-primary-foreground: oklch(.97 .005 145);--sidebar-accent: oklch(.93 .008 145);--sidebar-accent-foreground: oklch(.22 .02 145);--sidebar-border: oklch(.91 .006 145);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.24 .09 240);--banner-info-border: oklch(.52 .18 240);--banner-note: oklch(.94 .02 145);--banner-note-foreground: oklch(.24 .1 145);--banner-note-border: oklch(.48 .16 145);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 145);--badge-success-foreground: oklch(.98 .01 145);--checkbox-checked: oklch(.25 .06 145);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.87 .008 145)}[data-theme=sage].dark{--background: oklch(.14 .015 145);--foreground: oklch(.93 .01 145);--color-canopy: oklch(.09 .02 145);--color-hive: oklch(.75 .2 145);--color-parchment: oklch(.17 .018 145);--chart-1: oklch(.72 .2 142);--chart-2: oklch(.78 .18 72);--chart-3: oklch(.75 .2 38);--chart-4: oklch(.65 .22 25);--chart-5: oklch(.65 .22 264);--chart-6: oklch(.63 .22 290);--chart-7: oklch(.7 .2 314);--chart-8: oklch(.7 .2 340);--card: oklch(.19 .018 145 / .75);--card-foreground: oklch(.93 .01 145);--popover: oklch(.17 .015 145);--popover-foreground: oklch(.93 .01 145);--primary: oklch(.8 .1 145);--primary-foreground: oklch(.14 .015 145);--secondary: oklch(.24 .015 145);--secondary-foreground: oklch(.8 .1 145);--muted: oklch(.24 .015 145);--muted-foreground: oklch(.62 .015 145);--accent: oklch(.24 .015 145);--accent-foreground: oklch(.8 .1 145);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.93 .01 145);--border: oklch(.28 .015 145);--input: oklch(.28 .015 145);--ring: oklch(.8 .1 145 / .3);--sidebar: oklch(.19 .018 145);--sidebar-foreground: oklch(.93 .01 145);--sidebar-primary: oklch(.8 .1 145);--sidebar-primary-foreground: oklch(.14 .015 145);--sidebar-accent: oklch(.23 .015 145);--sidebar-accent-foreground: oklch(.93 .01 145);--sidebar-border: oklch(.28 .015 145);--banner-info: oklch(.22 .04 240);--banner-info-foreground: oklch(.88 .05 240);--banner-info-border: oklch(.48 .16 240);--banner-note: oklch(.22 .05 145);--banner-note-foreground: oklch(.88 .06 145);--banner-note-border: oklch(.5 .12 145);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 145);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.8 .1 145);--checkbox-checked-foreground: oklch(.14 .015 145);--checkbox-unchecked-bg: oklch(.22 .01 145);--checkbox-unchecked-border: oklch(.38 .01 145)}[data-theme=dusk]{--background: oklch(.965 .015 295);--foreground: oklch(.2 .02 295);--color-canopy: oklch(.16 .04 285);--color-hive: oklch(.62 .2 285);--color-parchment: oklch(.975 .006 285);--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(.99 .004 295 / .85);--card-foreground: oklch(.2 .02 295);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 295);--primary: oklch(.3 .06 295);--primary-foreground: oklch(.98 .005 295);--secondary: oklch(.97 .005 295);--secondary-foreground: oklch(.3 .06 295);--muted: oklch(.94 .005 295);--muted-foreground: oklch(.52 .02 295);--accent: oklch(.92 .008 295);--accent-foreground: oklch(.3 .06 295);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.89 .006 295);--input: oklch(.89 .006 295);--ring: oklch(.3 .06 295 / .15);--sidebar: oklch(.99 .004 295);--sidebar-foreground: oklch(.25 .02 295);--sidebar-primary: oklch(.3 .06 295);--sidebar-primary-foreground: oklch(.98 .005 295);--sidebar-accent: oklch(.93 .008 295);--sidebar-accent-foreground: oklch(.25 .02 295);--sidebar-border: oklch(.91 .006 295);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 295);--banner-note-foreground: oklch(.24 .1 295);--banner-note-border: oklch(.48 .16 295);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .06 295);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.86 .008 295)}[data-theme=dusk].dark{--background: oklch(.17 .02 305);--foreground: oklch(.95 .005 310);--color-canopy: oklch(.09 .02 305);--color-hive: oklch(.78 .2 305);--color-parchment: oklch(.17 .018 305);--chart-1: oklch(.72 .2 142);--chart-2: oklch(.78 .18 72);--chart-3: oklch(.75 .2 38);--chart-4: oklch(.65 .22 25);--chart-5: oklch(.65 .22 264);--chart-6: oklch(.63 .22 290);--chart-7: oklch(.7 .2 314);--chart-8: oklch(.7 .2 340);--card: oklch(.22 .025 305 / .75);--card-foreground: oklch(.95 .005 310);--popover: oklch(.2 .02 305);--popover-foreground: oklch(.95 .005 310);--primary: oklch(.88 .1 305);--primary-foreground: oklch(.17 .02 305);--secondary: oklch(.27 .025 305);--secondary-foreground: oklch(.88 .1 305);--muted: oklch(.27 .025 305);--muted-foreground: oklch(.68 .015 305);--accent: oklch(.27 .025 305);--accent-foreground: oklch(.88 .1 305);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.95 .005 310);--border: oklch(.31 .025 305);--input: oklch(.31 .025 305);--ring: oklch(.88 .1 305 / .3);--sidebar: oklch(.22 .025 305);--sidebar-foreground: oklch(.95 .005 310);--sidebar-primary: oklch(.88 .1 305);--sidebar-primary-foreground: oklch(.17 .02 305);--sidebar-accent: oklch(.27 .025 305);--sidebar-accent-foreground: oklch(.95 .005 310);--sidebar-border: oklch(.31 .025 305);--banner-info: oklch(.22 .04 260);--banner-info-foreground: oklch(.88 .05 260);--banner-info-border: oklch(.48 .16 260);--banner-note: oklch(.22 .05 295);--banner-note-foreground: oklch(.88 .06 295);--banner-note-border: oklch(.5 .12 295);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.88 .08 295);--checkbox-checked-foreground: oklch(.17 .015 280);--checkbox-unchecked-bg: oklch(.24 .01 280);--checkbox-unchecked-border: oklch(.38 .01 280)}[data-theme=canopy]{--background: oklch(.97 .008 210);--foreground: oklch(.16 .035 225);--color-canopy: #0f172a;--color-hive: #0ea5e9;--color-parchment: #f1f5f9;--chart-1: oklch(.65 .18 142);--chart-2: oklch(.72 .17 72);--chart-3: oklch(.69 .19 38);--chart-4: oklch(.55 .2 25);--chart-5: oklch(.57 .22 264);--chart-6: oklch(.55 .22 290);--chart-7: oklch(.62 .2 314);--chart-8: oklch(.62 .2 340);--card: oklch(1 0 0 / .85);--card-foreground: oklch(.16 .035 225);--popover: oklch(1 0 0);--popover-foreground: oklch(.16 .035 225);--primary: oklch(.62 .18 210);--primary-foreground: oklch(1 0 0);--secondary: oklch(.93 .01 210);--secondary-foreground: oklch(.62 .18 210);--muted: oklch(.93 .01 210);--muted-foreground: oklch(.5 .02 210);--accent: oklch(.93 .01 210);--accent-foreground: oklch(.62 .18 210);--destructive: oklch(.55 .19 15);--destructive-foreground: oklch(1 0 0);--border: oklch(.88 .008 210);--input: oklch(.88 .008 210);--ring: oklch(.62 .18 210 / .3);--sidebar: oklch(1 0 0);--sidebar-foreground: oklch(.16 .035 225);--sidebar-primary: oklch(.62 .18 210);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.93 .01 210);--sidebar-accent-foreground: oklch(.16 .035 225);--sidebar-border: oklch(.88 .008 210);--banner-info: oklch(.94 .02 210);--banner-info-foreground: oklch(.24 .09 210);--banner-info-border: oklch(.52 .18 210);--banner-note: oklch(.94 .02 162);--banner-note-foreground: oklch(.24 .1 162);--banner-note-border: oklch(.48 .16 162);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.62 .18 210);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.85 .01 210)}[data-theme=canopy].dark{--background: oklch(.14 .03 240);--foreground: oklch(.95 .005 210);--color-canopy: #020617;--color-hive: #38bdf8;--color-parchment: #0f172a;--chart-1: oklch(.72 .2 142);--chart-2: oklch(.78 .18 72);--chart-3: oklch(.75 .2 38);--chart-4: oklch(.65 .22 25);--chart-5: oklch(.65 .22 264);--chart-6: oklch(.63 .22 290);--chart-7: oklch(.7 .2 314);--chart-8: oklch(.7 .2 340);--card: oklch(.19 .035 235 / .75);--card-foreground: oklch(.95 .005 210);--popover: oklch(.17 .03 240);--popover-foreground: oklch(.95 .005 210);--primary: oklch(.72 .18 210);--primary-foreground: oklch(.14 .03 240);--secondary: oklch(.24 .035 235);--secondary-foreground: oklch(.72 .18 210);--muted: oklch(.24 .035 235);--muted-foreground: oklch(.65 .015 210);--accent: oklch(.24 .035 235);--accent-foreground: oklch(.72 .18 210);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.95 .005 210);--border: oklch(.28 .035 235);--input: oklch(.28 .035 235);--ring: oklch(.72 .18 210 / .3);--sidebar: oklch(.19 .035 235);--sidebar-foreground: oklch(.95 .005 210);--sidebar-primary: oklch(.72 .18 210);--sidebar-primary-foreground: oklch(.14 .03 240);--sidebar-accent: oklch(.24 .035 235);--sidebar-accent-foreground: oklch(.95 .005 210);--sidebar-border: oklch(.28 .035 235);--banner-info: oklch(.22 .04 220);--banner-info-foreground: oklch(.88 .05 220);--banner-info-border: oklch(.48 .16 220);--banner-note: oklch(.22 .05 155);--banner-note-foreground: oklch(.88 .06 155);--banner-note-border: oklch(.5 .12 155);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.72 .18 210);--checkbox-checked-foreground: oklch(.14 .03 240);--checkbox-unchecked-bg: oklch(.22 .01 235);--checkbox-unchecked-border: oklch(.38 .01 235)}

package/dist/shared/Input.js

@@ -1,14 +1,14 @@
 import { jsx as t } from "react/jsx-runtime";
 import "react";
-import { c as n } from "./utils.js";
-function s({ className: e, type: i, ...r }) {
+import { c as o } from "./utils.js";
+function l({ className: e, type: i, ...r }) {
   return /* @__PURE__ */ t(
     "input",
     {
       type: i,
       "data-slot": "input",
-      className: n(
-        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+      className: o(
+        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground border-input h-9 w-full min-w-0 rounded border bg-card px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
         "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
         e
@@ -18,6 +18,6 @@ function s({ className: e, type: i, ...r }) {
   );
 }
 export {
-  s as I
+  l as I
 };
 //# sourceMappingURL=Input.js.map

package/dist/shared/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@/utils\"\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n\treturn (\n\t\t<input\n\t\t\ttype={type}\n\t\t\tdata-slot=\"input\"\n\t\t\tclassName={cn(\n\t\t\t\t\"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n\t\t\t\t\"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]\",\n\t\t\t\t\"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Input }\n"],"names":["Input","className","type","props","jsx","cn"],"mappings":";;;AAIA,SAASA,EAAM,EAAE,WAAAC,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AAC5E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,MAAAF;AAAA,MACA,aAAU;AAAA,MACV,WAAWG;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACAJ;AAAA,MAAA;AAAA,MAEA,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Input.js","sources":["../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@/utils\"\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n\treturn (\n\t\t<input\n\t\t\ttype={type}\n\t\t\tdata-slot=\"input\"\n\t\t\tclassName={cn(\n\t\t\t\t\"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground border-input h-9 w-full min-w-0 rounded border bg-card px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n\t\t\t\t\"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]\",\n\t\t\t\t\"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Input }\n"],"names":["Input","className","type","props","jsx","cn"],"mappings":";;;AAIA,SAASA,EAAM,EAAE,WAAAC,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AAC5E,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,MAAAF;AAAA,MACA,aAAU;AAAA,MACV,WAAWG;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACAJ;AAAA,MAAA;AAAA,MAEA,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/shared/Select.js

@@ -1,6 +1,6 @@
 import { jsx as r } from "react/jsx-runtime";
 import "react";
-import { c as s } from "./utils.js";
+import { c as i } from "./utils.js";
 function l({
   className: e,
   ...o
@@ -9,8 +9,8 @@ function l({
     "select",
     {
       "data-slot": "select",
-      className: s(
-        "flex h-9 w-full rounded border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors outline-none",
+      className: i(
+        "flex h-9 w-full rounded border border-input bg-card px-3 py-1 text-sm shadow-xs transition-colors outline-none",
         "focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring",
         "disabled:pointer-events-none disabled:opacity-50",
         e

package/dist/shared/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\n/** Native select styled to match design-system Input (form control). */\nexport function Select({\n\tclassName,\n\t...props\n}: React.ComponentProps<'select'>) {\n\treturn (\n\t\t<select\n\t\t\tdata-slot=\"select\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex h-9 w-full rounded border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors outline-none',\n\t\t\t\t'focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring',\n\t\t\t\t'disabled:pointer-events-none disabled:opacity-50',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Select","className","props","jsx","cn"],"mappings":";;;AAKO,SAASA,EAAO;AAAA,EACtB,WAAAC;AAAA,EACA,GAAGC;AACJ,GAAmC;AAClC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Select.js","sources":["../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/utils'\n\n/** Native select styled to match design-system Input (form control). */\nexport function Select({\n\tclassName,\n\t...props\n}: React.ComponentProps<'select'>) {\n\treturn (\n\t\t<select\n\t\t\tdata-slot=\"select\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex h-9 w-full rounded border border-input bg-card px-3 py-1 text-sm shadow-xs transition-colors outline-none',\n\t\t\t\t'focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring',\n\t\t\t\t'disabled:pointer-events-none disabled:opacity-50',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],"names":["Select","className","props","jsx","cn"],"mappings":";;;AAKO,SAASA,EAAO;AAAA,EACtB,WAAAC;AAAA,EACA,GAAGC;AACJ,GAAmC;AAClC,SACC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAWC;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACAH;AAAA,MAAA;AAAA,MAEA,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/themes/ThemeProvider.d.ts

@@ -3,8 +3,9 @@ import './linen.css';
 import './steel.css';
 import './sage.css';
 import './dusk.css';
+import './canopy.css';
 export type Theme = 'light' | 'dark' | 'system';
-export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk';
+export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk' | 'canopy';
 export declare function ThemeProvider({ children, defaultColorTheme, }: {
     children: ReactNode;
     defaultColorTheme?: ColorTheme;

package/dist/themes/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/themes/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,OAAO,aAAa,CAAA;AACpB,OAAO,aAAa,CAAA;AACpB,OAAO,YAAY,CAAA;AACnB,OAAO,YAAY,CAAA;AAEnB,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;AAiC5D,wBAAgB,aAAa,CAAC,EAC7B,QAAQ,EACR,iBAA2B,GAC3B,EAAE;IACF,QAAQ,EAAE,SAAS,CAAA;IACnB,iBAAiB,CAAC,EAAE,UAAU,CAAA;CAC9B,2CA8CA"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/themes/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,OAAO,aAAa,CAAA;AACpB,OAAO,aAAa,CAAA;AACpB,OAAO,YAAY,CAAA;AACnB,OAAO,YAAY,CAAA;AACnB,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAA;AAiCvE,wBAAgB,aAAa,CAAC,EAC7B,QAAQ,EACR,iBAA2B,GAC3B,EAAE;IACF,QAAQ,EAAE,SAAS,CAAA;IACnB,iBAAiB,CAAC,EAAE,UAAU,CAAA;CAC9B,2CA8CA"}

package/dist/themes.js

@@ -1,6 +1,6 @@
 import { jsx as S } from "react/jsx-runtime";
-import { useState as m, useEffect as a, useCallback as l, useMemo as E } from "react";
-import { T as y } from "./shared/useTheme.js";
+import { useState as m, useEffect as a, useCallback as l, useMemo as y } from "react";
+import { T as E } from "./shared/useTheme.js";
 import { u as b } from "./shared/useTheme.js";
 const u = "theme", h = "color-theme";
 function v() {
@@ -11,7 +11,7 @@ function v() {
 function w(e) {
   if (typeof window > "u") return e;
   const t = localStorage.getItem(h);
-  return t === "linen" || t === "steel" || t === "sage" || t === "dusk" ? t : e;
+  return t === "linen" || t === "steel" || t === "sage" || t === "dusk" || t === "canopy" ? t : e;
 }
 function C(e) {
   const t = document.documentElement;
@@ -26,27 +26,27 @@ function _({
 }) {
   const [r, f] = m(v), [s, T] = m(
     () => w(t)
-  ), [g, p] = m(
+  ), [p, g] = m(
     () => window.matchMedia("(prefers-color-scheme: dark)").matches
-  ), n = r === "system" ? g ? "dark" : "light" : r;
+  ), n = r === "system" ? p ? "dark" : "light" : r;
   a(() => {
     C(n);
   }, [n]), a(() => {
     L(s);
   }, [s]), a(() => {
     if (r !== "system") return;
-    const o = window.matchMedia("(prefers-color-scheme: dark)"), i = () => p(o.matches);
+    const o = window.matchMedia("(prefers-color-scheme: dark)"), i = () => g(o.matches);
     return o.addEventListener("change", i), () => o.removeEventListener("change", i);
   }, [r]);
   const c = l((o) => {
     f(o), localStorage.setItem(u, o);
   }, []), d = l((o) => {
     T(o), localStorage.setItem(h, o);
-  }, []), k = E(
+  }, []), k = y(
     () => ({ theme: r, setTheme: c, effectiveTheme: n, colorTheme: s, setColorTheme: d }),
     [r, c, n, s, d]
   );
-  return /* @__PURE__ */ S(y.Provider, { value: k, children: e });
+  return /* @__PURE__ */ S(E.Provider, { value: k, children: e });
 }
 export {
   _ as ThemeProvider,

package/dist/themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"themes.js","sources":["../src/themes/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ThemeContext } from './ThemeContext'\nimport './linen.css'\nimport './steel.css'\nimport './sage.css'\nimport './dusk.css'\n\nexport type Theme = 'light' | 'dark' | 'system'\nexport type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk'\n\nconst STORAGE_KEY = 'theme'\nconst COLOR_THEME_STORAGE_KEY = 'color-theme'\n\nfunction getStoredTheme(): Theme {\n\tif (typeof window === 'undefined') return 'system'\n\tconst stored = localStorage.getItem(STORAGE_KEY)\n\tif (stored === 'light' || stored === 'dark' || stored === 'system')\n\t\treturn stored\n\treturn 'dark'\n}\n\nfunction getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {\n\tif (typeof window === 'undefined') return defaultColorTheme\n\tconst stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)\n\tif (stored === 'linen' || stored === 'steel' || stored === 'sage' || stored === 'dusk') return stored\n\treturn defaultColorTheme\n}\n\nfunction applyTheme(effective: 'light' | 'dark') {\n\tconst root = document.documentElement\n\tif (effective === 'dark') {\n\t\troot.classList.add('dark')\n\t} else {\n\t\troot.classList.remove('dark')\n\t}\n}\n\nfunction applyColorTheme(colorTheme: ColorTheme) {\n\tdocument.documentElement.setAttribute('data-theme', colorTheme)\n}\n\nexport function ThemeProvider({\n\tchildren,\n\tdefaultColorTheme = 'steel',\n}: {\n\tchildren: ReactNode\n\tdefaultColorTheme?: ColorTheme\n}) {\n\tconst [theme, setThemeState] = useState<Theme>(getStoredTheme)\n\tconst [colorTheme, setColorThemeState] = useState<ColorTheme>(() =>\n\t\tgetStoredColorTheme(defaultColorTheme),\n\t)\n\tconst [systemDark, setSystemDark] = useState(\n\t\t() => window.matchMedia('(prefers-color-scheme: dark)').matches,\n\t)\n\n\tconst effectiveTheme: 'light' | 'dark' =\n\t\ttheme === 'system' ? (systemDark ? 'dark' : 'light') : theme\n\n\tuseEffect(() => {\n\t\tapplyTheme(effectiveTheme)\n\t}, [effectiveTheme])\n\n\tuseEffect(() => {\n\t\tapplyColorTheme(colorTheme)\n\t}, [colorTheme])\n\n\tuseEffect(() => {\n\t\tif (theme !== 'system') return\n\t\tconst media = window.matchMedia('(prefers-color-scheme: dark)')\n\t\tconst handler = () => setSystemDark(media.matches)\n\t\tmedia.addEventListener('change', handler)\n\t\treturn () => media.removeEventListener('change', handler)\n\t}, [theme])\n\n\tconst setTheme = useCallback((next: Theme) => {\n\t\tsetThemeState(next)\n\t\tlocalStorage.setItem(STORAGE_KEY, next)\n\t}, [])\n\n\tconst setColorTheme = useCallback((next: ColorTheme) => {\n\t\tsetColorThemeState(next)\n\t\tlocalStorage.setItem(COLOR_THEME_STORAGE_KEY, next)\n\t}, [])\n\n\tconst value = useMemo(\n\t\t() => ({ theme, setTheme, effectiveTheme, colorTheme, setColorTheme }),\n\t\t[theme, setTheme, effectiveTheme, colorTheme, setColorTheme],\n\t)\n\n\treturn (\n\t\t<ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n\t)\n}\n"],"names":["STORAGE_KEY","COLOR_THEME_STORAGE_KEY","getStoredTheme","stored","getStoredColorTheme","defaultColorTheme","applyTheme","effective","root","applyColorTheme","colorTheme","ThemeProvider","children","theme","setThemeState","useState","setColorThemeState","systemDark","setSystemDark","effectiveTheme","useEffect","media","handler","setTheme","useCallback","next","setColorTheme","value","useMemo","jsx","ThemeContext"],"mappings":";;;;AAWA,MAAMA,IAAc,SACdC,IAA0B;AAEhC,SAASC,IAAwB;AAChC,MAAI,OAAO,SAAW,IAAa,QAAO;AAC1C,QAAMC,IAAS,aAAa,QAAQH,CAAW;AAC/C,SAAIG,MAAW,WAAWA,MAAW,UAAUA,MAAW,WAClDA,IACD;AACR;AAEA,SAASC,EAAoBC,GAA2C;AACvE,MAAI,OAAO,SAAW,IAAa,QAAOA;AAC1C,QAAMF,IAAS,aAAa,QAAQF,CAAuB;AAC3D,SAAIE,MAAW,WAAWA,MAAW,WAAWA,MAAW,UAAUA,MAAW,SAAeA,IACxFE;AACR;AAEA,SAASC,EAAWC,GAA6B;AAChD,QAAMC,IAAO,SAAS;AACtB,EAAID,MAAc,SACjBC,EAAK,UAAU,IAAI,MAAM,IAEzBA,EAAK,UAAU,OAAO,MAAM;AAE9B;AAEA,SAASC,EAAgBC,GAAwB;AAChD,WAAS,gBAAgB,aAAa,cAAcA,CAAU;AAC/D;AAEO,SAASC,EAAc;AAAA,EAC7B,UAAAC;AAAA,EACA,mBAAAP,IAAoB;AACrB,GAGG;AACF,QAAM,CAACQ,GAAOC,CAAa,IAAIC,EAAgBb,CAAc,GACvD,CAACQ,GAAYM,CAAkB,IAAID;AAAA,IAAqB,MAC7DX,EAAoBC,CAAiB;AAAA,EAAA,GAEhC,CAACY,GAAYC,CAAa,IAAIH;AAAA,IACnC,MAAM,OAAO,WAAW,8BAA8B,EAAE;AAAA,EAAA,GAGnDI,IACLN,MAAU,WAAYI,IAAa,SAAS,UAAWJ;AAExD,EAAAO,EAAU,MAAM;AACf,IAAAd,EAAWa,CAAc;AAAA,EAC1B,GAAG,CAACA,CAAc,CAAC,GAEnBC,EAAU,MAAM;AACf,IAAAX,EAAgBC,CAAU;AAAA,EAC3B,GAAG,CAACA,CAAU,CAAC,GAEfU,EAAU,MAAM;AACf,QAAIP,MAAU,SAAU;AACxB,UAAMQ,IAAQ,OAAO,WAAW,8BAA8B,GACxDC,IAAU,MAAMJ,EAAcG,EAAM,OAAO;AACjD,WAAAA,EAAM,iBAAiB,UAAUC,CAAO,GACjC,MAAMD,EAAM,oBAAoB,UAAUC,CAAO;AAAA,EACzD,GAAG,CAACT,CAAK,CAAC;AAEV,QAAMU,IAAWC,EAAY,CAACC,MAAgB;AAC7C,IAAAX,EAAcW,CAAI,GAClB,aAAa,QAAQzB,GAAayB,CAAI;AAAA,EACvC,GAAG,CAAA,CAAE,GAECC,IAAgBF,EAAY,CAACC,MAAqB;AACvD,IAAAT,EAAmBS,CAAI,GACvB,aAAa,QAAQxB,GAAyBwB,CAAI;AAAA,EACnD,GAAG,CAAA,CAAE,GAECE,IAAQC;AAAA,IACb,OAAO,EAAE,OAAAf,GAAO,UAAAU,GAAU,gBAAAJ,GAAgB,YAAAT,GAAY,eAAAgB,EAAA;AAAA,IACtD,CAACb,GAAOU,GAAUJ,GAAgBT,GAAYgB,CAAa;AAAA,EAAA;AAG5D,SACC,gBAAAG,EAACC,EAAa,UAAb,EAAsB,OAAAH,GAAe,UAAAf,EAAA,CAAS;AAEjD;"}
+{"version":3,"file":"themes.js","sources":["../src/themes/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ThemeContext } from './ThemeContext'\nimport './linen.css'\nimport './steel.css'\nimport './sage.css'\nimport './dusk.css'\nimport './canopy.css'\n\nexport type Theme = 'light' | 'dark' | 'system'\nexport type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk' | 'canopy'\n\nconst STORAGE_KEY = 'theme'\nconst COLOR_THEME_STORAGE_KEY = 'color-theme'\n\nfunction getStoredTheme(): Theme {\n\tif (typeof window === 'undefined') return 'system'\n\tconst stored = localStorage.getItem(STORAGE_KEY)\n\tif (stored === 'light' || stored === 'dark' || stored === 'system')\n\t\treturn stored\n\treturn 'dark'\n}\n\nfunction getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {\n\tif (typeof window === 'undefined') return defaultColorTheme\n\tconst stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)\n\tif (stored === 'linen' || stored === 'steel' || stored === 'sage' || stored === 'dusk' || stored === 'canopy') return stored\n\treturn defaultColorTheme\n}\n\nfunction applyTheme(effective: 'light' | 'dark') {\n\tconst root = document.documentElement\n\tif (effective === 'dark') {\n\t\troot.classList.add('dark')\n\t} else {\n\t\troot.classList.remove('dark')\n\t}\n}\n\nfunction applyColorTheme(colorTheme: ColorTheme) {\n\tdocument.documentElement.setAttribute('data-theme', colorTheme)\n}\n\nexport function ThemeProvider({\n\tchildren,\n\tdefaultColorTheme = 'steel',\n}: {\n\tchildren: ReactNode\n\tdefaultColorTheme?: ColorTheme\n}) {\n\tconst [theme, setThemeState] = useState<Theme>(getStoredTheme)\n\tconst [colorTheme, setColorThemeState] = useState<ColorTheme>(() =>\n\t\tgetStoredColorTheme(defaultColorTheme),\n\t)\n\tconst [systemDark, setSystemDark] = useState(\n\t\t() => window.matchMedia('(prefers-color-scheme: dark)').matches,\n\t)\n\n\tconst effectiveTheme: 'light' | 'dark' =\n\t\ttheme === 'system' ? (systemDark ? 'dark' : 'light') : theme\n\n\tuseEffect(() => {\n\t\tapplyTheme(effectiveTheme)\n\t}, [effectiveTheme])\n\n\tuseEffect(() => {\n\t\tapplyColorTheme(colorTheme)\n\t}, [colorTheme])\n\n\tuseEffect(() => {\n\t\tif (theme !== 'system') return\n\t\tconst media = window.matchMedia('(prefers-color-scheme: dark)')\n\t\tconst handler = () => setSystemDark(media.matches)\n\t\tmedia.addEventListener('change', handler)\n\t\treturn () => media.removeEventListener('change', handler)\n\t}, [theme])\n\n\tconst setTheme = useCallback((next: Theme) => {\n\t\tsetThemeState(next)\n\t\tlocalStorage.setItem(STORAGE_KEY, next)\n\t}, [])\n\n\tconst setColorTheme = useCallback((next: ColorTheme) => {\n\t\tsetColorThemeState(next)\n\t\tlocalStorage.setItem(COLOR_THEME_STORAGE_KEY, next)\n\t}, [])\n\n\tconst value = useMemo(\n\t\t() => ({ theme, setTheme, effectiveTheme, colorTheme, setColorTheme }),\n\t\t[theme, setTheme, effectiveTheme, colorTheme, setColorTheme],\n\t)\n\n\treturn (\n\t\t<ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n\t)\n}\n"],"names":["STORAGE_KEY","COLOR_THEME_STORAGE_KEY","getStoredTheme","stored","getStoredColorTheme","defaultColorTheme","applyTheme","effective","root","applyColorTheme","colorTheme","ThemeProvider","children","theme","setThemeState","useState","setColorThemeState","systemDark","setSystemDark","effectiveTheme","useEffect","media","handler","setTheme","useCallback","next","setColorTheme","value","useMemo","jsx","ThemeContext"],"mappings":";;;;AAYA,MAAMA,IAAc,SACdC,IAA0B;AAEhC,SAASC,IAAwB;AAChC,MAAI,OAAO,SAAW,IAAa,QAAO;AAC1C,QAAMC,IAAS,aAAa,QAAQH,CAAW;AAC/C,SAAIG,MAAW,WAAWA,MAAW,UAAUA,MAAW,WAClDA,IACD;AACR;AAEA,SAASC,EAAoBC,GAA2C;AACvE,MAAI,OAAO,SAAW,IAAa,QAAOA;AAC1C,QAAMF,IAAS,aAAa,QAAQF,CAAuB;AAC3D,SAAIE,MAAW,WAAWA,MAAW,WAAWA,MAAW,UAAUA,MAAW,UAAUA,MAAW,WAAiBA,IAC/GE;AACR;AAEA,SAASC,EAAWC,GAA6B;AAChD,QAAMC,IAAO,SAAS;AACtB,EAAID,MAAc,SACjBC,EAAK,UAAU,IAAI,MAAM,IAEzBA,EAAK,UAAU,OAAO,MAAM;AAE9B;AAEA,SAASC,EAAgBC,GAAwB;AAChD,WAAS,gBAAgB,aAAa,cAAcA,CAAU;AAC/D;AAEO,SAASC,EAAc;AAAA,EAC7B,UAAAC;AAAA,EACA,mBAAAP,IAAoB;AACrB,GAGG;AACF,QAAM,CAACQ,GAAOC,CAAa,IAAIC,EAAgBb,CAAc,GACvD,CAACQ,GAAYM,CAAkB,IAAID;AAAA,IAAqB,MAC7DX,EAAoBC,CAAiB;AAAA,EAAA,GAEhC,CAACY,GAAYC,CAAa,IAAIH;AAAA,IACnC,MAAM,OAAO,WAAW,8BAA8B,EAAE;AAAA,EAAA,GAGnDI,IACLN,MAAU,WAAYI,IAAa,SAAS,UAAWJ;AAExD,EAAAO,EAAU,MAAM;AACf,IAAAd,EAAWa,CAAc;AAAA,EAC1B,GAAG,CAACA,CAAc,CAAC,GAEnBC,EAAU,MAAM;AACf,IAAAX,EAAgBC,CAAU;AAAA,EAC3B,GAAG,CAACA,CAAU,CAAC,GAEfU,EAAU,MAAM;AACf,QAAIP,MAAU,SAAU;AACxB,UAAMQ,IAAQ,OAAO,WAAW,8BAA8B,GACxDC,IAAU,MAAMJ,EAAcG,EAAM,OAAO;AACjD,WAAAA,EAAM,iBAAiB,UAAUC,CAAO,GACjC,MAAMD,EAAM,oBAAoB,UAAUC,CAAO;AAAA,EACzD,GAAG,CAACT,CAAK,CAAC;AAEV,QAAMU,IAAWC,EAAY,CAACC,MAAgB;AAC7C,IAAAX,EAAcW,CAAI,GAClB,aAAa,QAAQzB,GAAayB,CAAI;AAAA,EACvC,GAAG,CAAA,CAAE,GAECC,IAAgBF,EAAY,CAACC,MAAqB;AACvD,IAAAT,EAAmBS,CAAI,GACvB,aAAa,QAAQxB,GAAyBwB,CAAI;AAAA,EACnD,GAAG,CAAA,CAAE,GAECE,IAAQC;AAAA,IACb,OAAO,EAAE,OAAAf,GAAO,UAAAU,GAAU,gBAAAJ,GAAgB,YAAAT,GAAY,eAAAgB,EAAA;AAAA,IACtD,CAACb,GAAOU,GAAUJ,GAAgBT,GAAYgB,CAAa;AAAA,EAAA;AAG5D,SACC,gBAAAG,EAACC,EAAa,UAAb,EAAsB,OAAAH,GAAe,UAAAf,EAAA,CAAS;AAEjD;"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@abumble/design-system",
-	"version": "0.0.47",
+	"version": "0.0.48",
 	"files": [
 		"dist",
 		"src/styles.css",

package/src/styles.css

@@ -119,7 +119,7 @@
 }
 
 .sidebar {
-	@apply text-sidebar-foreground;
+	@apply bg-sidebar text-sidebar-foreground;
 }
 
 .header {

package/src/themes/ThemeProvider.tsx

@@ -5,9 +5,10 @@ import './linen.css'
 import './steel.css'
 import './sage.css'
 import './dusk.css'
+import './canopy.css'
 
 export type Theme = 'light' | 'dark' | 'system'
-export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk'
+export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk' | 'canopy'
 
 const STORAGE_KEY = 'theme'
 const COLOR_THEME_STORAGE_KEY = 'color-theme'
@@ -23,7 +24,7 @@ function getStoredTheme(): Theme {
 function getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {
 	if (typeof window === 'undefined') return defaultColorTheme
 	const stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)
-	if (stored === 'linen' || stored === 'steel' || stored === 'sage' || stored === 'dusk') return stored
+	if (stored === 'linen' || stored === 'steel' || stored === 'sage' || stored === 'dusk' || stored === 'canopy') return stored
 	return defaultColorTheme
 }
 

package/src/themes/canopy.css

@@ -0,0 +1,157 @@
+[data-theme="canopy"] {
+	/* --- Light Theme (Professional Navy & Sky — Product Dashboard) --- */
+	--background: oklch(0.97 0.008 210);
+	--foreground: oklch(0.16 0.035 225);
+
+	/* Brand palette */
+	--color-canopy: #0f172a;
+	--color-hive: #0ea5e9;
+	--color-parchment: #f1f5f9;
+
+	/* Chart palette */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
+	/* Surfaces */
+	--card: oklch(1 0 0 / 0.85);
+	--card-foreground: oklch(0.16 0.035 225);
+
+	--popover: oklch(1 0 0);
+	--popover-foreground: oklch(0.16 0.035 225);
+
+	/* Primary: Sky Blue */
+	--primary: oklch(0.62 0.18 210);
+	--primary-foreground: oklch(1 0 0);
+
+	--secondary: oklch(0.93 0.01 210);
+	--secondary-foreground: oklch(0.62 0.18 210);
+
+	--muted: oklch(0.93 0.01 210);
+	--muted-foreground: oklch(0.5 0.02 210);
+
+	--accent: oklch(0.93 0.01 210);
+	--accent-foreground: oklch(0.62 0.18 210);
+
+	--destructive: oklch(0.55 0.19 15);
+	--destructive-foreground: oklch(1 0 0);
+
+	--border: oklch(0.88 0.008 210);
+	--input: oklch(0.88 0.008 210);
+	--ring: oklch(0.62 0.18 210 / 0.3);
+
+	/* Sidebar (Elevated cool surface) */
+	--sidebar: oklch(1 0 0);
+	--sidebar-foreground: oklch(0.16 0.035 225);
+	--sidebar-primary: oklch(0.62 0.18 210);
+	--sidebar-primary-foreground: oklch(1 0 0);
+	--sidebar-accent: oklch(0.93 0.01 210);
+	--sidebar-accent-foreground: oklch(0.16 0.035 225);
+	--sidebar-border: oklch(0.88 0.008 210);
+
+	/* Banners */
+	--banner-info: oklch(0.94 0.02 210);
+	--banner-info-foreground: oklch(0.24 0.09 210);
+	--banner-info-border: oklch(0.52 0.18 210);
+	--banner-note: oklch(0.94 0.02 162);
+	--banner-note-foreground: oklch(0.24 0.1 162);
+	--banner-note-border: oklch(0.48 0.16 162);
+	--banner-warning: oklch(0.95 0.04 78);
+	--banner-warning-foreground: oklch(0.34 0.13 62);
+	--banner-warning-border: oklch(0.62 0.18 72);
+	--banner-alert: oklch(0.95 0.03 22);
+	--banner-alert-foreground: oklch(0.34 0.14 22);
+	--banner-alert-border: oklch(0.52 0.2 22);
+
+	/* Interactive Elements */
+	--badge-success: oklch(0.35 0.1 160);
+	--badge-success-foreground: oklch(0.98 0.01 160);
+	--checkbox-checked: oklch(0.62 0.18 210);
+	--checkbox-checked-foreground: oklch(1 0 0);
+	--checkbox-unchecked-bg: oklch(1 0 0);
+	--checkbox-unchecked-border: oklch(0.85 0.01 210);
+}
+
+[data-theme="canopy"].dark {
+	/* --- Dark Theme (Deep Slate & Sky Glow) --- */
+	--background: oklch(0.14 0.03 240);
+	--foreground: oklch(0.95 0.005 210);
+
+	/* Brand palette — dark */
+	--color-canopy: #020617;
+	--color-hive: #38bdf8;
+	--color-parchment: #0f172a;
+
+	/* Chart palette — dark */
+	--chart-1: oklch(0.72 0.2 142);
+	--chart-2: oklch(0.78 0.18 72);
+	--chart-3: oklch(0.75 0.2 38);
+	--chart-4: oklch(0.65 0.22 25);
+	--chart-5: oklch(0.65 0.22 264);
+	--chart-6: oklch(0.63 0.22 290);
+	--chart-7: oklch(0.7 0.2 314);
+	--chart-8: oklch(0.7 0.2 340);
+
+	/* Card Elevation */
+	--card: oklch(0.19 0.035 235 / 0.75);
+	--card-foreground: oklch(0.95 0.005 210);
+
+	--popover: oklch(0.17 0.03 240);
+	--popover-foreground: oklch(0.95 0.005 210);
+
+	/* Primary: Bright Sky Glow */
+	--primary: oklch(0.72 0.18 210);
+	--primary-foreground: oklch(0.14 0.03 240);
+
+	--secondary: oklch(0.24 0.035 235);
+	--secondary-foreground: oklch(0.72 0.18 210);
+
+	--muted: oklch(0.24 0.035 235);
+	--muted-foreground: oklch(0.65 0.015 210);
+
+	--accent: oklch(0.24 0.035 235);
+	--accent-foreground: oklch(0.72 0.18 210);
+
+	--destructive: oklch(0.45 0.15 25);
+	--destructive-foreground: oklch(0.95 0.005 210);
+
+	--border: oklch(0.28 0.035 235);
+	--input: oklch(0.28 0.035 235);
+	--ring: oklch(0.72 0.18 210 / 0.3);
+
+	/* Sidebar (Deep Slate) */
+	--sidebar: oklch(0.19 0.035 235);
+	--sidebar-foreground: oklch(0.95 0.005 210);
+	--sidebar-primary: oklch(0.72 0.18 210);
+	--sidebar-primary-foreground: oklch(0.14 0.03 240);
+	--sidebar-accent: oklch(0.24 0.035 235);
+	--sidebar-accent-foreground: oklch(0.95 0.005 210);
+	--sidebar-border: oklch(0.28 0.035 235);
+
+	/* Banners (Dark) */
+	--banner-info: oklch(0.22 0.04 220);
+	--banner-info-foreground: oklch(0.88 0.05 220);
+	--banner-info-border: oklch(0.48 0.16 220);
+	--banner-note: oklch(0.22 0.05 155);
+	--banner-note-foreground: oklch(0.88 0.06 155);
+	--banner-note-border: oklch(0.5 0.12 155);
+	--banner-warning: oklch(0.26 0.06 70);
+	--banner-warning-foreground: oklch(0.92 0.1 80);
+	--banner-warning-border: oklch(0.65 0.2 75);
+	--banner-alert: oklch(0.23 0.05 25);
+	--banner-alert-foreground: oklch(0.9 0.06 25);
+	--banner-alert-border: oklch(0.44 0.14 25);
+
+	/* Interactive Elements (Dark) */
+	--badge-success: oklch(0.48 0.15 150);
+	--badge-success-foreground: oklch(1 0 0);
+	--checkbox-checked: oklch(0.72 0.18 210);
+	--checkbox-checked-foreground: oklch(0.14 0.03 240);
+	--checkbox-unchecked-bg: oklch(0.22 0.01 235);
+	--checkbox-unchecked-border: oklch(0.38 0.01 235);
+}

package/src/themes/dusk.css

@@ -1,8 +1,23 @@
 [data-theme="dusk"] {
 	/* --- Light Theme (Creative, Sophisticated - Pale Lavender) --- */
-	--background: oklch(0.965 0.006 295);
+	--background: oklch(0.965 0.015 295);
 	--foreground: oklch(0.2 0.02 295);
 
+	/* Brand palette */
+	--color-canopy: oklch(0.16 0.04 285);
+	--color-hive: oklch(0.62 0.2 285);
+	--color-parchment: oklch(0.975 0.006 285);
+
+	/* Chart palette */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
 	/* Surfaces */
 	--card: oklch(0.99 0.004 295 / 0.85);
 	--card-foreground: oklch(0.2 0.02 295);
@@ -32,7 +47,7 @@
 	--ring: oklch(0.3 0.06 295 / 0.15);
 
 	/* Sidebar (Soft Lavender) */
-	--sidebar: oklch(0.97 0.005 295);
+	--sidebar: oklch(0.99 0.004 295);
 	--sidebar-foreground: oklch(0.25 0.02 295);
 	--sidebar-primary: oklch(0.3 0.06 295);
 	--sidebar-primary-foreground: oklch(0.98 0.005 295);
@@ -64,45 +79,60 @@
 }
 
 [data-theme="dusk"].dark {
-	/* --- Dark Theme (Deep Violet with Bright Lavender Glow) --- */
-	--background: oklch(0.17 0.015 280);
-	--foreground: oklch(0.95 0.005 295);
+	/* --- Dark Theme (Amethyst with Bright Purple Glow) --- */
+	--background: oklch(0.17 0.02 305);
+	--foreground: oklch(0.95 0.005 310);
+
+	/* Brand palette — dark */
+	--color-canopy: oklch(0.09 0.02 305);
+	--color-hive: oklch(0.78 0.2 305);
+	--color-parchment: oklch(0.17 0.018 305);
+
+	/* Chart palette — dark */
+	--chart-1: oklch(0.72 0.2 142);
+	--chart-2: oklch(0.78 0.18 72);
+	--chart-3: oklch(0.75 0.2 38);
+	--chart-4: oklch(0.65 0.22 25);
+	--chart-5: oklch(0.65 0.22 264);
+	--chart-6: oklch(0.63 0.22 290);
+	--chart-7: oklch(0.7 0.2 314);
+	--chart-8: oklch(0.7 0.2 340);
 
 	/* Card Elevation */
-	--card: oklch(0.22 0.018 280 / 0.75);
-	--card-foreground: oklch(0.95 0.005 295);
+	--card: oklch(0.22 0.025 305 / 0.75);
+	--card-foreground: oklch(0.95 0.005 310);
 
-	--popover: oklch(0.20 0.015 280);
-	--popover-foreground: oklch(0.95 0.005 295);
+	--popover: oklch(0.20 0.02 305);
+	--popover-foreground: oklch(0.95 0.005 310);
 
-	/* Primary: Bright Lavender Glow */
-	--primary: oklch(0.88 0.08 295);
-	--primary-foreground: oklch(0.17 0.015 280);
+	/* Primary: Bright Purple Glow */
+	--primary: oklch(0.88 0.1 305);
+	--primary-foreground: oklch(0.17 0.02 305);
 
-	--secondary: oklch(0.27 0.02 280);
-	--secondary-foreground: oklch(0.88 0.08 295);
+	--secondary: oklch(0.27 0.025 305);
+	--secondary-foreground: oklch(0.88 0.1 305);
 
-	--muted: oklch(0.27 0.02 280);
-	--muted-foreground: oklch(0.68 0.015 295);
+	--muted: oklch(0.27 0.025 305);
+	--muted-foreground: oklch(0.68 0.015 305);
 
-	--accent: oklch(0.27 0.02 280);
-	--accent-foreground: oklch(0.88 0.08 295);
+	--accent: oklch(0.27 0.025 305);
+	--accent-foreground: oklch(0.88 0.1 305);
 
 	--destructive: oklch(0.45 0.15 25);
-	--destructive-foreground: oklch(0.95 0.005 295);
-
-	--border: oklch(0.31 0.02 280);
-	--input: oklch(0.31 0.02 280);
-	--ring: oklch(0.88 0.08 295 / 0.3);
-
-	/* Sidebar (Dark Violet) */
-	--sidebar: oklch(0.20 0.015 280);
-	--sidebar-foreground: oklch(0.95 0.005 295);
-	--sidebar-primary: oklch(0.88 0.08 295);
-	--sidebar-primary-foreground: oklch(0.17 0.015 280);
-	--sidebar-accent: oklch(0.27 0.02 280);
-	--sidebar-accent-foreground: oklch(0.95 0.005 295);
-	--sidebar-border: oklch(0.31 0.02 280);
+	--destructive-foreground: oklch(0.95 0.005 310);
+
+	--border: oklch(0.31 0.025 305);
+	--input: oklch(0.31 0.025 305);
+	--ring: oklch(0.88 0.1 305 / 0.3);
+
+	/* Sidebar (Amethyst) */
+	--sidebar: oklch(0.22 0.025 305);
+	--sidebar-foreground: oklch(0.95 0.005 310);
+	--sidebar-primary: oklch(0.88 0.1 305);
+	--sidebar-primary-foreground: oklch(0.17 0.02 305);
+	--sidebar-accent: oklch(0.27 0.025 305);
+	--sidebar-accent-foreground: oklch(0.95 0.005 310);
+	--sidebar-border: oklch(0.31 0.025 305);
 
 	/* Banners (Dark) */
 	--banner-info: oklch(0.22 0.04 260);

package/src/themes/linen.css

@@ -1,8 +1,23 @@
 :root {
 	/* --- Light Theme (Linen & Slate - Minimal Warmth) --- */
-	--background: oklch(0.992 0.003 85);
+	--background: oklch(0.992 0.008 85);
 	--foreground: oklch(0.2 0.01 85);
 
+	/* Brand palette */
+	--color-canopy: oklch(0.16 0.015 85);
+	--color-hive: oklch(0.68 0.18 75);
+	--color-parchment: oklch(0.975 0.006 85);
+
+	/* Chart palette — semantic (portfolio health) + categorical (unit mix) */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
 	/* Surfaces (Tables, Cards, Buttons) - Frosted White */
 	--card: oklch(1 0 0 / 0.75);
 	--card-foreground: oklch(0.2 0.01 85);
@@ -10,34 +25,34 @@
 	--popover: oklch(1 0 0);
 	--popover-foreground: oklch(0.2 0.01 85);
 
-	/* Primary: Deep Warm Charcoal (Neutral & High Contrast) */
-	--primary: oklch(0.18 0.01 85);
+	/* Primary: Warm Amber */
+	--primary: oklch(0.58 0.18 70);
 	--primary-foreground: oklch(1 0 0);
 
 	/* Button/Surface Colors: Pure White */
 	--secondary: oklch(1 0 0);
-	--secondary-foreground: oklch(0.18 0.01 85);
+	--secondary-foreground: oklch(0.58 0.18 70);
 
 	--muted: oklch(1 0 0);
 	--muted-foreground: oklch(0.5 0.01 85);
 
-	--accent: oklch(1 0 0);
-	--accent-foreground: oklch(0.18 0.01 85);
+	--accent: oklch(0.97 0.01 85);
+	--accent-foreground: oklch(0.58 0.18 70);
 
-	--destructive: oklch(0.55 0.15 25);
+	--destructive: oklch(0.55 0.19 15);
 	--destructive-foreground: oklch(1 0 0);
 
 	--border: oklch(0.94 0.005 85);
 	--input: oklch(0.94 0.005 85);
-	--ring: oklch(0.18 0.01 85 / 0.1);
+	--ring: oklch(0.58 0.18 70 / 0.3);
 
 	/* Sidebar (Soft White) */
-	--sidebar: oklch(0.995 0.002 85);
+	--sidebar: oklch(1 0 0);
 	--sidebar-foreground: oklch(0.2 0.01 85);
-	--sidebar-primary: oklch(0.18 0.01 85);
+	--sidebar-primary: oklch(0.58 0.18 70);
 	--sidebar-primary-foreground: oklch(1 0 0);
-	--sidebar-accent: oklch(0.97 0.01 85);
-	--sidebar-accent-foreground: oklch(0.18 0.01 85);
+	--sidebar-accent: oklch(0.96 0.015 75);
+	--sidebar-accent-foreground: oklch(0.35 0.1 70);
 	--sidebar-border: oklch(0.95 0.005 85);
 
 	/* Banners */
@@ -57,7 +72,7 @@
 	/* Interactive Elements */
 	--badge-success: oklch(0.4 0.1 160);
 	--badge-success-foreground: oklch(1 0 0);
-	--checkbox-checked: oklch(0.15 0.01 60);
+	--checkbox-checked: oklch(0.58 0.18 70);
 	--checkbox-checked-foreground: oklch(1 0 0);
 	--checkbox-unchecked-bg: oklch(1 0 0);
 	--checkbox-unchecked-border: oklch(0.88 0.01 60);
@@ -65,9 +80,24 @@
 
 [data-theme="linen"] {
 	/* --- Light Theme (Linen & Slate - Minimal Warmth) --- */
-	--background: oklch(0.992 0.003 85);
+	--background: oklch(0.992 0.008 85);
 	--foreground: oklch(0.2 0.01 85);
 
+	/* Brand palette */
+	--color-canopy: oklch(0.16 0.015 85);
+	--color-hive: oklch(0.68 0.18 75);
+	--color-parchment: oklch(0.975 0.006 85);
+
+	/* Chart palette */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
 	/* Surfaces (Tables, Cards, Buttons) - Frosted White */
 	--card: oklch(1 0 0 / 0.75);
 	--card-foreground: oklch(0.2 0.01 85);
@@ -75,34 +105,34 @@
 	--popover: oklch(1 0 0);
 	--popover-foreground: oklch(0.2 0.01 85);
 
-	/* Primary: Deep Warm Charcoal (Neutral & High Contrast) */
-	--primary: oklch(0.18 0.01 85);
+	/* Primary: Warm Amber */
+	--primary: oklch(0.58 0.18 70);
 	--primary-foreground: oklch(1 0 0);
 
 	/* Button/Surface Colors: Pure White */
 	--secondary: oklch(1 0 0);
-	--secondary-foreground: oklch(0.18 0.01 85);
+	--secondary-foreground: oklch(0.58 0.18 70);
 
 	--muted: oklch(1 0 0);
 	--muted-foreground: oklch(0.5 0.01 85);
 
-	--accent: oklch(1 0 0);
-	--accent-foreground: oklch(0.18 0.01 85);
+	--accent: oklch(0.97 0.01 85);
+	--accent-foreground: oklch(0.58 0.18 70);
 
-	--destructive: oklch(0.55 0.15 25);
+	--destructive: oklch(0.55 0.19 15);
 	--destructive-foreground: oklch(1 0 0);
 
 	--border: oklch(0.94 0.005 85);
 	--input: oklch(0.94 0.005 85);
-	--ring: oklch(0.18 0.01 85 / 0.1);
+	--ring: oklch(0.58 0.18 70 / 0.3);
 
 	/* Sidebar (Soft White) */
-	--sidebar: oklch(0.995 0.002 85);
+	--sidebar: oklch(1 0 0);
 	--sidebar-foreground: oklch(0.2 0.01 85);
-	--sidebar-primary: oklch(0.18 0.01 85);
+	--sidebar-primary: oklch(0.58 0.18 70);
 	--sidebar-primary-foreground: oklch(1 0 0);
-	--sidebar-accent: oklch(0.97 0.01 85);
-	--sidebar-accent-foreground: oklch(0.18 0.01 85);
+	--sidebar-accent: oklch(0.96 0.015 75);
+	--sidebar-accent-foreground: oklch(0.35 0.1 70);
 	--sidebar-border: oklch(0.95 0.005 85);
 
 	/* Banners */
@@ -122,7 +152,7 @@
 	/* Interactive Elements */
 	--badge-success: oklch(0.4 0.1 160);
 	--badge-success-foreground: oklch(1 0 0);
-	--checkbox-checked: oklch(0.15 0.01 60);
+	--checkbox-checked: oklch(0.58 0.18 70);
 	--checkbox-checked-foreground: oklch(1 0 0);
 	--checkbox-unchecked-bg: oklch(1 0 0);
 	--checkbox-unchecked-border: oklch(0.88 0.01 60);
@@ -133,6 +163,21 @@
 	--background: oklch(0.14 0.01 80);
 	--foreground: oklch(0.93 0.01 85);
 
+	/* Brand palette — dark */
+	--color-canopy: oklch(0.09 0.01 85);
+	--color-hive: oklch(0.78 0.18 75);
+	--color-parchment: oklch(0.17 0.012 80);
+
+	/* Chart palette — dark */
+	--chart-1: oklch(0.72 0.2 142);
+	--chart-2: oklch(0.78 0.18 72);
+	--chart-3: oklch(0.75 0.2 38);
+	--chart-4: oklch(0.65 0.22 25);
+	--chart-5: oklch(0.65 0.22 264);
+	--chart-6: oklch(0.63 0.22 290);
+	--chart-7: oklch(0.7 0.2 314);
+	--chart-8: oklch(0.7 0.2 340);
+
 	/* Card Elevation: Warm lifted surface */
 	--card: oklch(0.19 0.012 80 / 0.75);
 	--card-foreground: oklch(0.93 0.01 85);
@@ -161,7 +206,7 @@
 	--ring: oklch(0.86 0.05 85 / 0.3);
 
 	/* Sidebar (Warm Dark) */
-	--sidebar: oklch(0.17 0.01 80);
+	--sidebar: oklch(0.19 0.012 80);
 	--sidebar-foreground: oklch(0.93 0.01 85);
 	--sidebar-primary: oklch(0.86 0.05 85);
 	--sidebar-primary-foreground: oklch(0.14 0.01 80);

package/src/themes/sage.css

@@ -1,8 +1,23 @@
 [data-theme="sage"] {
 	/* --- Light Theme (Natural, Organic - Pale Sage) --- */
-	--background: oklch(0.965 0.007 145);
+	--background: oklch(0.965 0.015 145);
 	--foreground: oklch(0.18 0.02 145);
 
+	/* Brand palette */
+	--color-canopy: oklch(0.16 0.04 145);
+	--color-hive: oklch(0.62 0.2 145);
+	--color-parchment: oklch(0.975 0.008 145);
+
+	/* Chart palette */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
 	/* Surfaces - Frosted with green tint */
 	--card: oklch(0.99 0.004 145 / 0.75);
 	--card-foreground: oklch(0.18 0.02 145);
@@ -32,7 +47,7 @@
 	--ring: oklch(0.25 0.06 145 / 0.15);
 
 	/* Sidebar (Soft Sage) */
-	--sidebar: oklch(0.97 0.006 145);
+	--sidebar: oklch(0.99 0.004 145);
 	--sidebar-foreground: oklch(0.22 0.02 145);
 	--sidebar-primary: oklch(0.25 0.06 145);
 	--sidebar-primary-foreground: oklch(0.97 0.005 145);
@@ -68,6 +83,21 @@
 	--background: oklch(0.14 0.015 145);
 	--foreground: oklch(0.93 0.01 145);
 
+	/* Brand palette — dark */
+	--color-canopy: oklch(0.09 0.02 145);
+	--color-hive: oklch(0.75 0.2 145);
+	--color-parchment: oklch(0.17 0.018 145);
+
+	/* Chart palette — dark */
+	--chart-1: oklch(0.72 0.2 142);
+	--chart-2: oklch(0.78 0.18 72);
+	--chart-3: oklch(0.75 0.2 38);
+	--chart-4: oklch(0.65 0.22 25);
+	--chart-5: oklch(0.65 0.22 264);
+	--chart-6: oklch(0.63 0.22 290);
+	--chart-7: oklch(0.7 0.2 314);
+	--chart-8: oklch(0.7 0.2 340);
+
 	/* Card Elevation */
 	--card: oklch(0.19 0.018 145 / 0.75);
 	--card-foreground: oklch(0.93 0.01 145);
@@ -96,7 +126,7 @@
 	--ring: oklch(0.8 0.1 145 / 0.3);
 
 	/* Sidebar (Dark Forest) */
-	--sidebar: oklch(0.17 0.015 145);
+	--sidebar: oklch(0.19 0.018 145);
 	--sidebar-foreground: oklch(0.93 0.01 145);
 	--sidebar-primary: oklch(0.8 0.1 145);
 	--sidebar-primary-foreground: oklch(0.14 0.015 145);

package/src/themes/steel.css

@@ -1,8 +1,23 @@
 [data-theme="steel"] {
 	/* --- Light Theme (Metallic & Industrial - Brushed Steel) --- */
-	--background: oklch(0.95 0.005 250);
+	--background: oklch(0.95 0.015 250);
 	--foreground: oklch(0.2 0.02 250);
 
+	/* Brand palette */
+	--color-canopy: #0f172a;
+	--color-hive: #0ea5e9;
+	--color-parchment: #f1f5f9;
+
+	/* Chart palette */
+	--chart-1: oklch(0.65 0.18 142);
+	--chart-2: oklch(0.72 0.17 72);
+	--chart-3: oklch(0.69 0.19 38);
+	--chart-4: oklch(0.55 0.2 25);
+	--chart-5: oklch(0.57 0.22 264);
+	--chart-6: oklch(0.55 0.22 290);
+	--chart-7: oklch(0.62 0.2 314);
+	--chart-8: oklch(0.62 0.2 340);
+
 	/* Surfaces - Aluminum Finish */
 	--card: oklch(0.98 0.005 250 / 0.85);
 	--card-foreground: oklch(0.2 0.02 250);
@@ -32,7 +47,7 @@
 	--ring: oklch(0.3 0.05 250 / 0.15);
 
 	/* Sidebar (Cold Slate) */
-	--sidebar: oklch(0.97 0.005 250);
+	--sidebar: oklch(0.98 0.005 250);
 	--sidebar-foreground: oklch(0.25 0.02 250);
 	--sidebar-primary: oklch(0.3 0.05 250);
 	--sidebar-primary-foreground: oklch(0.98 0.005 250);
@@ -64,45 +79,60 @@
 }
 
 [data-theme="steel"].dark {
-	/* --- Dark Theme (Modern Slate & Glow) --- */
-	--background: oklch(0.18 0.015 260);
+	/* --- Dark Theme (Midnight Navy & Cyan) --- */
+	--background: oklch(0.18 0.02 225);
 	--foreground: oklch(0.985 0 0);
 
+	/* Brand palette — dark */
+	--color-canopy: #020617;
+	--color-hive: #38bdf8;
+	--color-parchment: #0f172a;
+
+	/* Chart palette — dark */
+	--chart-1: oklch(0.72 0.2 142);
+	--chart-2: oklch(0.78 0.18 72);
+	--chart-3: oklch(0.75 0.2 38);
+	--chart-4: oklch(0.65 0.22 25);
+	--chart-5: oklch(0.65 0.22 264);
+	--chart-6: oklch(0.63 0.22 290);
+	--chart-7: oklch(0.7 0.2 314);
+	--chart-8: oklch(0.7 0.2 340);
+
 	/* Card Elevation: Brighter than background */
-	--card: oklch(0.23 0.02 260 / 0.75);
+	--card: oklch(0.23 0.025 225 / 0.75);
 	--card-foreground: oklch(0.985 0 0);
 
-	--popover: oklch(0.21 0.015 260);
+	--popover: oklch(0.21 0.02 225);
 	--popover-foreground: oklch(0.985 0 0);
 
 	/* Primary: Electric Cyan Glow */
 	--primary: oklch(0.9 0.1 220);
-	--primary-foreground: oklch(0.18 0.015 260);
+	--primary-foreground: oklch(0.18 0.02 225);
 
-	--secondary: oklch(0.28 0.02 260);
+	--secondary: oklch(0.28 0.025 225);
 	--secondary-foreground: oklch(0.9 0.1 220);
 
-	--muted: oklch(0.28 0.02 260);
-	--muted-foreground: oklch(0.705 0.015 260);
+	--muted: oklch(0.28 0.025 225);
+	--muted-foreground: oklch(0.705 0.015 225);
 
-	--accent: oklch(0.28 0.02 260);
+	--accent: oklch(0.28 0.025 225);
 	--accent-foreground: oklch(0.9 0.1 220);
 
 	--destructive: oklch(0.45 0.15 25);
 	--destructive-foreground: oklch(0.985 0 0);
 
-	--border: oklch(0.32 0.02 260);
-	--input: oklch(0.32 0.02 260);
+	--border: oklch(0.32 0.025 225);
+	--input: oklch(0.32 0.025 225);
 	--ring: oklch(0.9 0.1 220 / 0.3);
 
-	/* Sidebar (Dark) */
-	--sidebar: oklch(0.21 0.015 260);
+	/* Sidebar (Midnight Navy) */
+	--sidebar: oklch(0.23 0.025 225);
 	--sidebar-foreground: oklch(0.985 0 0);
 	--sidebar-primary: oklch(0.9 0.1 220);
-	--sidebar-primary-foreground: oklch(0.18 0.015 260);
-	--sidebar-accent: oklch(0.28 0.02 260);
+	--sidebar-primary-foreground: oklch(0.18 0.02 225);
+	--sidebar-accent: oklch(0.28 0.025 225);
 	--sidebar-accent-foreground: oklch(0.985 0 0);
-	--sidebar-border: oklch(0.32 0.02 260);
+	--sidebar-border: oklch(0.32 0.025 225);
 
 	/* Banners (Dark - Desaturated) */
 	--banner-info: oklch(0.274 0.079 260);