@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
@@ -131,8 +131,9 @@
131
131
  --dt-theme-mention-color-background-strong: var(--dt-color-purple-900);
132
132
  --dt-theme-mention-color-foreground: var(--dt-color-black-50);
133
133
  --dt-theme-color-base: var(--dt-color-black-900);
134
- --dt-action-color-background-positive-primary-hover: var(--dt-color-green-800);
135
- --dt-action-color-background-positive-primary-default: var(--dt-color-green-700); /* Postive, accepting, or success actions. */
134
+ --dt-action-color-background-positive-primary-active: var(--dt-color-green-800);
135
+ --dt-action-color-background-positive-primary-hover: var(--dt-color-green-700);
136
+ --dt-action-color-background-positive-primary-default: var(--dt-color-green-600); /* Postive, accepting, or success actions. */
136
137
  --dt-action-color-background-positive-default: var(--dt-color-neutral-transparent);
137
138
  --dt-action-color-background-muted-default: var(--dt-color-neutral-transparent);
138
139
  --dt-action-color-background-inverted-primary-active: var(--dt-color-purple-200);
@@ -142,9 +143,9 @@
142
143
  --dt-action-color-background-critical-primary-hover: var(--dt-color-red-600);
143
144
  --dt-action-color-background-critical-primary-default: var(--dt-color-red-500);
144
145
  --dt-action-color-background-critical-default: var(--dt-color-neutral-transparent);
145
- --dt-action-color-background-base-primary-active: var(--dt-color-purple-800);
146
- --dt-action-color-background-base-primary-hover: var(--dt-color-purple-700);
147
- --dt-action-color-background-base-primary-default: var(--dt-color-purple-600);
146
+ --dt-action-color-background-base-primary-active: var(--dt-color-purple-700);
147
+ --dt-action-color-background-base-primary-hover: var(--dt-color-purple-600);
148
+ --dt-action-color-background-base-primary-default: var(--dt-color-purple-500);
148
149
  --dt-action-color-background-base-default: var(--dt-color-neutral-transparent);
149
150
  --dt-action-color-foreground-positive-primary-default: var(--dt-color-black-50);
150
151
  --dt-action-color-foreground-critical-primary-default: var(--dt-color-black-50);
@@ -436,19 +437,16 @@
436
437
  --dt-color-border-brand-strong-inverted: var(--dt-color-purple-200);
437
438
  --dt-color-border-info-strong-inverted: var(--dt-color-blue-200);
438
439
  --dt-color-border-warning-strong-inverted: var(--dt-color-gold-300);
439
- --dt-color-border-success-strong-inverted: var(--dt-color-green-500);
440
440
  --dt-color-border-positive-strong-inverted: var(--dt-color-green-500);
441
441
  --dt-color-border-critical-strong-inverted: var(--dt-color-red-200);
442
442
  --dt-color-border-brand-subtle-inverted: var(--dt-color-purple-600);
443
443
  --dt-color-border-info-subtle-inverted: var(--dt-color-blue-900);
444
444
  --dt-color-border-warning-subtle-inverted: var(--dt-color-gold-800);
445
- --dt-color-border-success-subtle-inverted: var(--dt-color-green-900);
446
445
  --dt-color-border-positive-subtle-inverted: var(--dt-color-green-900);
447
446
  --dt-color-border-critical-subtle-inverted: var(--dt-color-red-900);
448
447
  --dt-color-border-brand-inverted: var(--dt-color-purple-400);
449
448
  --dt-color-border-info-inverted: var(--dt-color-blue-300);
450
449
  --dt-color-border-warning-inverted: var(--dt-color-gold-500);
451
- --dt-color-border-success-inverted: var(--dt-color-green-500);
452
450
  --dt-color-border-positive-inverted: var(--dt-color-green-500);
453
451
  --dt-color-border-critical-inverted: var(--dt-color-red-300);
454
452
  --dt-color-border-bold-inverted: oklch(1 0 0 / 0.5);
@@ -458,39 +456,34 @@
458
456
  --dt-color-border-brand-strong: var(--dt-color-purple-800);
459
457
  --dt-color-border-info-strong: var(--dt-color-blue-800);
460
458
  --dt-color-border-warning-strong: var(--dt-color-gold-700);
461
- --dt-color-border-success-strong: var(--dt-color-green-900);
462
459
  --dt-color-border-positive-strong: var(--dt-color-green-900);
463
460
  --dt-color-border-critical-strong: var(--dt-color-red-800);
464
461
  --dt-color-border-brand-subtle: var(--dt-color-purple-300);
465
462
  --dt-color-border-info-subtle: var(--dt-color-blue-300);
466
463
  --dt-color-border-warning-subtle: var(--dt-color-gold-300);
467
- --dt-color-border-success-subtle: var(--dt-color-green-300);
468
464
  --dt-color-border-positive-subtle: var(--dt-color-green-300);
469
465
  --dt-color-border-critical-subtle: var(--dt-color-red-300);
470
466
  --dt-color-border-brand: var(--dt-color-brand-purple);
471
467
  --dt-color-border-info: var(--dt-color-blue-600);
472
468
  --dt-color-border-warning: var(--dt-color-gold-500);
473
- --dt-color-border-success: var(--dt-color-green-700);
474
469
  --dt-color-border-positive: var(--dt-color-green-700);
475
470
  --dt-color-border-critical: var(--dt-color-red-600);
476
- --dt-color-border-bold: oklch(0.23 0 0 / 0.5);
477
- --dt-color-border-moderate: oklch(0.23 0 0 / 0.3);
478
- --dt-color-border-default: oklch(0.23 0 0 / 0.17);
479
- --dt-color-border-subtle: oklch(0.23 0 0 / 0.11);
471
+ --dt-color-border-bold: oklch(0.26 0.01 78.2 / 0.5);
472
+ --dt-color-border-moderate: oklch(0.26 0.01 78.2 / 0.3);
473
+ --dt-color-border-default: oklch(0.26 0.01 78.2 / 0.17);
474
+ --dt-color-border-subtle: oklch(0.26 0.01 78.2 / 0.11);
480
475
  --dt-color-surface-ai: var(--dt-color-gradient-gold-red-magenta-purple);
481
476
  --dt-color-surface-backdrop: oklch(0 0 0 / 0.65); /* Background color for a modal-like backdrop. */
482
- --dt-color-surface-brand-subtle-opaque-inverted: oklch(0.16 0.08 292 / 0.66); /* Info surface as opaque background color. */
483
- --dt-color-surface-info-subtle-opaque-inverted: oklch(0.14 0.03 244 / 0.66); /* Info surface as opaque background color. */
484
- --dt-color-surface-success-subtle-opaque-inverted: oklch(0.21 0.05 162 / 0.66); /* Success subtle surface as opaque background color. */
477
+ --dt-color-surface-brand-subtle-opaque-inverted: oklch(0.15 0.09 291 / 0.66); /* Info surface as opaque background color. */
478
+ --dt-color-surface-info-subtle-opaque-inverted: oklch(0.16 0.05 252 / 0.66); /* Info surface as opaque background color. */
485
479
  --dt-color-surface-positive-subtle-opaque-inverted: oklch(0.21 0.05 162 / 0.66); /* Positive subtle surface as opaque background color. */
