zabi-components 7.0.1 → 7.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/atoms/Tooltip.svelte +12 -38
  2. package/dist/zabi-components-colors.css +3 -437
  3. package/dist/zabi-components-theme-dark-only.css +151 -78
  4. package/dist/zabi-components-theme-dark.css +151 -78
  5. package/dist/zabi-components-theme-only.css +153 -59
  6. package/dist/zabi-components-theme.css +153 -59
  7. package/dist/zabi-components.css +268 -106
  8. package/package.json +2 -2
package/dist/zabi-components-theme-only.css CHANGED
@@ -28,54 +28,144 @@
28
28
  --zabi-base-950: #09090b
29
29
  /* Typography - Nunito Sans font family */
30
30
  --font-family-sans: 'Nunito Sans', ui-sans-serif, system-ui, sans-serif
31
- /* Brand Color Scale */
32
- --color-brand-50: #f7faff
33
- --color-brand-100: #edf2fb
34
- --color-brand-200: #dfe7fb
35
- --color-brand-300: #ccdbfd
36
- --color-brand-400: #abc4ff
37
- --color-brand-500: #8fa8ff
38
- --color-brand-600: #6e84fa
39
- --color-brand-700: #5366e2
40
- --color-brand-800: #3f4fc0
41
- --color-brand-900: #2f3c99
42
- --color-brand-950: #1f2866
43
- /* Citron Color Scale */
44
- --color-citron-50: #f9faeb
45
- --color-citron-100: #f1f5cf
46
- --color-citron-200: #e4ecaa
47
- --color-citron-300: #d5e184
48
- --color-citron-400: #c7d460
49
- --color-citron-500: #bbbe64
50
- --color-citron-600: #a3a852
51
- --color-citron-700: #848a43
52
- --color-citron-800: #666c35
53
- --color-citron-900: #4d5229
54
- --color-citron-950: #323518
55
- /* Pine Color Scale */
56
- --color-pine-50: #e9f6f2
57
- --color-pine-100: #d2ece4
58
- --color-pine-200: #a7d9c9
59
- --color-pine-300: #78c4ad
60
- --color-pine-400: #49ad91
61
- --color-pine-500: #0C5D43
62
- --color-pine-600: #0a513a
63
- --color-pine-700: #084532
64
- --color-pine-800: #063a2a
65
- --color-pine-900: #04231a
66
- --color-pine-950: #02160f
67
- /* Iris Color Scale */
68
- --color-iris-50: #f4f4fa
69
- --color-iris-100: #e9e9f7
70
- --color-iris-200: #d6d6f0
71
- --color-iris-300: #bdbde6
72
- --color-iris-400: #a3a3d8
73
- --color-iris-500: #6969B3
74
- --color-iris-600: #58589e
75
- --color-iris-700: #474788
76
- --color-iris-800: #38386f
77
- --color-iris-900: #2a2a56
78
- --color-iris-950: #1b1b37
31
+ /* Brand Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
32
+ --zabi-brand-50: #f7faff
33
+ --zabi-brand-100: #edf2fb
34
+ --zabi-brand-200: #dfe7fb
35
+ --zabi-brand-300: #ccdbfd
36
+ --zabi-brand-400: #abc4ff
37
+ --zabi-brand-500: #8fa8ff
38
+ --zabi-brand-600: #6e84fa
39
+ --zabi-brand-700: #5366e2
40
+ --zabi-brand-800: #3f4fc0
41
+ --zabi-brand-900: #2f3c99
42
+ --zabi-brand-950: #1f2866
43
+ --color-brand-50: var(--zabi-brand-50)
44
+ --color-brand-100: var(--zabi-brand-100)
45
+ --color-brand-200: var(--zabi-brand-200)
46
+ --color-brand-300: var(--zabi-brand-300)
47
+ --color-brand-400: var(--zabi-brand-400)
48
+ --color-brand-500: var(--zabi-brand-500)
49
+ --color-brand-600: var(--zabi-brand-600)
50
+ --color-brand-700: var(--zabi-brand-700)
51
+ --color-brand-800: var(--zabi-brand-800)
52
+ --color-brand-900: var(--zabi-brand-900)
53
+ --color-brand-950: var(--zabi-brand-950)
54
+ /* Citron Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
55
+ --zabi-citron-50: #f9faeb
56
+ --zabi-citron-100: #f1f5cf
57
+ --zabi-citron-200: #e4ecaa
58
+ --zabi-citron-300: #d5e184
59
+ --zabi-citron-400: #c7d460
60
+ --zabi-citron-500: #bbbe64
61
+ --zabi-citron-600: #a3a852
62
+ --zabi-citron-700: #848a43
63
+ --zabi-citron-800: #666c35
64
+ --zabi-citron-900: #4d5229
65
+ --zabi-citron-950: #323518
66
+ --color-citron-50: var(--zabi-citron-50)
67
+ --color-citron-100: var(--zabi-citron-100)
68
+ --color-citron-200: var(--zabi-citron-200)
69
+ --color-citron-300: var(--zabi-citron-300)
70
+ --color-citron-400: var(--zabi-citron-400)
71
+ --color-citron-500: var(--zabi-citron-500)
72
+ --color-citron-600: var(--zabi-citron-600)
73
+ --color-citron-700: var(--zabi-citron-700)
74
+ --color-citron-800: var(--zabi-citron-800)
75
+ --color-citron-900: var(--zabi-citron-900)
76
+ --color-citron-950: var(--zabi-citron-950)
77
+ /* Pine Color Scale — physical ramp + semantic aliases (mirror pattern matches --zabi-base-* / --color-base-*) */
78
+ --zabi-pine-50: #e9f6f2
79
+ --zabi-pine-100: #d2ece4
80
+ --zabi-pine-200: #a7d9c9
81
+ --zabi-pine-300: #78c4ad
82
+ --zabi-pine-400: #49ad91
83
+ --zabi-pine-500: #0c5d43
84
+ --zabi-pine-600: #0a513a
85
+ --zabi-pine-700: #084532
86
+ --zabi-pine-800: #063a2a
87
+ --zabi-pine-900: #04231a
88
+ --zabi-pine-950: #02160f
89
+ --color-pine-50: var(--zabi-pine-50)
90
+ --color-pine-100: var(--zabi-pine-100)
91
+ --color-pine-200: var(--zabi-pine-200)
92
+ --color-pine-300: var(--zabi-pine-300)
93
+ --color-pine-400: var(--zabi-pine-400)
94
+ --color-pine-500: var(--zabi-pine-500)
95
+ --color-pine-600: var(--zabi-pine-600)
96
+ --color-pine-700: var(--zabi-pine-700)
97
+ --color-pine-800: var(--zabi-pine-800)
98
+ --color-pine-900: var(--zabi-pine-900)
99
+ --color-pine-950: var(--zabi-pine-950)
100
+ /* Iris Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
101
+ --zabi-iris-50: #f4f4fa
102
+ --zabi-iris-100: #e9e9f7
103
+ --zabi-iris-200: #d6d6f0
104
+ --zabi-iris-300: #bdbde6
105
+ --zabi-iris-400: #a3a3d8
106
+ --zabi-iris-500: #6969b3
107
+ --zabi-iris-600: #58589e
108
+ --zabi-iris-700: #474788
109
+ --zabi-iris-800: #38386f
110
+ --zabi-iris-900: #2a2a56
111
+ --zabi-iris-950: #1b1b37
112
+ --color-iris-50: var(--zabi-iris-50)
113
+ --color-iris-100: var(--zabi-iris-100)
114
+ --color-iris-200: var(--zabi-iris-200)
115
+ --color-iris-300: var(--zabi-iris-300)
116
+ --color-iris-400: var(--zabi-iris-400)
117
+ --color-iris-500: var(--zabi-iris-500)
118
+ --color-iris-600: var(--zabi-iris-600)
119
+ --color-iris-700: var(--zabi-iris-700)
120
+ --color-iris-800: var(--zabi-iris-800)
121
+ --color-iris-900: var(--zabi-iris-900)
122
+ --color-iris-950: var(--zabi-iris-950)
123
+ /* Warning Color Scale — physical ramp + semantic aliases (Tailwind amber) */
124
+ --zabi-warning-50: #fffbeb
125
+ --zabi-warning-100: #fef3c7
126
+ --zabi-warning-200: #fde68a
127
+ --zabi-warning-300: #fcd34d
128
+ --zabi-warning-400: #fbbf24
129
+ --zabi-warning-500: #f59e0b
130
+ --zabi-warning-600: #d97706
131
+ --zabi-warning-700: #b45309
132
+ --zabi-warning-800: #92400e
133
+ --zabi-warning-900: #78350f
134
+ --zabi-warning-950: #451a03
135
+ --color-warning-50: var(--zabi-warning-50)
136
+ --color-warning-100: var(--zabi-warning-100)
137
+ --color-warning-200: var(--zabi-warning-200)
138
+ --color-warning-300: var(--zabi-warning-300)
139
+ --color-warning-400: var(--zabi-warning-400)
140
+ --color-warning-500: var(--zabi-warning-500)
141
+ --color-warning-600: var(--zabi-warning-600)
142
+ --color-warning-700: var(--zabi-warning-700)
143
+ --color-warning-800: var(--zabi-warning-800)
144
+ --color-warning-900: var(--zabi-warning-900)
145
+ --color-warning-950: var(--zabi-warning-950)
146
+ /* Error Color Scale — physical ramp + semantic aliases (Tailwind red) */
147
+ --zabi-error-50: #fef2f2
148
+ --zabi-error-100: #fee2e2
149
+ --zabi-error-200: #fecaca
150
+ --zabi-error-300: #fca5a5
151
+ --zabi-error-400: #f87171
152
+ --zabi-error-500: #ef4444
153
+ --zabi-error-600: #dc2626
154
+ --zabi-error-700: #b91c1c
155
+ --zabi-error-800: #991b1b
156
+ --zabi-error-900: #7f1d1d
157
+ --zabi-error-950: #450a0a
158
+ --color-error-50: var(--zabi-error-50)
159
+ --color-error-100: var(--zabi-error-100)
160
+ --color-error-200: var(--zabi-error-200)
161
+ --color-error-300: var(--zabi-error-300)
162
+ --color-error-400: var(--zabi-error-400)
163
+ --color-error-500: var(--zabi-error-500)
164
+ --color-error-600: var(--zabi-error-600)
165
+ --color-error-700: var(--zabi-error-700)
166
+ --color-error-800: var(--zabi-error-800)
167
+ --color-error-900: var(--zabi-error-900)
168
+ --color-error-950: var(--zabi-error-950)
79
169
  /* Base Color Scale — semantic tokens alias the physical ramp (light: 1:1) */
