@dialpad/dialtone-css 8.80.0-next.3 → 8.80.0-next.5

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 (128) hide show
  1. package/lib/build/js/dialtone_migrate_chip_interactive/index.mjs +367 -0
  2. package/lib/build/js/dialtone_migrate_chip_interactive/test.mjs +244 -0
  3. package/lib/build/js/dialtone_migrate_scrollbar_always/index.mjs +225 -0
  4. package/lib/build/less/components/box.less +2 -0
  5. package/lib/build/less/components/link.less +14 -19
  6. package/lib/build/less/components/notice.less +1 -1
  7. package/lib/build/less/components/rich-text-editor.less +24 -0
  8. package/lib/build/less/components/scrollbar.less +22 -0
  9. package/lib/build/less/dialtone.less +7 -0
  10. package/lib/dist/dialtone-default-theme.css +334 -293
  11. package/lib/dist/dialtone-default-theme.min.css +1 -1
  12. package/lib/dist/dialtone-docs.json +1 -1
  13. package/lib/dist/dialtone.css +50 -15
  14. package/lib/dist/dialtone.min.css +1 -1
  15. package/lib/dist/js/dialtone_migrate_chip_interactive/index.mjs +367 -0
  16. package/lib/dist/js/dialtone_migrate_chip_interactive/test.mjs +244 -0
  17. package/lib/dist/js/dialtone_migrate_scrollbar_always/index.mjs +225 -0
  18. package/lib/dist/tokens/tokens-101-dark.css +141 -135
  19. package/lib/dist/tokens/tokens-101-light.css +164 -158
  20. package/lib/dist/tokens/tokens-102-dark.css +141 -135
  21. package/lib/dist/tokens/tokens-102-light.css +164 -158
  22. package/lib/dist/tokens/tokens-103-dark.css +141 -135
  23. package/lib/dist/tokens/tokens-103-light.css +164 -158
  24. package/lib/dist/tokens/tokens-104-dark.css +141 -135
  25. package/lib/dist/tokens/tokens-104-light.css +164 -158
  26. package/lib/dist/tokens/tokens-105-dark.css +141 -135
  27. package/lib/dist/tokens/tokens-105-light.css +164 -158
  28. package/lib/dist/tokens/tokens-106-dark.css +141 -135
  29. package/lib/dist/tokens/tokens-106-light.css +164 -158
  30. package/lib/dist/tokens/tokens-107-dark.css +141 -135
  31. package/lib/dist/tokens/tokens-107-light.css +164 -158
  32. package/lib/dist/tokens/tokens-108-dark.css +141 -135
  33. package/lib/dist/tokens/tokens-108-light.css +164 -158
  34. package/lib/dist/tokens/tokens-109-dark.css +141 -135
  35. package/lib/dist/tokens/tokens-109-light.css +164 -158
  36. package/lib/dist/tokens/tokens-110-dark.css +141 -135
  37. package/lib/dist/tokens/tokens-110-light.css +164 -158
  38. package/lib/dist/tokens/tokens-111-dark.css +141 -135
  39. package/lib/dist/tokens/tokens-111-light.css +164 -158
  40. package/lib/dist/tokens/tokens-112-dark.css +141 -135
  41. package/lib/dist/tokens/tokens-112-light.css +164 -158
  42. package/lib/dist/tokens/tokens-113-dark.css +141 -135
  43. package/lib/dist/tokens/tokens-113-light.css +164 -158
  44. package/lib/dist/tokens/tokens-114-dark.css +141 -135
  45. package/lib/dist/tokens/tokens-114-light.css +164 -158
  46. package/lib/dist/tokens/tokens-115-dark.css +141 -135
  47. package/lib/dist/tokens/tokens-115-light.css +164 -158
  48. package/lib/dist/tokens/tokens-116-dark.css +141 -135
  49. package/lib/dist/tokens/tokens-116-light.css +164 -158
  50. package/lib/dist/tokens/tokens-117-dark.css +141 -135
  51. package/lib/dist/tokens/tokens-117-light.css +164 -158
  52. package/lib/dist/tokens/tokens-118-dark.css +141 -135
  53. package/lib/dist/tokens/tokens-118-light.css +164 -158
  54. package/lib/dist/tokens/tokens-119-dark.css +141 -135
  55. package/lib/dist/tokens/tokens-119-light.css +164 -158
  56. package/lib/dist/tokens/tokens-120-dark.css +141 -135
  57. package/lib/dist/tokens/tokens-120-light.css +164 -158
  58. package/lib/dist/tokens/tokens-121-dark.css +141 -135
  59. package/lib/dist/tokens/tokens-121-light.css +164 -158
  60. package/lib/dist/tokens/tokens-122-dark.css +141 -135
  61. package/lib/dist/tokens/tokens-122-light.css +164 -158
  62. package/lib/dist/tokens/tokens-123-dark.css +141 -135
  63. package/lib/dist/tokens/tokens-123-light.css +164 -158
  64. package/lib/dist/tokens/tokens-124-dark.css +141 -135
  65. package/lib/dist/tokens/tokens-124-light.css +164 -158
  66. package/lib/dist/tokens/tokens-125-dark.css +141 -135
  67. package/lib/dist/tokens/tokens-125-light.css +164 -158
  68. package/lib/dist/tokens/tokens-126-dark.css +141 -135
  69. package/lib/dist/tokens/tokens-126-light.css +164 -158
  70. package/lib/dist/tokens/tokens-127-dark.css +141 -135
  71. package/lib/dist/tokens/tokens-127-light.css +164 -158
  72. package/lib/dist/tokens/tokens-128-dark.css +141 -135
  73. package/lib/dist/tokens/tokens-128-light.css +164 -158
  74. package/lib/dist/tokens/tokens-129-dark.css +141 -135
  75. package/lib/dist/tokens/tokens-129-light.css +164 -158
  76. package/lib/dist/tokens/tokens-130-dark.css +141 -135
  77. package/lib/dist/tokens/tokens-130-light.css +164 -158
  78. package/lib/dist/tokens/tokens-131-dark.css +141 -135
  79. package/lib/dist/tokens/tokens-131-light.css +164 -158
  80. package/lib/dist/tokens/tokens-132-dark.css +141 -135
  81. package/lib/dist/tokens/tokens-132-light.css +164 -158
  82. package/lib/dist/tokens/tokens-133-dark.css +141 -135
  83. package/lib/dist/tokens/tokens-133-light.css +164 -158
  84. package/lib/dist/tokens/tokens-134-dark.css +141 -135
  85. package/lib/dist/tokens/tokens-134-light.css +164 -158
  86. package/lib/dist/tokens/tokens-135-dark.css +141 -135
  87. package/lib/dist/tokens/tokens-135-light.css +164 -158
  88. package/lib/dist/tokens/tokens-136-dark.css +141 -135
  89. package/lib/dist/tokens/tokens-136-light.css +164 -158
  90. package/lib/dist/tokens/tokens-137-dark.css +141 -135
  91. package/lib/dist/tokens/tokens-137-light.css +164 -158
  92. package/lib/dist/tokens/tokens-aegean-dark.css +164 -158
  93. package/lib/dist/tokens/tokens-aegean-light.css +184 -178
  94. package/lib/dist/tokens/tokens-base-dark.css +98 -98
  95. package/lib/dist/tokens/tokens-base-light.css +98 -98
  96. package/lib/dist/tokens/tokens-botany-dark.css +149 -143
  97. package/lib/dist/tokens/tokens-botany-light.css +171 -165
  98. package/lib/dist/tokens/tokens-buttercream-dark.css +148 -142
  99. package/lib/dist/tokens/tokens-buttercream-light.css +171 -165
  100. package/lib/dist/tokens/tokens-ceruleo-dark.css +164 -158
  101. package/lib/dist/tokens/tokens-ceruleo-light.css +184 -178
  102. package/lib/dist/tokens/tokens-contrast-high-dark.css +3 -3
  103. package/lib/dist/tokens/tokens-contrast-high-light.css +10 -10
  104. package/lib/dist/tokens/tokens-debug-dp.css +28 -22
  105. package/lib/dist/tokens/tokens-dp-dark.css +166 -160
  106. package/lib/dist/tokens/tokens-dp-light.css +186 -180
  107. package/lib/dist/tokens/tokens-expressive-dark.css +163 -157
  108. package/lib/dist/tokens/tokens-expressive-light.css +186 -180
  109. package/lib/dist/tokens/tokens-expressive-sm-dark.css +163 -157
  110. package/lib/dist/tokens/tokens-expressive-sm-light.css +186 -180
  111. package/lib/dist/tokens/tokens-high-desert-dark.css +144 -138
  112. package/lib/dist/tokens/tokens-high-desert-light.css +164 -158
  113. package/lib/dist/tokens/tokens-melon-dark.css +145 -139
  114. package/lib/dist/tokens/tokens-melon-light.css +165 -159
  115. package/lib/dist/tokens/tokens-plum-dark.css +153 -147
  116. package/lib/dist/tokens/tokens-plum-light.css +164 -158
  117. package/lib/dist/tokens/tokens-prota-deuter-dark.css +292 -262
  118. package/lib/dist/tokens/tokens-prota-deuter-light.css +315 -285
  119. package/lib/dist/tokens/tokens-sunflower-dark.css +154 -148
  120. package/lib/dist/tokens/tokens-sunflower-light.css +174 -168
  121. package/lib/dist/tokens/tokens-tmo-dark.css +165 -159
  122. package/lib/dist/tokens/tokens-tmo-light.css +185 -179
  123. package/lib/dist/tokens/tokens-trita-dark.css +239 -197
  124. package/lib/dist/tokens/tokens-trita-light.css +263 -221
  125. package/lib/dist/tokens/tokens-verdant-haze-dark.css +144 -138
  126. package/lib/dist/tokens/tokens-verdant-haze-light.css +164 -158
  127. package/lib/dist/tokens-docs.json +1 -1
  128. package/package.json +11 -4