486
- --dt-color-surface-warning-subtle-opaque-inverted: oklch(0.2 0.04 76.1 / 0.3); /* Warning subtle surface as opaque background color */
487
- --dt-color-surface-critical-subtle-opaque-inverted: oklch(0.17 0.07 16.5 / 0.6); /* Critical subtle surface as opaque background color. */
488
- --dt-color-surface-brand-opaque-inverted: oklch(0.23 0.13 285 / 0.8); /* Info surface as opaque background color. */
489
- --dt-color-surface-info-opaque-inverted: oklch(0.22 0.05 248 / 0.6); /* Info surface as opaque background color. */
490
- --dt-color-surface-success-opaque-inverted: oklch(0.34 0.08 157 / 0.3); /* Success surface as opaque background color. */
480
+ --dt-color-surface-warning-subtle-opaque-inverted: oklch(0.18 0.04 77.5 / 0.3); /* Warning subtle surface as opaque background color */
481
+ --dt-color-surface-critical-subtle-opaque-inverted: oklch(0.17 0.07 8 / 0.6); /* Critical subtle surface as opaque background color. */
482
+ --dt-color-surface-brand-opaque-inverted: oklch(0.22 0.13 285 / 0.8); /* Info surface as opaque background color. */
483
+ --dt-color-surface-info-opaque-inverted: oklch(0.26 0.09 258 / 0.6); /* Info surface as opaque background color. */
491
484
  --dt-color-surface-positive-opaque-inverted: oklch(0.34 0.08 157 / 0.3); /* Positive surface as opaque background color. */
492
- --dt-color-surface-warning-opaque-inverted: oklch(0.35 0.07 68.3 / 0.35); /* Warning surface as opaque background color */
493
- --dt-color-surface-critical-opaque-inverted: oklch(0.32 0.13 12.4 / 0.5); /* Critical surface as opaque background color. */
485
+ --dt-color-surface-warning-opaque-inverted: oklch(0.32 0.07 64.8 / 0.35); /* Warning surface as opaque background color */
486
+ --dt-color-surface-critical-opaque-inverted: oklch(0.31 0.13 14.7 / 0.5); /* Critical surface as opaque background color. */
494
487
  --dt-color-surface-contrast-opaque-inverted: oklch(1 0 0 / 0.97); /* Contrast surface as opaque background color. */
495
488
  --dt-color-surface-strong-opaque-inverted: oklch(1 0 0 / 0.67); /* Strong surface as opaque background color. */
496
489
  --dt-color-surface-bold-opaque-inverted: oklch(1 0 0 / 0.32); /* Bold surface as opaque background color. */
@@ -503,13 +496,11 @@
503
496
  --dt-color-surface-critical-strong-inverted: var(--dt-color-red-300); /* A contrasting critical surface, most likely paired with inverted foreground colors. */
504
497
  --dt-color-surface-brand-subtle-inverted: var(--dt-color-purple-1000); /* A softer version of the default informational surface. */
505
498
  --dt-color-surface-info-subtle-inverted: var(--dt-color-blue-1000); /* A softer version of the default informational surface. */
506
- --dt-color-surface-success-subtle-inverted: var(--dt-color-green-1000); /* A softer version of the default success surface. */
507
499
  --dt-color-surface-positive-subtle-inverted: var(--dt-color-green-1000); /* A softer version of the default positive surface. */
508
500
  --dt-color-surface-warning-subtle-inverted: var(--dt-color-gold-1000); /* A softer version of the default warning surface. */
509
501
  --dt-color-surface-critical-subtle-inverted: var(--dt-color-red-1000); /* A softer version of the Critical surface. */
510
502
  --dt-color-surface-brand-inverted: var(--dt-color-purple-950); /* Background surface color containing messaging or elements communicated as generally informational. */
511
503
  --dt-color-surface-info-inverted: var(--dt-color-blue-950); /* Background surface color containing messaging or elements communicated as generally informational. */
512
- --dt-color-surface-success-inverted: var(--dt-color-green-900); /* Background surface color containing messaging or elements expressing a positive or successful state. */
513
504
  --dt-color-surface-positive-inverted: var(--dt-color-green-900); /* Background surface color containing messaging or elements expressing a positive or successful state. */
514
505
  --dt-color-surface-warning-inverted: var(--dt-color-gold-950); /* Background surface color highlighting messaging or elements that may require user's attention. */
515
506
  --dt-color-surface-critical-inverted: var(--dt-color-red-950); /* Background surface color containing error, danger, or otherwise critical messaging or elements. */
@@ -519,38 +510,33 @@
519
510
  --dt-color-surface-moderate-inverted: var(--dt-color-black-700); /* A tertiary surface level, prominent without being too overpowering. */
520
511
  --dt-color-surface-secondary-inverted: var(--dt-color-black-800); /* For adjacent or complementary regions. */
521
512
  --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. */
522
- --dt-color-surface-brand-subtle-opaque: oklch(0.84 0.08 300 / 0.2); /* Info surface as opaque background color. */
523
- --dt-color-surface-info-subtle-opaque: oklch(0.96 0.01 248 / 0.5); /* Info surface as opaque background color. */
524
- --dt-color-surface-success-subtle-opaque: oklch(0.96 0.06 167 / 0.5); /* Success subtle surface as opaque background color. */
513
+ --dt-color-surface-brand-subtle-opaque: oklch(0.85 0.09 301 / 0.2); /* Info surface as opaque background color. */
514
+ --dt-color-surface-info-subtle-opaque: oklch(0.9 0.05 257 / 0.5); /* Info surface as opaque background color. */
525
515
  --dt-color-surface-positive-subtle-opaque: oklch(0.96 0.06 167 / 0.5); /* Positive subtle surface as opaque background color. */
526
- --dt-color-surface-warning-subtle-opaque: oklch(0.97 0.05 94.4 / 0.5); /* Warning subtle surface as opaque background color */
527
- --dt-color-surface-critical-subtle-opaque: oklch(0.93 0.03 15.2 / 0.5); /* Critical subtle surface as opaque background color. */
528
- --dt-color-surface-brand-opaque: oklch(0.84 0.08 300 / 0.27); /* Info surface as opaque background color. */
529
- --dt-color-surface-info-opaque: oklch(0.91 0.04 232 / 0.35); /* Info surface as opaque background color. */
530
- --dt-color-surface-success-opaque: oklch(0.79 0.17 159 / 0.25); /* Success surface as opaque background color. */
516
+ --dt-color-surface-warning-subtle-opaque: oklch(0.94 0.05 77.3 / 0.5); /* Warning subtle surface as opaque background color */
517
+ --dt-color-surface-critical-subtle-opaque: oklch(0.88 0.07 17.3 / 0.5); /* Critical subtle surface as opaque background color. */
518
+ --dt-color-surface-brand-opaque: oklch(0.85 0.09 301 / 0.39); /* Info surface as opaque background color. */
519
+ --dt-color-surface-info-opaque: oklch(0.84 0.08 257 / 0.35); /* Info surface as opaque background color. */
531
520
  --dt-color-surface-positive-opaque: oklch(0.79 0.17 159 / 0.25); /* Positive surface as opaque background color. */
