@alfalab/core-components-tabs 8.7.0 → 8.7.2

package/esm/components/secondary-tablist/mobile.css

@@ -1,4 +1,4 @@
-/* hash: 14fjm */
+/* hash: 11lzq */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 }/* deprecated */:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 }:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -51,30 +51,30 @@
 
     /* size xl */
     --secondary-tablist-xl-gaps: var(--gap-m);
-}.tabs__component_1ewic {
+}.tabs__component_1n7da {
     position: relative;
     display: inline-flex;
-}.tabs__fullWidthScroll_1ewic {
+}.tabs__fullWidthScroll_1n7da {
     margin: 0 var(--gap-m);
-}.tabs__container_1ewic {
+}.tabs__container_1n7da {
     overflow: hidden;
 
     /* focus-outline fix */
     margin: var(--gap-2xs-neg) 0 var(--gap-2xs-neg) var(--gap-2xs-neg);
     padding: var(--gap-2xs) 0 var(--gap-2xs) var(--gap-2xs);
-}.tabs__title_1ewic {
+}.tabs__title_1n7da {
     white-space: nowrap;
-}/* sizes */.tabs__xxs_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}/* sizes */.tabs__xxs_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-xxs-gaps);
-}.tabs__xs_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}.tabs__xs_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-xs-gaps);
-}.tabs__s_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}.tabs__s_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-s-gaps);
-}.tabs__m_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}.tabs__m_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-m-gaps);
-}.tabs__l_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}.tabs__l_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-l-gaps);
-}.tabs__xl_1ewic .tabs__title_1ewic + .tabs__title_1ewic {
+}.tabs__xl_1n7da .tabs__title_1n7da + .tabs__title_1n7da {
     margin-left: var(--secondary-tablist-xl-gaps);
 } :root {
     --color-dark-indigo: #0b1f35; /* deprecated */
@@ -153,19 +153,19 @@
     --color-dark-accent-primary-inverted-hover: #e32a17;
     --color-dark-accent-primary-inverted-press: #d72505;
     --color-dark-accent-primary-press: #fd624e;
-    --color-dark-accent-secondary: #fff;
-    --color-dark-accent-secondary-hover: #e7e8eb;
-    --color-dark-accent-secondary-inverted: #0e0e0e;
-    --color-dark-accent-secondary-inverted-hover: #29292c;
-    --color-dark-accent-secondary-inverted-press: #2f2f32;
+    --color-dark-accent-secondary: #f2f3f5;
+    --color-dark-accent-secondary-hover: #dcdde1;
+    --color-dark-accent-secondary-inverted: #212124;
+    --color-dark-accent-secondary-inverted-hover: #2f2f32;
+    --color-dark-accent-secondary-inverted-press: #353539;
     --color-dark-accent-secondary-press: #d2d3d9;
-    --color-dark-base-bg-alt-primary: #0e0e0e;
+    --color-dark-base-bg-alt-primary: #121213;
     --color-dark-base-bg-alt-primary-inverted: #f2f3f5;
     --color-dark-base-bg-alt-secondary: #1c1c1e;
     --color-dark-base-bg-alt-secondary-inverted: #fff;
     --color-dark-base-bg-alt-tertiary: #29292c;
     --color-dark-base-bg-alt-tertiary-inverted: #f2f3f5;
-    --color-dark-base-bg-primary: #0e0e0e;
+    --color-dark-base-bg-primary: #121213;
     --color-dark-base-bg-primary-inverted: #fff;
     --color-dark-base-bg-secondary: #1c1c1e;
     --color-dark-base-bg-secondary-inverted: #f2f3f5;
@@ -224,7 +224,7 @@
     --color-dark-modal-bg-secondary-inverted: #f2f3f5;
     --color-dark-modal-bg-tertiary: #353539;
     --color-dark-modal-bg-tertiary-inverted: #fff;
-    --color-dark-neutral-0: #29292c;
+    --color-dark-neutral-0: #262629;
     --color-dark-neutral-0-hover: #2f2f32;
     --color-dark-neutral-0-inverted: #fff;
     --color-dark-neutral-0-inverted-hover: #e7e8eb;
@@ -238,7 +238,7 @@
     --color-dark-neutral-100-press: #29292c;
     --color-dark-neutral-1500: #fff;
     --color-dark-neutral-1500-hover: #babbc2;
-    --color-dark-neutral-1500-inverted: #0e0e0e;
+    --color-dark-neutral-1500-inverted: #121213;
     --color-dark-neutral-1500-inverted-hover: #3f3f45;
     --color-dark-neutral-1500-inverted-press: #5f5f66;
     --color-dark-neutral-1500-press: #a0a1a9;
@@ -284,6 +284,12 @@
     --color-dark-neutral-translucent-100-inverted-hover: rgba(15, 25, 55, 0.1);
     --color-dark-neutral-translucent-100-inverted-press: rgba(5, 12, 41, 0.14);
     --color-dark-neutral-translucent-100-press: rgba(222, 222, 238, 0.13);
+    --color-dark-neutral-translucent-1300: rgba(255, 255, 255, 0.94);
+    --color-dark-neutral-translucent-1300-hover: rgba(255, 255, 255, 0.7);
+    --color-dark-neutral-translucent-1300-inverted: rgba(3, 3, 6, 0.88);
+    --color-dark-neutral-translucent-1300-inverted-hover: rgba(3, 3, 8, 0.8);
+    --color-dark-neutral-translucent-1300-inverted-press: rgba(0, 0, 10, 0.71);
+    --color-dark-neutral-translucent-1300-press: rgba(255, 255, 255, 0.6);
     --color-dark-neutral-translucent-1500-hover: rgba(243, 245, 254, 0.75);
     --color-dark-neutral-translucent-1500-inverted-hover: rgba(2, 2, 10, 0.76);
     --color-dark-neutral-translucent-1500-inverted-press: rgba(1, 1, 12, 0.63);
@@ -343,59 +349,59 @@
     --color-dark-status-info-inverted-press: #2c64d4;
     --color-dark-status-info-press: #63aafd;
     --color-dark-status-muted-alt-attention: #412f22;
-    --color-dark-status-muted-alt-attention-hover: #4f3623;
+    --color-dark-status-muted-alt-attention-hover: #543a27;
     --color-dark-status-muted-alt-attention-inverted: #fde6c8;
     --color-dark-status-muted-alt-attention-inverted-hover: #f6d7af;
-    --color-dark-status-muted-alt-attention-inverted-press: #eec596;
-    --color-dark-status-muted-alt-attention-press: #634128;
+    --color-dark-status-muted-alt-attention-inverted-press: #f0c492;
+    --color-dark-status-muted-alt-attention-press: #6a462c;
     --color-dark-status-muted-alt-info: #293044;
-    --color-dark-status-muted-alt-info-hover: #303a55;
+    --color-dark-status-muted-alt-info-hover: #2f3a55;
     --color-dark-status-muted-alt-info-inverted: #e4f0ff;
-    --color-dark-status-muted-alt-info-inverted-hover: #c4defa;
-    --color-dark-status-muted-alt-info-inverted-press: #aeccf1;
-    --color-dark-status-muted-alt-info-press: #3a456a;
+    --color-dark-status-muted-alt-info-inverted-hover: #c1dbf7;
+    --color-dark-status-muted-alt-info-inverted-press: #a7cbf2;
+    --color-dark-status-muted-alt-info-press: #38476c;
     --color-dark-status-muted-alt-negative: #442926;
-    --color-dark-status-muted-alt-negative-hover: #56302d;
+    --color-dark-status-muted-alt-negative-hover: #55312e;
     --color-dark-status-muted-alt-negative-inverted: #ffdfdf;
-    --color-dark-status-muted-alt-negative-inverted-hover: #faccca;
-    --color-dark-status-muted-alt-negative-inverted-press: #f1b7b0;
-    --color-dark-status-muted-alt-negative-press: #6c3b34;
+    --color-dark-status-muted-alt-negative-inverted-hover: #f9ccca;
+    --color-dark-status-muted-alt-negative-inverted-press: #f3b6af;
+    --color-dark-status-muted-alt-negative-press: #6b3b34;
     --color-dark-status-muted-alt-positive: #253528;
-    --color-dark-status-muted-alt-positive-hover: #283f2d;
+    --color-dark-status-muted-alt-positive-hover: #273f2d;
     --color-dark-status-muted-alt-positive-inverted: #d1f1d7;
-    --color-dark-status-muted-alt-positive-inverted-hover: #bae6c2;
-    --color-dark-status-muted-alt-positive-inverted-press: #a1d7a8;
-    --color-dark-status-muted-alt-positive-press: #2d4d32;
+    --color-dark-status-muted-alt-positive-inverted-hover: #bbe8c3;
+    --color-dark-status-muted-alt-positive-inverted-press: #a1dba8;
+    --color-dark-status-muted-alt-positive-press: #2d4e33;
     --color-dark-status-muted-attention: #36291f;
     --color-dark-status-muted-attention-hover: #412f22;
     --color-dark-status-muted-attention-inverted: #ffefd9;
     --color-dark-status-muted-attention-inverted-hover: #fde6c8;
     --color-dark-status-muted-attention-inverted-press: #f6d7af;
-    --color-dark-status-muted-attention-press: #4f3623;
+    --color-dark-status-muted-attention-press: #543a27;
     --color-dark-status-muted-info: #222a3e;
     --color-dark-status-muted-info-hover: #293044;
     --color-dark-status-muted-info-inverted: #e4f0ff;
     --color-dark-status-muted-info-inverted-hover: #d8eaff;
-    --color-dark-status-muted-info-inverted-press: #c4defa;
-    --color-dark-status-muted-info-press: #303a55;
+    --color-dark-status-muted-info-inverted-press: #c1dbf7;
+    --color-dark-status-muted-info-press: #2f3a55;
     --color-dark-status-muted-negative: #392523;
     --color-dark-status-muted-negative-hover: #442926;
     --color-dark-status-muted-negative-inverted: #ffebeb;
     --color-dark-status-muted-negative-inverted-hover: #ffdfdf;
-    --color-dark-status-muted-negative-inverted-press: #faccca;
-    --color-dark-status-muted-negative-press: #56302d;
+    --color-dark-status-muted-negative-inverted-press: #f9ccca;
+    --color-dark-status-muted-negative-press: #55312e;
     --color-dark-status-muted-positive: #232d25;
     --color-dark-status-muted-positive-hover: #253528;
     --color-dark-status-muted-positive-inverted: #dff8e5;
     --color-dark-status-muted-positive-inverted-hover: #d1f1d7;
-    --color-dark-status-muted-positive-inverted-press: #bae6c2;
-    --color-dark-status-muted-positive-press: #283f2d;
-    --color-dark-status-negative: #ff5431;
-    --color-dark-status-negative-hover: #ff7554;
-    --color-dark-status-negative-inverted: #ff5431;
-    --color-dark-status-negative-inverted-hover: #ec2e14;
-    --color-dark-status-negative-inverted-press: #c7251c;
-    --color-dark-status-negative-press: #ff8d73;
+    --color-dark-status-muted-positive-inverted-press: #bbe8c3;
+    --color-dark-status-muted-positive-press: #273f2d;
+    --color-dark-status-negative: #ff4837;
+    --color-dark-status-negative-hover: #ff755e;
+    --color-dark-status-negative-inverted: #ff4837;
+    --color-dark-status-negative-inverted-hover: #ec2d20;
+    --color-dark-status-negative-inverted-press: #c7241f;
+    --color-dark-status-negative-press: #ff8d79;
     --color-dark-status-positive: #17d055;
     --color-dark-status-positive-hover: #22e068;
     --color-dark-status-positive-inverted: #0cc44d;
@@ -418,24 +424,24 @@
     --color-dark-text-info-inverted-press: #2453b4;
     --color-dark-text-info-press: #7fb6ff;
     --color-dark-text-link: #4a9dfc;
-    --color-dark-text-negative: #ff5431;
-    --color-dark-text-negative-hover: #ff7554;
-    --color-dark-text-negative-inverted: #ec2e14;
-    --color-dark-text-negative-inverted-hover: #c7251c;
+    --color-dark-text-negative: #ff4837;
+    --color-dark-text-negative-hover: #ff755e;
+    --color-dark-text-negative-inverted: #ec2d20;
+    --color-dark-text-negative-inverted-hover: #c7241f;
     --color-dark-text-negative-inverted-press: #a6201e;
-    --color-dark-text-negative-press: #ff8d73;
+    --color-dark-text-negative-press: #ff8d79;
     --color-dark-text-positive: #0cc44d;
     --color-dark-text-positive-hover: #22e068;
     --color-dark-text-positive-inverted: #0d9336;
     --color-dark-text-positive-inverted-hover: #0a7d2c;
     --color-dark-text-positive-inverted-press: #036625;
     --color-dark-text-positive-press: #4ae777;
-    --color-dark-text-primary: #fff;
-    --color-dark-text-primary-hover: #babbc2;
-    --color-dark-text-primary-inverted: #0e0e0e;
-    --color-dark-text-primary-inverted-hover: #5f5f66;
-    --color-dark-text-primary-inverted-press: #75757d;
-    --color-dark-text-primary-press: #a0a1a9;
+    --color-dark-text-primary: rgba(255, 255, 255, 0.94);
+    --color-dark-text-primary-hover: rgba(255, 255, 255, 0.7);
+    --color-dark-text-primary-inverted: rgba(3, 3, 6, 0.88);
+    --color-dark-text-primary-inverted-hover: rgba(1, 1, 12, 0.63);
+    --color-dark-text-primary-inverted-press: rgba(4, 4, 19, 0.55);
+    --color-dark-text-primary-press: rgba(255, 255, 255, 0.6);
     --color-dark-text-quaternary: rgba(231, 231, 248, 0.18);
     --color-dark-text-quaternary-inverted: rgba(5, 11, 44, 0.18);
     --color-dark-text-secondary: rgba(238, 238, 251, 0.55);
@@ -461,20 +467,20 @@
     --color-light-accent-primary-inverted-hover: #ff503e;
     --color-light-accent-primary-inverted-press: #fd624e;
     --color-light-accent-primary-press: #d72505;
-    --color-light-accent-secondary: #0e0e0e;
-    --color-light-accent-secondary-hover: #29292c;
-    --color-light-accent-secondary-inverted: #fff;
-    --color-light-accent-secondary-inverted-hover: #e7e8eb;
+    --color-light-accent-secondary: #212124;
+    --color-light-accent-secondary-hover: #2f2f32;
+    --color-light-accent-secondary-inverted: #f2f3f5;
+    --color-light-accent-secondary-inverted-hover: #dcdde1;
     --color-light-accent-secondary-inverted-press: #d2d3d9;
-    --color-light-accent-secondary-press: #2f2f32;
+    --color-light-accent-secondary-press: #353539;
     --color-light-base-bg-alt-primary: #f2f3f5;
-    --color-light-base-bg-alt-primary-inverted: #0e0e0e;
+    --color-light-base-bg-alt-primary-inverted: #121213;
     --color-light-base-bg-alt-secondary: #fff;
     --color-light-base-bg-alt-secondary-inverted: #1c1c1e;
     --color-light-base-bg-alt-tertiary: #f2f3f5;
     --color-light-base-bg-alt-tertiary-inverted: #29292c;
     --color-light-base-bg-primary: #fff;
-    --color-light-base-bg-primary-inverted: #0e0e0e;
+    --color-light-base-bg-primary-inverted: #121213;
     --color-light-base-bg-secondary: #f2f3f5;
     --color-light-base-bg-secondary-inverted: #1c1c1e;
     --color-light-base-bg-tertiary: #fff;
@@ -534,7 +540,7 @@
     --color-light-modal-bg-tertiary-inverted: #353539;
     --color-light-neutral-0: #fff;
     --color-light-neutral-0-hover: #e7e8eb;
-    --color-light-neutral-0-inverted: #29292c;
+    --color-light-neutral-0-inverted: #262629;
     --color-light-neutral-0-inverted-hover: #2f2f32;
     --color-light-neutral-0-inverted-press: #353539;
     --color-light-neutral-0-press: #dcdde1;
@@ -544,7 +550,7 @@
     --color-light-neutral-100-inverted-hover: #212124;
     --color-light-neutral-100-inverted-press: #29292c;
     --color-light-neutral-100-press: #dcdde1;
-    --color-light-neutral-1500: #0e0e0e;
+    --color-light-neutral-1500: #121213;
     --color-light-neutral-1500-hover: #3f3f45;
     --color-light-neutral-1500-inverted: #fff;
     --color-light-neutral-1500-inverted-hover: #babbc2;
@@ -592,6 +598,12 @@
     --color-light-neutral-translucent-100-inverted-hover: rgba(222, 222, 238, 0.13);
     --color-light-neutral-translucent-100-inverted-press: rgba(234, 234, 248, 0.15);
     --color-light-neutral-translucent-100-press: rgba(5, 12, 41, 0.14);
+    --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
+    --color-light-neutral-translucent-1300-hover: rgba(3, 3, 8, 0.8);
+    --color-light-neutral-translucent-1300-inverted: rgba(255, 255, 255, 0.94);
+    --color-light-neutral-translucent-1300-inverted-hover: rgba(255, 255, 255, 0.7);
+    --color-light-neutral-translucent-1300-inverted-press: rgba(255, 255, 255, 0.6);
+    --color-light-neutral-translucent-1300-press: rgba(0, 0, 10, 0.71);
     --color-light-neutral-translucent-1500-hover: rgba(2, 2, 10, 0.76);
     --color-light-neutral-translucent-1500-inverted-hover: rgba(243, 245, 254, 0.75);
     --color-light-neutral-translucent-1500-inverted-press: rgba(239, 240, 252, 0.65);
@@ -653,57 +665,57 @@
     --color-light-status-muted-alt-attention: #fde6c8;
     --color-light-status-muted-alt-attention-hover: #f6d7af;
     --color-light-status-muted-alt-attention-inverted: #412f22;
-    --color-light-status-muted-alt-attention-inverted-hover: #4f3623;
-    --color-light-status-muted-alt-attention-inverted-press: #634128;
-    --color-light-status-muted-alt-attention-press: #eec596;
+    --color-light-status-muted-alt-attention-inverted-hover: #543a27;
+    --color-light-status-muted-alt-attention-inverted-press: #6a462c;
+    --color-light-status-muted-alt-attention-press: #f0c492;
     --color-light-status-muted-alt-info: #d8eaff;
-    --color-light-status-muted-alt-info-hover: #c4defa;
+    --color-light-status-muted-alt-info-hover: #c1dbf7;
     --color-light-status-muted-alt-info-inverted: #293044;
-    --color-light-status-muted-alt-info-inverted-hover: #303a55;
-    --color-light-status-muted-alt-info-inverted-press: #3a456a;
-    --color-light-status-muted-alt-info-press: #aeccf1;
+    --color-light-status-muted-alt-info-inverted-hover: #2f3a55;
+    --color-light-status-muted-alt-info-inverted-press: #38476c;
+    --color-light-status-muted-alt-info-press: #a7cbf2;
     --color-light-status-muted-alt-negative: #ffdfdf;
-    --color-light-status-muted-alt-negative-hover: #faccca;
+    --color-light-status-muted-alt-negative-hover: #f9ccca;
     --color-light-status-muted-alt-negative-inverted: #442926;
-    --color-light-status-muted-alt-negative-inverted-hover: #56302d;
-    --color-light-status-muted-alt-negative-inverted-press: #6c3b34;
-    --color-light-status-muted-alt-negative-press: #f1b7b0;
+    --color-light-status-muted-alt-negative-inverted-hover: #55312e;
+    --color-light-status-muted-alt-negative-inverted-press: #6b3b34;
+    --color-light-status-muted-alt-negative-press: #f3b6af;
     --color-light-status-muted-alt-positive: #d1f1d7;
-    --color-light-status-muted-alt-positive-hover: #bae6c2;
+    --color-light-status-muted-alt-positive-hover: #bbe8c3;
     --color-light-status-muted-alt-positive-inverted: #253528;
-    --color-light-status-muted-alt-positive-inverted-hover: #283f2d;
-    --color-light-status-muted-alt-positive-inverted-press: #2d4d32;
-    --color-light-status-muted-alt-positive-press: #a1d7a8;
+    --color-light-status-muted-alt-positive-inverted-hover: #273f2d;
+    --color-light-status-muted-alt-positive-inverted-press: #2d4e33;
+    --color-light-status-muted-alt-positive-press: #a1dba8;
     --color-light-status-muted-attention: #ffefd9;
     --color-light-status-muted-attention-hover: #fde6c8;
     --color-light-status-muted-attention-inverted: #36291f;
     --color-light-status-muted-attention-inverted-hover: #412f22;
-    --color-light-status-muted-attention-inverted-press: #4f3623;
+    --color-light-status-muted-attention-inverted-press: #543a27;
     --color-light-status-muted-attention-press: #f6d7af;
     --color-light-status-muted-info: #e4f0ff;
     --color-light-status-muted-info-hover: #d8eaff;
     --color-light-status-muted-info-inverted: #222a3e;
     --color-light-status-muted-info-inverted-hover: #293044;
-    --color-light-status-muted-info-inverted-press: #303a55;
-    --color-light-status-muted-info-press: #c4defa;
+    --color-light-status-muted-info-inverted-press: #2f3a55;
+    --color-light-status-muted-info-press: #c1dbf7;
     --color-light-status-muted-negative: #ffebeb;
     --color-light-status-muted-negative-hover: #ffdfdf;
     --color-light-status-muted-negative-inverted: #392523;
     --color-light-status-muted-negative-inverted-hover: #442926;
-    --color-light-status-muted-negative-inverted-press: #56302d;
-    --color-light-status-muted-negative-press: #faccca;
+    --color-light-status-muted-negative-inverted-press: #55312e;
+    --color-light-status-muted-negative-press: #f9ccca;
     --color-light-status-muted-positive: #dff8e5;
     --color-light-status-muted-positive-hover: #d1f1d7;
     --color-light-status-muted-positive-inverted: #232d25;
     --color-light-status-muted-positive-inverted-hover: #253528;
-    --color-light-status-muted-positive-inverted-press: #283f2d;
-    --color-light-status-muted-positive-press: #bae6c2;
-    --color-light-status-negative: #ff5431;
-    --color-light-status-negative-hover: #ec2e14;
-    --color-light-status-negative-inverted: #ff5431;
-    --color-light-status-negative-inverted-hover: #ff7554;
-    --color-light-status-negative-inverted-press: #ff8d73;
-    --color-light-status-negative-press: #c7251c;
+    --color-light-status-muted-positive-inverted-press: #273f2d;
+    --color-light-status-muted-positive-press: #bbe8c3;
+    --color-light-status-negative: #ff4837;
+    --color-light-status-negative-hover: #ec2d20;
+    --color-light-status-negative-inverted: #ff4837;
+    --color-light-status-negative-inverted-hover: #ff755e;
+    --color-light-status-negative-inverted-press: #ff8d79;
+    --color-light-status-negative-press: #c7241f;
     --color-light-status-positive: #0cc44d;
     --color-light-status-positive-hover: #04b545;
     --color-light-status-positive-inverted: #17d055;
@@ -726,11 +738,11 @@
     --color-light-text-info-inverted-press: #7fb6ff;
     --color-light-text-info-press: #2453b4;
     --color-light-text-link: #2a77ef;
-    --color-light-text-negative: #ec2e14;
-    --color-light-text-negative-hover: #c7251c;
-    --color-light-text-negative-inverted: #ff5431;
-    --color-light-text-negative-inverted-hover: #ff7554;
-    --color-light-text-negative-inverted-press: #ff8d73;
+    --color-light-text-negative: #ec2d20;
+    --color-light-text-negative-hover: #c7241f;
+    --color-light-text-negative-inverted: #ff4837;
+    --color-light-text-negative-inverted-hover: #ff755e;
+    --color-light-text-negative-inverted-press: #ff8d79;
     --color-light-text-negative-press: #a6201e;
     --color-light-text-positive: #0d9336;
     --color-light-text-positive-hover: #0a7d2c;
@@ -738,12 +750,12 @@
     --color-light-text-positive-inverted-hover: #22e068;
     --color-light-text-positive-inverted-press: #4ae777;
     --color-light-text-positive-press: #036625;
-    --color-light-text-primary: #0e0e0e;
-    --color-light-text-primary-hover: #5f5f66;
-    --color-light-text-primary-inverted: #fff;
-    --color-light-text-primary-inverted-hover: #babbc2;
-    --color-light-text-primary-inverted-press: #a0a1a9;
-    --color-light-text-primary-press: #75757d;
+    --color-light-text-primary: rgba(3, 3, 6, 0.88);
+    --color-light-text-primary-hover: rgba(1, 1, 12, 0.63);
+    --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
+    --color-light-text-primary-inverted-hover: rgba(255, 255, 255, 0.7);
+    --color-light-text-primary-inverted-press: rgba(255, 255, 255, 0.6);
+    --color-light-text-primary-press: rgba(4, 4, 19, 0.55);
     --color-light-text-quaternary: rgba(5, 11, 44, 0.18);
     --color-light-text-quaternary-inverted: rgba(231, 231, 248, 0.18);
     --color-light-text-secondary: rgba(4, 4, 19, 0.55);
@@ -769,12 +781,12 @@
     --color-static-accent-primary-inverted-hover: #ff503e;
     --color-static-accent-primary-inverted-press: #fd624e;
     --color-static-accent-primary-press: #d72505;
-    --color-static-accent-secondary: #0e0e0e;
-    --color-static-accent-secondary-hover: #29292c;
-    --color-static-accent-secondary-inverted: #fff;
-    --color-static-accent-secondary-inverted-hover: #e7e8eb;
+    --color-static-accent-secondary: #212124;
+    --color-static-accent-secondary-hover: #2f2f32;
+    --color-static-accent-secondary-inverted: #f2f3f5;
+    --color-static-accent-secondary-inverted-hover: #dcdde1;
     --color-static-accent-secondary-inverted-press: #d2d3d9;
-    --color-static-accent-secondary-press: #2f2f32;
+    --color-static-accent-secondary-press: #353539;
     --color-static-bg-accent: #ef3124;
     --color-static-bg-primary-dark: #0e0e0e;
     --color-static-bg-primary-light: #fff;
@@ -790,7 +802,7 @@
     --color-static-graphic-light: #fff;
     --color-static-neutral-0: #fff;
     --color-static-neutral-0-hover: #e7e8eb;
-    --color-static-neutral-0-inverted: #29292c;
+    --color-static-neutral-0-inverted: #262629;
     --color-static-neutral-0-inverted-hover: #2f2f32;
     --color-static-neutral-0-inverted-press: #353539;
     --color-static-neutral-0-press: #dcdde1;
@@ -800,7 +812,7 @@
     --color-static-neutral-100-inverted-hover: #212124;
     --color-static-neutral-100-inverted-press: #29292c;
     --color-static-neutral-100-press: #dcdde1;
-    --color-static-neutral-1500: #0e0e0e;
+    --color-static-neutral-1500: #121213;
     --color-static-neutral-1500-hover: #3f3f45;
     --color-static-neutral-1500-inverted: #fff;
     --color-static-neutral-1500-inverted-hover: #babbc2;
@@ -813,7 +825,11 @@
     --color-static-neutral-200-inverted-press: #2f2f32;
     --color-static-neutral-200-press: #dcdde1;
     --color-static-neutral-300: #e7e8eb;
+    --color-static-neutral-300-hover: #dcdde1;
     --color-static-neutral-300-inverted: #29292c;
+    --color-static-neutral-300-inverted-hover: #2f2f32;
+    --color-static-neutral-300-inverted-press: #353539;
+    --color-static-neutral-300-press: #d2d3d9;
     --color-static-neutral-400: #d2d3d9;
     --color-static-neutral-400-hover: #babbc2;
     --color-static-neutral-400-inverted: #353539;
@@ -844,6 +860,12 @@
     --color-static-neutral-translucent-100-inverted-hover: rgba(222, 222, 238, 0.13);
     --color-static-neutral-translucent-100-inverted-press: rgba(234, 234, 248, 0.15);
     --color-static-neutral-translucent-100-press: rgba(5, 12, 41, 0.14);
+    --color-static-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
+    --color-static-neutral-translucent-1300-hover: rgba(3, 3, 8, 0.8);
+    --color-static-neutral-translucent-1300-inverted: rgba(255, 255, 255, 0.94);
+    --color-static-neutral-translucent-1300-inverted-hover: rgba(255, 255, 255, 0.7);
+    --color-static-neutral-translucent-1300-inverted-press: rgba(255, 255, 255, 0.6);
+    --color-static-neutral-translucent-1300-press: rgba(0, 0, 10, 0.71);
     --color-static-neutral-translucent-1500-hover: rgba(2, 2, 10, 0.76);
     --color-static-neutral-translucent-1500-inverted-hover: rgba(243, 245, 254, 0.75);
     --color-static-neutral-translucent-1500-inverted-press: rgba(239, 240, 252, 0.65);
@@ -855,7 +877,11 @@
     --color-static-neutral-translucent-200-inverted-press: rgba(234, 234, 248, 0.15);
     --color-static-neutral-translucent-200-press: rgba(5, 12, 41, 0.14);
     --color-static-neutral-translucent-300: rgba(15, 25, 55, 0.1);
+    --color-static-neutral-translucent-300-hover: rgba(5, 12, 41, 0.14);
     --color-static-neutral-translucent-300-inverted: rgba(222, 222, 238, 0.13);
+    --color-static-neutral-translucent-300-inverted-hover: rgba(234, 234, 248, 0.15);
+    --color-static-neutral-translucent-300-inverted-press: rgba(231, 231, 248, 0.18);
+    --color-static-neutral-translucent-300-press: rgba(5, 11, 44, 0.18);
     --color-static-neutral-translucent-400: rgba(5, 11, 44, 0.18);
     --color-static-neutral-translucent-400-hover: rgba(9, 12, 37, 0.28);
     --color-static-neutral-translucent-400-inverted: rgba(231, 231, 248, 0.18);
@@ -894,8 +920,8 @@
     --color-static-status-muted-negative-inverted: #392523;
     --color-static-status-muted-positive: #dff8e5;
     --color-static-status-muted-positive-inverted: #232d25;
-    --color-static-status-negative: #ff5431;
-    --color-static-status-negative-inverted: #ff5431;
+    --color-static-status-negative: #ff4837;
+    --color-static-status-negative-inverted: #ff4837;
     --color-static-status-positive: #0cc44d;
     --color-static-status-positive-inverted: #17d055;
     --color-static-text-accent: #ef3124;
@@ -911,11 +937,11 @@
     --color-static-text-info-inverted-hover: #63aafd;
     --color-static-text-info-inverted-press: #7fb6ff;
     --color-static-text-info-press: #2453b4;
-    --color-static-text-negative: #ec2e14;
-    --color-static-text-negative-hover: #c7251c;
-    --color-static-text-negative-inverted: #ff5431;
-    --color-static-text-negative-inverted-hover: #ff7554;
-    --color-static-text-negative-inverted-press: #ff8d73;
+    --color-static-text-negative: #ec2d20;
+    --color-static-text-negative-hover: #c7241f;
+    --color-static-text-negative-inverted: #ff4837;
+    --color-static-text-negative-inverted-hover: #ff755e;
+    --color-static-text-negative-inverted-press: #ff8d79;
     --color-static-text-negative-press: #a6201e;
     --color-static-text-positive: #0d9336;
     --color-static-text-positive-hover: #0a7d2c;
@@ -923,14 +949,14 @@
     --color-static-text-positive-inverted-hover: #22e068;
     --color-static-text-positive-inverted-press: #4ae777;
     --color-static-text-positive-press: #036625;
-    --color-static-text-primary: #0e0e0e;
+    --color-static-text-primary: rgba(3, 3, 6, 0.88);
     --color-static-text-primary-dark: #0e0e0e;
-    --color-static-text-primary-hover: #5f5f66;
-    --color-static-text-primary-inverted: #fff;
-    --color-static-text-primary-inverted-hover: #babbc2;
-    --color-static-text-primary-inverted-press: #a0a1a9;
+    --color-static-text-primary-hover: rgba(1, 1, 12, 0.63);
+    --color-static-text-primary-inverted: rgba(255, 255, 255, 0.94);
+    --color-static-text-primary-inverted-hover: rgba(255, 255, 255, 0.7);
+    --color-static-text-primary-inverted-press: rgba(255, 255, 255, 0.6);
     --color-static-text-primary-light: #fff;
-    --color-static-text-primary-press: #75757d;
+    --color-static-text-primary-press: rgba(4, 4, 19, 0.55);
     --color-static-text-quaternary: rgba(5, 11, 44, 0.18);
     --color-static-text-quaternary-inverted: rgba(231, 231, 248, 0.18);
     --color-static-text-secondary: rgba(4, 4, 19, 0.55);
@@ -1127,22 +1153,22 @@
     --color-dark-text-link-tint-20: rgb(110, 177, 253);
     --color-dark-text-link-tint-40: rgb(146, 196, 253);
     --color-dark-text-primary-alpha-30: rgba(255, 255, 255, 0.3);
-    --color-dark-text-primary-shade-24: rgb(194, 194, 194);
-    --color-dark-text-primary-shade-30: rgb(179, 179, 179);
-    --color-dark-text-primary-shade-40: rgb(153, 153, 153);
-    --color-dark-text-primary-shade-50: rgb(128, 128, 128);
-    --color-dark-text-primary-tint-20: rgb(255, 255, 255);
-    --color-dark-text-primary-tint-40: rgb(255, 255, 255);
-    --color-dark-text-primary-inverted-alpha-30: rgba(14, 14, 14, 0.3);
-    --color-dark-text-primary-inverted-alpha-40: rgba(14, 14, 14, 0.4);
-    --color-dark-text-primary-inverted-shade-20: rgb(11, 11, 11);
-    --color-dark-text-primary-inverted-shade-30: rgb(10, 10, 10);
-    --color-dark-text-primary-inverted-tint-7: rgb(31, 31, 31);
-    --color-dark-text-primary-inverted-tint-15: rgb(50, 50, 50);
-    --color-dark-text-primary-inverted-tint-24: rgb(72, 72, 72);
-    --color-dark-text-primary-inverted-tint-30: rgb(86, 86, 86);
-    --color-dark-text-primary-inverted-tint-40: rgb(110, 110, 110);
-    --color-dark-text-primary-inverted-tint-50: rgb(135, 135, 135);
+    --color-dark-text-primary-shade-24: rgba(194, 194, 194, 0.9544);
+    --color-dark-text-primary-shade-30: rgba(179, 179, 179, 0.958);
+    --color-dark-text-primary-shade-40: rgba(153, 153, 153, 0.964);
+    --color-dark-text-primary-shade-50: rgba(128, 128, 128, 0.97);
+    --color-dark-text-primary-tint-20: rgba(255, 255, 255, 0.952);
+    --color-dark-text-primary-tint-40: rgba(255, 255, 255, 0.964);
+    --color-dark-text-primary-inverted-alpha-30: rgba(3, 3, 6, 0.3);
+    --color-dark-text-primary-inverted-alpha-40: rgba(3, 3, 6, 0.4);
+    --color-dark-text-primary-inverted-shade-20: rgba(2, 2, 5, 0.904);
+    --color-dark-text-primary-inverted-shade-30: rgba(2, 2, 4, 0.916);
+    --color-dark-text-primary-inverted-tint-7: rgba(21, 21, 23, 0.8884);
+    --color-dark-text-primary-inverted-tint-15: rgba(41, 41, 43, 0.898);
+    --color-dark-text-primary-inverted-tint-24: rgba(63, 63, 66, 0.9088);
+    --color-dark-text-primary-inverted-tint-30: rgba(79, 79, 81, 0.916);
+    --color-dark-text-primary-inverted-tint-40: rgba(104, 104, 106, 0.928);
+    --color-dark-text-primary-inverted-tint-50: rgba(129, 129, 131, 0.94);
     --color-dark-text-secondary-shade-20: rgba(190, 190, 201, 0.64);
     --color-dark-text-secondary-shade-30: rgba(167, 167, 176, 0.685);
     --color-dark-text-secondary-tint-20: rgba(241, 241, 252, 0.64);
@@ -1288,23 +1314,23 @@
     --color-light-text-link-tint-50: rgb(149, 187, 247);
     --color-light-text-link-shade-20: rgb(34, 95, 191);
     --color-light-text-link-shade-40: rgb(25, 71, 143);
-    --color-light-text-primary-alpha-30: rgba(14, 14, 14, 0.3);
-    --color-light-text-primary-tint-24: rgb(72, 72, 72);
-    --color-light-text-primary-tint-30: rgb(86, 86, 86);
-    --color-light-text-primary-tint-40: rgb(110, 110, 110);
-    --color-light-text-primary-tint-50: rgb(135, 135, 135);
-    --color-light-text-primary-shade-20: rgb(11, 11, 11);
-    --color-light-text-primary-shade-40: rgb(8, 8, 8);
+    --color-light-text-primary-alpha-30: rgba(3, 3, 6, 0.3);
+    --color-light-text-primary-tint-24: rgba(63, 63, 66, 0.9088);
+    --color-light-text-primary-tint-30: rgba(79, 79, 81, 0.916);
+    --color-light-text-primary-tint-40: rgba(104, 104, 106, 0.928);
+    --color-light-text-primary-tint-50: rgba(129, 129, 131, 0.94);
+    --color-light-text-primary-shade-20: rgba(2, 2, 5, 0.904);
+    --color-light-text-primary-shade-40: rgba(2, 2, 4, 0.928);
     --color-light-text-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
     --color-light-text-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
-    --color-light-text-primary-inverted-tint-20: rgb(255, 255, 255);
-    --color-light-text-primary-inverted-tint-30: rgb(255, 255, 255);
-    --color-light-text-primary-inverted-shade-7: rgb(237, 237, 237);
-    --color-light-text-primary-inverted-shade-15: rgb(217, 217, 217);
-    --color-light-text-primary-inverted-shade-24: rgb(194, 194, 194);
-    --color-light-text-primary-inverted-shade-30: rgb(179, 179, 179);
-    --color-light-text-primary-inverted-shade-40: rgb(153, 153, 153);
-    --color-light-text-primary-inverted-shade-50: rgb(128, 128, 128);
+    --color-light-text-primary-inverted-tint-20: rgba(255, 255, 255, 0.952);
+    --color-light-text-primary-inverted-tint-30: rgba(255, 255, 255, 0.958);
+    --color-light-text-primary-inverted-shade-7: rgba(237, 237, 237, 0.9442);
+    --color-light-text-primary-inverted-shade-15: rgba(217, 217, 217, 0.949);
+    --color-light-text-primary-inverted-shade-24: rgba(194, 194, 194, 0.9544);
+    --color-light-text-primary-inverted-shade-30: rgba(179, 179, 179, 0.958);
+    --color-light-text-primary-inverted-shade-40: rgba(153, 153, 153, 0.964);
+    --color-light-text-primary-inverted-shade-50: rgba(128, 128, 128, 0.97);
     --color-light-text-secondary-tint-20: rgba(54, 54, 66, 0.64);
     --color-light-text-secondary-tint-30: rgba(79, 79, 90, 0.685);
     --color-light-text-secondary-shade-20: rgba(3, 3, 15, 0.64);
@@ -1637,7 +1663,7 @@
 
     /* size xl */
     --secondary-tablist-xl-gaps: var(--gap-m);
-} .tabs__title_ajujo {
-} .tabs__mobile_ajujo .tabs__title_ajujo + .tabs__title_ajujo {
+} .tabs__title_v15ld {
+} .tabs__mobile_v15ld .tabs__title_v15ld + .tabs__title_v15ld {
         margin-left: var(--secondary-tablist-mobile-gaps);
     }

package/esm/components/tab/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"component":"tabs__component_8oxrm","hidden":"tabs__hidden_8oxrm"};
+var styles = {"component":"tabs__component_1m9j2","hidden":"tabs__hidden_1m9j2"};
 require('./index.css')
 
 var Tab = function (_a) {

package/esm/components/tab/index.css

@@ -1,8 +1,8 @@
-/* hash: 1wzik */
-.tabs__component_8oxrm {
+/* hash: ryfir */
+.tabs__component_1m9j2 {
     outline: none;
 }
 
-.tabs__hidden_8oxrm {
+.tabs__hidden_1m9j2 {
     display: none;
 }