80
170
  --color-base-50: var(--zabi-base-50)
81
171
  --color-base-75: var(--zabi-base-75)
@@ -140,11 +230,11 @@
140
230
  --color-nav-menu-active: var(--color-action-primary-subtle)
141
231
  --color-nav-menu-focus: var(--color-brand-500)
142
232
  --color-success-text: var(--color-success)
143
- --color-warning-text: #b45309
233
+ --color-warning-text: var(--color-warning-700)
144
234
  --color-neutral-text: var(--color-base-700)
145
235
  --color-energetic-text: var(--color-citron-700)
146
- --color-error-text: #b91c1c
147
- --color-inverse: #ffffff
236
+ --color-error-text: var(--color-error-700)
237
+ --color-inverse: var(--color-base-100)
148
238
  --color-disabled: var(--color-base-400)
149
239
  /* Border Colors */
150
240
  --color-border: var(--color-base-300)
@@ -175,15 +265,15 @@
175
265
  --color-success-medium: var(--color-pine-800)
176
266
  --color-success-strong: var(--color-pine-900)
177
267
  /* Warning Colors */
178
- --color-warning: #f59e0b
179
- --color-warning-weak: #d97706
180
- --color-warning-medium: #fbbf24
181
- --color-warning-strong: #fcd34d
268
+ --color-warning: var(--color-warning-500)
269
+ --color-warning-weak: var(--color-warning-600)
270
+ --color-warning-medium: var(--color-warning-400)
271
+ --color-warning-strong: var(--color-warning-300)
182
272
  /* Error Colors */