532
- --dt-color-surface-warning-opaque: oklch(0.93 0.1 93.2 / 0.5); /* Warning surface as opaque background color */
533
- --dt-color-surface-critical-opaque: oklch(0.82 0.07 24.1 / 0.31); /* Critical surface as opaque background color. */
534
- --dt-color-surface-contrast-opaque: oklch(0.23 0 0 / 0.94); /* Contrast surface as opaque background color. */
535
- --dt-color-surface-strong-opaque: oklch(0.23 0 0 / 0.76); /* Strong surface as opaque background color. */
536
- --dt-color-surface-bold-opaque: oklch(0.23 0 0 / 0.19); /* Bold surface as opaque background color. */
537
- --dt-color-surface-moderate-opaque: oklch(0.23 0 0 / 0.1); /* Moderate surface as opaque background color. */
538
- --dt-color-surface-secondary-opaque: oklch(0.23 0 0 / 0.02); /* Secondary surface as opaque background color. */
521
+ --dt-color-surface-warning-opaque: oklch(0.9 0.09 77.6 / 0.5); /* Warning surface as opaque background color */
522
+ --dt-color-surface-critical-opaque: oklch(0.82 0.1 12.7 / 0.31); /* Critical surface as opaque background color. */
523
+ --dt-color-surface-contrast-opaque: oklch(0.26 0.01 78.2 / 0.94); /* Contrast surface as opaque background color. */
524
+ --dt-color-surface-strong-opaque: oklch(0.26 0.01 78.2 / 0.76); /* Strong surface as opaque background color. */
525
+ --dt-color-surface-bold-opaque: oklch(0.26 0.01 78.2 / 0.19); /* Bold surface as opaque background color. */
526
+ --dt-color-surface-moderate-opaque: oklch(0.26 0.01 78.2 / 0.1); /* Moderate surface as opaque background color. */
527
+ --dt-color-surface-secondary-opaque: oklch(0.26 0.01 78.2 / 0.02); /* Secondary surface as opaque background color. */
539
528
  --dt-color-surface-brand-strong: var(--dt-color-purple-600); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
540
- --dt-color-surface-info-strong: var(--dt-color-blue-800); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
541
- --dt-color-surface-success-strong: var(--dt-color-green-600); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
542
- --dt-color-surface-positive-strong: var(--dt-color-green-800); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
543
- --dt-color-surface-warning-strong: var(--dt-color-gold-400); /* A contrasting warning surface, most likely paired with inverted foreground colors. */
529
+ --dt-color-surface-info-strong: var(--dt-color-blue-600); /* A contrasting informational surface, most likely paired with inverted foreground colors. */
530
+ --dt-color-surface-positive-strong: var(--dt-color-green-600); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
531
+ --dt-color-surface-warning-strong: var(--dt-color-gold-500); /* A contrasting warning surface, most likely paired with inverted foreground colors. */
544
532
  --dt-color-surface-critical-strong: var(--dt-color-red-600); /* A contrasting critical surface, most likely paired with inverted foreground colors. */
545
533
  --dt-color-surface-brand-subtle: var(--dt-color-purple-50); /* A softer version of the default informational surface. */
546
534
  --dt-color-surface-info-subtle: var(--dt-color-blue-50); /* A softer version of the default informational surface. */
547
- --dt-color-surface-success-subtle: var(--dt-color-green-50); /* A softer version of the default success surface. */
548
535
  --dt-color-surface-positive-subtle: var(--dt-color-green-50); /* A softer version of the default positive surface. */
549
536
  --dt-color-surface-warning-subtle: var(--dt-color-gold-50); /* A softer version of the default warning surface. */
550
537
  --dt-color-surface-critical-subtle: var(--dt-color-red-50); /* A softer version of the Critical surface. */
551
538
  --dt-color-surface-brand: var(--dt-color-purple-100); /* Background surface color containing messaging or elements communicated as generally informational. */
552
539
  --dt-color-surface-info: var(--dt-color-blue-100); /* Background surface color containing messaging or elements communicated as generally informational. */
553
- --dt-color-surface-success: var(--dt-color-green-100); /* Background surface color containing messaging or elements expressing a positive or successful state. */
554
540
  --dt-color-surface-positive: var(--dt-color-green-100); /* Background surface color containing messaging or elements expressing a positive or successful state. */
555
541
  --dt-color-surface-warning: var(--dt-color-gold-100); /* Background surface color highlighting messaging or elements that may require user's attention. */
556
542
  --dt-color-surface-critical: var(--dt-color-red-100); /* Background surface color containing error, danger, or otherwise critical messaging or elements. */
@@ -564,36 +550,34 @@
564
550
  --dt-color-link-warning-inverted-hover: var(--dt-color-gold-300);
565
551
  --dt-color-link-primary-inverted-hover: var(--dt-color-purple-200);
566
552
  --dt-color-link-primary-inverted: var(--dt-color-purple-200);
553
+ --dt-color-link-info-hover: var(--dt-color-blue-700);
554
+ --dt-color-link-info: var(--dt-color-blue-600);
567
555
  --dt-color-link-warning-hover: var(--dt-color-gold-900);
568
556
  --dt-color-link-primary-hover: var(--dt-color-purple-800);
569
557
  --dt-color-link-primary: var(--dt-color-purple-600);
570
558
  --dt-color-foreground-info-strong-inverted: var(--dt-color-blue-200); /* Info strong text that sits on high-contrast surfaces or backgrounds. */
571
559
  --dt-color-foreground-info-inverted: var(--dt-color-blue-300); /* Info text that sits on high-contrast surfaces or backgrounds. */
572
560
  --dt-color-foreground-warning-inverted: var(--dt-color-gold-500); /* Warning text that sits on high-contrast surfaces or backgrounds */
573
- --dt-color-foreground-success-strong-inverted: var(--dt-color-green-50); /* Success strong text that sits on high-contrast surfaces or backgrounds. */
574
- --dt-color-foreground-success-inverted: var(--dt-color-green-200); /* Success text that sits on high-contrast surfaces or backgrounds. */
575
561
  --dt-color-foreground-positive-strong-inverted: var(--dt-color-green-50); /* Positive strong text that sits on high-contrast surfaces or backgrounds. */
