cetec-design-system 2.3.7 → 3.0.0

package/dist/styles.css

@@ -661,6 +661,7 @@
     --cetec-z-index-1000: 1000;
     --cetec-z-index-1100: 1100;
     --cetec-z-index-1101: 1101;
+    --cetec-z-index-1102: 1102;
     --cetec-z-index-1200: 1200;
     --cetec-z-index--1: -1;
     --cetec-breakpoints-xs: 30rem;
@@ -696,24 +697,36 @@
     --cetec-colors-bg-success-bold: var(--cetec-colors-green-50);
     --cetec-colors-bg-success-bold-hovered: var(--cetec-colors-green-60);
     --cetec-colors-bg-success-bold-pressed: var(--cetec-colors-green-70);
+    --cetec-colors-bg-success-subtle: var(--cetec-colors-green-5);
+    --cetec-colors-bg-success-subtle-hovered: var(--cetec-colors-green-10);
+    --cetec-colors-bg-success-subtle-pressed: var(--cetec-colors-green-20);
     --cetec-colors-bg-warning: var(--cetec-colors-orange-10);
     --cetec-colors-bg-warning-hovered: var(--cetec-colors-orange-20);
     --cetec-colors-bg-warning-pressed: var(--cetec-colors-orange-30);
     --cetec-colors-bg-warning-bold: var(--cetec-colors-orange-50);
     --cetec-colors-bg-warning-bold-hovered: var(--cetec-colors-orange-60);
     --cetec-colors-bg-warning-bold-pressed: var(--cetec-colors-orange-70);
+    --cetec-colors-bg-warning-subtle: var(--cetec-colors-orange-5);
+    --cetec-colors-bg-warning-subtle-hovered: var(--cetec-colors-orange-10);
+    --cetec-colors-bg-warning-subtle-pressed: var(--cetec-colors-orange-20);
     --cetec-colors-bg-danger: var(--cetec-colors-red-10);
     --cetec-colors-bg-danger-hovered: var(--cetec-colors-red-20);
     --cetec-colors-bg-danger-pressed: var(--cetec-colors-red-30);
     --cetec-colors-bg-danger-bold: var(--cetec-colors-red-50);
     --cetec-colors-bg-danger-bold-hovered: var(--cetec-colors-red-40);
     --cetec-colors-bg-danger-bold-pressed: var(--cetec-colors-red-60);
+    --cetec-colors-bg-danger-subtle: var(--cetec-colors-red-5);
+    --cetec-colors-bg-danger-subtle-hovered: var(--cetec-colors-red-10);
+    --cetec-colors-bg-danger-subtle-pressed: var(--cetec-colors-red-20);
     --cetec-colors-bg-info: var(--cetec-colors-blue-10);
     --cetec-colors-bg-info-hovered: var(--cetec-colors-blue-20);
     --cetec-colors-bg-info-pressed: var(--cetec-colors-blue-30);
     --cetec-colors-bg-info-bold: var(--cetec-colors-blue-50);
     --cetec-colors-bg-info-bold-hovered: var(--cetec-colors-blue-60);
     --cetec-colors-bg-info-bold-pressed: var(--cetec-colors-blue-70);
+    --cetec-colors-bg-info-subtle: var(--cetec-colors-blue-5);
+    --cetec-colors-bg-info-subtle-hovered: var(--cetec-colors-blue-10);
+    --cetec-colors-bg-info-subtle-pressed: var(--cetec-colors-blue-20);
     --cetec-colors-bg-cta: var(--cetec-colors-gold-10);
     --cetec-colors-bg-cta-hovered: var(--cetec-colors-gold-20);
     --cetec-colors-bg-cta-pressed: var(--cetec-colors-gold-30);
@@ -987,6 +1000,7 @@
     --cetec-z-index-elevated: var(--cetec-z-index-1000);
     --cetec-z-index-overlay: var(--cetec-z-index-1100);
     --cetec-z-index-modal: var(--cetec-z-index-1101);
+    --cetec-z-index-modal-floating: var(--cetec-z-index-1102);
     --cetec-z-index-tooltip: var(--cetec-z-index-1200);
 }
 
@@ -1018,24 +1032,36 @@
     --cetec-colors-bg-success-bold: var(--cetec-colors-green-40);
     --cetec-colors-bg-success-bold-hovered: var(--cetec-colors-green-30);
     --cetec-colors-bg-success-bold-pressed: var(--cetec-colors-green-20);
+    --cetec-colors-bg-success-subtle: var(--cetec-colors-green-80);
+    --cetec-colors-bg-success-subtle-hovered: var(--cetec-colors-green-70);
+    --cetec-colors-bg-success-subtle-pressed: var(--cetec-colors-green-90);
     --cetec-colors-bg-warning: var(--cetec-colors-orange-70);
     --cetec-colors-bg-warning-hovered: var(--cetec-colors-orange-80);
     --cetec-colors-bg-warning-pressed: var(--cetec-colors-orange-90);
     --cetec-colors-bg-warning-bold: var(--cetec-colors-orange-30);
     --cetec-colors-bg-warning-bold-hovered: var(--cetec-colors-orange-40);
     --cetec-colors-bg-warning-bold-pressed: var(--cetec-colors-orange-50);
+    --cetec-colors-bg-warning-subtle: var(--cetec-colors-orange-80);
+    --cetec-colors-bg-warning-subtle-hovered: var(--cetec-colors-orange-70);
+    --cetec-colors-bg-warning-subtle-pressed: var(--cetec-colors-orange-90);
     --cetec-colors-bg-danger: var(--cetec-colors-red-70);
     --cetec-colors-bg-danger-hovered: var(--cetec-colors-red-80);
     --cetec-colors-bg-danger-pressed: var(--cetec-colors-red-90);
     --cetec-colors-bg-danger-bold: var(--cetec-colors-red-40);
     --cetec-colors-bg-danger-bold-hovered: var(--cetec-colors-red-30);
     --cetec-colors-bg-danger-bold-pressed: var(--cetec-colors-red-50);