183
- --color-error: #ef4444
184
- --color-error-weak: #dc2626
185
- --color-error-medium: #f87171
186
- --color-error-strong: #fca5a5
273
+ --color-error: var(--color-error-500)
274
+ --color-error-weak: var(--color-error-600)
275
+ --color-error-medium: var(--color-error-400)
276
+ --color-error-strong: var(--color-error-300)
187
277
  /* Energetic Colors (Citron) */
188
278
  --color-energetic: var(--color-citron-500)
189
279
  --color-energetic-weak: var(--color-citron-600)
@@ -199,6 +289,7 @@
199
289
  --color-info-weak: var(--color-iris-700)
200
290
  --color-info-medium: var(--color-iris-800)
201
291
  --color-info-strong: var(--color-iris-900)
292
+ --color-info-active: var(--color-iris-400)
202
293
  /* Text alias */
203
294
  --color-info-text: var(--color-info)
204
295
  /* ========================================
@@ -255,4 +346,7 @@
255
346
  --z-popover: 1060
256
347
  --z-tooltip: 1070
257
348
  --z-toast: 1080
349
+ /* Tooltip — elevated hint surface (Tooltip.svelte); arrow uses --color-tooltip-bg */
350
+ --color-tooltip-bg: var(--color-base-800)
351
+ --color-tooltip-fg: var(--color-base-50)
258
352
  }