576
562
  --dt-color-foreground-positive-inverted: var(--dt-color-green-200); /* Positive text that sits on high-contrast surfaces or backgrounds. */
577
563
  --dt-color-foreground-critical-strong-inverted: var(--dt-color-red-200); /* Critical strong text that sits on high-contrast surfaces or backgrounds */
578
564
  --dt-color-foreground-critical-inverted: var(--dt-color-red-300); /* Critical text that sits on high-contrast surfaces or backgrounds */
579
565
  --dt-color-foreground-disabled-inverted: var(--dt-color-black-400); /* Disabled text color that sits on high-contrast surfaces or backgrounds. */
580
566
  --dt-color-foreground-placeholder-inverted: var(--dt-color-black-400); /* Placeholder text color that sits on high-contrast surfaces or backgrounds. */
581
- --dt-color-foreground-muted-inverted: oklch(0.98 0 0 / 0.65); /* Muted text color that sits on high-contrast surfaces or backgrounds. */
567
+ --dt-color-foreground-muted-inverted: oklch(0.98 0 48.7 / 0.65); /* Muted text color that sits on high-contrast surfaces or backgrounds. */
582
568
  --dt-color-foreground-tertiary-inverted: var(--dt-color-black-300); /* Tertiary text color that sits on high-contrast surfaces or backgrounds. */
583
569
  --dt-color-foreground-secondary-inverted: var(--dt-color-black-200); /* Secondary text color that sits on high-contrast surfaces or backgrounds. */
584
570
  --dt-color-foreground-primary-inverted: var(--dt-color-black-100); /* Primary text that sits on high-contrast surfaces or backgrounds. */
585
571
  --dt-color-foreground-info-strong: var(--dt-color-blue-900); /* Indicates a generally informational state on surfaces that require a stronger contrast. */
586
572
  --dt-color-foreground-info: var(--dt-color-blue-800); /* Indicates a generally informational state. */
587
573
  --dt-color-foreground-warning: var(--dt-color-gold-800); /* Indicates information that requires user’s attention and further action may be necessary. */
588
- --dt-color-foreground-success-strong: var(--dt-color-green-950); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
589
- --dt-color-foreground-success: var(--dt-color-green-700); /* Indicates a positive state. */
590
574
  --dt-color-foreground-positive-strong: var(--dt-color-green-950); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
591
575
  --dt-color-foreground-positive: var(--dt-color-green-700); /* Indicates a positive state. */
592
576
  --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. */
593
577
  --dt-color-foreground-critical: var(--dt-color-red-600); /* Expresses an error, danger, or otherwise critical state. */
594
578
  --dt-color-foreground-disabled: var(--dt-color-black-500); /* Used for text paired with disabled content or components, like the form elements. */
595
579
  --dt-color-foreground-placeholder: var(--dt-color-black-500); /* Text color for placeholder text within form elements. */
596
- --dt-color-foreground-muted: oklch(0 0 0 / 0.5);
580
+ --dt-color-foreground-muted: oklch(0.16 0 84.6 / 0.5);
597
581
  --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. */
598
582
  --dt-color-foreground-secondary: var(--dt-color-black-700); /* Example uses include introduction paragraphs, labels, and descriptions paired with form elements. */
599
583
  --dt-color-foreground-primary: var(--dt-color-black-900); /* Default text color throughout the UI. */
@@ -661,39 +645,38 @@
661
645
  --dt-theme-presence-color-background-busy-unavailable: var(--dt-presence-color-unavailable);
662
646
  --dt-theme-presence-color-background-available: var(--dt-presence-color-available);
663
647
  --dt-theme-sidebar-section-color-foreground: var(--dt-color-foreground-tertiary);
664
- --dt-theme-sidebar-selected-row-color-background: oklch(0.23 0 0 / 0.09);
648
+ --dt-theme-sidebar-selected-row-color-background: oklch(0.26 0.01 78.2 / 0.09);
665
649
  --dt-theme-sidebar-selected-row-color-foreground: var(--dt-color-foreground-primary);
666
- --dt-theme-sidebar-row-color-background-active: oklch(0.23 0 0 / 0.15);
667
- --dt-theme-sidebar-row-color-background-hover: oklch(0.23 0 0 / 0.11);
668
- --dt-theme-sidebar-row-color-background: oklch(0.23 0 0 / 0);
650
+ --dt-theme-sidebar-row-color-background-active: oklch(0.26 0.01 78.2 / 0.15);
651
+ --dt-theme-sidebar-row-color-background-hover: oklch(0.26 0.01 78.2 / 0.11);
652
+ --dt-theme-sidebar-row-color-background: oklch(0.26 0.01 78.2 / 0);
669
653
  --dt-theme-sidebar-status-color-foreground: var(--dt-color-foreground-tertiary);
670
654
  --dt-theme-sidebar-color-foreground-unread: var(--dt-color-foreground-primary);
671
655
  --dt-theme-sidebar-color-foreground: var(--dt-color-foreground-secondary);
672
- --dt-theme-topbar-profile-color-background-active: oklch(0.23 0 0 / 0.14);
673
- --dt-theme-topbar-profile-color-background-hover: oklch(0.23 0 0 / 0.1);
674
- --dt-theme-topbar-profile-color-background-inverted: oklch(0.23 0 0 / 0.75);
675
- --dt-theme-topbar-profile-color-background: oklch(0.23 0 0 / 0.05);
676
- --dt-theme-topbar-profile-color-foreground-inverted: oklch(0.98 0 0 / 0.75);
677
- --dt-theme-topbar-button-color-background-active: oklch(0.23 0 0 / 0.1);
678
- --dt-theme-topbar-button-color-background-hover: oklch(0.23 0 0 / 0.05);
679
- --dt-theme-topbar-button-color-background: oklch(0.23 0 0 / 0);
656
+ --dt-theme-topbar-profile-color-background-active: oklch(0.26 0.01 78.2 / 0.14);
657
+ --dt-theme-topbar-profile-color-background-hover: oklch(0.26 0.01 78.2 / 0.1);
658
+ --dt-theme-topbar-profile-color-background-inverted: oklch(0.26 0.01 78.2 / 0.75);
659
+ --dt-theme-topbar-profile-color-background: oklch(0.26 0.01 78.2 / 0.05);
660
+ --dt-theme-topbar-profile-color-foreground-inverted: oklch(0.98 0 48.7 / 0.75);
661
+ --dt-theme-topbar-button-color-background-active: oklch(0.26 0.01 78.2 / 0.1);
662
+ --dt-theme-topbar-button-color-background-hover: oklch(0.26 0.01 78.2 / 0.05);
663
+ --dt-theme-topbar-button-color-background: oklch(0.26 0.01 78.2 / 0);
680
664
  --dt-theme-topbar-button-color-foreground-hover: var(--dt-theme-color-base);