@@ -121,8 +121,9 @@
121
121
  --dt-theme-mention-color-background-strong: var(--dt-color-purple-900);
122
122
  --dt-theme-mention-color-foreground: var(--dt-color-black-50);
123
123
  --dt-theme-color-base: var(--dt-color-black-900);
124
- --dt-action-color-background-positive-primary-hover: var(--dt-color-green-800);
125
- --dt-action-color-background-positive-primary-default: var(--dt-color-green-700); /* Postive, accepting, or success actions. */
124
+ --dt-action-color-background-positive-primary-active: var(--dt-color-green-800);
125
+ --dt-action-color-background-positive-primary-hover: var(--dt-color-green-700);
126
+ --dt-action-color-background-positive-primary-default: var(--dt-color-green-600); /* Postive, accepting, or success actions. */
126
127
  --dt-action-color-background-positive-default: var(--dt-color-neutral-transparent);
127
128
  --dt-action-color-background-muted-default: var(--dt-color-neutral-transparent);
128
129
  --dt-action-color-background-inverted-primary-active: var(--dt-color-purple-200);
@@ -132,9 +133,9 @@
132
133
  --dt-action-color-background-critical-primary-hover: var(--dt-color-red-600);
133
134
  --dt-action-color-background-critical-primary-default: var(--dt-color-red-500);
134
135
  --dt-action-color-background-critical-default: var(--dt-color-neutral-transparent);
135
- --dt-action-color-background-base-primary-active: var(--dt-color-purple-800);
136
- --dt-action-color-background-base-primary-hover: var(--dt-color-purple-700);
137
- --dt-action-color-background-base-primary-default: var(--dt-color-purple-600);
136
+ --dt-action-color-background-base-primary-active: var(--dt-color-purple-700);
137
+ --dt-action-color-background-base-primary-hover: var(--dt-color-purple-600);
138
+ --dt-action-color-background-base-primary-default: var(--dt-color-purple-500);
138
139
  --dt-action-color-background-base-default: var(--dt-color-neutral-transparent);
139
140
  --dt-action-color-foreground-positive-primary-default: var(--dt-color-black-50);
140
141
  --dt-action-color-foreground-critical-primary-default: var(--dt-color-black-50);
@@ -426,19 +427,16 @@
426
427
  --dt-color-border-brand-strong-inverted: var(--dt-color-purple-200);
427
428
  --dt-color-border-info-strong-inverted: var(--dt-color-blue-200);
428
429
  --dt-color-border-warning-strong-inverted: var(--dt-color-gold-300);
429
- --dt-color-border-success-strong-inverted: var(--dt-color-green-500);
430
430
  --dt-color-border-positive-strong-inverted: var(--dt-color-green-500);
431
431
  --dt-color-border-critical-strong-inverted: var(--dt-color-red-200);
432
432
  --dt-color-border-brand-subtle-inverted: var(--dt-color-purple-600);
433
433
  --dt-color-border-info-subtle-inverted: var(--dt-color-blue-900);
434
434
  --dt-color-border-warning-subtle-inverted: var(--dt-color-gold-800);
435
- --dt-color-border-success-subtle-inverted: var(--dt-color-green-900);
436
435
  --dt-color-border-positive-subtle-inverted: var(--dt-color-green-900);
437
436
  --dt-color-border-critical-subtle-inverted: var(--dt-color-red-900);
438
437
  --dt-color-border-brand-inverted: var(--dt-color-purple-400);
439
438
  --dt-color-border-info-inverted: var(--dt-color-blue-300);
440
439
  --dt-color-border-warning-inverted: var(--dt-color-gold-500);
441
- --dt-color-border-success-inverted: var(--dt-color-green-500);
442
440
  --dt-color-border-positive-inverted: var(--dt-color-green-500);
443
441
  --dt-color-border-critical-inverted: var(--dt-color-red-300);
444
442
  --dt-color-border-bold-inverted: oklch(1 0 0 / 0.5);
@@ -448,39 +446,34 @@
448
446
  --dt-color-border-brand-strong: var(--dt-color-purple-800);
449
447
  --dt-color-border-info-strong: var(--dt-color-blue-800);
450
448
  --dt-color-border-warning-strong: var(--dt-color-gold-700);
451
- --dt-color-border-success-strong: var(--dt-color-green-900);
452
449
  --dt-color-border-positive-strong: var(--dt-color-green-900);
453
450
  --dt-color-border-critical-strong: var(--dt-color-red-800);
454
451
  --dt-color-border-brand-subtle: var(--dt-color-purple-300);
455
452
  --dt-color-border-info-subtle: var(--dt-color-blue-300);
456
453
  --dt-color-border-warning-subtle: var(--dt-color-gold-300);
457
- --dt-color-border-success-subtle: var(--dt-color-green-300);
458
454
  --dt-color-border-positive-subtle: var(--dt-color-green-300);
459
455
  --dt-color-border-critical-subtle: var(--dt-color-red-300);
460
456
  --dt-color-border-brand: var(--dt-color-brand-purple);
461
457
  --dt-color-border-info: var(--dt-color-blue-600);
462
458
  --dt-color-border-warning: var(--dt-color-gold-500);
463
- --dt-color-border-success: var(--dt-color-green-700);
464
459
  --dt-color-border-positive: var(--dt-color-green-700);
465
460
  --dt-color-border-critical: var(--dt-color-red-600);
466
- --dt-color-border-bold: oklch(0.23 0 0 / 0.5);
467
- --dt-color-border-moderate: oklch(0.23 0 0 / 0.3);
468
- --dt-color-border-default: oklch(0.23 0 0 / 0.17);
469
- --dt-color-border-subtle: oklch(0.23 0 0 / 0.11);
461
+ --dt-color-border-bold: oklch(0.26 0.01 78.2 / 0.5);
462
+ --dt-color-border-moderate: oklch(0.26 0.01 78.2 / 0.3);
463
+ --dt-color-border-default: oklch(0.26 0.01 78.2 / 0.17);
464
+ --dt-color-border-subtle: oklch(0.26 0.01 78.2 / 0.11);
470
465
  --dt-color-surface-ai: var(--dt-color-gradient-gold-red-magenta-purple);
471
466
  --dt-color-surface-backdrop: oklch(0 0 0 / 0.65); /* Background color for a modal-like backdrop. */
472
- --dt-color-surface-brand-subtle-opaque-inverted: oklch(0.16 0.08 292 / 0.66); /* Info surface as opaque background color. */
473
- --dt-color-surface-info-subtle-opaque-inverted: oklch(0.14 0.03 244 / 0.66); /* Info surface as opaque background color. */
474
- --dt-color-surface-success-subtle-opaque-inverted: oklch(0.21 0.05 162 / 0.66); /* Success subtle surface as opaque background color. */
467
+ --dt-color-surface-brand-subtle-opaque-inverted: oklch(0.15 0.09 291 / 0.66); /* Info surface as opaque background color. */
468
+ --dt-color-surface-info-subtle-opaque-inverted: oklch(0.16 0.05 252 / 0.66); /* Info surface as opaque background color. */
475
469
  --dt-color-surface-positive-subtle-opaque-inverted: oklch(0.21 0.05 162 / 0.66); /* Positive subtle surface as opaque background color. */
476
- --dt-color-surface-warning-subtle-opaque-inverted: oklch(0.2 0.04 76.1 / 0.3); /* Warning subtle surface as opaque background color */
477
- --dt-color-surface-critical-subtle-opaque-inverted: oklch(0.17 0.07 16.5 / 0.6); /* Critical subtle surface as opaque background color. */
478
- --dt-color-surface-brand-opaque-inverted: oklch(0.23 0.13 285 / 0.8); /* Info surface as opaque background color. */
479
- --dt-color-surface-info-opaque-inverted: oklch(0.22 0.05 248 / 0.6); /* Info surface as opaque background color. */
480
- --dt-color-surface-success-opaque-inverted: oklch(0.34 0.08 157 / 0.3); /* Success surface as opaque background color. */
470
+ --dt-color-surface-warning-subtle-opaque-inverted: oklch(0.18 0.04 77.5 / 0.3); /* Warning subtle surface as opaque background color */
471
+ --dt-color-surface-critical-subtle-opaque-inverted: oklch(0.17 0.07 8 / 0.6); /* Critical subtle surface as opaque background color. */
472
+ --dt-color-surface-brand-opaque-inverted: oklch(0.22 0.13 285 / 0.8); /* Info surface as opaque background color. */
473
+ --dt-color-surface-info-opaque-inverted: oklch(0.26 0.09 258 / 0.6); /* Info surface as opaque background color. */
481
474
  --dt-color-surface-positive-opaque-inverted: oklch(0.34 0.08 157 / 0.3); /* Positive surface as opaque background color. */