package/dist/zabi-components-theme.css CHANGED
@@ -30,54 +30,144 @@
30
30
  --zabi-base-950: #09090b
31
31
  /* Typography - Nunito Sans font family */
32
32
  --font-family-sans: 'Nunito Sans', ui-sans-serif, system-ui, sans-serif
33
- /* Brand Color Scale */
34
- --color-brand-50: #f7faff
35
- --color-brand-100: #edf2fb
36
- --color-brand-200: #dfe7fb
37
- --color-brand-300: #ccdbfd
38
- --color-brand-400: #abc4ff
39
- --color-brand-500: #8fa8ff
40
- --color-brand-600: #6e84fa
41
- --color-brand-700: #5366e2
42
- --color-brand-800: #3f4fc0
43
- --color-brand-900: #2f3c99
44
- --color-brand-950: #1f2866
45
- /* Citron Color Scale */
46
- --color-citron-50: #f9faeb
47
- --color-citron-100: #f1f5cf
48
- --color-citron-200: #e4ecaa
49
- --color-citron-300: #d5e184
50
- --color-citron-400: #c7d460
51
- --color-citron-500: #bbbe64
52
- --color-citron-600: #a3a852
53
- --color-citron-700: #848a43
54
- --color-citron-800: #666c35
55
- --color-citron-900: #4d5229
56
- --color-citron-950: #323518
57
- /* Pine Color Scale */
58
- --color-pine-50: #e9f6f2
59
- --color-pine-100: #d2ece4
60
- --color-pine-200: #a7d9c9
61
- --color-pine-300: #78c4ad
62
- --color-pine-400: #49ad91
63
- --color-pine-500: #0C5D43
64
- --color-pine-600: #0a513a
65
- --color-pine-700: #084532
66
- --color-pine-800: #063a2a
67
- --color-pine-900: #04231a
68
- --color-pine-950: #02160f
69
- /* Iris Color Scale */
70
- --color-iris-50: #f4f4fa
71
- --color-iris-100: #e9e9f7
72
- --color-iris-200: #d6d6f0
73
- --color-iris-300: #bdbde6
74
- --color-iris-400: #a3a3d8
75
- --color-iris-500: #6969B3
76
- --color-iris-600: #58589e
77
- --color-iris-700: #474788
78
- --color-iris-800: #38386f
79
- --color-iris-900: #2a2a56
80
- --color-iris-950: #1b1b37
33
+ /* Brand Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
34
+ --zabi-brand-50: #f7faff
35
+ --zabi-brand-100: #edf2fb
36
+ --zabi-brand-200: #dfe7fb
37
+ --zabi-brand-300: #ccdbfd
38
+ --zabi-brand-400: #abc4ff
39
+ --zabi-brand-500: #8fa8ff
40
+ --zabi-brand-600: #6e84fa
41
+ --zabi-brand-700: #5366e2
42
+ --zabi-brand-800: #3f4fc0
43
+ --zabi-brand-900: #2f3c99
44
+ --zabi-brand-950: #1f2866
45
+ --color-brand-50: var(--zabi-brand-50)
46
+ --color-brand-100: var(--zabi-brand-100)
47
+ --color-brand-200: var(--zabi-brand-200)
48
+ --color-brand-300: var(--zabi-brand-300)
49
+ --color-brand-400: var(--zabi-brand-400)
50
+ --color-brand-500: var(--zabi-brand-500)
51
+ --color-brand-600: var(--zabi-brand-600)
52
+ --color-brand-700: var(--zabi-brand-700)
53
+ --color-brand-800: var(--zabi-brand-800)
54
+ --color-brand-900: var(--zabi-brand-900)
55
+ --color-brand-950: var(--zabi-brand-950)
56
+ /* Citron Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
57
+ --zabi-citron-50: #f9faeb
58
+ --zabi-citron-100: #f1f5cf
59
+ --zabi-citron-200: #e4ecaa
60
+ --zabi-citron-300: #d5e184
61
+ --zabi-citron-400: #c7d460
62
+ --zabi-citron-500: #bbbe64
63
+ --zabi-citron-600: #a3a852
64
+ --zabi-citron-700: #848a43
65
+ --zabi-citron-800: #666c35
66
+ --zabi-citron-900: #4d5229
67
+ --zabi-citron-950: #323518
68
+ --color-citron-50: var(--zabi-citron-50)
69
+ --color-citron-100: var(--zabi-citron-100)
70
+ --color-citron-200: var(--zabi-citron-200)
71
+ --color-citron-300: var(--zabi-citron-300)
72
+ --color-citron-400: var(--zabi-citron-400)
73
+ --color-citron-500: var(--zabi-citron-500)
74
+ --color-citron-600: var(--zabi-citron-600)
75
+ --color-citron-700: var(--zabi-citron-700)
76
+ --color-citron-800: var(--zabi-citron-800)
77
+ --color-citron-900: var(--zabi-citron-900)
78
+ --color-citron-950: var(--zabi-citron-950)
79
+ /* Pine Color Scale — physical ramp + semantic aliases (mirror pattern matches --zabi-base-* / --color-base-*) */
80
+ --zabi-pine-50: #e9f6f2
81
+ --zabi-pine-100: #d2ece4
82
+ --zabi-pine-200: #a7d9c9
83
+ --zabi-pine-300: #78c4ad
84
+ --zabi-pine-400: #49ad91
85
+ --zabi-pine-500: #0c5d43
86
+ --zabi-pine-600: #0a513a
87
+ --zabi-pine-700: #084532
88
+ --zabi-pine-800: #063a2a
89
+ --zabi-pine-900: #04231a
90
+ --zabi-pine-950: #02160f
91
+ --color-pine-50: var(--zabi-pine-50)
92
+ --color-pine-100: var(--zabi-pine-100)
93
+ --color-pine-200: var(--zabi-pine-200)
94
+ --color-pine-300: var(--zabi-pine-300)
95
+ --color-pine-400: var(--zabi-pine-400)
96
+ --color-pine-500: var(--zabi-pine-500)
97
+ --color-pine-600: var(--zabi-pine-600)
98
+ --color-pine-700: var(--zabi-pine-700)
99
+ --color-pine-800: var(--zabi-pine-800)
100
+ --color-pine-900: var(--zabi-pine-900)
101
+ --color-pine-950: var(--zabi-pine-950)
102
+ /* Iris Color Scale — physical ramp + semantic aliases (same mirror pattern as pine / base) */
103
+ --zabi-iris-50: #f4f4fa
104
+ --zabi-iris-100: #e9e9f7
105
+ --zabi-iris-200: #d6d6f0
106
+ --zabi-iris-300: #bdbde6
107
+ --zabi-iris-400: #a3a3d8
108
+ --zabi-iris-500: #6969b3
109
+ --zabi-iris-600: #58589e
110
+ --zabi-iris-700: #474788
111
+ --zabi-iris-800: #38386f
112
+ --zabi-iris-900: #2a2a56
113
+ --zabi-iris-950: #1b1b37
114
+ --color-iris-50: var(--zabi-iris-50)
115
+ --color-iris-100: var(--zabi-iris-100)
116
+ --color-iris-200: var(--zabi-iris-200)
117
+ --color-iris-300: var(--zabi-iris-300)
118
+ --color-iris-400: var(--zabi-iris-400)
119
+ --color-iris-500: var(--zabi-iris-500)
120
+ --color-iris-600: var(--zabi-iris-600)
121
+ --color-iris-700: var(--zabi-iris-700)
122
+ --color-iris-800: var(--zabi-iris-800)
123
+ --color-iris-900: var(--zabi-iris-900)
124
+ --color-iris-950: var(--zabi-iris-950)
125
+ /* Warning Color Scale — physical ramp + semantic aliases (Tailwind amber) */
126
+ --zabi-warning-50: #fffbeb
127
+ --zabi-warning-100: #fef3c7
128
+ --zabi-warning-200: #fde68a
129
+ --zabi-warning-300: #fcd34d
130
+ --zabi-warning-400: #fbbf24
131
+ --zabi-warning-500: #f59e0b
132
+ --zabi-warning-600: #d97706
133
+ --zabi-warning-700: #b45309
134
+ --zabi-warning-800: #92400e
135
+ --zabi-warning-900: #78350f
136
+ --zabi-warning-950: #451a03
137
+ --color-warning-50: var(--zabi-warning-50)
138
+ --color-warning-100: var(--zabi-warning-100)
139
+ --color-warning-200: var(--zabi-warning-200)
140
+ --color-warning-300: var(--zabi-warning-300)
141
+ --color-warning-400: var(--zabi-warning-400)
142
+ --color-warning-500: var(--zabi-warning-500)
143
+ --color-warning-600: var(--zabi-warning-600)
144
+ --color-warning-700: var(--zabi-warning-700)
145
+ --color-warning-800: var(--zabi-warning-800)
146
+ --color-warning-900: var(--zabi-warning-900)
147
+ --color-warning-950: var(--zabi-warning-950)
148
+ /* Error Color Scale — physical ramp + semantic aliases (Tailwind red) */
149
+ --zabi-error-50: #fef2f2
150
+ --zabi-error-100: #fee2e2
151
+ --zabi-error-200: #fecaca
152
+ --zabi-error-300: #fca5a5
153
+ --zabi-error-400: #f87171
154
+ --zabi-error-500: #ef4444
155
+ --zabi-error-600: #dc2626
156
+ --zabi-error-700: #b91c1c
157
+ --zabi-error-800: #991b1b
158
+ --zabi-error-900: #7f1d1d
159
+ --zabi-error-950: #450a0a
160
+ --color-error-50: var(--zabi-error-50)
161
+ --color-error-100: var(--zabi-error-100)
162
+ --color-error-200: var(--zabi-error-200)
163
+ --color-error-300: var(--zabi-error-300)
164
+ --color-error-400: var(--zabi-error-400)
165
+ --color-error-500: var(--zabi-error-500)
166
+ --color-error-600: var(--zabi-error-600)
167
+ --color-error-700: var(--zabi-error-700)
168
+ --color-error-800: var(--zabi-error-800)
169
+ --color-error-900: var(--zabi-error-900)
170
+ --color-error-950: var(--zabi-error-950)
81
171
  /* Base Color Scale — semantic tokens alias the physical ramp (light: 1:1) */