681
- --dt-theme-topbar-button-color-foreground: oklch(0.23 0 0 / 0.65);
682
- --dt-theme-topbar-field-color-border-active: oklch(0.23 0 0 / 0.2);
683
- --dt-theme-topbar-field-color-border-hover: oklch(0.23 0 0 / 0.1);
684
- --dt-theme-topbar-field-color-border: oklch(0.23 0 0 / 0);
685
- --dt-theme-topbar-field-color-background-hover: oklch(0.45 0 0);
686
- --dt-theme-topbar-field-color-background: oklch(0.23 0 0 / 0.05);
687
- --dt-theme-topbar-field-color-foreground-hover: oklch(0.23 0 0 / 0.75);
688
- --dt-theme-topbar-field-color-foreground: oklch(0.23 0 0 / 0.5);
665
+ --dt-theme-topbar-button-color-foreground: oklch(0.26 0.01 78.2 / 0.65);
666
+ --dt-theme-topbar-field-color-border-active: oklch(0.26 0.01 78.2 / 0.2);
667
+ --dt-theme-topbar-field-color-border-hover: oklch(0.26 0.01 78.2 / 0.1);
668
+ --dt-theme-topbar-field-color-border: oklch(0.26 0.01 78.2 / 0);
669
+ --dt-theme-topbar-field-color-background-hover: oklch(0.51 0.01 78.2);
670
+ --dt-theme-topbar-field-color-background: oklch(0.26 0.01 78.2 / 0.05);
671
+ --dt-theme-topbar-field-color-foreground-hover: oklch(0.26 0.01 78.2 / 0.75);
672
+ --dt-theme-topbar-field-color-foreground: oklch(0.26 0.01 78.2 / 0.5);
689
673
  --dt-theme-topbar-color-background: var(--dt-color-surface-secondary);
690
- --dt-theme-topbar-color-foreground: oklch(0.23 0 0 / 0.8);
674
+ --dt-theme-topbar-color-foreground: oklch(0.26 0.01 78.2 / 0.8);
691
675
  --dt-action-color-border-positive-outlined-default: var(--dt-color-border-positive);
692
676
  --dt-action-color-border-muted-outlined-default: var(--dt-color-border-default);
693
677
  --dt-action-color-border-inverted-outlined-default: var(--dt-color-border-default-inverted);
694
678
  --dt-action-color-border-critical-outlined-default: var(--dt-color-border-critical);
695
679
  --dt-action-color-border-base-outlined-default: var(--dt-color-border-brand);
696
- --dt-action-color-background-positive-primary-active: oklch(0.38 0.1 156);
697
680
  --dt-action-color-background-positive-hover: var(--dt-color-surface-positive-opaque);
698
681
  --dt-action-color-background-disabled-default: var(--dt-color-surface-bold-opaque);
699
682
  --dt-action-color-background-muted-hover: var(--dt-color-surface-moderate-opaque);
@@ -815,8 +798,8 @@
815
798
  --dt-typography-body-md-font-size: var(--dt-font-size-200); /* Base default medium text style for main content. */
816
799
  --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. */
817
800
  --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. */
818
- --dt-color-chart-sequential-10-selected: oklch(0.23 0.05 276); /* Selected state for tenth sequential chart color. */
819
- --dt-color-chart-sequential-10-hover: oklch(0.28 0.06 258); /* Hover state for tenth sequential chart color. */
801
+ --dt-color-chart-sequential-10-selected: oklch(0.28 0.05 193); /* Selected state for tenth sequential chart color. */
802
+ --dt-color-chart-sequential-10-hover: oklch(0.31 0.06 217); /* Hover state for tenth sequential chart color. */
820
803
  --dt-color-chart-sequential-09: oklch(0.39 0.06 243); /* Ninth color in sequential chart series, extremely dark shade. */
821
804
  --dt-color-chart-sequential-08: oklch(0.46 0.06 246); /* Eighth color in sequential chart series, very dark shade. */
822
805
  --dt-color-chart-sequential-07: oklch(0.54 0.05 249); /* Seventh color in sequential chart series, dark shade. */
@@ -825,25 +808,46 @@
825
808
  --dt-color-chart-sequential-04: oklch(0.75 0.03 258); /* Fourth color in sequential chart series, light-medium shade. */
826
809
  --dt-color-chart-sequential-03: oklch(0.82 0.02 261); /* Third color in sequential chart series, light shade. */
827
810
  --dt-color-chart-sequential-02: oklch(0.89 0.02 264); /* Second color in sequential chart series, very light shade. */
828
- --dt-color-chart-sequential-01-selected: oklch(0.67 0.01 295); /* Selected state for first sequential chart color. */
829
- --dt-color-chart-sequential-01-hover: oklch(0.81 0.01 281); /* Hover state for first sequential chart color. */
811
+ --dt-color-chart-sequential-01-selected: oklch(0.72 0.01 320); /* Selected state for first sequential chart color. */
812
+ --dt-color-chart-sequential-01-hover: oklch(0.84 0.01 293); /* Hover state for first sequential chart color. */
830
813
  --dt-color-chart-categorical-11-selected: oklch(0.59 0.01 56.3);
831
814
  --dt-color-chart-categorical-11-hover: oklch(0.71 0.01 56.3);
832
- --dt-color-chart-categorical-28: oklch(0.72 0.15 259);
833
- --dt-color-chart-categorical-26: oklch(0.74 0.18 388);
834
- --dt-color-chart-categorical-22: oklch(0.79 0.07 357);
835
- --dt-color-chart-categorical-21: oklch(0.69 0.15 118);
836
- --dt-color-chart-categorical-20: oklch(0.72 0.15 259);
837
- --dt-color-chart-categorical-19: oklch(0.71 0.13 228);
838
- --dt-color-chart-categorical-18: oklch(0.69 0.17 83.2);
839
- --dt-color-chart-categorical-17: oklch(0.74 0.21 346);
815
+ --dt-color-chart-categorical-28: oklch(0.64 0.21 273);
816
+ --dt-color-chart-categorical-26: oklch(0.72 0.19 385);
817
+ --dt-color-chart-categorical-22: oklch(0.77 0.09 362);
818
+ --dt-color-chart-categorical-21: oklch(0.67 0.17 119);
819
+ --dt-color-chart-categorical-20: oklch(0.64 0.21 273);
820
+ --dt-color-chart-categorical-19: oklch(0.62 0.21 244);
821
+ --dt-color-chart-categorical-18: oklch(0.78 0.14 86.6);
822
+ --dt-color-chart-categorical-17: oklch(0.74 0.21 343);
840
823
  --dt-color-chart-categorical-16: oklch(0.66 0.15 140);