+    --cetec-colors-bg-danger-subtle: var(--cetec-colors-red-80);
+    --cetec-colors-bg-danger-subtle-hovered: var(--cetec-colors-red-70);
+    --cetec-colors-bg-danger-subtle-pressed: var(--cetec-colors-red-90);
     --cetec-colors-bg-info: var(--cetec-colors-blue-70);
     --cetec-colors-bg-info-hovered: var(--cetec-colors-blue-80);
     --cetec-colors-bg-info-pressed: var(--cetec-colors-blue-90);
     --cetec-colors-bg-info-bold: var(--cetec-colors-blue-40);
     --cetec-colors-bg-info-bold-hovered: var(--cetec-colors-blue-30);
     --cetec-colors-bg-info-bold-pressed: var(--cetec-colors-blue-20);
+    --cetec-colors-bg-info-subtle: var(--cetec-colors-blue-80);
+    --cetec-colors-bg-info-subtle-hovered: var(--cetec-colors-blue-70);
+    --cetec-colors-bg-info-subtle-pressed: var(--cetec-colors-blue-90);
     --cetec-colors-bg-cta: var(--cetec-colors-gold-70);
     --cetec-colors-bg-cta-hovered: var(--cetec-colors-gold-80);
     --cetec-colors-bg-cta-pressed: var(--cetec-colors-gold-90);
@@ -1574,22 +1600,27 @@
 }
 
     .cetec-link {
+      background: none;
       gap: var(--cetec-spacing-1);
-      text-decoration: none;
+      text-decoration: underline;
+      transition-property: var(--transition-prop, all);
+      transition-timing-function: var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
+      transition-duration: var(--cetec-durations-fast);
       display: inline-flex;
       align-items: center;
       font-weight: var(--cetec-font-weights-medium);
       color: var(--cetec-colors-link);
-      background-image: linear-gradient(90deg, transparent 0% 100%);
-      background-size: 100% 1px;
-      background-repeat: no-repeat;
-      background-position-y: 100%;
-      outline-width: var(--cetec-border-widths-2);
-      outline-style: solid;
-      outline-color: var(--cetec-colors-transparent);
-      outline-offset: var(--cetec-spacing-1);
-      cursor: pointer;
-      width: fit-content;
+      text-decoration-thickness: 0.0625em;
+      text-underline-offset: 0.15625em;
+      text-decoration-skip-ink: all;
+      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);
+      --transition-duration: var(--cetec-durations-fast);
+}
+
+    .cetec-link:is(:disabled, [disabled], [data-disabled=true], [aria-disabled=true]) {
+      cursor: not-allowed;
+      opacity: 0.4;
+      pointer-events: none;
 }
 
     .cetec-link:is(:focus-visible, [data-focus-visible=true]) {
@@ -1598,8 +1629,9 @@
 }
 
     .cetec-link:is(:hover, [data-hover=true]) {
-      color: var(--cetec-colors-link);
-      background-image: linear-gradient(90deg, currentColor 0% 100%);
+      color: var(--cetec-colors-link-pressed);
+      text-decoration-color: var(--cetec-colors-current);
+      text-decoration-thickness: 0.125em;
 }
 
     .cetec-list {
@@ -2155,7 +2187,18 @@
 }
 
   .cetec-label--underline_true {
+    text-decoration-skip-ink: all;
+}
+
+  .cetec-label--underline_true,.cetec-label--dashedUnderline_true {
     text-decoration: underline;
+    text-decoration-thickness: 0.0625em;
+    text-underline-offset: 0.15625em;
+}
+
+  .cetec-label--dashedUnderline_true {
+    text-decoration-style: dashed;
+    text-decoration-skip-ink: all;
 }
 
   .cetec-label--truncate_true {
@@ -2268,7 +2311,18 @@
 }
 
   .cetec-link--underline_true {
+    text-decoration-skip-ink: all;
+}
+
+  .cetec-link--underline_true,.cetec-link--dashedUnderline_true {
     text-decoration: underline;
+    text-decoration-thickness: 0.0625em;
+    text-underline-offset: 0.15625em;
+}
+
+  .cetec-link--dashedUnderline_true {
+    text-decoration-style: dashed;
+    text-decoration-skip-ink: all;
 }
 
   .cetec-link--truncate_true {
@@ -2469,7 +2523,18 @@
 }
 
   .cetec-text--underline_true {
+    text-decoration-skip-ink: all;
+}
+
+  .cetec-text--underline_true,.cetec-text--dashedUnderline_true {
     text-decoration: underline;
+    text-decoration-thickness: 0.0625em;
+    text-underline-offset: 0.15625em;
+}
+
+  .cetec-text--dashedUnderline_true {
+    text-decoration-style: dashed;
+    text-decoration-skip-ink: all;
 }
 
   .cetec-text--truncate_true {
@@ -4426,6 +4491,13 @@
       max-width: var(--cetec-sizes-full);
 }
 
+    .cetec-autocomplete__token[data-new=true] {
+      background: var(--cetec-colors-transparent);
+      outline-width: var(--cetec-border-widths-1);
+      outline-style: dashed;
+      outline-color: var(--cetec-colors-border-warning);
+}
+
     .cetec-autocomplete__overflowIndicator {
       background: var(--cetec-colors-bg-neutral);
       padding-inline: var(--cetec-spacing-6);
@@ -4468,7 +4540,6 @@
       font-weight: var(--cetec-font-weights-normal);
       color: var(--cetec-colors-text-subtlest);
       box-shadow: var(--cetec-shadows-overlay);
-      z-index: var(--cetec-z-index-elevated);
       max-height: var(--cetec-sizes-192);
       overflow-y: auto;
 }
@@ -5075,6 +5146,7 @@
       position: relative;
       display: inline-flex;
       align-items: center;
+      justify-content: center;
       flex-shrink: 0;
       outline-width: var(--cetec-border-widths-2);
       outline-style: solid;
@@ -5469,7 +5541,6 @@
       line-height: var(--cetec-line-heights-default);
       color: var(--cetec-colors-text-subtlest);
       box-shadow: var(--cetec-shadows-overlay);
-      z-index: 100;
       --transition-prop: width, height;
       transition-property: width, height;
       --transition-duration: var(--cetec-durations-normal);
@@ -6341,6 +6412,10 @@
     --loading-size: var(--cetec-sizes-20);
 }
 