82
172
  --color-base-50: var(--zabi-base-50)
83
173
  --color-base-75: var(--zabi-base-75)
@@ -142,11 +232,11 @@
142
232
  --color-nav-menu-active: var(--color-action-primary-subtle)
143
233
  --color-nav-menu-focus: var(--color-brand-500)
144
234
  --color-success-text: var(--color-success)
145
- --color-warning-text: #b45309
235
+ --color-warning-text: var(--color-warning-700)
146
236
  --color-neutral-text: var(--color-base-700)
147
237
  --color-energetic-text: var(--color-citron-700)
148
- --color-error-text: #b91c1c
149
- --color-inverse: #ffffff
238
+ --color-error-text: var(--color-error-700)
239
+ --color-inverse: var(--color-base-100)
150
240
  --color-disabled: var(--color-base-400)
151
241
  /* Border Colors */
152
242
  --color-border: var(--color-base-300)
@@ -177,15 +267,15 @@
177
267
  --color-success-medium: var(--color-pine-800)
178
268
  --color-success-strong: var(--color-pine-900)
179
269
  /* Warning Colors */
180
- --color-warning: #f59e0b
181
- --color-warning-weak: #d97706
182
- --color-warning-medium: #fbbf24
183
- --color-warning-strong: #fcd34d
270
+ --color-warning: var(--color-warning-500)
271
+ --color-warning-weak: var(--color-warning-600)
272
+ --color-warning-medium: var(--color-warning-400)
273
+ --color-warning-strong: var(--color-warning-300)
184
274
  /* Error Colors */