482
- --dt-color-surface-warning-opaque-inverted: oklch(0.35 0.07 68.3 / 0.35); /* Warning surface as opaque background color */
483
- --dt-color-surface-critical-opaque-inverted: oklch(0.32 0.13 12.4 / 0.5); /* Critical surface as opaque background color. */
475
+ --dt-color-surface-warning-opaque-inverted: oklch(0.32 0.07 64.8 / 0.35); /* Warning surface as opaque background color */
476
+ --dt-color-surface-critical-opaque-inverted: oklch(0.31 0.13 14.7 / 0.5); /* Critical surface as opaque background color. */
484
477
  --dt-color-surface-contrast-opaque-inverted: oklch(1 0 0 / 0.97); /* Contrast surface as opaque background color. */
485
478
  --dt-color-surface-strong-opaque-inverted: oklch(1 0 0 / 0.67); /* Strong surface as opaque background color. */
486
479
  --dt-color-surface-bold-opaque-inverted: oklch(1 0 0 / 0.32); /* Bold surface as opaque background color. */
@@ -493,13 +486,11 @@
493
486
  --dt-color-surface-critical-strong-inverted: var(--dt-color-red-300); /* A contrasting critical surface, most likely paired with inverted foreground colors. */
494
487
  --dt-color-surface-brand-subtle-inverted: var(--dt-color-purple-1000); /* A softer version of the default informational surface. */
495
488
  --dt-color-surface-info-subtle-inverted: var(--dt-color-blue-1000); /* A softer version of the default informational surface. */
496
- --dt-color-surface-success-subtle-inverted: var(--dt-color-green-1000); /* A softer version of the default success surface. */
497
489
  --dt-color-surface-positive-subtle-inverted: var(--dt-color-green-1000); /* A softer version of the default positive surface. */
498
490
  --dt-color-surface-warning-subtle-inverted: var(--dt-color-gold-1000); /* A softer version of the default warning surface. */
499
491
  --dt-color-surface-critical-subtle-inverted: var(--dt-color-red-1000); /* A softer version of the Critical surface. */
500
492
  --dt-color-surface-brand-inverted: var(--dt-color-purple-950); /* Background surface color containing messaging or elements communicated as generally informational. */
501
493
  --dt-color-surface-info-inverted: var(--dt-color-blue-950); /* Background surface color containing messaging or elements communicated as generally informational. */
502
- --dt-color-surface-success-inverted: var(--dt-color-green-900); /* Background surface color containing messaging or elements expressing a positive or successful state. */
503
494
  --dt-color-surface-positive-inverted: var(--dt-color-green-900); /* Background surface color containing messaging or elements expressing a positive or successful state. */
504
495
  --dt-color-surface-warning-inverted: var(--dt-color-gold-950); /* Background surface color highlighting messaging or elements that may require user's attention. */
505
496
  --dt-color-surface-critical-inverted: var(--dt-color-red-950); /* Background surface color containing error, danger, or otherwise critical messaging or elements. */
@@ -509,38 +500,33 @@
509
500
  --dt-color-surface-moderate-inverted: var(--dt-color-black-700); /* A tertiary surface level, prominent without being too overpowering. */
510
501
  --dt-color-surface-secondary-inverted: var(--dt-color-black-800); /* For adjacent or complementary regions. */
511
502
  --dt-color-surface-primary-inverted: var(--dt-color-black-1000); /* An inverted surface for lightened content and elements, most likely paired with inverted foreground colors. */
512
- --dt-color-surface-brand-subtle-opaque: oklch(0.84 0.08 300 / 0.2); /* Info surface as opaque background color. */
513
- --dt-color-surface-info-subtle-opaque: oklch(0.96 0.01 248 / 0.5); /* Info surface as opaque background color. */
514
- --dt-color-surface-success-subtle-opaque: oklch(0.96 0.06 167 / 0.5); /* Success subtle surface as opaque background color. */
503
+ --dt-color-surface-brand-subtle-opaque: oklch(0.85 0.09 301 / 0.2); /* Info surface as opaque background color. */
504
+ --dt-color-surface-info-subtle-opaque: oklch(0.9 0.05 257 / 0.5); /* Info surface as opaque background color. */
515
505
  --dt-color-surface-positive-subtle-opaque: oklch(0.96 0.06 167 / 0.5); /* Positive subtle surface as opaque background color. */
516
- --dt-color-surface-warning-subtle-opaque: oklch(0.97 0.05 94.4 / 0.5); /* Warning subtle surface as opaque background color */
517
- --dt-color-surface-critical-subtle-opaque: oklch(0.93 0.03 15.2 / 0.5); /* Critical subtle surface as opaque background color. */
518
- --dt-color-surface-brand-opaque: oklch(0.84 0.08 300 / 0.27); /* Info surface as opaque background color. */
519
- --dt-color-surface-info-opaque: oklch(0.91 0.04 232 / 0.35); /* Info surface as opaque background color. */
520
- --dt-color-surface-success-opaque: oklch(0.79 0.17 159 / 0.25); /* Success surface as opaque background color. */
506
+ --dt-color-surface-warning-subtle-opaque: oklch(0.94 0.05 77.3 / 0.5); /* Warning subtle surface as opaque background color */
507
+ --dt-color-surface-critical-subtle-opaque: oklch(0.88 0.07 17.3 / 0.5); /* Critical subtle surface as opaque background color. */
508
+ --dt-color-surface-brand-opaque: oklch(0.85 0.09 301 / 0.39); /* Info surface as opaque background color. */
509
+ --dt-color-surface-info-opaque: oklch(0.84 0.08 257 / 0.35); /* Info surface as opaque background color. */
521
510
  --dt-color-surface-positive-opaque: oklch(0.79 0.17 159 / 0.25); /* Positive surface as opaque background color. */
522
- --dt-color-surface-warning-opaque: oklch(0.93 0.1 93.2 / 0.5); /* Warning surface as opaque background color */
523
- --dt-color-surface-critical-opaque: oklch(0.82 0.07 24.1 / 0.31); /* Critical surface as opaque background color. */
524
- --dt-color-surface-contrast-opaque: oklch(0.23 0 0 / 0.94); /* Contrast surface as opaque background color. */
525
- --dt-color-surface-strong-opaque: oklch(0.23 0 0 / 0.76); /* Strong surface as opaque background color. */
526
- --dt-color-surface-bold-opaque: oklch(0.23 0 0 / 0.19); /* Bold surface as opaque background color. */
527
- --dt-color-surface-moderate-opaque: oklch(0.23 0 0 / 0.1); /* Moderate surface as opaque background color. */
528
- --dt-color-surface-secondary-opaque: oklch(0.23 0 0 / 0.02); /* Secondary surface as opaque background color. */
511
+ --dt-color-surface-warning-opaque: oklch(0.9 0.09 77.6 / 0.5); /* Warning surface as opaque background color */
512
+ --dt-color-surface-critical-opaque: oklch(0.82 0.1 12.7 / 0.31); /* Critical surface as opaque background color. */
513
+ --dt-color-surface-contrast-opaque: oklch(0.26 0.01 78.2 / 0.94); /* Contrast surface as opaque background color. */
514
+ --dt-color-surface-strong-opaque: oklch(0.26 0.01 78.2 / 0.76); /* Strong surface as opaque background color. */
515
+ --dt-color-surface-bold-opaque: oklch(0.26 0.01 78.2 / 0.19); /* Bold surface as opaque background color. */
516
+ --dt-color-surface-moderate-opaque: oklch(0.26 0.01 78.2 / 0.1); /* Moderate surface as opaque background color. */
517
+ --dt-color-surface-secondary-opaque: oklch(0.26 0.01 78.2 / 0.02); /* Secondary surface as opaque background color. */
529
518
  --dt-color-surface-brand-strong: var(--dt-color-purple-600); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
530
- --dt-color-surface-info-strong: var(--dt-color-blue-800); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
531
- --dt-color-surface-success-strong: var(--dt-color-green-600); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
532
- --dt-color-surface-positive-strong: var(--dt-color-green-800); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
533
- --dt-color-surface-warning-strong: var(--dt-color-gold-400); /* A contrasting warning surface, most likely paired with inverted foreground colors. */
519
+ --dt-color-surface-info-strong: var(--dt-color-blue-600); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
520
+ --dt-color-surface-positive-strong: var(--dt-color-green-600); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
521
+ --dt-color-surface-warning-strong: var(--dt-color-gold-500); /* A contrasting warning surface, most likely paired with inverted foreground colors. */
534
522
  --dt-color-surface-critical-strong: var(--dt-color-red-600); /* A contrasting critical surface, most likely paired with inverted foreground colors. */