+  .cetec-autocomplete__listbox--layer_elevated {
+    z-index: var(--cetec-z-index-elevated);
+}
+
   .cetec-autocomplete__root--size_sm {
     --control-py: var(--cetec-sizes-0);
     --control-px: var(--cetec-sizes-8);
@@ -6371,6 +6446,10 @@
     --loading-size: var(--cetec-sizes-24);
 }
 
+  .cetec-autocomplete__listbox--layer_modalFloating {
+    z-index: var(--cetec-z-index-modal-floating);
+}
+
   .cetec-avatar__root--size_md {
     width: var(--cetec-sizes-20);
 }
@@ -7500,19 +7579,24 @@
     padding-block: var(--cetec-spacing-1);
     padding-inline-end: var(--cetec-spacing-18);
     padding-inline-start: var(--cetec-spacing-5);
-}
-
-  .cetec-menu__backHeader--density_compact,.cetec-menu__backHeader--density_comfortable {
     font-family: var(--cetec-fonts-body);
     font-variation-settings: "MONO" 0, "CRSV" 0, "CASL" 0, "slnt" 0;
     color: var(--cetec-colors-text);
     font-size: var(--cetec-font-sizes-16);
 }
 
+  .cetec-menu__wrapper--layer_elevated {
+    z-index: var(--cetec-z-index-elevated);
+}
+
   .cetec-menu__backHeader--density_comfortable {
     padding-block: var(--cetec-spacing-5);
     padding-inline-end: var(--cetec-spacing-20);
     padding-inline-start: var(--cetec-spacing-7);
+    font-family: var(--cetec-fonts-body);
+    font-variation-settings: "MONO" 0, "CRSV" 0, "CASL" 0, "slnt" 0;
+    color: var(--cetec-colors-text);
+    font-size: var(--cetec-font-sizes-16);
 }
 
   .cetec-menu__backHeader--density_spacious {
@@ -7525,6 +7609,10 @@
     font-size: var(--cetec-font-sizes-20);
 }
 