185
- --color-error: #ef4444
186
- --color-error-weak: #dc2626
187
- --color-error-medium: #f87171
188
- --color-error-strong: #fca5a5
275
+ --color-error: var(--color-error-500)
276
+ --color-error-weak: var(--color-error-600)
277
+ --color-error-medium: var(--color-error-400)
278
+ --color-error-strong: var(--color-error-300)
189
279
  /* Energetic Colors (Citron) */
190
280
  --color-energetic: var(--color-citron-500)
191
281
  --color-energetic-weak: var(--color-citron-600)
@@ -201,6 +291,7 @@
201
291
  --color-info-weak: var(--color-iris-700)
202
292
  --color-info-medium: var(--color-iris-800)
203
293
  --color-info-strong: var(--color-iris-900)
294
+ --color-info-active: var(--color-iris-400)
204
295
  /* Text alias */
205
296
  --color-info-text: var(--color-info)
206
297
  /* ========================================
@@ -257,4 +348,7 @@
257
348
  --z-popover: 1060
258
349
  --z-tooltip: 1070
259
350
  --z-toast: 1080
351
+ /* Tooltip — elevated hint surface (Tooltip.svelte); arrow uses --color-tooltip-bg */
352
+ --color-tooltip-bg: var(--color-base-800)
353
+ --color-tooltip-fg: var(--color-base-50)
260
354
  }