535
523
  --dt-color-surface-brand-subtle: var(--dt-color-purple-50); /* A softer version of the default informational surface. */
536
524
  --dt-color-surface-info-subtle: var(--dt-color-blue-50); /* A softer version of the default informational surface. */
537
- --dt-color-surface-success-subtle: var(--dt-color-green-50); /* A softer version of the default success surface. */
538
525
  --dt-color-surface-positive-subtle: var(--dt-color-green-50); /* A softer version of the default positive surface. */
539
526
  --dt-color-surface-warning-subtle: var(--dt-color-gold-50); /* A softer version of the default warning surface. */
540
527
  --dt-color-surface-critical-subtle: var(--dt-color-red-50); /* A softer version of the Critical surface. */
541
528
  --dt-color-surface-brand: var(--dt-color-purple-100); /* Background surface color containing messaging or elements communicated as generally informational. */
542
529
  --dt-color-surface-info: var(--dt-color-blue-100); /* Background surface color containing messaging or elements communicated as generally informational. */
543
- --dt-color-surface-success: var(--dt-color-green-100); /* Background surface color containing messaging or elements expressing a positive or successful state. */
544
530
  --dt-color-surface-positive: var(--dt-color-green-100); /* Background surface color containing messaging or elements expressing a positive or successful state. */
545
531
  --dt-color-surface-warning: var(--dt-color-gold-100); /* Background surface color highlighting messaging or elements that may require user's attention. */
546
532
  --dt-color-surface-critical: var(--dt-color-red-100); /* Background surface color containing error, danger, or otherwise critical messaging or elements. */
@@ -554,36 +540,34 @@
554
540
  --dt-color-link-warning-inverted-hover: var(--dt-color-gold-300);
555
541
  --dt-color-link-primary-inverted-hover: var(--dt-color-purple-200);
556
542
  --dt-color-link-primary-inverted: var(--dt-color-purple-200);
543
+ --dt-color-link-info-hover: var(--dt-color-blue-700);
544
+ --dt-color-link-info: var(--dt-color-blue-600);
557
545
  --dt-color-link-warning-hover: var(--dt-color-gold-900);
558
546
  --dt-color-link-primary-hover: var(--dt-color-purple-800);
559
547
  --dt-color-link-primary: var(--dt-color-purple-600);
560
548
  --dt-color-foreground-info-strong-inverted: var(--dt-color-blue-200); /* Info strong text that sits on high-contrast surfaces or backgrounds. */
561
549
  --dt-color-foreground-info-inverted: var(--dt-color-blue-300); /* Info text that sits on high-contrast surfaces or backgrounds. */
562
550
  --dt-color-foreground-warning-inverted: var(--dt-color-gold-500); /* Warning text that sits on high-contrast surfaces or backgrounds */
563
- --dt-color-foreground-success-strong-inverted: var(--dt-color-green-50); /* Success strong text that sits on high-contrast surfaces or backgrounds. */
564
- --dt-color-foreground-success-inverted: var(--dt-color-green-200); /* Success text that sits on high-contrast surfaces or backgrounds. */
565
551
  --dt-color-foreground-positive-strong-inverted: var(--dt-color-green-50); /* Positive strong text that sits on high-contrast surfaces or backgrounds. */
566
552
  --dt-color-foreground-positive-inverted: var(--dt-color-green-200); /* Positive text that sits on high-contrast surfaces or backgrounds. */
567
553
  --dt-color-foreground-critical-strong-inverted: var(--dt-color-red-200); /* Critical strong text that sits on high-contrast surfaces or backgrounds */
568
554
  --dt-color-foreground-critical-inverted: var(--dt-color-red-300); /* Critical text that sits on high-contrast surfaces or backgrounds */
569
555
  --dt-color-foreground-disabled-inverted: var(--dt-color-black-400); /* Disabled text color that sits on high-contrast surfaces or backgrounds. */
570
556
  --dt-color-foreground-placeholder-inverted: var(--dt-color-black-400); /* Placeholder text color that sits on high-contrast surfaces or backgrounds. */
571
- --dt-color-foreground-muted-inverted: oklch(0.98 0 0 / 0.65); /* Muted text color that sits on high-contrast surfaces or backgrounds. */
557
+ --dt-color-foreground-muted-inverted: oklch(0.98 0 48.7 / 0.65); /* Muted text color that sits on high-contrast surfaces or backgrounds. */
572
558
  --dt-color-foreground-tertiary-inverted: var(--dt-color-black-300); /* Tertiary text color that sits on high-contrast surfaces or backgrounds. */
573
559
  --dt-color-foreground-secondary-inverted: var(--dt-color-black-200); /* Secondary text color that sits on high-contrast surfaces or backgrounds. */
574
560
  --dt-color-foreground-primary-inverted: var(--dt-color-black-100); /* Primary text that sits on high-contrast surfaces or backgrounds. */
575
561
  --dt-color-foreground-info-strong: var(--dt-color-blue-900); /* Indicates a generally informational state on surfaces that require a stronger contrast. */
576
562
  --dt-color-foreground-info: var(--dt-color-blue-800); /* Indicates a generally informational state. */
577
563
  --dt-color-foreground-warning: var(--dt-color-gold-800); /* Indicates information that requires user’s attention and further action may be necessary. */
578
- --dt-color-foreground-success-strong: var(--dt-color-green-950); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
579
- --dt-color-foreground-success: var(--dt-color-green-700); /* Indicates a positive state. */
580
564
  --dt-color-foreground-positive-strong: var(--dt-color-green-950); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
581
565
  --dt-color-foreground-positive: var(--dt-color-green-700); /* Indicates a positive state. */
582
566
  --dt-color-foreground-critical-strong: var(--dt-color-red-700); /* Expresses an error, danger, or otherwise critical state on surfaces that require a stronger contrast. */
583
567
  --dt-color-foreground-critical: var(--dt-color-red-600); /* Expresses an error, danger, or otherwise critical state. */
584
568
  --dt-color-foreground-disabled: var(--dt-color-black-500); /* Used for text paired with disabled content or components, like the form elements. */
585
569
  --dt-color-foreground-placeholder: var(--dt-color-black-500); /* Text color for placeholder text within form elements. */
586
- --dt-color-foreground-muted: oklch(0 0 0 / 0.5);
570
+ --dt-color-foreground-muted: oklch(0.16 0 84.6 / 0.5);
587
571
  --dt-color-foreground-tertiary: var(--dt-color-black-600); /* Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels. */
588
572
  --dt-color-foreground-secondary: var(--dt-color-black-700); /* Example uses include introduction paragraphs, labels, and descriptions paired with form elements. */
589
573
  --dt-color-foreground-primary: var(--dt-color-black-900); /* Default text color throughout the UI. */
@@ -621,19 +605,19 @@
621
605
  --dt-shell-presence-color-busy: var(--dt-presence-color-busy);
622
606
  --dt-shell-presence-color-unavailable: var(--dt-presence-color-unavailable);
623
607
  --dt-shell-presence-color-available: var(--dt-presence-color-available);
624
- --dt-shell-mention-color-surface-secondary: oklch(0.28 0.23 18.9);
608
+ --dt-shell-mention-color-surface-secondary: oklch(0.29 0.25 15.8);
625
609
  --dt-shell-mention-color-surface-primary: var(--dt-shell-base-color-accent);
626
610
  --dt-shell-color-border-default: oklch(1 0 0 / 0.17);
627
611
  --dt-shell-color-border-subtle: oklch(1 0 0 / 0.1);
628
612
  --dt-shell-color-surface-default: var(--dt-shell-base-color-surface);
629
- --dt-shell-color-foreground-warning: oklch(0.68 0.12 88.4);
630
- --dt-shell-color-foreground-critical: oklch(0.58 0.14 25.3);
613
+ --dt-shell-color-foreground-warning: oklch(0.64 0.12 75.7);
614
+ --dt-shell-color-foreground-critical: oklch(0.62 0.14 14);
631
615
  --dt-shell-color-foreground-positive: oklch(0.72 0.14 162);
632
- --dt-shell-color-foreground-disabled: oklch(0.98 0.01 248 / 0.57);
633
- --dt-shell-color-foreground-muted: oklch(0.98 0.01 248 / 0.6);
634
- --dt-shell-color-foreground-strong: oklch(0.98 0.01 248);
635
- --dt-shell-color-foreground-tertiary: oklch(0.98 0.01 248 / 0.72);
636
- --dt-shell-color-foreground-secondary: oklch(0.98 0.01 248 / 0.86);
616
+ --dt-shell-color-foreground-disabled: oklch(0.95 0.02 258 / 0.57);
617
+ --dt-shell-color-foreground-muted: oklch(0.95 0.02 258 / 0.6);
618
+ --dt-shell-color-foreground-strong: oklch(0.95 0.02 258);
619
+ --dt-shell-color-foreground-tertiary: oklch(0.95 0.02 258 / 0.72);
620
+ --dt-shell-color-foreground-secondary: oklch(0.95 0.02 258 / 0.86);
637
621
  --dt-shell-color-foreground-primary: var(--dt-shell-base-color-foreground);