+  .cetec-menu__wrapper--layer_modalFloating {
+    z-index: var(--cetec-z-index-modal-floating);
+}
+
   .cetec-menu__wrapper--panel_true {
     border-radius: var(--cetec-radii-0);
     box-shadow: none;
@@ -16869,6 +16957,18 @@
     background: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .cetec-bg_bg\.success\.subtle {
+    background: var(--cetec-colors-bg-success-subtle);
+}
+
+  .cetec-bg_bg\.success\.subtle\.hovered {
+    background: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .cetec-bg_bg\.success\.subtle\.pressed {
+    background: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .cetec-bg_bg\.warning {
     background: var(--cetec-colors-bg-warning);
 }
@@ -16893,6 +16993,18 @@
     background: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .cetec-bg_bg\.warning\.subtle {
+    background: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .cetec-bg_bg\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .cetec-bg_bg\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .cetec-bg_bg\.danger {
     background: var(--cetec-colors-bg-danger);
 }
@@ -16917,6 +17029,18 @@
     background: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .cetec-bg_bg\.danger\.subtle {
+    background: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .cetec-bg_bg\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .cetec-bg_bg\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .cetec-bg_bg\.info {
     background: var(--cetec-colors-bg-info);
 }
@@ -16941,6 +17065,18 @@
     background: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .cetec-bg_bg\.info\.subtle {
+    background: var(--cetec-colors-bg-info-subtle);
+}
+
+  .cetec-bg_bg\.info\.subtle\.hovered {
+    background: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .cetec-bg_bg\.info\.subtle\.pressed {
+    background: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .cetec-bg_bg\.cta {
     background: var(--cetec-colors-bg-cta);
 }
@@ -18209,6 +18345,18 @@
     background: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .cetec-bg_colorPalette\.success\.subtle {
+    background: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .cetec-bg_colorPalette\.success\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .cetec-bg_colorPalette\.success\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .cetec-bg_colorPalette\.warning {
     background: var(--cetec-colors-color-palette-warning);
 }
@@ -18233,6 +18381,18 @@
     background: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .cetec-bg_colorPalette\.warning\.subtle {
+    background: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .cetec-bg_colorPalette\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .cetec-bg_colorPalette\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .cetec-bg_colorPalette\.danger {
     background: var(--cetec-colors-color-palette-danger);
 }
@@ -18257,6 +18417,18 @@
     background: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .cetec-bg_colorPalette\.danger\.subtle {
+    background: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .cetec-bg_colorPalette\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .cetec-bg_colorPalette\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .cetec-bg_colorPalette\.info {
     background: var(--cetec-colors-color-palette-info);
 }
@@ -18281,6 +18453,18 @@
     background: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .cetec-bg_colorPalette\.info\.subtle {
+    background: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .cetec-bg_colorPalette\.info\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .cetec-bg_colorPalette\.info\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .cetec-bg_colorPalette\.cta {
     background: var(--cetec-colors-color-palette-cta);
 }
@@ -19421,14 +19605,6 @@
     padding-block: var(--cetec-spacing-16);
 }
 
-  .cetec-mx_8 {
-    margin-inline: var(--cetec-spacing-8);
-}
-
-  .cetec-my_12 {
-    margin-block: var(--cetec-spacing-12);
-}
-
   .cetec-gap_3 {
     gap: var(--cetec-spacing-3);
 }
@@ -19441,6 +19617,14 @@
     flex: none;
 }
 
+  .cetec-mx_8 {
+    margin-inline: var(--cetec-spacing-8);
+}
+
+  .cetec-my_12 {
+    margin-block: var(--cetec-spacing-12);
+}
+
   .cetec-bd-c_blue\.60 {
     border-color: var(--cetec-colors-blue-60);
 }
@@ -20777,6 +20961,18 @@
     color: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .cetec-c_bg\.success\.subtle {
+    color: var(--cetec-colors-bg-success-subtle);
+}
+
+  .cetec-c_bg\.success\.subtle\.hovered {
+    color: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .cetec-c_bg\.success\.subtle\.pressed {
+    color: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .cetec-c_bg\.warning {
     color: var(--cetec-colors-bg-warning);
 }
@@ -20801,6 +20997,18 @@
     color: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .cetec-c_bg\.warning\.subtle {
+    color: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .cetec-c_bg\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .cetec-c_bg\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .cetec-c_bg\.danger {
     color: var(--cetec-colors-bg-danger);
 }
@@ -20825,6 +21033,18 @@
     color: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .cetec-c_bg\.danger\.subtle {
+    color: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .cetec-c_bg\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .cetec-c_bg\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .cetec-c_bg\.info {
     color: var(--cetec-colors-bg-info);
 }
@@ -20849,6 +21069,18 @@
     color: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .cetec-c_bg\.info\.subtle {
+    color: var(--cetec-colors-bg-info-subtle);
+}
+
+  .cetec-c_bg\.info\.subtle\.hovered {
+    color: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .cetec-c_bg\.info\.subtle\.pressed {
+    color: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .cetec-c_bg\.cta {
     color: var(--cetec-colors-bg-cta);
 }
@@ -22117,6 +22349,18 @@
     color: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .cetec-c_colorPalette\.success\.subtle {
+    color: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .cetec-c_colorPalette\.success\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .cetec-c_colorPalette\.success\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .cetec-c_colorPalette\.warning {
     color: var(--cetec-colors-color-palette-warning);
 }
@@ -22141,6 +22385,18 @@
     color: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .cetec-c_colorPalette\.warning\.subtle {
+    color: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .cetec-c_colorPalette\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .cetec-c_colorPalette\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .cetec-c_colorPalette\.danger {
     color: var(--cetec-colors-color-palette-danger);
 }
@@ -22165,6 +22421,18 @@
     color: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .cetec-c_colorPalette\.danger\.subtle {
+    color: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .cetec-c_colorPalette\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .cetec-c_colorPalette\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .cetec-c_colorPalette\.info {
     color: var(--cetec-colors-color-palette-info);
 }
@@ -22189,6 +22457,18 @@
     color: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .cetec-c_colorPalette\.info\.subtle {
+    color: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .cetec-c_colorPalette\.info\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .cetec-c_colorPalette\.info\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .cetec-c_colorPalette\.cta {
     color: var(--cetec-colors-color-palette-cta);
 }
@@ -24317,6 +24597,18 @@
     fill: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .cetec-fill_bg\.success\.subtle {
+    fill: var(--cetec-colors-bg-success-subtle);
+}
+
+  .cetec-fill_bg\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .cetec-fill_bg\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .cetec-fill_bg\.warning {
     fill: var(--cetec-colors-bg-warning);
 }
@@ -24341,6 +24633,18 @@
     fill: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .cetec-fill_bg\.warning\.subtle {
+    fill: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .cetec-fill_bg\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .cetec-fill_bg\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .cetec-fill_bg\.danger {
     fill: var(--cetec-colors-bg-danger);
 }
@@ -24365,6 +24669,18 @@
     fill: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .cetec-fill_bg\.danger\.subtle {
+    fill: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .cetec-fill_bg\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .cetec-fill_bg\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .cetec-fill_bg\.info {
     fill: var(--cetec-colors-bg-info);
 }
@@ -24389,6 +24705,18 @@
     fill: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .cetec-fill_bg\.info\.subtle {
+    fill: var(--cetec-colors-bg-info-subtle);
+}
+
+  .cetec-fill_bg\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .cetec-fill_bg\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .cetec-fill_bg\.cta {
     fill: var(--cetec-colors-bg-cta);
 }
@@ -25657,6 +25985,18 @@
     fill: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .cetec-fill_colorPalette\.success\.subtle {
+    fill: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .cetec-fill_colorPalette\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .cetec-fill_colorPalette\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .cetec-fill_colorPalette\.warning {
     fill: var(--cetec-colors-color-palette-warning);
 }
@@ -25681,6 +26021,18 @@
     fill: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .cetec-fill_colorPalette\.warning\.subtle {
+    fill: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .cetec-fill_colorPalette\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .cetec-fill_colorPalette\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .cetec-fill_colorPalette\.danger {
     fill: var(--cetec-colors-color-palette-danger);
 }
@@ -25705,6 +26057,18 @@
     fill: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .cetec-fill_colorPalette\.danger\.subtle {
+    fill: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .cetec-fill_colorPalette\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .cetec-fill_colorPalette\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .cetec-fill_colorPalette\.info {
     fill: var(--cetec-colors-color-palette-info);
 }
@@ -25729,6 +26093,18 @@
     fill: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .cetec-fill_colorPalette\.info\.subtle {
+    fill: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .cetec-fill_colorPalette\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .cetec-fill_colorPalette\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .cetec-fill_colorPalette\.cta {
     fill: var(--cetec-colors-color-palette-cta);
 }
@@ -26893,6 +27269,10 @@
     text-align: left;
 }
 
+  .cetec-d_block {
+    display: block;
+}
+
   .cetec-ta_center {
     text-align: center;
 }
@@ -26913,6 +27293,10 @@
     opacity: 0;
 }
 
+  .cetec-ai_start {
+    align-items: start;
+}
+
   .cetec-flex-wrap_wrap {
     flex-wrap: wrap;
 }
@@ -27001,10 +27385,6 @@
     font-size: inherit;
 }
 
-  .cetec-ai_start {
-    align-items: start;
-}
-
   .cetec-grid-tc_repeat\(2\,_minmax\(0\,_1fr\)\) {
     grid-template-columns: repeat(2, minmax(0, 1fr));
 }
@@ -27033,14 +27413,6 @@
     pointer-events: none;
 }
 
-  .cetec-fw_semibold {
-    font-weight: semibold;
-}
-
-  .cetec-grid-tc_1fr_auto_1fr {
-    grid-template-columns: 1fr auto 1fr;
-}
-
   .cetec-grid-tc_repeat\(2\,_1fr\) {
     grid-template-columns: repeat(2, 1fr);
 }
@@ -27049,6 +27421,14 @@
     fill: var(--cetec-colors-bg-neutral-inverse);
 }
 
+  .cetec-fw_semibold {
+    font-weight: semibold;
+}
+
+  .cetec-grid-tc_1fr_auto_1fr {
+    grid-template-columns: 1fr auto 1fr;
+}
+
   .cetec-bg-c_blue\.50 {
     background-color: var(--cetec-colors-blue-50);
 }
@@ -29777,6 +30157,10 @@
     width: 100px;
 }
 
+  .cetec-w_fit-content {
+    width: fit-content;
+}
+
   .cetec-pt_16 {
     padding-top: var(--cetec-spacing-16);
 }
@@ -32341,6 +32725,30 @@
     background: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .light .light\:cetec-bg_bg\.success\.subtle,.light\:cetec-bg_bg\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.success\.subtle {
+    background: var(--cetec-colors-bg-success-subtle);
+}
+
+  .dark .dark\:cetec-bg_bg\.success\.subtle,.dark\:cetec-bg_bg\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.success\.subtle {
+    background: var(--cetec-colors-bg-success-subtle);
+}
+
+  .light .light\:cetec-bg_bg\.success\.subtle\.hovered,.light\:cetec-bg_bg\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.success\.subtle\.hovered {
+    background: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_bg\.success\.subtle\.hovered,.dark\:cetec-bg_bg\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.success\.subtle\.hovered {
+    background: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_bg\.success\.subtle\.pressed,.light\:cetec-bg_bg\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.success\.subtle\.pressed {
+    background: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_bg\.success\.subtle\.pressed,.dark\:cetec-bg_bg\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.success\.subtle\.pressed {
+    background: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .light .light\:cetec-bg_bg\.warning,.light\:cetec-bg_bg\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.warning {
     background: var(--cetec-colors-bg-warning);
 }
@@ -32389,6 +32797,30 @@
     background: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .light .light\:cetec-bg_bg\.warning\.subtle,.light\:cetec-bg_bg\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.warning\.subtle {
+    background: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .dark .dark\:cetec-bg_bg\.warning\.subtle,.dark\:cetec-bg_bg\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.warning\.subtle {
+    background: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .light .light\:cetec-bg_bg\.warning\.subtle\.hovered,.light\:cetec-bg_bg\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_bg\.warning\.subtle\.hovered,.dark\:cetec-bg_bg\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_bg\.warning\.subtle\.pressed,.light\:cetec-bg_bg\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_bg\.warning\.subtle\.pressed,.dark\:cetec-bg_bg\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .light .light\:cetec-bg_bg\.danger,.light\:cetec-bg_bg\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.danger {
     background: var(--cetec-colors-bg-danger);
 }
@@ -32437,6 +32869,30 @@
     background: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .light .light\:cetec-bg_bg\.danger\.subtle,.light\:cetec-bg_bg\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.danger\.subtle {
+    background: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .dark .dark\:cetec-bg_bg\.danger\.subtle,.dark\:cetec-bg_bg\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.danger\.subtle {
+    background: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .light .light\:cetec-bg_bg\.danger\.subtle\.hovered,.light\:cetec-bg_bg\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_bg\.danger\.subtle\.hovered,.dark\:cetec-bg_bg\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_bg\.danger\.subtle\.pressed,.light\:cetec-bg_bg\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_bg\.danger\.subtle\.pressed,.dark\:cetec-bg_bg\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .light .light\:cetec-bg_bg\.info,.light\:cetec-bg_bg\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.info {
     background: var(--cetec-colors-bg-info);
 }
@@ -32485,6 +32941,30 @@
     background: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .light .light\:cetec-bg_bg\.info\.subtle,.light\:cetec-bg_bg\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.info\.subtle {
+    background: var(--cetec-colors-bg-info-subtle);
+}
+
+  .dark .dark\:cetec-bg_bg\.info\.subtle,.dark\:cetec-bg_bg\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.info\.subtle {
+    background: var(--cetec-colors-bg-info-subtle);
+}
+
+  .light .light\:cetec-bg_bg\.info\.subtle\.hovered,.light\:cetec-bg_bg\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.info\.subtle\.hovered {
+    background: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_bg\.info\.subtle\.hovered,.dark\:cetec-bg_bg\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.info\.subtle\.hovered {
+    background: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_bg\.info\.subtle\.pressed,.light\:cetec-bg_bg\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.info\.subtle\.pressed {
+    background: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_bg\.info\.subtle\.pressed,.dark\:cetec-bg_bg\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_bg\.info\.subtle\.pressed {
+    background: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .light .light\:cetec-bg_bg\.cta,.light\:cetec-bg_bg\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_bg\.cta {
     background: var(--cetec-colors-bg-cta);
 }
@@ -35021,6 +35501,30 @@
     background: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .light .light\:cetec-bg_colorPalette\.success\.subtle,.light\:cetec-bg_colorPalette\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.success\.subtle {
+    background: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.success\.subtle,.dark\:cetec-bg_colorPalette\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.success\.subtle {
+    background: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .light .light\:cetec-bg_colorPalette\.success\.subtle\.hovered,.light\:cetec-bg_colorPalette\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.success\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.success\.subtle\.hovered,.dark\:cetec-bg_colorPalette\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.success\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_colorPalette\.success\.subtle\.pressed,.light\:cetec-bg_colorPalette\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.success\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.success\.subtle\.pressed,.dark\:cetec-bg_colorPalette\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.success\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .light .light\:cetec-bg_colorPalette\.warning,.light\:cetec-bg_colorPalette\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.warning {
     background: var(--cetec-colors-color-palette-warning);
 }
@@ -35069,6 +35573,30 @@
     background: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .light .light\:cetec-bg_colorPalette\.warning\.subtle,.light\:cetec-bg_colorPalette\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.warning\.subtle {
+    background: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.warning\.subtle,.dark\:cetec-bg_colorPalette\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.warning\.subtle {
+    background: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .light .light\:cetec-bg_colorPalette\.warning\.subtle\.hovered,.light\:cetec-bg_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.warning\.subtle\.hovered,.dark\:cetec-bg_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.warning\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_colorPalette\.warning\.subtle\.pressed,.light\:cetec-bg_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.warning\.subtle\.pressed,.dark\:cetec-bg_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.warning\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .light .light\:cetec-bg_colorPalette\.danger,.light\:cetec-bg_colorPalette\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.danger {
     background: var(--cetec-colors-color-palette-danger);
 }
@@ -35117,6 +35645,30 @@
     background: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .light .light\:cetec-bg_colorPalette\.danger\.subtle,.light\:cetec-bg_colorPalette\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.danger\.subtle {
+    background: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.danger\.subtle,.dark\:cetec-bg_colorPalette\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.danger\.subtle {
+    background: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .light .light\:cetec-bg_colorPalette\.danger\.subtle\.hovered,.light\:cetec-bg_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.danger\.subtle\.hovered,.dark\:cetec-bg_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.danger\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_colorPalette\.danger\.subtle\.pressed,.light\:cetec-bg_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.danger\.subtle\.pressed,.dark\:cetec-bg_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.danger\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .light .light\:cetec-bg_colorPalette\.info,.light\:cetec-bg_colorPalette\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.info {
     background: var(--cetec-colors-color-palette-info);
 }
@@ -35165,6 +35717,30 @@
     background: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .light .light\:cetec-bg_colorPalette\.info\.subtle,.light\:cetec-bg_colorPalette\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.info\.subtle {
+    background: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.info\.subtle,.dark\:cetec-bg_colorPalette\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.info\.subtle {
+    background: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .light .light\:cetec-bg_colorPalette\.info\.subtle\.hovered,.light\:cetec-bg_colorPalette\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.info\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.info\.subtle\.hovered,.dark\:cetec-bg_colorPalette\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.info\.subtle\.hovered {
+    background: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .light .light\:cetec-bg_colorPalette\.info\.subtle\.pressed,.light\:cetec-bg_colorPalette\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.info\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-bg_colorPalette\.info\.subtle\.pressed,.dark\:cetec-bg_colorPalette\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-bg_colorPalette\.info\.subtle\.pressed {
+    background: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .light .light\:cetec-bg_colorPalette\.cta,.light\:cetec-bg_colorPalette\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-bg_colorPalette\.cta {
     background: var(--cetec-colors-color-palette-cta);
 }
@@ -39681,6 +40257,30 @@
     color: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .light .light\:cetec-c_bg\.success\.subtle,.light\:cetec-c_bg\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.success\.subtle {
+    color: var(--cetec-colors-bg-success-subtle);
+}
+
+  .dark .dark\:cetec-c_bg\.success\.subtle,.dark\:cetec-c_bg\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.success\.subtle {
+    color: var(--cetec-colors-bg-success-subtle);
+}
+
+  .light .light\:cetec-c_bg\.success\.subtle\.hovered,.light\:cetec-c_bg\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.success\.subtle\.hovered {
+    color: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_bg\.success\.subtle\.hovered,.dark\:cetec-c_bg\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.success\.subtle\.hovered {
+    color: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .light .light\:cetec-c_bg\.success\.subtle\.pressed,.light\:cetec-c_bg\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.success\.subtle\.pressed {
+    color: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_bg\.success\.subtle\.pressed,.dark\:cetec-c_bg\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.success\.subtle\.pressed {
+    color: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .light .light\:cetec-c_bg\.warning,.light\:cetec-c_bg\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.warning {
     color: var(--cetec-colors-bg-warning);
 }
@@ -39729,6 +40329,30 @@
     color: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .light .light\:cetec-c_bg\.warning\.subtle,.light\:cetec-c_bg\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.warning\.subtle {
+    color: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .dark .dark\:cetec-c_bg\.warning\.subtle,.dark\:cetec-c_bg\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.warning\.subtle {
+    color: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .light .light\:cetec-c_bg\.warning\.subtle\.hovered,.light\:cetec-c_bg\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_bg\.warning\.subtle\.hovered,.dark\:cetec-c_bg\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-c_bg\.warning\.subtle\.pressed,.light\:cetec-c_bg\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_bg\.warning\.subtle\.pressed,.dark\:cetec-c_bg\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .light .light\:cetec-c_bg\.danger,.light\:cetec-c_bg\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.danger {
     color: var(--cetec-colors-bg-danger);
 }
@@ -39777,6 +40401,30 @@
     color: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .light .light\:cetec-c_bg\.danger\.subtle,.light\:cetec-c_bg\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.danger\.subtle {
+    color: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .dark .dark\:cetec-c_bg\.danger\.subtle,.dark\:cetec-c_bg\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.danger\.subtle {
+    color: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .light .light\:cetec-c_bg\.danger\.subtle\.hovered,.light\:cetec-c_bg\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_bg\.danger\.subtle\.hovered,.dark\:cetec-c_bg\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-c_bg\.danger\.subtle\.pressed,.light\:cetec-c_bg\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_bg\.danger\.subtle\.pressed,.dark\:cetec-c_bg\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .light .light\:cetec-c_bg\.info,.light\:cetec-c_bg\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.info {
     color: var(--cetec-colors-bg-info);
 }
@@ -39825,6 +40473,30 @@
     color: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .light .light\:cetec-c_bg\.info\.subtle,.light\:cetec-c_bg\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.info\.subtle {
+    color: var(--cetec-colors-bg-info-subtle);
+}
+
+  .dark .dark\:cetec-c_bg\.info\.subtle,.dark\:cetec-c_bg\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.info\.subtle {
+    color: var(--cetec-colors-bg-info-subtle);
+}
+
+  .light .light\:cetec-c_bg\.info\.subtle\.hovered,.light\:cetec-c_bg\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.info\.subtle\.hovered {
+    color: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_bg\.info\.subtle\.hovered,.dark\:cetec-c_bg\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.info\.subtle\.hovered {
+    color: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .light .light\:cetec-c_bg\.info\.subtle\.pressed,.light\:cetec-c_bg\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.info\.subtle\.pressed {
+    color: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_bg\.info\.subtle\.pressed,.dark\:cetec-c_bg\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_bg\.info\.subtle\.pressed {
+    color: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .light .light\:cetec-c_bg\.cta,.light\:cetec-c_bg\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_bg\.cta {
     color: var(--cetec-colors-bg-cta);
 }
@@ -42361,6 +43033,30 @@
     color: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .light .light\:cetec-c_colorPalette\.success\.subtle,.light\:cetec-c_colorPalette\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.success\.subtle {
+    color: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.success\.subtle,.dark\:cetec-c_colorPalette\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.success\.subtle {
+    color: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .light .light\:cetec-c_colorPalette\.success\.subtle\.hovered,.light\:cetec-c_colorPalette\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.success\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.success\.subtle\.hovered,.dark\:cetec-c_colorPalette\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.success\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .light .light\:cetec-c_colorPalette\.success\.subtle\.pressed,.light\:cetec-c_colorPalette\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.success\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.success\.subtle\.pressed,.dark\:cetec-c_colorPalette\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.success\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .light .light\:cetec-c_colorPalette\.warning,.light\:cetec-c_colorPalette\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.warning {
     color: var(--cetec-colors-color-palette-warning);
 }
@@ -42409,6 +43105,30 @@
     color: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .light .light\:cetec-c_colorPalette\.warning\.subtle,.light\:cetec-c_colorPalette\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.warning\.subtle {
+    color: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.warning\.subtle,.dark\:cetec-c_colorPalette\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.warning\.subtle {
+    color: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .light .light\:cetec-c_colorPalette\.warning\.subtle\.hovered,.light\:cetec-c_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.warning\.subtle\.hovered,.dark\:cetec-c_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.warning\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-c_colorPalette\.warning\.subtle\.pressed,.light\:cetec-c_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.warning\.subtle\.pressed,.dark\:cetec-c_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.warning\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .light .light\:cetec-c_colorPalette\.danger,.light\:cetec-c_colorPalette\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.danger {
     color: var(--cetec-colors-color-palette-danger);
 }
@@ -42457,6 +43177,30 @@
     color: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .light .light\:cetec-c_colorPalette\.danger\.subtle,.light\:cetec-c_colorPalette\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.danger\.subtle {
+    color: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.danger\.subtle,.dark\:cetec-c_colorPalette\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.danger\.subtle {
+    color: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .light .light\:cetec-c_colorPalette\.danger\.subtle\.hovered,.light\:cetec-c_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.danger\.subtle\.hovered,.dark\:cetec-c_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.danger\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-c_colorPalette\.danger\.subtle\.pressed,.light\:cetec-c_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.danger\.subtle\.pressed,.dark\:cetec-c_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.danger\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .light .light\:cetec-c_colorPalette\.info,.light\:cetec-c_colorPalette\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.info {
     color: var(--cetec-colors-color-palette-info);
 }
@@ -42505,6 +43249,30 @@
     color: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .light .light\:cetec-c_colorPalette\.info\.subtle,.light\:cetec-c_colorPalette\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.info\.subtle {
+    color: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.info\.subtle,.dark\:cetec-c_colorPalette\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.info\.subtle {
+    color: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .light .light\:cetec-c_colorPalette\.info\.subtle\.hovered,.light\:cetec-c_colorPalette\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.info\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.info\.subtle\.hovered,.dark\:cetec-c_colorPalette\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.info\.subtle\.hovered {
+    color: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .light .light\:cetec-c_colorPalette\.info\.subtle\.pressed,.light\:cetec-c_colorPalette\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.info\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-c_colorPalette\.info\.subtle\.pressed,.dark\:cetec-c_colorPalette\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-c_colorPalette\.info\.subtle\.pressed {
+    color: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .light .light\:cetec-c_colorPalette\.cta,.light\:cetec-c_colorPalette\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-c_colorPalette\.cta {
     color: var(--cetec-colors-color-palette-cta);
 }
@@ -46761,6 +47529,30 @@
     fill: var(--cetec-colors-bg-success-bold-pressed);
 }
 
+  .light .light\:cetec-fill_bg\.success\.subtle,.light\:cetec-fill_bg\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.success\.subtle {
+    fill: var(--cetec-colors-bg-success-subtle);
+}
+
+  .dark .dark\:cetec-fill_bg\.success\.subtle,.dark\:cetec-fill_bg\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.success\.subtle {
+    fill: var(--cetec-colors-bg-success-subtle);
+}
+
+  .light .light\:cetec-fill_bg\.success\.subtle\.hovered,.light\:cetec-fill_bg\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_bg\.success\.subtle\.hovered,.dark\:cetec-fill_bg\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-success-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_bg\.success\.subtle\.pressed,.light\:cetec-fill_bg\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_bg\.success\.subtle\.pressed,.dark\:cetec-fill_bg\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-success-subtle-pressed);
+}
+
   .light .light\:cetec-fill_bg\.warning,.light\:cetec-fill_bg\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.warning {
     fill: var(--cetec-colors-bg-warning);
 }
@@ -46809,6 +47601,30 @@
     fill: var(--cetec-colors-bg-warning-bold-pressed);
 }
 
+  .light .light\:cetec-fill_bg\.warning\.subtle,.light\:cetec-fill_bg\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.warning\.subtle {
+    fill: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .dark .dark\:cetec-fill_bg\.warning\.subtle,.dark\:cetec-fill_bg\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.warning\.subtle {
+    fill: var(--cetec-colors-bg-warning-subtle);
+}
+
+  .light .light\:cetec-fill_bg\.warning\.subtle\.hovered,.light\:cetec-fill_bg\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_bg\.warning\.subtle\.hovered,.dark\:cetec-fill_bg\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_bg\.warning\.subtle\.pressed,.light\:cetec-fill_bg\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_bg\.warning\.subtle\.pressed,.dark\:cetec-fill_bg\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-warning-subtle-pressed);
+}
+
   .light .light\:cetec-fill_bg\.danger,.light\:cetec-fill_bg\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.danger {
     fill: var(--cetec-colors-bg-danger);
 }
@@ -46857,6 +47673,30 @@
     fill: var(--cetec-colors-bg-danger-bold-pressed);
 }
 
+  .light .light\:cetec-fill_bg\.danger\.subtle,.light\:cetec-fill_bg\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.danger\.subtle {
+    fill: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .dark .dark\:cetec-fill_bg\.danger\.subtle,.dark\:cetec-fill_bg\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.danger\.subtle {
+    fill: var(--cetec-colors-bg-danger-subtle);
+}
+
+  .light .light\:cetec-fill_bg\.danger\.subtle\.hovered,.light\:cetec-fill_bg\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_bg\.danger\.subtle\.hovered,.dark\:cetec-fill_bg\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_bg\.danger\.subtle\.pressed,.light\:cetec-fill_bg\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_bg\.danger\.subtle\.pressed,.dark\:cetec-fill_bg\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-danger-subtle-pressed);
+}
+
   .light .light\:cetec-fill_bg\.info,.light\:cetec-fill_bg\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.info {
     fill: var(--cetec-colors-bg-info);
 }
@@ -46905,6 +47745,30 @@
     fill: var(--cetec-colors-bg-info-bold-pressed);
 }
 
+  .light .light\:cetec-fill_bg\.info\.subtle,.light\:cetec-fill_bg\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.info\.subtle {
+    fill: var(--cetec-colors-bg-info-subtle);
+}
+
+  .dark .dark\:cetec-fill_bg\.info\.subtle,.dark\:cetec-fill_bg\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.info\.subtle {
+    fill: var(--cetec-colors-bg-info-subtle);
+}
+
+  .light .light\:cetec-fill_bg\.info\.subtle\.hovered,.light\:cetec-fill_bg\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_bg\.info\.subtle\.hovered,.dark\:cetec-fill_bg\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-bg-info-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_bg\.info\.subtle\.pressed,.light\:cetec-fill_bg\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_bg\.info\.subtle\.pressed,.dark\:cetec-fill_bg\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_bg\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-bg-info-subtle-pressed);
+}
+
   .light .light\:cetec-fill_bg\.cta,.light\:cetec-fill_bg\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_bg\.cta {
     fill: var(--cetec-colors-bg-cta);
 }
@@ -49441,6 +50305,30 @@
     fill: var(--cetec-colors-color-palette-success-bold-pressed);
 }
 
+  .light .light\:cetec-fill_colorPalette\.success\.subtle,.light\:cetec-fill_colorPalette\.success\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.success\.subtle {
+    fill: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.success\.subtle,.dark\:cetec-fill_colorPalette\.success\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.success\.subtle {
+    fill: var(--cetec-colors-color-palette-success-subtle);
+}
+
+  .light .light\:cetec-fill_colorPalette\.success\.subtle\.hovered,.light\:cetec-fill_colorPalette\.success\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.success\.subtle\.hovered,.dark\:cetec-fill_colorPalette\.success\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.success\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-success-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_colorPalette\.success\.subtle\.pressed,.light\:cetec-fill_colorPalette\.success\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.success\.subtle\.pressed,.dark\:cetec-fill_colorPalette\.success\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.success\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-success-subtle-pressed);
+}
+
   .light .light\:cetec-fill_colorPalette\.warning,.light\:cetec-fill_colorPalette\.warning:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.warning {
     fill: var(--cetec-colors-color-palette-warning);
 }
@@ -49489,6 +50377,30 @@
     fill: var(--cetec-colors-color-palette-warning-bold-pressed);
 }
 
+  .light .light\:cetec-fill_colorPalette\.warning\.subtle,.light\:cetec-fill_colorPalette\.warning\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.warning\.subtle {
+    fill: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.warning\.subtle,.dark\:cetec-fill_colorPalette\.warning\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.warning\.subtle {
+    fill: var(--cetec-colors-color-palette-warning-subtle);
+}
+
+  .light .light\:cetec-fill_colorPalette\.warning\.subtle\.hovered,.light\:cetec-fill_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.warning\.subtle\.hovered,.dark\:cetec-fill_colorPalette\.warning\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.warning\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-warning-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_colorPalette\.warning\.subtle\.pressed,.light\:cetec-fill_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.warning\.subtle\.pressed,.dark\:cetec-fill_colorPalette\.warning\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.warning\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-warning-subtle-pressed);
+}
+
   .light .light\:cetec-fill_colorPalette\.danger,.light\:cetec-fill_colorPalette\.danger:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.danger {
     fill: var(--cetec-colors-color-palette-danger);
 }
@@ -49537,6 +50449,30 @@
     fill: var(--cetec-colors-color-palette-danger-bold-pressed);
 }
 
+  .light .light\:cetec-fill_colorPalette\.danger\.subtle,.light\:cetec-fill_colorPalette\.danger\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.danger\.subtle {
+    fill: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.danger\.subtle,.dark\:cetec-fill_colorPalette\.danger\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.danger\.subtle {
+    fill: var(--cetec-colors-color-palette-danger-subtle);
+}
+
+  .light .light\:cetec-fill_colorPalette\.danger\.subtle\.hovered,.light\:cetec-fill_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.danger\.subtle\.hovered,.dark\:cetec-fill_colorPalette\.danger\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.danger\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-danger-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_colorPalette\.danger\.subtle\.pressed,.light\:cetec-fill_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.danger\.subtle\.pressed,.dark\:cetec-fill_colorPalette\.danger\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.danger\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-danger-subtle-pressed);
+}
+
   .light .light\:cetec-fill_colorPalette\.info,.light\:cetec-fill_colorPalette\.info:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.info {
     fill: var(--cetec-colors-color-palette-info);
 }
@@ -49585,6 +50521,30 @@
     fill: var(--cetec-colors-color-palette-info-bold-pressed);
 }
 
+  .light .light\:cetec-fill_colorPalette\.info\.subtle,.light\:cetec-fill_colorPalette\.info\.subtle:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.info\.subtle {
+    fill: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.info\.subtle,.dark\:cetec-fill_colorPalette\.info\.subtle:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.info\.subtle {
+    fill: var(--cetec-colors-color-palette-info-subtle);
+}
+
+  .light .light\:cetec-fill_colorPalette\.info\.subtle\.hovered,.light\:cetec-fill_colorPalette\.info\.subtle\.hovered:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.info\.subtle\.hovered,.dark\:cetec-fill_colorPalette\.info\.subtle\.hovered:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.info\.subtle\.hovered {
+    fill: var(--cetec-colors-color-palette-info-subtle-hovered);
+}
+
+  .light .light\:cetec-fill_colorPalette\.info\.subtle\.pressed,.light\:cetec-fill_colorPalette\.info\.subtle\.pressed:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
+  .dark .dark\:cetec-fill_colorPalette\.info\.subtle\.pressed,.dark\:cetec-fill_colorPalette\.info\.subtle\.pressed:is([data-color-mode="dark"] *),[data-color-mode="dark"] .dark\:cetec-fill_colorPalette\.info\.subtle\.pressed {
+    fill: var(--cetec-colors-color-palette-info-subtle-pressed);
+}
+
   .light .light\:cetec-fill_colorPalette\.cta,.light\:cetec-fill_colorPalette\.cta:is([data-color-mode="light"] *),[data-color-mode="light"] .light\:cetec-fill_colorPalette\.cta {
     fill: var(--cetec-colors-color-palette-cta);
 }