841
- --dt-color-chart-categorical-15: oklch(0.75 0.17 402);
842
- --dt-color-chart-categorical-14: oklch(0.72 0.15 268);
843
- --dt-color-chart-categorical-13: oklch(0.68 0.19 405);
844
- --dt-color-chart-categorical-12: oklch(0.69 0.19 332);
845
- --dt-color-surface-primary-opaque-inverted: oklch(0 0 0 / 0.85); /* Secondary surface as opaque background color. */
824
+ --dt-color-chart-categorical-15: oklch(0.74 0.19 399);
825
+ --dt-color-chart-categorical-14: oklch(0.66 0.21 280);
826
+ --dt-color-chart-categorical-13: oklch(0.68 0.21 398);
827
+ --dt-color-chart-categorical-12: oklch(0.64 0.22 329);
828
+ --dt-color-border-success-strong-inverted: var(--dt-color-border-positive-strong-inverted);
829
+ --dt-color-border-success-subtle-inverted: var(--dt-color-border-positive-subtle-inverted);
830
+ --dt-color-border-success-inverted: var(--dt-color-border-positive-inverted);
831
+ --dt-color-border-success-strong: var(--dt-color-border-positive-strong);
832
+ --dt-color-border-success-subtle: var(--dt-color-border-positive-subtle);
833
+ --dt-color-border-success: var(--dt-color-border-positive);
834
+ --dt-color-surface-success-subtle-opaque-inverted: var(--dt-color-surface-positive-subtle-opaque-inverted); /* Success subtle surface as opaque background color. */
835
+ --dt-color-surface-success-opaque-inverted: var(--dt-color-surface-positive-opaque-inverted); /* Success surface as opaque background color. */
836
+ --dt-color-surface-primary-opaque-inverted: oklch(0.16 0 84.6 / 0.85); /* Secondary surface as opaque background color. */
837
+ --dt-color-surface-success-subtle-inverted: var(--dt-color-surface-positive-subtle-inverted); /* A softer version of the default success surface. */
838
+ --dt-color-surface-success-inverted: var(--dt-color-surface-positive-inverted); /* Background surface color containing messaging or elements expressing a positive or successful state. */
839
+ --dt-color-surface-success-subtle-opaque: var(--dt-color-surface-positive-subtle-opaque); /* Success subtle surface as opaque background color. */
840
+ --dt-color-surface-success-opaque: var(--dt-color-surface-positive-opaque); /* Success surface as opaque background color. */
846
841
  --dt-color-surface-primary-opaque: oklch(1 0 0 / 0.96); /* Primary surface as opaque background color. */
842
+ --dt-color-surface-success-strong: var(--dt-color-surface-positive-strong); /* A contrasting positive state surface, most likely paired with inverted foreground colors. */
843
+ --dt-color-surface-success-subtle: var(--dt-color-surface-positive-subtle); /* A softer version of the default success surface. */
844
+ --dt-color-surface-success: var(--dt-color-surface-positive); /* Background surface color containing messaging or elements expressing a positive or successful state. */
845
+ --dt-color-link-mention-inverted-background-hover: oklch(0.85 0.09 301 / 0.2);
846
+ --dt-color-link-mention-inverted-background: oklch(0.85 0.09 301 / 0.3);
847
+ --dt-color-link-mention-background-hover: oklch(0.85 0.09 301 / 0.15);
848
+ --dt-color-link-mention-background: oklch(0.85 0.09 301 / 0.1);
849
+ --dt-color-link-mention-hover: var(--dt-color-link-primary-hover);
850
+ --dt-color-link-mention: var(--dt-color-link-primary);
847
851
  --dt-color-link-disabled-inverted-hover: var(--dt-color-foreground-disabled-inverted);
848
852
  --dt-color-link-disabled-inverted: var(--dt-color-foreground-disabled-inverted);
849
853
  --dt-color-link-muted-inverted: var(--dt-color-foreground-secondary-inverted);
@@ -859,8 +863,6 @@
859
863
  --dt-color-link-disabled: var(--dt-color-foreground-disabled);
860
864
  --dt-color-link-muted-hover: var(--dt-color-foreground-primary);
861
865
  --dt-color-link-muted: var(--dt-color-foreground-secondary);
862
- --dt-color-link-info-hover: var(--dt-color-foreground-info-strong);
863
- --dt-color-link-info: var(--dt-color-foreground-info);
864
866
  --dt-color-link-warning: var(--dt-color-foreground-warning);
865
867
  --dt-color-link-success-hover: var(--dt-color-foreground-positive-strong);
866
868
  --dt-color-link-success: var(--dt-color-foreground-positive); /* positive */
@@ -868,19 +870,23 @@
868
870
  --dt-color-link-positive: var(--dt-color-foreground-positive); /* positive */
869
871
  --dt-color-link-critical-hover: var(--dt-color-foreground-critical-strong);
870
872
  --dt-color-link-critical: var(--dt-color-foreground-critical);
873
+ --dt-color-foreground-success-strong-inverted: var(--dt-color-foreground-positive-strong-inverted); /* Success strong text that sits on high-contrast surfaces or backgrounds. */
874
+ --dt-color-foreground-success-inverted: var(--dt-color-foreground-positive-inverted); /* Success text that sits on high-contrast surfaces or backgrounds. */
875
+ --dt-color-foreground-success-strong: var(--dt-color-foreground-positive-strong); /* Indicates a strong positive state on surfaces that require a stronger contrast. */
876
+ --dt-color-foreground-success: var(--dt-color-foreground-positive); /* Indicates a positive state. */
871
877
  --dt-icon-size-border-500: var(--dt-icon-size-border-400);
872
878
  --dt-shell-action-color-foreground-muted-selected: oklch(0.06 0.08 286 / 0.6);
873
879
  --dt-shell-action-color-foreground-muted-hover: oklch(0.08 0.08 286 / 0.6);
874
- --dt-shell-color-foreground-warning: oklch(0.36 0.1 68.3);
875
- --dt-shell-color-foreground-critical: oklch(0.45 0.21 16.4);
880
+ --dt-shell-color-foreground-warning: oklch(0.31 0.1 61.6);
881
+ --dt-shell-color-foreground-critical: oklch(0.46 0.23 18.6);
876
882
  --dt-shell-color-foreground-positive: oklch(0.44 0.13 155);
877
883
  --dt-theme-sidebar-icon-color-foreground: var(--dt-theme-sidebar-color-foreground);
878
884
  --dt-theme-sidebar-color-background: var(--dt-theme-topbar-color-background);
879
885
  --dt-theme-topbar-profile-color-foreground: var(--dt-theme-topbar-color-foreground);
880
886
  --dt-action-color-background-positive-active: oklch(0.55 0.17 159 / 0.25);