638
622
  --dt-shell-base-action-color-background-muted: var(--dt-shell-base-color-action);
639
623
  --dt-shell-base-action-color-background-secondary: var(--dt-shell-base-color-action);
@@ -645,39 +629,38 @@
645
629
  --dt-theme-presence-color-background-busy-unavailable: var(--dt-presence-color-unavailable);
646
630
  --dt-theme-presence-color-background-available: var(--dt-presence-color-available);
647
631
  --dt-theme-sidebar-section-color-foreground: var(--dt-color-foreground-tertiary);
648
- --dt-theme-sidebar-selected-row-color-background: oklch(0.23 0 0 / 0.09);
632
+ --dt-theme-sidebar-selected-row-color-background: oklch(0.26 0.01 78.2 / 0.09);
649
633
  --dt-theme-sidebar-selected-row-color-foreground: var(--dt-color-foreground-primary);
650
- --dt-theme-sidebar-row-color-background-active: oklch(0.23 0 0 / 0.15);
651
- --dt-theme-sidebar-row-color-background-hover: oklch(0.23 0 0 / 0.11);
652
- --dt-theme-sidebar-row-color-background: oklch(0.23 0 0 / 0);
634
+ --dt-theme-sidebar-row-color-background-active: oklch(0.26 0.01 78.2 / 0.15);
635
+ --dt-theme-sidebar-row-color-background-hover: oklch(0.26 0.01 78.2 / 0.11);
636
+ --dt-theme-sidebar-row-color-background: oklch(0.26 0.01 78.2 / 0);
653
637
  --dt-theme-sidebar-status-color-foreground: var(--dt-color-foreground-tertiary);
654
638
  --dt-theme-sidebar-color-foreground-unread: var(--dt-color-foreground-primary);
655
639
  --dt-theme-sidebar-color-foreground: var(--dt-color-foreground-secondary);
656
- --dt-theme-topbar-profile-color-background-active: oklch(0.23 0 0 / 0.14);
657
- --dt-theme-topbar-profile-color-background-hover: oklch(0.23 0 0 / 0.1);
658
- --dt-theme-topbar-profile-color-background-inverted: oklch(0.23 0 0 / 0.75);
659
- --dt-theme-topbar-profile-color-background: oklch(0.23 0 0 / 0.05);
660
- --dt-theme-topbar-profile-color-foreground-inverted: oklch(0.98 0 0 / 0.75);
661
- --dt-theme-topbar-button-color-background-active: oklch(0.23 0 0 / 0.1);
662
- --dt-theme-topbar-button-color-background-hover: oklch(0.23 0 0 / 0.05);
663
- --dt-theme-topbar-button-color-background: oklch(0.23 0 0 / 0);
640
+ --dt-theme-topbar-profile-color-background-active: oklch(0.26 0.01 78.2 / 0.14);
641
+ --dt-theme-topbar-profile-color-background-hover: oklch(0.26 0.01 78.2 / 0.1);
642
+ --dt-theme-topbar-profile-color-background-inverted: oklch(0.26 0.01 78.2 / 0.75);
643
+ --dt-theme-topbar-profile-color-background: oklch(0.26 0.01 78.2 / 0.05);
644
+ --dt-theme-topbar-profile-color-foreground-inverted: oklch(0.98 0 48.7 / 0.75);
645
+ --dt-theme-topbar-button-color-background-active: oklch(0.26 0.01 78.2 / 0.1);
646
+ --dt-theme-topbar-button-color-background-hover: oklch(0.26 0.01 78.2 / 0.05);
647
+ --dt-theme-topbar-button-color-background: oklch(0.26 0.01 78.2 / 0);
664
648
  --dt-theme-topbar-button-color-foreground-hover: var(--dt-theme-color-base);
665
- --dt-theme-topbar-button-color-foreground: oklch(0.23 0 0 / 0.65);
666
- --dt-theme-topbar-field-color-border-active: oklch(0.23 0 0 / 0.2);
667
- --dt-theme-topbar-field-color-border-hover: oklch(0.23 0 0 / 0.1);
668
- --dt-theme-topbar-field-color-border: oklch(0.23 0 0 / 0);
669
- --dt-theme-topbar-field-color-background-hover: oklch(0.45 0 0);
670
- --dt-theme-topbar-field-color-background: oklch(0.23 0 0 / 0.05);
671
- --dt-theme-topbar-field-color-foreground-hover: oklch(0.23 0 0 / 0.75);
672
- --dt-theme-topbar-field-color-foreground: oklch(0.23 0 0 / 0.5);
649
+ --dt-theme-topbar-button-color-foreground: oklch(0.26 0.01 78.2 / 0.65);
650
+ --dt-theme-topbar-field-color-border-active: oklch(0.26 0.01 78.2 / 0.2);
651
+ --dt-theme-topbar-field-color-border-hover: oklch(0.26 0.01 78.2 / 0.1);
652
+ --dt-theme-topbar-field-color-border: oklch(0.26 0.01 78.2 / 0);
653
+ --dt-theme-topbar-field-color-background-hover: oklch(0.51 0.01 78.2);
654
+ --dt-theme-topbar-field-color-background: oklch(0.26 0.01 78.2 / 0.05);
655
+ --dt-theme-topbar-field-color-foreground-hover: oklch(0.26 0.01 78.2 / 0.75);
656
+ --dt-theme-topbar-field-color-foreground: oklch(0.26 0.01 78.2 / 0.5);
673
657
  --dt-theme-topbar-color-background: var(--dt-color-surface-secondary);
674
- --dt-theme-topbar-color-foreground: oklch(0.23 0 0 / 0.8);
658
+ --dt-theme-topbar-color-foreground: oklch(0.26 0.01 78.2 / 0.8);
675
659
  --dt-action-color-border-positive-outlined-default: var(--dt-color-border-positive);
676
660
  --dt-action-color-border-muted-outlined-default: var(--dt-color-border-default);
677
661
  --dt-action-color-border-inverted-outlined-default: var(--dt-color-border-default-inverted);
678
662
  --dt-action-color-border-critical-outlined-default: var(--dt-color-border-critical);
679
663
  --dt-action-color-border-base-outlined-default: var(--dt-color-border-brand);
680
- --dt-action-color-background-positive-primary-active: oklch(0.38 0.1 156);
681
664
  --dt-action-color-background-positive-hover: var(--dt-color-surface-positive-opaque);
682
665
  --dt-action-color-background-disabled-default: var(--dt-color-surface-bold-opaque);
683
666
  --dt-action-color-background-muted-hover: var(--dt-color-surface-moderate-opaque);
@@ -799,8 +782,8 @@
799
782
  --dt-typography-body-md-font-size: var(--dt-font-size-200); /* Base default medium text style for main content. */
800
783
  --dt-color-chart-sequential-range-00-end: var(--dt-color-chart-sequential-10); /* Start color value for default sequential range. Use to create a dynamically generated sequential series, must be paired with a start color. */
801
784
  --dt-color-chart-sequential-range-00-start: var(--dt-color-chart-sequential-01); /* Start color value for default sequential range. Use to create a dynamically generated sequential series, must be paired with an end color. */
802
- --dt-color-chart-sequential-10-selected: oklch(0.23 0.05 276); /* Selected state for tenth sequential chart color. */
803
- --dt-color-chart-sequential-10-hover: oklch(0.28 0.06 258); /* Hover state for tenth sequential chart color. */
785
+ --dt-color-chart-sequential-10-selected: oklch(0.28 0.05 193); /* Selected state for tenth sequential chart color. */
786
+ --dt-color-chart-sequential-10-hover: oklch(0.31 0.06 217); /* Hover state for tenth sequential chart color. */
804
787
  --dt-color-chart-sequential-09: oklch(0.39 0.06 243); /* Ninth color in sequential chart series, extremely dark shade. */
805
788
  --dt-color-chart-sequential-08: oklch(0.46 0.06 246); /* Eighth color in sequential chart series, very dark shade. */
806
789
  --dt-color-chart-sequential-07: oklch(0.54 0.05 249); /* Seventh color in sequential chart series, dark shade. */
@@ -809,25 +792,46 @@
809
792
  --dt-color-chart-sequential-04: oklch(0.75 0.03 258); /* Fourth color in sequential chart series, light-medium shade. */
810
793
  --dt-color-chart-sequential-03: oklch(0.82 0.02 261); /* Third color in sequential chart series, light shade. */
811
794
  --dt-color-chart-sequential-02: oklch(0.89 0.02 264); /* Second color in sequential chart series, very light shade. */
