@kaanolin/react 1.1.2

package/dist/select/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,EACL,mBAAmB,EAOpB,MAAM,iBAAiB,CAAC;AAWzB,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC9D,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sFAAsF;IACtF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4DAA4D;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,4DAA4D;IAC5D,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,0DAA0D;IAC1D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kDAAkD;IAClD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AAED,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAC5D,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;AA+BvE,QAAA,MAAM,MAAM,oFA+WX,CAAC;AAMF,QAAA,MAAM,UAAU,uFAoDf,CAAC;AAMF,QAAA,MAAM,WAAW,yFAqBhB,CAAC;AAMF,QAAA,MAAM,eAAe,4FAUnB,CAAC;AAMH,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}

package/dist/select/Select.styles.d.ts

@@ -0,0 +1,20 @@
+export declare const selectTriggerStyles: (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+    variant?: "default" | "error" | "success" | null | undefined;
+    disabled?: boolean | null | undefined;
+    open?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const selectChevronStyles: (props?: ({
+    open?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const selectDropdownStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectDropdownInnerStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectItemStyles: (props?: ({
+    highlighted?: boolean | null | undefined;
+    selected?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const selectGroupLabelStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectSeparatorStyles: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+//# sourceMappingURL=Select.styles.d.ts.map

package/dist/select/Select.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.styles.d.ts","sourceRoot":"","sources":["../../src/select/Select.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,mBAAmB;;;;;8EA2E/B,CAAC;AAIF,eAAO,MAAM,mBAAmB;;;8EAqB/B,CAAC;AAIF,eAAO,MAAM,oBAAoB,oFAY/B,CAAC;AAIH,eAAO,MAAM,yBAAyB,oFAAuC,CAAC;AAI9E,eAAO,MAAM,gBAAgB;;;;8EAmC5B,CAAC;AAIF,eAAO,MAAM,sBAAsB,oFAOjC,CAAC;AAIH,eAAO,MAAM,qBAAqB,oFAIhC,CAAC"}

package/dist/select/index.d.ts

@@ -0,0 +1,3 @@
+export { Select, SelectItem, SelectGroup, SelectSeparator, type SelectProps, type SelectItemProps, type SelectGroupProps, type SelectSeparatorProps, } from './Select';
+export { selectTriggerStyles, selectChevronStyles, selectDropdownStyles, selectDropdownInnerStyles, selectItemStyles, selectGroupLabelStyles, selectSeparatorStyles, } from './Select.styles';
+//# sourceMappingURL=index.d.ts.map

package/dist/select/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EACN,UAAU,EACV,WAAW,EACX,eAAe,EACf,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,gBAAgB,EACrB,KAAK,oBAAoB,GAC1B,MAAM,UAAU,CAAC;AAElB,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,oBAAoB,EACpB,yBAAyB,EACzB,gBAAgB,EAChB,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,iBAAiB,CAAC"}

package/dist/select.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Select-1U2YyMRi.cjs");exports.Select=e.Select;exports.SelectGroup=e.SelectGroup;exports.SelectItem=e.SelectItem;exports.SelectSeparator=e.SelectSeparator;exports.selectChevronStyles=e.selectChevronStyles;exports.selectDropdownInnerStyles=e.selectDropdownInnerStyles;exports.selectDropdownStyles=e.selectDropdownStyles;exports.selectGroupLabelStyles=e.selectGroupLabelStyles;exports.selectItemStyles=e.selectItemStyles;exports.selectSeparatorStyles=e.selectSeparatorStyles;exports.selectTriggerStyles=e.selectTriggerStyles;

package/dist/select.js

@@ -0,0 +1,14 @@
+import { S as t, a as l, b as a, c as r, s as S, d as c, e as o, f as p, g as y, h as n, i as d } from "./Select-C2A4HgEF.js";
+export {
+  t as Select,
+  l as SelectGroup,
+  a as SelectItem,
+  r as SelectSeparator,
+  S as selectChevronStyles,
+  c as selectDropdownInnerStyles,
+  o as selectDropdownStyles,
+  p as selectGroupLabelStyles,
+  y as selectItemStyles,
+  n as selectSeparatorStyles,
+  d as selectTriggerStyles
+};

package/dist/styles/colors.css

@@ -0,0 +1,391 @@
+@theme {
+    /* ========== BASE COLORS ========== */
+    --color-transparent: rgb(0 0 0 / 0);
+    --color-white: rgb(255 255 255);
+    --color-black: rgb(0 0 0);
+
+    /* Brand */
+    --color-brand-25: rgb(252 250 255);
+    --color-brand-50: rgb(249 245 255);
+    --color-brand-100: rgb(244 235 255);
+    --color-brand-200: rgb(233 215 254);
+    --color-brand-300: rgb(214 187 251);
+    --color-brand-400: rgb(182 146 246);
+    --color-brand-500: rgb(158 119 237);
+    --color-brand-600: rgb(127 86 217);
+    --color-brand-700: rgb(105 65 198);
+    --color-brand-800: rgb(83 56 158);
+    --color-brand-900: rgb(66 48 125);
+    --color-brand-950: rgb(44 28 95);
+
+    /* Error */
+    --color-error-25: rgb(255 251 250);
+    --color-error-50: rgb(254 243 242);
+    --color-error-100: rgb(254 228 226);
+    --color-error-200: rgb(254 205 202);
+    --color-error-300: rgb(253 162 155);
+    --color-error-400: rgb(249 112 102);
+    --color-error-500: rgb(240 68 56);
+    --color-error-600: rgb(217 45 32);
+    --color-error-700: rgb(180 35 24);
+    --color-error-800: rgb(145 32 24);
+    --color-error-900: rgb(122 39 26);
+    --color-error-950: rgb(85 22 12);
+
+    /* Warning */
+    --color-warning-25: rgb(255 252 245);
+    --color-warning-50: rgb(255 250 235);
+    --color-warning-100: rgb(254 240 199);
+    --color-warning-200: rgb(254 223 137);
+    --color-warning-300: rgb(254 200 75);
+    --color-warning-400: rgb(253 176 34);
+    --color-warning-500: rgb(247 144 9);
+    --color-warning-600: rgb(220 104 3);
+    --color-warning-700: rgb(181 71 8);
+    --color-warning-800: rgb(147 55 13);
+    --color-warning-900: rgb(122 46 14);
+    --color-warning-950: rgb(78 29 9);
+
+    /* Success */
+    --color-success-25: rgb(246 254 249);
+    --color-success-50: rgb(236 253 243);
+    --color-success-100: rgb(220 250 230);
+    --color-success-200: rgb(171 239 198);
+    --color-success-300: rgb(117 224 167);
+    --color-success-400: rgb(71 205 137);
+    --color-success-500: rgb(23 178 106);
+    --color-success-600: rgb(7 148 85);
+    --color-success-700: rgb(6 118 71);
+    --color-success-800: rgb(8 93 58);
+    --color-success-900: rgb(7 77 49);
+    --color-success-950: rgb(5 51 33);
+
+    /* Gray */
+    --color-gray-25: rgb(253 253 253);
+    --color-gray-50: rgb(250 250 250);
+    --color-gray-100: rgb(245 245 245);
+    --color-gray-200: rgb(233 234 235);
+    --color-gray-300: rgb(213 215 218);
+    --color-gray-400: rgb(164 167 174);
+    --color-gray-500: rgb(113 118 128);
+    --color-gray-600: rgb(83 88 98);
+    --color-gray-700: rgb(65 70 81);
+    --color-gray-800: rgb(37 43 55);
+    --color-gray-900: rgb(24 29 39);
+    --color-gray-950: rgb(10 13 18);
+
+    /* Blue */
+    --color-blue-25: rgb(245 250 255);
+    --color-blue-50: rgb(239 248 255);
+    --color-blue-100: rgb(209 233 255);
+    --color-blue-200: rgb(178 221 255);
+    --color-blue-300: rgb(132 202 255);
+    --color-blue-400: rgb(83 177 253);
+    --color-blue-500: rgb(46 144 250);
+    --color-blue-600: rgb(21 112 239);
+    --color-blue-700: rgb(23 92 211);
+    --color-blue-800: rgb(24 73 169);
+    --color-blue-900: rgb(25 65 133);
+    --color-blue-950: rgb(16 42 86);
+
+    /* Indigo */
+    --color-indigo-25: rgb(245 248 255);
+    --color-indigo-50: rgb(238 244 255);
+    --color-indigo-100: rgb(224 234 255);
+    --color-indigo-200: rgb(199 215 254);
+    --color-indigo-300: rgb(164 188 253);
+    --color-indigo-400: rgb(128 152 249);
+    --color-indigo-500: rgb(97 114 243);
+    --color-indigo-600: rgb(68 76 231);
+    --color-indigo-700: rgb(53 56 205);
+    --color-indigo-800: rgb(45 49 166);
+    --color-indigo-900: rgb(45 50 130);
+    --color-indigo-950: rgb(31 35 91);
+
+    /* Violet */
+    --color-violet-25: rgb(251 250 255);
+    --color-violet-50: rgb(245 243 255);
+    --color-violet-100: rgb(236 233 254);
+    --color-violet-200: rgb(221 214 254);
+    --color-violet-300: rgb(195 181 253);
+    --color-violet-400: rgb(164 138 251);
+    --color-violet-500: rgb(135 91 247);
+    --color-violet-600: rgb(120 57 238);
+    --color-violet-700: rgb(105 39 218);
+    --color-violet-800: rgb(87 32 183);
+    --color-violet-900: rgb(73 28 150);
+    --color-violet-950: rgb(46 18 94);
+
+    /* Purple */
+    --color-purple-25: rgb(250 250 255);
+    --color-purple-50: rgb(244 243 255);
+    --color-purple-100: rgb(235 233 254);
+    --color-purple-200: rgb(217 214 254);
+    --color-purple-300: rgb(189 180 254);
+    --color-purple-400: rgb(155 138 251);
+    --color-purple-500: rgb(122 90 248);
+    --color-purple-600: rgb(105 56 239);
+    --color-purple-700: rgb(89 37 220);
+    --color-purple-800: rgb(74 31 184);
+    --color-purple-900: rgb(62 28 150);
+    --color-purple-950: rgb(39 17 95);
+
+    /* Fuchsia */
+    --color-fuchsia-25: rgb(254 250 255);
+    --color-fuchsia-50: rgb(253 244 255);
+    --color-fuchsia-100: rgb(251 232 255);
+    --color-fuchsia-200: rgb(246 208 254);
+    --color-fuchsia-300: rgb(238 170 253);
+    --color-fuchsia-400: rgb(228 120 250);
+    --color-fuchsia-500: rgb(212 68 241);
+    --color-fuchsia-600: rgb(186 36 213);
+    --color-fuchsia-700: rgb(159 26 177);
+    --color-fuchsia-800: rgb(130 24 144);
+    --color-fuchsia-900: rgb(111 24 119);
+    --color-fuchsia-950: rgb(71 16 76);
+
+    /* Pink */
+    --color-pink-25: rgb(254 246 251);
+    --color-pink-50: rgb(253 242 250);
+    --color-pink-100: rgb(252 231 246);
+    --color-pink-200: rgb(252 206 238);
+    --color-pink-300: rgb(250 167 224);
+    --color-pink-400: rgb(246 112 199);
+    --color-pink-500: rgb(238 70 188);
+    --color-pink-600: rgb(221 37 144);
+    --color-pink-700: rgb(193 21 116);
+    --color-pink-800: rgb(158 22 95);
+    --color-pink-900: rgb(133 22 81);
+    --color-pink-950: rgb(78 13 48);
+
+    /* Rose */
+    --color-rose-25: rgb(255 245 246);
+    --color-rose-50: rgb(255 241 243);
+    --color-rose-100: rgb(255 228 232);
+    --color-rose-200: rgb(254 205 214);
+    --color-rose-300: rgb(254 163 180);
+    --color-rose-400: rgb(253 111 142);
+    --color-rose-500: rgb(246 61 104);
+    --color-rose-600: rgb(227 27 84);
+    --color-rose-700: rgb(192 16 72);
+    --color-rose-800: rgb(161 16 67);
+    --color-rose-900: rgb(137 18 62);
+    --color-rose-950: rgb(81 11 36);
+
+    /* Orange */
+    --color-orange-25: rgb(254 250 245);
+    --color-orange-50: rgb(254 246 238);
+    --color-orange-100: rgb(253 234 215);
+    --color-orange-200: rgb(249 219 175);
+    --color-orange-300: rgb(247 178 122);
+    --color-orange-400: rgb(243 135 68);
+    --color-orange-500: rgb(239 104 32);
+    --color-orange-600: rgb(224 79 22);
+    --color-orange-700: rgb(185 56 21);
+    --color-orange-800: rgb(147 47 25);
+    --color-orange-900: rgb(119 41 23);
+    --color-orange-950: rgb(81 28 16);
+
+    /* Yellow */
+    --color-yellow-25: rgb(254 253 240);
+    --color-yellow-50: rgb(254 251 232);
+    --color-yellow-100: rgb(254 247 195);
+    --color-yellow-200: rgb(254 238 149);
+    --color-yellow-300: rgb(253 226 114);
+    --color-yellow-400: rgb(250 197 21);
+    --color-yellow-500: rgb(234 170 8);
+    --color-yellow-600: rgb(202 133 4);
+    --color-yellow-700: rgb(161 92 7);
+    --color-yellow-800: rgb(133 74 14);
+    --color-yellow-900: rgb(113 59 18);
+    --color-yellow-950: rgb(84 44 13);
+
+    /* Teal */
+    --color-teal-25: rgb(246 254 252);
+    --color-teal-50: rgb(240 253 249);
+    --color-teal-100: rgb(204 251 239);
+    --color-teal-200: rgb(153 246 224);
+    --color-teal-300: rgb(95 233 208);
+    --color-teal-400: rgb(46 211 183);
+    --color-teal-500: rgb(21 183 158);
+    --color-teal-600: rgb(14 147 132);
+    --color-teal-700: rgb(16 117 105);
+    --color-teal-800: rgb(18 93 86);
+    --color-teal-900: rgb(19 78 72);
+    --color-teal-950: rgb(10 41 38);
+
+    /* Cyan */
+    --color-cyan-25: rgb(245 254 255);
+    --color-cyan-50: rgb(236 253 255);
+    --color-cyan-100: rgb(207 249 254);
+    --color-cyan-200: rgb(165 240 252);
+    --color-cyan-300: rgb(103 227 249);
+    --color-cyan-400: rgb(34 204 238);
+    --color-cyan-500: rgb(6 174 212);
+    --color-cyan-600: rgb(8 138 178);
+    --color-cyan-700: rgb(14 112 144);
+    --color-cyan-800: rgb(21 91 117);
+    --color-cyan-900: rgb(22 76 99);
+    --color-cyan-950: rgb(13 45 58);
+
+    /* Green */
+    --color-green-25: rgb(246 254 249);
+    --color-green-50: rgb(237 252 242);
+    --color-green-100: rgb(211 248 223);
+    --color-green-200: rgb(170 240 196);
+    --color-green-300: rgb(115 226 163);
+    --color-green-400: rgb(60 203 127);
+    --color-green-500: rgb(22 179 100);
+    --color-green-600: rgb(9 146 80);
+    --color-green-700: rgb(8 116 67);
+    --color-green-800: rgb(9 92 55);
+    --color-green-900: rgb(8 76 46);
+    --color-green-950: rgb(5 46 28);
+
+    /* Moss */
+    --color-moss-25: rgb(250 253 247);
+    --color-moss-50: rgb(245 251 238);
+    --color-moss-100: rgb(230 244 215);
+    --color-moss-200: rgb(206 234 176);
+    --color-moss-300: rgb(172 220 121);
+    --color-moss-400: rgb(134 203 60);
+    --color-moss-500: rgb(102 159 42);
+    --color-moss-600: rgb(79 122 33);
+    --color-moss-700: rgb(63 98 26);
+    --color-moss-800: rgb(51 80 21);
+    --color-moss-900: rgb(43 66 18);
+    --color-moss-950: rgb(26 40 11);
+
+    /* ========== SEMANTIC COMPONENT TOKENS ========== */
+    --color-primary: rgb(127 86 217);
+    --color-primary-foreground: rgb(255 255 255);
+    --color-secondary: rgb(245 245 245);
+    --color-secondary-foreground: rgb(24 29 39);
+    --color-destructive: rgb(217 45 32);
+    --color-destructive-foreground: rgb(255 255 255);
+    --color-muted: rgb(245 245 245);
+    --color-muted-foreground: rgb(113 118 128);
+    --color-accent: rgb(250 250 250);
+    --color-accent-foreground: rgb(24 29 39);
+    --color-background: rgb(255 255 255);
+    --color-foreground: rgb(10 13 18);
+    --color-border: rgb(213 215 218);
+    --color-ring: rgb(158 119 237);
+    --color-input: rgb(213 215 218);
+    --color-success: rgb(7 148 85);
+    --color-success-foreground: rgb(255 255 255);
+    --color-warning: rgb(220 104 3);
+    --color-warning-foreground: rgb(10 13 18);
+
+    /* ========== UNTITLED UI SEMANTIC LAYERS ========== */
+
+    /* Text Colors */
+    --color-text-white: rgb(255 255 255);
+    --color-text-primary: rgb(24 29 39);
+    --color-text-secondary: rgb(65 70 81);
+    --color-text-secondary_hover: rgb(37 43 55);
+    --color-text-tertiary: rgb(83 88 98);
+    --color-text-tertiary_hover: rgb(65 70 81);
+    --color-text-quaternary: rgb(113 118 128);
+    --color-text-error-primary: rgb(217 45 32);
+    --color-text-warning-primary: rgb(220 104 3);
+    --color-text-success-primary: rgb(7 148 85);
+    --color-text-disabled: rgb(113 118 128);
+    --color-text-placeholder: rgb(113 118 128);
+    --color-text-placeholder_subtle: rgb(213 215 218);
+    --color-text-primary_on-brand: rgb(255 255 255);
+    --color-text-brand-primary: rgb(66 48 125);
+    --color-text-brand-secondary: rgb(105 65 198);
+    --color-text-brand-tertiary: rgb(127 86 217);
+
+    /* Foreground Colors */
+    --color-fg-white: rgb(255 255 255);
+    --color-fg-primary: rgb(24 29 39);
+    --color-fg-secondary: rgb(65 70 81);
+    --color-fg-tertiary: rgb(83 88 98);
+    --color-fg-quaternary: rgb(164 167 174);
+    --color-fg-brand-primary: rgb(127 86 217);
+    --color-fg-brand-secondary: rgb(158 119 237);
+    --color-fg-error-primary: rgb(217 45 32);
+    --color-fg-error-secondary: rgb(240 68 56);
+    --color-fg-warning-primary: rgb(220 104 3);
+    --color-fg-success-primary: rgb(7 148 85);
+    --color-fg-disabled: rgb(164 167 174);
+
+    /* Background Colors */
+    --color-bg-primary: rgb(255 255 255);
+    --color-bg-primary_hover: rgb(250 250 250);
+    --color-bg-secondary: rgb(250 250 250);
+    --color-bg-secondary_hover: rgb(245 245 245);
+    --color-bg-secondary_subtle: rgb(253 253 253);
+    --color-bg-tertiary: rgb(245 245 245);
+    --color-bg-quaternary: rgb(233 234 235);
+    --color-bg-active: rgb(250 250 250);
+    --color-bg-disabled: rgb(245 245 245);
+    --color-bg-overlay: rgb(10 13 18);
+    --color-bg-brand-primary: rgb(249 245 255);
+    --color-bg-brand-secondary: rgb(244 235 255);
+    --color-bg-brand-solid: rgb(127 86 217);
+    --color-bg-brand-solid_hover: rgb(105 65 198);
+    --color-bg-brand-section: rgb(83 56 158);
+    --color-bg-error-primary: rgb(254 243 242);
+    --color-bg-error-secondary: rgb(254 228 226);
+    --color-bg-error-solid: rgb(217 45 32);
+    --color-bg-warning-primary: rgb(255 250 235);
+    --color-bg-warning-secondary: rgb(254 240 199);
+    --color-bg-warning-solid: rgb(220 104 3);
+    --color-bg-success-primary: rgb(236 253 243);
+    --color-bg-success-secondary: rgb(220 250 230);
+    --color-bg-success-solid: rgb(7 148 85);
+
+    /* Border Colors */
+    --color-border-primary: rgb(213 215 218);
+    --color-border-secondary: rgb(233 234 235);
+    --color-border-tertiary: rgb(245 245 245);
+    --color-border-error: rgb(240 68 56);
+    --color-border-error_subtle: rgb(253 162 155);
+    --color-border-disabled: rgb(213 215 218);
+    --color-border-brand: rgb(158 119 237);
+    --color-border-brand_alt: rgb(127 86 217);
+
+    /* Focus Ring */
+    --color-focus-ring: rgb(158 119 237);
+    --color-focus-ring-error: rgb(240 68 56);
+}
+
+@layer base {
+    .dark-mode {
+        --color-gray-25: rgb(250 250 250);
+        --color-gray-50: rgb(247 247 247);
+        --color-gray-100: rgb(240 240 241);
+        --color-gray-200: rgb(236 236 237);
+        --color-gray-300: rgb(206 207 210);
+        --color-gray-400: rgb(148 151 156);
+        --color-gray-500: rgb(133 136 142);
+        --color-gray-600: rgb(97 101 108);
+        --color-gray-700: rgb(55 58 65);
+        --color-gray-800: rgb(34 38 47);
+        --color-gray-900: rgb(19 22 27);
+        --color-gray-950: rgb(12 14 18);
+
+        --color-primary: rgb(182 146 246);
+        --color-primary-foreground: rgb(255 255 255);
+        --color-secondary: rgb(55 58 65);
+        --color-secondary-foreground: rgb(240 240 241);
+        --color-destructive: rgb(249 112 102);
+        --color-destructive-foreground: rgb(255 255 255);
+        --color-muted: rgb(55 58 65);
+        --color-muted-foreground: rgb(133 136 142);
+        --color-accent: rgb(34 38 47);
+        --color-accent-foreground: rgb(240 240 241);
+        --color-background: rgb(12 14 18);
+        --color-foreground: rgb(250 250 250);
+        --color-border: rgb(55 58 65);
+        --color-ring: rgb(158 119 237);
+        --color-input: rgb(55 58 65);
+        --color-success: rgb(71 205 137);
+        --color-success-foreground: rgb(255 255 255);
+        --color-warning: rgb(253 176 34);
+        --color-warning-foreground: rgb(12 14 18);
+    }
+}