881
- --dt-action-color-background-muted-active: oklch(0.23 0 0 / 0.14);
882
- --dt-action-color-background-critical-active: oklch(0.73 0.07 24.1 / 0.31);
883
- --dt-action-color-background-base-active: oklch(0.75 0.08 300 / 0.27);
887
+ --dt-action-color-background-muted-active: oklch(0.26 0.01 78.2 / 0.14);
888
+ --dt-action-color-background-critical-active: oklch(0.73 0.1 12.7 / 0.31);
889
+ --dt-action-color-background-base-active: oklch(0.76 0.09 301 / 0.39);
884
890
  --dt-action-color-foreground-positive-hover: var(--dt-color-link-positive-hover);
885
891
  --dt-action-color-foreground-positive-default: var(--dt-color-link-positive);
886
892
  --dt-action-color-foreground-muted-hover: var(--dt-color-link-muted-hover);
@@ -942,72 +948,72 @@
942
948
  --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);
943
949
  --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);
944
950
  --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) */
945
- --dt-color-chart-sequential-09-selected: oklch(0.27 0.04 278); /* Selected state for ninth sequential chart color. */
946
- --dt-color-chart-sequential-09-hover: oklch(0.33 0.05 261); /* Hover state for ninth sequential chart color. */
947
- --dt-color-chart-sequential-08-selected: oklch(0.32 0.04 280); /* Selected state for eighth sequential chart color. */
948
- --dt-color-chart-sequential-08-hover: oklch(0.39 0.05 263); /* Hover state for eighth sequential chart color. */
949
- --dt-color-chart-sequential-07-selected: oklch(0.38 0.04 282); /* Selected state for seventh sequential chart color. */
950
- --dt-color-chart-sequential-07-hover: oklch(0.46 0.04 266); /* Hover state for seventh sequential chart color. */
951
- --dt-color-chart-sequential-06-selected: oklch(0.43 0.03 284); /* Selected state for sixth sequential chart color. */
952
- --dt-color-chart-sequential-06-hover: oklch(0.52 0.03 268); /* Hover state for sixth sequential chart color. */
953
- --dt-color-chart-sequential-05-selected: oklch(0.48 0.03 287); /* Selected state for fifth sequential chart color. */
954
- --dt-color-chart-sequential-05-hover: oklch(0.58 0.03 271); /* Hover state for fifth sequential chart color. */
955
- --dt-color-chart-sequential-04-selected: oklch(0.53 0.02 289); /* Selected state for fourth sequential chart color. */
956
- --dt-color-chart-sequential-04-hover: oklch(0.64 0.03 273); /* Hover state for fourth sequential chart color. */
957
- --dt-color-chart-sequential-03-selected: oklch(0.57 0.01 291); /* Selected state for third sequential chart color. */
958
- --dt-color-chart-sequential-03-hover: oklch(0.7 0.02 276); /* Hover state for third sequential chart color. */
959
- --dt-color-chart-sequential-02-selected: oklch(0.62 0.01 293); /* Selected state for second sequential chart color. */
960
- --dt-color-chart-sequential-02-hover: oklch(0.76 0.02 278); /* Hover state for second sequential chart color. */
961
- --dt-color-chart-categorical-28-selected: oklch(0.5 0.15 259);
962
- --dt-color-chart-categorical-28-hover: oklch(0.61 0.15 259);
963
- --dt-color-chart-categorical-26-selected: oklch(0.52 0.18 388);
964
- --dt-color-chart-categorical-26-hover: oklch(0.63 0.18 388);
965
- --dt-color-chart-categorical-22-selected: oklch(0.55 0.07 357);
966
- --dt-color-chart-categorical-22-hover: oklch(0.67 0.07 357);
967
- --dt-color-chart-categorical-21-selected: oklch(0.48 0.15 118);
968
- --dt-color-chart-categorical-21-hover: oklch(0.59 0.15 118);
969
- --dt-color-chart-categorical-20-selected: oklch(0.5 0.15 259);
970
- --dt-color-chart-categorical-20-hover: oklch(0.61 0.15 259);
971
- --dt-color-chart-categorical-19-selected: oklch(0.5 0.13 228);
972
- --dt-color-chart-categorical-19-hover: oklch(0.6 0.13 228);
973
- --dt-color-chart-categorical-18-selected: oklch(0.48 0.17 83.2);
974
- --dt-color-chart-categorical-18-hover: oklch(0.59 0.17 83.2);
975
- --dt-color-chart-categorical-17-selected: oklch(0.52 0.21 346);
976
- --dt-color-chart-categorical-17-hover: oklch(0.63 0.21 346);
951
+ --dt-color-chart-sequential-09-selected: oklch(0.32 0.04 195); /* Selected state for ninth sequential chart color. */
952
+ --dt-color-chart-sequential-09-hover: oklch(0.36 0.05 219); /* Hover state for ninth sequential chart color. */
953
+ --dt-color-chart-sequential-08-selected: oklch(0.37 0.04 198); /* Selected state for eighth sequential chart color. */
954
+ --dt-color-chart-sequential-08-hover: oklch(0.41 0.05 222); /* Hover state for eighth sequential chart color. */
955
+ --dt-color-chart-sequential-07-selected: oklch(0.43 0.04 200); /* Selected state for seventh sequential chart color. */
956
+ --dt-color-chart-sequential-07-hover: oklch(0.48 0.04 224); /* Hover state for seventh sequential chart color. */
957
+ --dt-color-chart-sequential-06-selected: oklch(0.47 0.03 202); /* Selected state for sixth sequential chart color. */
958
+ --dt-color-chart-sequential-06-hover: oklch(0.54 0.03 227); /* Hover state for sixth sequential chart color. */
959
+ --dt-color-chart-sequential-05-selected: oklch(0.52 0.03 204); /* Selected state for fifth sequential chart color. */
960
+ --dt-color-chart-sequential-05-hover: oklch(0.6 0.03 229); /* Hover state for fifth sequential chart color. */
961
+ --dt-color-chart-sequential-04-selected: oklch(0.57 0.02 206); /* Selected state for fourth sequential chart color. */
962
+ --dt-color-chart-sequential-04-hover: oklch(0.66 0.03 232); /* Hover state for fourth sequential chart color. */
963
+ --dt-color-chart-sequential-03-selected: oklch(0.62 0.02 208); /* Selected state for third sequential chart color. */
964
+ --dt-color-chart-sequential-03-hover: oklch(0.72 0.02 235); /* Hover state for third sequential chart color. */
965
+ --dt-color-chart-sequential-02-selected: oklch(0.67 0.02 210); /* Selected state for second sequential chart color. */
966
+ --dt-color-chart-sequential-02-hover: oklch(0.78 0.02 237); /* Hover state for second sequential chart color. */
967
+ --dt-color-chart-categorical-28-selected: oklch(0.45 0.21 273);
968
+ --dt-color-chart-categorical-28-hover: oklch(0.54 0.21 273);
969
+ --dt-color-chart-categorical-26-selected: oklch(0.5 0.19 385);
970
+ --dt-color-chart-categorical-26-hover: oklch(0.61 0.19 385);
971
+ --dt-color-chart-categorical-22-selected: oklch(0.54 0.09 362);
972
+ --dt-color-chart-categorical-22-hover: oklch(0.65 0.09 362);
973
+ --dt-color-chart-categorical-21-selected: oklch(0.47 0.17 119);
974
+ --dt-color-chart-categorical-21-hover: oklch(0.57 0.17 119);
975
+ --dt-color-chart-categorical-20-selected: oklch(0.45 0.21 273);
976
+ --dt-color-chart-categorical-20-hover: oklch(0.54 0.21 273);
977
+ --dt-color-chart-categorical-19-selected: oklch(0.43 0.21 244);
978
+ --dt-color-chart-categorical-19-hover: oklch(0.53 0.21 244);
979
+ --dt-color-chart-categorical-18-selected: oklch(0.55 0.14 86.6);
980
+ --dt-color-chart-categorical-18-hover: oklch(0.66 0.14 86.6);
981
+ --dt-color-chart-categorical-17-selected: oklch(0.52 0.21 343);
982
+ --dt-color-chart-categorical-17-hover: oklch(0.63 0.21 343);
977
983
  --dt-color-chart-categorical-16-selected: oklch(0.46 0.15 140);