812
- --dt-color-chart-sequential-01-selected: oklch(0.67 0.01 295); /* Selected state for first sequential chart color. */
813
- --dt-color-chart-sequential-01-hover: oklch(0.81 0.01 281); /* Hover state for first sequential chart color. */
795
+ --dt-color-chart-sequential-01-selected: oklch(0.72 0.01 320); /* Selected state for first sequential chart color. */
796
+ --dt-color-chart-sequential-01-hover: oklch(0.84 0.01 293); /* Hover state for first sequential chart color. */
814
797
  --dt-color-chart-categorical-11-selected: oklch(0.59 0.01 56.3);
815
798
  --dt-color-chart-categorical-11-hover: oklch(0.71 0.01 56.3);
816
- --dt-color-chart-categorical-28: oklch(0.72 0.15 259);
817
- --dt-color-chart-categorical-26: oklch(0.74 0.18 388);
818
- --dt-color-chart-categorical-22: oklch(0.79 0.07 357);
819
- --dt-color-chart-categorical-21: oklch(0.69 0.15 118);
820
- --dt-color-chart-categorical-20: oklch(0.72 0.15 259);
821
- --dt-color-chart-categorical-19: oklch(0.71 0.13 228);
822
- --dt-color-chart-categorical-18: oklch(0.69 0.17 83.2);
823
- --dt-color-chart-categorical-17: oklch(0.74 0.21 346);
799
+ --dt-color-chart-categorical-28: oklch(0.64 0.21 273);
800
+ --dt-color-chart-categorical-26: oklch(0.72 0.19 385);
801
+ --dt-color-chart-categorical-22: oklch(0.77 0.09 362);
802
+ --dt-color-chart-categorical-21: oklch(0.67 0.17 119);
803
+ --dt-color-chart-categorical-20: oklch(0.64 0.21 273);
804
+ --dt-color-chart-categorical-19: oklch(0.62 0.21 244);
805
+ --dt-color-chart-categorical-18: oklch(0.78 0.14 86.6);
806
+ --dt-color-chart-categorical-17: oklch(0.74 0.21 343);
824
807
  --dt-color-chart-categorical-16: oklch(0.66 0.15 140);
825
- --dt-color-chart-categorical-15: oklch(0.75 0.17 402);
826
- --dt-color-chart-categorical-14: oklch(0.72 0.15 268);
827
- --dt-color-chart-categorical-13: oklch(0.68 0.19 405);
828
- --dt-color-chart-categorical-12: oklch(0.69 0.19 332);
829
- --dt-color-surface-primary-opaque-inverted: oklch(0 0 0 / 0.85); /* Secondary surface as opaque background color. */
808
+ --dt-color-chart-categorical-15: oklch(0.74 0.19 399);
809
+ --dt-color-chart-categorical-14: oklch(0.66 0.21 280);
810
+ --dt-color-chart-categorical-13: oklch(0.68 0.21 398);
811
+ --dt-color-chart-categorical-12: oklch(0.64 0.22 329);
812
+ --dt-color-border-success-strong-inverted: var(--dt-color-border-positive-strong-inverted);
813
+ --dt-color-border-success-subtle-inverted: var(--dt-color-border-positive-subtle-inverted);
814
+ --dt-color-border-success-inverted: var(--dt-color-border-positive-inverted);
815
+ --dt-color-border-success-strong: var(--dt-color-border-positive-strong);
816
+ --dt-color-border-success-subtle: var(--dt-color-border-positive-subtle);
817
+ --dt-color-border-success: var(--dt-color-border-positive);
818
+ --dt-color-surface-success-subtle-opaque-inverted: var(--dt-color-surface-positive-subtle-opaque-inverted); /* Success subtle surface as opaque background color. */
819
+ --dt-color-surface-success-opaque-inverted: var(--dt-color-surface-positive-opaque-inverted); /* Success surface as opaque background color. */
820
+ --dt-color-surface-primary-opaque-inverted: oklch(0.16 0 84.6 / 0.85); /* Secondary surface as opaque background color. */
821
+ --dt-color-surface-success-subtle-inverted: var(--dt-color-surface-positive-subtle-inverted); /* A softer version of the default success surface. */
822
+ --dt-color-surface-success-inverted: var(--dt-color-surface-positive-inverted); /* Background surface color containing messaging or elements expressing a positive or successful state. */
823
+ --dt-color-surface-success-subtle-opaque: var(--dt-color-surface-positive-subtle-opaque); /* Success subtle surface as opaque background color. */
824
+ --dt-color-surface-success-opaque: var(--dt-color-surface-positive-opaque); /* Success surface as opaque background color. */
830
825
  --dt-color-surface-primary-opaque: oklch(1 0 0 / 0.96); /* Primary surface as opaque background color. */
826
+ --dt-color-surface-success-strong: var(--dt-color-surface-positive-strong); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
827
+ --dt-color-surface-success-subtle: var(--dt-color-surface-positive-subtle); /* A softer version of the default success surface. */
828
+ --dt-color-surface-success: var(--dt-color-surface-positive); /* Background surface color containing messaging or elements expressing a positive or successful state. */
829
+ --dt-color-link-mention-inverted-background-hover: oklch(0.85 0.09 301 / 0.2);
830
+ --dt-color-link-mention-inverted-background: oklch(0.85 0.09 301 / 0.3);
831
+ --dt-color-link-mention-background-hover: oklch(0.85 0.09 301 / 0.15);
832
+ --dt-color-link-mention-background: oklch(0.85 0.09 301 / 0.1);
833
+ --dt-color-link-mention-hover: var(--dt-color-link-primary-hover);
834
+ --dt-color-link-mention: var(--dt-color-link-primary);
831
835
  --dt-color-link-disabled-inverted-hover: var(--dt-color-foreground-disabled-inverted);
832
836
  --dt-color-link-disabled-inverted: var(--dt-color-foreground-disabled-inverted);
833
837
  --dt-color-link-muted-inverted: var(--dt-color-foreground-secondary-inverted);
@@ -843,8 +847,6 @@
843
847
  --dt-color-link-disabled: var(--dt-color-foreground-disabled);
844
848
  --dt-color-link-muted-hover: var(--dt-color-foreground-primary);
845
849
  --dt-color-link-muted: var(--dt-color-foreground-secondary);
846
- --dt-color-link-info-hover: var(--dt-color-foreground-info-strong);
847
- --dt-color-link-info: var(--dt-color-foreground-info);
848
850
  --dt-color-link-warning: var(--dt-color-foreground-warning);
849
851
  --dt-color-link-success-hover: var(--dt-color-foreground-positive-strong);
850
852
  --dt-color-link-success: var(--dt-color-foreground-positive); /* positive */
@@ -852,19 +854,23 @@
852
854
  --dt-color-link-positive: var(--dt-color-foreground-positive); /* positive */
853
855
  --dt-color-link-critical-hover: var(--dt-color-foreground-critical-strong);
854
856
  --dt-color-link-critical: var(--dt-color-foreground-critical);
857
+ --dt-color-foreground-success-strong-inverted: var(--dt-color-foreground-positive-strong-inverted); /* Success strong text that sits on high-contrast surfaces or backgrounds. */
858
+ --dt-color-foreground-success-inverted: var(--dt-color-foreground-positive-inverted); /* Success text that sits on high-contrast surfaces or backgrounds. */
859
+ --dt-color-foreground-success-strong: var(--dt-color-foreground-positive-strong); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
860
+ --dt-color-foreground-success: var(--dt-color-foreground-positive); /* Indicates a positive state. */
855
861
  --dt-icon-size-border-500: var(--dt-icon-size-border-400);
856
- --dt-shell-action-color-background-muted-selected: oklch(0.86 0.08 231 / 0.07);
857
- --dt-shell-action-color-background-muted-active: oklch(0.86 0.08 231 / 0.07);
858
- --dt-shell-action-color-background-muted-hover: oklch(0.86 0.08 231 / 0.1);
859
- --dt-shell-action-color-background-muted-default: oklch(0.86 0.08 231 / 0.05);
860
- --dt-shell-action-color-background-secondary-selected: oklch(0.86 0.08 231 / 0.13);
861
- --dt-shell-action-color-background-secondary-active: oklch(0.86 0.08 231 / 0.16);
862
- --dt-shell-action-color-background-secondary-hover: oklch(0.86 0.08 231 / 0.1);
863
- --dt-shell-action-color-background-secondary-default: oklch(0.86 0.08 231 / 0);
864
- --dt-shell-action-color-background-primary-selected: oklch(0.86 0.08 231 / 0.13);
865
- --dt-shell-action-color-background-primary-active: oklch(0.86 0.08 231 / 0.16);
866
- --dt-shell-action-color-background-primary-hover: oklch(0.86 0.08 231 / 0.1);
867
- --dt-shell-action-color-background-primary-default: oklch(0.86 0.08 231 / 0);
862
+ --dt-shell-action-color-background-muted-selected: oklch(0.76 0.13 258 / 0.07);
863
+ --dt-shell-action-color-background-muted-active: oklch(0.76 0.13 258 / 0.07);
864
+ --dt-shell-action-color-background-muted-hover: oklch(0.76 0.13 258 / 0.1);
865
+ --dt-shell-action-color-background-muted-default: oklch(0.76 0.13 258 / 0.05);
866
+ --dt-shell-action-color-background-secondary-selected: oklch(0.76 0.13 258 / 0.13);
867
+ --dt-shell-action-color-background-secondary-active: oklch(0.76 0.13 258 / 0.16);
868
+ --dt-shell-action-color-background-secondary-hover: oklch(0.76 0.13 258 / 0.1);
869
+ --dt-shell-action-color-background-secondary-default: oklch(0.76 0.13 258 / 0);
870
+ --dt-shell-action-color-background-primary-selected: oklch(0.76 0.13 258 / 0.13);
871
+ --dt-shell-action-color-background-primary-active: oklch(0.76 0.13 258 / 0.16);
872
+ --dt-shell-action-color-background-primary-hover: oklch(0.76 0.13 258 / 0.1);
873
+ --dt-shell-action-color-background-primary-default: oklch(0.76 0.13 258 / 0);
868
874
  --dt-shell-action-color-foreground-muted-default: var(--dt-shell-color-foreground-muted);
869
875
  --dt-shell-action-color-foreground-secondary-disabled: var(--dt-shell-color-foreground-disabled);
870
876
  --dt-shell-action-color-foreground-primary-disabled: var(--dt-shell-color-foreground-disabled);
@@ -876,9 +882,9 @@
876
882
  --dt-theme-sidebar-color-background: var(--dt-theme-topbar-color-background);
877
883
  --dt-theme-topbar-profile-color-foreground: var(--dt-theme-topbar-color-foreground);
878
884
  --dt-action-color-background-positive-active: oklch(0.55 0.17 159 / 0.25);
879
- --dt-action-color-background-muted-active: oklch(0.23 0 0 / 0.14);
880
- --dt-action-color-background-critical-active: oklch(0.73 0.07 24.1 / 0.31);
881
- --dt-action-color-background-base-active: oklch(0.75 0.08 300 / 0.27);
885
+ --dt-action-color-background-muted-active: oklch(0.26 0.01 78.2 / 0.14);
886
+ --dt-action-color-background-critical-active: oklch(0.73 0.1 12.7 / 0.31);
887
+ --dt-action-color-background-base-active: oklch(0.76 0.09 301 / 0.39);
882
888
  --dt-action-color-foreground-positive-hover: var(--dt-color-link-positive-hover);
883
889
  --dt-action-color-foreground-positive-default: var(--dt-color-link-positive);
884
890
  --dt-action-color-foreground-muted-hover: var(--dt-color-link-muted-hover);
@@ -940,73 +946,73 @@
940
946
  --dt-typography-helper-sm: var(--dt-typography-helper-sm-font-weight) var(--dt-typography-helper-sm-font-size)/var(--dt-typography-helper-sm-line-height) var(--dt-typography-helper-sm-font-family);
941
947
  --dt-typography-code-md: var(--dt-typography-code-md-font-weight) var(--dt-typography-code-md-font-size)/var(--dt-typography-code-md-line-height) var(--dt-typography-code-md-font-family);
942
948
  --dt-typography-code-sm: var(--dt-typography-code-sm-font-weight) var(--dt-typography-code-sm-font-size)/var(--dt-typography-code-sm-line-height) var(--dt-typography-code-sm-font-family); /* Text style for extra small inputs (e.g. input and textarea) */
943
- --dt-color-chart-sequential-09-selected: oklch(0.27 0.04 278); /* Selected state for ninth sequential chart color. */
944
- --dt-color-chart-sequential-09-hover: oklch(0.33 0.05 261); /* Hover state for ninth sequential chart color. */
945
- --dt-color-chart-sequential-08-selected: oklch(0.32 0.04 280); /* Selected state for eighth sequential chart color. */
946
- --dt-color-chart-sequential-08-hover: oklch(0.39 0.05 263); /* Hover state for eighth sequential chart color. */
947
- --dt-color-chart-sequential-07-selected: oklch(0.38 0.04 282); /* Selected state for seventh sequential chart color. */
948
- --dt-color-chart-sequential-07-hover: oklch(0.46 0.04 266); /* Hover state for seventh sequential chart color. */
949
- --dt-color-chart-sequential-06-selected: oklch(0.43 0.03 284); /* Selected state for sixth sequential chart color. */
950
- --dt-color-chart-sequential-06-hover: oklch(0.52 0.03 268); /* Hover state for sixth sequential chart color. */
951
- --dt-color-chart-sequential-05-selected: oklch(0.48 0.03 287); /* Selected state for fifth sequential chart color. */
952
- --dt-color-chart-sequential-05-hover: oklch(0.58 0.03 271); /* Hover state for fifth sequential chart color. */
953
- --dt-color-chart-sequential-04-selected: oklch(0.53 0.02 289); /* Selected state for fourth sequential chart color. */
954
- --dt-color-chart-sequential-04-hover: oklch(0.64 0.03 273); /* Hover state for fourth sequential chart color. */
955
- --dt-color-chart-sequential-03-selected: oklch(0.57 0.01 291); /* Selected state for third sequential chart color. */
956
- --dt-color-chart-sequential-03-hover: oklch(0.7 0.02 276); /* Hover state for third sequential chart color. */
957
- --dt-color-chart-sequential-02-selected: oklch(0.62 0.01 293); /* Selected state for second sequential chart color. */
958
- --dt-color-chart-sequential-02-hover: oklch(0.76 0.02 278); /* Hover state for second sequential chart color. */
959
- --dt-color-chart-categorical-28-selected: oklch(0.5 0.15 259);
960
- --dt-color-chart-categorical-28-hover: oklch(0.61 0.15 259);
961
- --dt-color-chart-categorical-26-selected: oklch(0.52 0.18 388);
962
- --dt-color-chart-categorical-26-hover: oklch(0.63 0.18 388);
963
- --dt-color-chart-categorical-22-selected: oklch(0.55 0.07 357);
964
- --dt-color-chart-categorical-22-hover: oklch(0.67 0.07 357);
965
- --dt-color-chart-categorical-21-selected: oklch(0.48 0.15 118);
966
- --dt-color-chart-categorical-21-hover: oklch(0.59 0.15 118);
967
- --dt-color-chart-categorical-20-selected: oklch(0.5 0.15 259);
968
- --dt-color-chart-categorical-20-hover: oklch(0.61 0.15 259);
969
- --dt-color-chart-categorical-19-selected: oklch(0.5 0.13 228);
970
- --dt-color-chart-categorical-19-hover: oklch(0.6 0.13 228);
971
- --dt-color-chart-categorical-18-selected: oklch(0.48 0.17 83.2);
972
- --dt-color-chart-categorical-18-hover: oklch(0.59 0.17 83.2);
973
- --dt-color-chart-categorical-17-selected: oklch(0.52 0.21 346);
974
- --dt-color-chart-categorical-17-hover: oklch(0.63 0.21 346);
949
+ --dt-color-chart-sequential-09-selected: oklch(0.32 0.04 195); /* Selected state for ninth sequential chart color. */
950
+ --dt-color-chart-sequential-09-hover: oklch(0.36 0.05 219); /* Hover state for ninth sequential chart color. */
951
+ --dt-color-chart-sequential-08-selected: oklch(0.37 0.04 198); /* Selected state for eighth sequential chart color. */
952
+ --dt-color-chart-sequential-08-hover: oklch(0.41 0.05 222); /* Hover state for eighth sequential chart color. */
953
+ --dt-color-chart-sequential-07-selected: oklch(0.43 0.04 200); /* Selected state for seventh sequential chart color. */
954
+ --dt-color-chart-sequential-07-hover: oklch(0.48 0.04 224); /* Hover state for seventh sequential chart color. */
955
+ --dt-color-chart-sequential-06-selected: oklch(0.47 0.03 202); /* Selected state for sixth sequential chart color. */
956
+ --dt-color-chart-sequential-06-hover: oklch(0.54 0.03 227); /* Hover state for sixth sequential chart color. */
957
+ --dt-color-chart-sequential-05-selected: oklch(0.52 0.03 204); /* Selected state for fifth sequential chart color. */
958
+ --dt-color-chart-sequential-05-hover: oklch(0.6 0.03 229); /* Hover state for fifth sequential chart color. */
959
+ --dt-color-chart-sequential-04-selected: oklch(0.57 0.02 206); /* Selected state for fourth sequential chart color. */
960
+ --dt-color-chart-sequential-04-hover: oklch(0.66 0.03 232); /* Hover state for fourth sequential chart color. */
961
+ --dt-color-chart-sequential-03-selected: oklch(0.62 0.02 208); /* Selected state for third sequential chart color. */
962
+ --dt-color-chart-sequential-03-hover: oklch(0.72 0.02 235); /* Hover state for third sequential chart color. */
963
+ --dt-color-chart-sequential-02-selected: oklch(0.67 0.02 210); /* Selected state for second sequential chart color. */
964
+ --dt-color-chart-sequential-02-hover: oklch(0.78 0.02 237); /* Hover state for second sequential chart color. */
965
+ --dt-color-chart-categorical-28-selected: oklch(0.45 0.21 273);
966
+ --dt-color-chart-categorical-28-hover: oklch(0.54 0.21 273);
967
+ --dt-color-chart-categorical-26-selected: oklch(0.5 0.19 385);
968
+ --dt-color-chart-categorical-26-hover: oklch(0.61 0.19 385);
969
+ --dt-color-chart-categorical-22-selected: oklch(0.54 0.09 362);
970
+ --dt-color-chart-categorical-22-hover: oklch(0.65 0.09 362);
971
+ --dt-color-chart-categorical-21-selected: oklch(0.47 0.17 119);
972
+ --dt-color-chart-categorical-21-hover: oklch(0.57 0.17 119);
973
+ --dt-color-chart-categorical-20-selected: oklch(0.45 0.21 273);
974
+ --dt-color-chart-categorical-20-hover: oklch(0.54 0.21 273);
975
+ --dt-color-chart-categorical-19-selected: oklch(0.43 0.21 244);
976
+ --dt-color-chart-categorical-19-hover: oklch(0.53 0.21 244);
977
+ --dt-color-chart-categorical-18-selected: oklch(0.55 0.14 86.6);
978
+ --dt-color-chart-categorical-18-hover: oklch(0.66 0.14 86.6);
979
+ --dt-color-chart-categorical-17-selected: oklch(0.52 0.21 343);
980
+ --dt-color-chart-categorical-17-hover: oklch(0.63 0.21 343);
975
981
  --dt-color-chart-categorical-16-selected: oklch(0.46 0.15 140);