978
984
  --dt-color-chart-categorical-16-hover: oklch(0.56 0.15 140);
979
- --dt-color-chart-categorical-15-selected: oklch(0.52 0.17 402);
980
- --dt-color-chart-categorical-15-hover: oklch(0.64 0.17 402);
981
- --dt-color-chart-categorical-14-selected: oklch(0.5 0.15 268);
982
- --dt-color-chart-categorical-14-hover: oklch(0.61 0.15 268);
983
- --dt-color-chart-categorical-13-selected: oklch(0.48 0.19 405);
984
- --dt-color-chart-categorical-13-hover: oklch(0.58 0.19 405);
985
- --dt-color-chart-categorical-12-selected: oklch(0.48 0.19 332);
986
- --dt-color-chart-categorical-12-hover: oklch(0.59 0.19 332);
987
- --dt-color-chart-categorical-30: oklch(0.71 0.12 217);
988
- --dt-color-chart-categorical-29: oklch(0.7 0.17 416);
989
- --dt-color-chart-categorical-27: oklch(0.67 0.14 171);
990
- --dt-color-chart-categorical-25: oklch(0.71 0.16 321);
991
- --dt-color-chart-categorical-24: oklch(0.71 0.18 52.6);
992
- --dt-color-chart-categorical-23: oklch(0.71 0.18 353);
985
+ --dt-color-chart-categorical-15-selected: oklch(0.52 0.19 399);
986
+ --dt-color-chart-categorical-15-hover: oklch(0.63 0.19 399);
987
+ --dt-color-chart-categorical-14-selected: oklch(0.46 0.21 280);
988
+ --dt-color-chart-categorical-14-hover: oklch(0.56 0.21 280);
989
+ --dt-color-chart-categorical-13-selected: oklch(0.48 0.21 398);
990
+ --dt-color-chart-categorical-13-hover: oklch(0.58 0.21 398);
991
+ --dt-color-chart-categorical-12-selected: oklch(0.45 0.22 329);
992
+ --dt-color-chart-categorical-12-hover: oklch(0.54 0.22 329);
993
+ --dt-color-chart-categorical-30: oklch(0.63 0.18 231);
994
+ --dt-color-chart-categorical-29: oklch(0.75 0.16 418);
995
+ --dt-color-chart-categorical-27: oklch(0.64 0.17 176);
996
+ --dt-color-chart-categorical-25: oklch(0.7 0.19 330);
997
+ --dt-color-chart-categorical-24: oklch(0.71 0.2 46.6);
998
+ --dt-color-chart-categorical-23: oklch(0.67 0.21 350);
993
999
  --dt-color-link-disabled-hover: var(--dt-color-link-disabled);
994
1000
  --dt-shell-action-color-foreground-muted-active: var(--dt-shell-action-color-foreground-muted-hover);
995
1001
  --dt-action-color-foreground-positive-active: var(--dt-action-color-foreground-positive-hover);
996
1002
  --dt-action-color-foreground-muted-active: var(--dt-action-color-foreground-muted-hover);
997
1003
  --dt-action-color-foreground-inverted-active: var(--dt-action-color-foreground-inverted-hover);
998
1004
  --dt-action-color-foreground-critical-active: var(--dt-action-color-foreground-critical-hover);
999
- --dt-color-chart-categorical-30-selected: oklch(0.5 0.12 217);
1000
- --dt-color-chart-categorical-30-hover: oklch(0.6 0.12 217);
1001
- --dt-color-chart-categorical-29-selected: oklch(0.49 0.17 416);
1002
- --dt-color-chart-categorical-29-hover: oklch(0.59 0.17 416);
1003
- --dt-color-chart-categorical-27-selected: oklch(0.47 0.14 171);
1004
- --dt-color-chart-categorical-27-hover: oklch(0.57 0.14 171);
1005
- --dt-color-chart-categorical-25-selected: oklch(0.5 0.16 321);
1006
- --dt-color-chart-categorical-25-hover: oklch(0.6 0.16 321);
1007
- --dt-color-chart-categorical-24-selected: oklch(0.5 0.18 52.6);
1008
- --dt-color-chart-categorical-24-hover: oklch(0.6 0.18 52.6);
1009
- --dt-color-chart-categorical-23-selected: oklch(0.5 0.18 353);
1010
- --dt-color-chart-categorical-23-hover: oklch(0.6 0.18 353);
1005
+ --dt-color-chart-categorical-30-selected: oklch(0.44 0.18 231);
1006
+ --dt-color-chart-categorical-30-hover: oklch(0.54 0.18 231);
1007
+ --dt-color-chart-categorical-29-selected: oklch(0.52 0.16 418);
1008
+ --dt-color-chart-categorical-29-hover: oklch(0.64 0.16 418);
1009
+ --dt-color-chart-categorical-27-selected: oklch(0.45 0.17 176);
1010
+ --dt-color-chart-categorical-27-hover: oklch(0.54 0.17 176);
1011
+ --dt-color-chart-categorical-25-selected: oklch(0.49 0.19 330);
1012
+ --dt-color-chart-categorical-25-hover: oklch(0.59 0.19 330);
1013
+ --dt-color-chart-categorical-24-selected: oklch(0.5 0.2 46.6);
1014
+ --dt-color-chart-categorical-24-hover: oklch(0.6 0.2 46.6);
1015
+ --dt-color-chart-categorical-23-selected: oklch(0.47 0.21 350);
1016
+ --dt-color-chart-categorical-23-hover: oklch(0.57 0.21 350);
1011
1017
  --dt-font-size-100-mobile: 1.2rem;
1012
1018
  --dt-font-size-200-mobile: 1.6rem;
1013
1019
  --dt-font-size-300-mobile: 2rem;