976
982
  --dt-color-chart-categorical-16-hover: oklch(0.56 0.15 140);
977
- --dt-color-chart-categorical-15-selected: oklch(0.52 0.17 402);
978
- --dt-color-chart-categorical-15-hover: oklch(0.64 0.17 402);
979
- --dt-color-chart-categorical-14-selected: oklch(0.5 0.15 268);
980
- --dt-color-chart-categorical-14-hover: oklch(0.61 0.15 268);
981
- --dt-color-chart-categorical-13-selected: oklch(0.48 0.19 405);
982
- --dt-color-chart-categorical-13-hover: oklch(0.58 0.19 405);
983
- --dt-color-chart-categorical-12-selected: oklch(0.48 0.19 332);
984
- --dt-color-chart-categorical-12-hover: oklch(0.59 0.19 332);
985
- --dt-color-chart-categorical-30: oklch(0.71 0.12 217);
986
- --dt-color-chart-categorical-29: oklch(0.7 0.17 416);
987
- --dt-color-chart-categorical-27: oklch(0.67 0.14 171);
988
- --dt-color-chart-categorical-25: oklch(0.71 0.16 321);
989
- --dt-color-chart-categorical-24: oklch(0.71 0.18 52.6);
990
- --dt-color-chart-categorical-23: oklch(0.71 0.18 353);
983
+ --dt-color-chart-categorical-15-selected: oklch(0.52 0.19 399);
984
+ --dt-color-chart-categorical-15-hover: oklch(0.63 0.19 399);
985
+ --dt-color-chart-categorical-14-selected: oklch(0.46 0.21 280);
986
+ --dt-color-chart-categorical-14-hover: oklch(0.56 0.21 280);
987
+ --dt-color-chart-categorical-13-selected: oklch(0.48 0.21 398);
988
+ --dt-color-chart-categorical-13-hover: oklch(0.58 0.21 398);
989
+ --dt-color-chart-categorical-12-selected: oklch(0.45 0.22 329);
990
+ --dt-color-chart-categorical-12-hover: oklch(0.54 0.22 329);
991
+ --dt-color-chart-categorical-30: oklch(0.63 0.18 231);
992
+ --dt-color-chart-categorical-29: oklch(0.75 0.16 418);
993
+ --dt-color-chart-categorical-27: oklch(0.64 0.17 176);
994
+ --dt-color-chart-categorical-25: oklch(0.7 0.19 330);
995
+ --dt-color-chart-categorical-24: oklch(0.71 0.2 46.6);
996
+ --dt-color-chart-categorical-23: oklch(0.67 0.21 350);
991
997
  --dt-color-link-disabled-hover: var(--dt-color-link-disabled);
992
- --dt-shell-action-color-foreground-muted-selected: oklch(0.39 0.01 248 / 0.6);
993
- --dt-shell-action-color-foreground-muted-hover: oklch(0.59 0.01 248 / 0.6);
998
+ --dt-shell-action-color-foreground-muted-selected: oklch(0.38 0.02 258 / 0.6);
999
+ --dt-shell-action-color-foreground-muted-hover: oklch(0.57 0.02 258 / 0.6);
994
1000
  --dt-action-color-foreground-positive-active: var(--dt-action-color-foreground-positive-hover);
995
1001
  --dt-action-color-foreground-muted-active: var(--dt-action-color-foreground-muted-hover);
996
1002
  --dt-action-color-foreground-inverted-active: var(--dt-action-color-foreground-inverted-hover);
997
1003
  --dt-action-color-foreground-critical-active: var(--dt-action-color-foreground-critical-hover);
998
- --dt-color-chart-categorical-30-selected: oklch(0.5 0.12 217);
999
- --dt-color-chart-categorical-30-hover: oklch(0.6 0.12 217);
1000
- --dt-color-chart-categorical-29-selected: oklch(0.49 0.17 416);
1001
- --dt-color-chart-categorical-29-hover: oklch(0.59 0.17 416);
1002
- --dt-color-chart-categorical-27-selected: oklch(0.47 0.14 171);
1003
- --dt-color-chart-categorical-27-hover: oklch(0.57 0.14 171);
1004
- --dt-color-chart-categorical-25-selected: oklch(0.5 0.16 321);
1005
- --dt-color-chart-categorical-25-hover: oklch(0.6 0.16 321);
1006
- --dt-color-chart-categorical-24-selected: oklch(0.5 0.18 52.6);
1007
- --dt-color-chart-categorical-24-hover: oklch(0.6 0.18 52.6);
1008
- --dt-color-chart-categorical-23-selected: oklch(0.5 0.18 353);
1009
- --dt-color-chart-categorical-23-hover: oklch(0.6 0.18 353);
1004
+ --dt-color-chart-categorical-30-selected: oklch(0.44 0.18 231);
1005
+ --dt-color-chart-categorical-30-hover: oklch(0.54 0.18 231);
1006
+ --dt-color-chart-categorical-29-selected: oklch(0.52 0.16 418);
1007
+ --dt-color-chart-categorical-29-hover: oklch(0.64 0.16 418);
1008
+ --dt-color-chart-categorical-27-selected: oklch(0.45 0.17 176);
1009
+ --dt-color-chart-categorical-27-hover: oklch(0.54 0.17 176);
1010
+ --dt-color-chart-categorical-25-selected: oklch(0.49 0.19 330);
1011
+ --dt-color-chart-categorical-25-hover: oklch(0.59 0.19 330);
1012
+ --dt-color-chart-categorical-24-selected: oklch(0.5 0.2 46.6);
1013
+ --dt-color-chart-categorical-24-hover: oklch(0.6 0.2 46.6);
1014
+ --dt-color-chart-categorical-23-selected: oklch(0.47 0.21 350);
1015
+ --dt-color-chart-categorical-23-hover: oklch(0.57 0.21 350);
1010
1016
  --dt-shell-action-color-foreground-muted-active: var(--dt-shell-action-color-foreground-muted-hover);
1011
1017
  --dt-font-size-100-mobile: 1.2rem;
1012
1018
  --dt-font-size-200-mobile: 1.6rem;
@@ -14,9 +14,9 @@
14
14
  --dt-color-foreground-primary: var(--dt-color-black-1000); /* Default text color throughout the UI. */
15
15
  --dt-shell-color-border-default: oklch(1 0 0 / 0.18);
16
16
  --dt-shell-color-border-subtle: oklch(1 0 0 / 0.15);
17
- --dt-shell-color-foreground-muted: oklch(0.92 0 0 / 0.6);
18
- --dt-shell-color-foreground-tertiary: oklch(0.92 0 0 / 0.72);
19
- --dt-shell-color-foreground-secondary: oklch(0.92 0 0 / 0.86);
17
+ --dt-shell-color-foreground-muted: oklch(0.93 0 84.6 / 0.6);
18
+ --dt-shell-color-foreground-tertiary: oklch(0.93 0 84.6 / 0.72);
19
+ --dt-shell-color-foreground-secondary: oklch(0.93 0 84.6 / 0.86);
20
20
  --dt-shell-color-foreground-primary: var(--dt-shell-base-color-foreground);
21
21
  --dt-action-color-border-positive-default: var(--dt-color-border-subtle);
22
22
  --dt-action-color-border-muted-default: var(--dt-color-border-subtle);