@salutejs-ds/sdds_sbcom 0.1.14 → 0.1.15

package/css/sdds_sbcom__light.css

@@ -6,13 +6,11 @@
   --inverse-personas-sea-blue-text-accent-active: #00A8ADFF;
   --inverse-personas-violet-text-accent-active: #D982E8FF;
   --on-light-outline-default-hover: #CCCCCCFF;
-  --inverse-outline-primary-active: #2B2827FF;
-  --on-dark-outline-default-active: #292929FF;
   --on-dark-outline-default-hover: #666666FF;
+  --on-dark-outline-default-active: #292929FF;
   --personas-green-text-accent-hover: #8CDECAFF;
   --personas-sea-blue-text-accent-hover: #000000FF;
   --inverse-surface-accent-secondary-hover: #70CDB7FF;
-  --on-light-surface-accent-secondary-active: #3CAF94FF;
   --surface-transparent-navi-active: #FFFFFFAD;
   --on-light-surface-transparent-accent-minor-active: #0BA88852;
   --on-light-personas-green-text-accent-active: #04AF87FF;
@@ -23,7 +21,6 @@
   --on-light-personas-violet-text-accent-active: #81288FFF;
   --on-light-personas-ochre-text-accent-active: #AA4A0EFF;
   --on-dark-surface-accent-secondary-hover: #70CDB7FF;
-  --inverse-personas-green-text-accent-hover: #04C396FF;
   --on-light-personas-pink-text-accent-hover: #E47777FF;
   --surface-accent-secondary-hover: #50C3A8FF;
   --personas-indigo-text-accent-hover: #000000FF;
@@ -32,23 +29,20 @@
   --inverse-outline-default: #383838;
   --on-dark-personas-blue-text-accent-hover: #C3DDF9FF;
   --on-light-personas-indigo-text-accent-hover: #000000FF;
-  --on-light-personas-indigo-text-accent-active: #5B2999FF;
   --on-light-personas-sea-blue-text-accent-hover: #00D9E0FF;
   --personas-ochre-text-accent-active: #AA4A0EFF;
   --inverse-background-hardline: #FFFFFF;
-  --on-dark-surface-transparent-accent-minor-active: #0BA88838;
   --on-dark-personas-sea-blue-text-accent-hover: #FFFFFFFF;
   --surface-transparent-navi: #FFFFFF99;
   --personas-violet-text-accent-active: #D679E6FF;
   --personas-blue-text-accent-hover: #1477E1FF;
   --outline-default: #383838;
   --text-primary-brightness-active: #171717C4;
-  --surface-solid-card-brightness-hover: #FFFFFFFF;
   --surface-transparent-card-brightness-hover: #FFFFFFFF;
   --surface-solid-card-brightness-active: #FFFFFFFF;
   --surface-solid-primary-brightness-hover: #FFFFFFFF;
   --surface-transparent-card-brightness-active: #FFFFFFFF;
-  --on-dark-surface-solid-primary-brightness-active: #212121FF;
+  --surface-solid-card-brightness-hover: #FFFFFFFF;
   --on-dark-surface-transparent-card-brightness-hover: #FAFAFA1F;
   --on-dark-surface-transparent-card-brightness-active: #FAFAFA0A;
   --on-dark-surface-solid-card-brightness-hover: #303030FF;
@@ -89,18 +83,16 @@
   --inverse-surface-transparent-card-brightness-active: #FAFAFA0A;
   --on-light-outline-warning-active: #A3420AFF;
   --on-light-personas-violet-text-accent: #9E32AF;
-  --inverse-surface-accent-minor: #04473B;
   --inverse-surface-solid-card-brightness-active: #212121FF;
   --on-dark-surface-accent-minor-hover: #055C4CFF;
   --on-light-surface-accent-minor-hover: #C7F0E5FF;
-  --on-dark-personas-blue-text-accent: #79B3F2;
-  --on-light-personas-indigo-text-accent: #7133BE;
+  --inverse-surface-accent-minor: #04473B;
   --on-light-personas-sea-blue-text-accent: #00898D;
   --personas-ochre-text-accent: #D15A11;
   --on-dark-surface-transparent-accent-minor: #0BA68647;
   --on-dark-personas-violet-text-accent: #E19DED;
   --on-light-surface-transparent-navi: #FFFFFF99;
-  --on-dark-personas-green-text-accent-hover: #84DCC6FF;
+  --on-dark-personas-blue-text-accent: #79B3F2;
   --personas-green-text-accent-active: #4CCDACFF;
   --personas-sea-blue-text-accent-active: #4BB4B4FF;
   --inverse-surface-accent-secondary-active: #59C5ACFF;
@@ -127,16 +119,13 @@
   --inverse-personas-blue-text-accent-active: #5DA3EFFF;
   --inverse-surface-transparent-accent-minor-active: #0BA8882E;
   --text-primary-brightness-hover: #17171793;
+  --on-dark-personas-green-text-accent-hover: #84DCC6FF;
   --on-dark-text-primary-brightness-hover: #FAFAFA93;
   --on-dark-personas-sea-blue-text-accent: #7BC8C8;
   --on-light-personas-blue-text-accent-active: #0D4F96FF;
   --on-light-outline-default-active: #E6E6E6FF;
   --on-light-text-warning-active: #6F2D06FF;
-  --surface-transparent-navi-hover: #FFFFFFA8;
-  --on-light-surface-transparent-accent-minor-hover: #0BA8884D;
   --on-light-personas-green-text-accent-hover: #04D7A6FF;
-  --outline-default-hover: #B3B3B3FF;
-  --on-dark-outline-primary-hover: #6B6461FF;
   --on-dark-personas-pink-text-accent-hover: #F26E6EFF;
   --outline-primary-hover: #B6B1AFFF;
   --inverse-personas-indigo-text-accent-hover: #FFFFFFFF;
@@ -162,14 +151,10 @@
   --on-light-personas-blue-text-accent-hover: #1477E1FF;
   --on-dark-surface-transparent-navi-hover: #242424B8;
   --on-light-surface-accent-secondary-hover: #50C3A8FF;
-  --personas-blue-text-accent: #1063BA;
-  --personas-sea-blue-text-accent: #7BC8C8;
-  --personas-violet-text-accent-hover: #EBBEF3FF;
-  --background-hardline: #FFFFFF;
-  --on-light-text-primary-brightness-hover: #17171793;
-  --inverse-text-primary-brightness-hover: #FAFAFA93;
-  --surface-solid-primary-brightness-active: #FFFFFFFF;
-  --on-dark-surface-solid-primary-brightness-hover: #303030FF;
+  --surface-transparent-navi-hover: #FFFFFFA8;
+  --on-light-surface-transparent-accent-minor-hover: #0BA8884D;
+  --outline-default-hover: #B3B3B3FF;
+  --on-dark-outline-primary-hover: #6B6461FF;
   --inverse-surface-solid-card-brightness-hover: #303030FF;
   --inverse-personas-blue-text-accent: #79B3F2;
   --personas-blue-text-accent-active: #0D4F96FF;
@@ -178,9 +163,6 @@
   --inverse-personas-sea-blue-text-accent: #00898D;
   --on-dark-personas-pink-text-accent: #F7A4A4;
   --personas-pink-text-accent: #F7A4A4;
-  --inverse-personas-violet-text-accent: #E19DED;
-  --inverse-surface-transparent-accent-minor: #0BA6863D;
-  --on-light-personas-blue-text-accent: #1063BA;
   --on-dark-surface-transparent-navi: #23232399;
   --inverse-outline-primary: #3B3735;
   --inverse-personas-olive-text-accent-active: #7DC07CFF;
@@ -188,6 +170,17 @@
   --personas-green-text-accent: #6CD5BB;
   --dark-background-hardline: #000000;
   --on-dark-outline-primary: #3B3735;
+  --personas-blue-text-accent: #1063BA;
+  --personas-sea-blue-text-accent: #7BC8C8;
+  --personas-violet-text-accent-hover: #EBBEF3FF;
+  --background-hardline: #FFFFFF;
+  --on-light-text-primary-brightness-hover: #17171793;
+  --inverse-text-primary-brightness-hover: #FAFAFA93;
+  --surface-solid-primary-brightness-active: #FFFFFFFF;
+  --on-dark-surface-solid-primary-brightness-hover: #303030FF;
+  --inverse-personas-violet-text-accent: #E19DED;
+  --inverse-surface-transparent-accent-minor: #0BA6863D;
+  --on-light-personas-blue-text-accent: #1063BA;
   --on-dark-text-primary-brightness-active: #FAFAFAC4;
   --on-light-text-primary-brightness-active: #171717C4;
   --inverse-text-primary-brightness-active: #FAFAFAC4;
@@ -209,7 +202,13 @@
   --on-light-surface-accent-secondary: #41BDA1;
   --on-light-personas-pink-text-accent: #DE5555;
   --inverse-personas-olive-text-accent: #93CB92;
-  --text-paragraph-active: #15110F7A;
+  --inverse-outline-primary-active: #2B2827FF;
+  --on-light-surface-accent-secondary-active: #3CAF94FF;
+  --on-dark-surface-transparent-accent-minor-active: #0BA88838;
+  --on-dark-surface-solid-primary-brightness-active: #212121FF;
+  --on-light-personas-indigo-text-accent: #7133BE;
+  --inverse-personas-green-text-accent-hover: #04C396FF;
+  --on-light-personas-indigo-text-accent-active: #5B2999FF;
   --text-accent: #0A8E73;
   --text-accent-hover: #0DB593FF;
   --text-accent-active: #076955FF;
@@ -238,7 +237,7 @@
   --text-primary-brightness: #171717F5;
   --text-paragraph: #15110F66;
   --text-paragraph-hover: #15110FFF;
-  --on-dark-text-paragraph-active: #F5F1EF93;
+  --text-paragraph-active: #15110F7A;
   --on-dark-text-accent: #61C8B0;
   --on-dark-text-accent-hover: #77CFBBFF;
   --on-dark-text-accent-active: #4ABFA4FF;
@@ -268,7 +267,7 @@
   --on-dark-text-primary-hover: #FFFFFF97;
   --on-dark-text-paragraph: #F6F2F07A;
   --on-dark-text-paragraph-hover: #F5F1EFFF;
-  --on-light-text-primary-brightness: #171717F5;
+  --on-dark-text-paragraph-active: #F5F1EF93;
   --on-light-text-secondary: #15110FA3;
   --on-light-text-secondary-hover: #15110FFF;
   --on-light-text-secondary-active: #15110FC4;
@@ -292,6 +291,7 @@
   --on-light-text-primary: #15110FFC;
   --on-light-text-primary-hover: #15110F97;
   --on-light-text-primary-active: #15110FCA;
+  --on-light-text-primary-brightness: #171717F5;
   --inverse-text-primary: #FFFFFFFC;
   --inverse-text-primary-hover: #FFFFFF97;
   --inverse-text-primary-active: #FFFFFFCA;
@@ -317,7 +317,6 @@
   --on-light-text-info-hover: #000000FF;
   --on-light-text-info-active: #194B85FF;
   --on-light-text-negative-hover: #E3353BFF;
-  --inverse-text-negative-active: #F3626AFF;
   --inverse-text-info: #70B2F5;
   --inverse-text-info-hover: #BCDBFAFF;
   --inverse-text-info-active: #53A3F3FF;
@@ -338,7 +337,7 @@
   --inverse-text-positive-active: #469442FF;
   --inverse-text-negative: #F57E83;
   --inverse-text-negative-hover: #F89BA0FF;
-  --surface-transparent-secondary-active: #15110F1F;
+  --inverse-text-negative-active: #F3626AFF;
   --surface-transparent-tertiary: #15110F1F;
   --surface-transparent-tertiary-hover: #15110F2E;
   --surface-transparent-tertiary-active: #15110F33;
@@ -372,7 +371,7 @@
   --surface-transparent-primary-active: #15110F0F;
   --surface-transparent-secondary: #15110F14;
   --surface-transparent-secondary-hover: #15110F1A;
-  --surface-warning-active: #AD460BFF;
+  --surface-transparent-secondary-active: #15110F1F;
   --surface-negative: #E83439;
   --surface-negative-hover: #EC5156FF;
   --surface-negative-active: #E72329FF;
@@ -384,7 +383,7 @@
   --surface-positive-hover: #28A126FF;
   --surface-warning: #BE4E0C;
   --surface-warning-hover: #D3560DFF;
-  --surface-transparent-negative: #E8343929;
+  --surface-warning-active: #AD460BFF;
   --surface-transparent-negative-hover: #E9353B38;
   --surface-read-only: #F9F9F903;
   --surface-read-only-hover: #FAFAFA05;
@@ -399,7 +398,7 @@
   --on-dark-surface-solid-tertiary: #474747;
   --on-dark-surface-solid-tertiary-hover: #525252FF;
   --surface-transparent-negative-active: #E9353B3D;
-  --on-dark-surface-transparent-secondary-active: #FFFFFF1A;
+  --surface-transparent-negative: #E8343929;
   --on-dark-surface-transparent-tertiary: #FFFFFF3D;
   --on-dark-surface-transparent-tertiary-hover: #FFFFFF5C;
   --on-dark-surface-transparent-tertiary-active: #FFFFFF2E;
@@ -428,7 +427,7 @@
   --on-dark-surface-transparent-primary-active: #FFFFFF0F;
   --on-dark-surface-transparent-secondary: #FFFFFF29;
   --on-dark-surface-transparent-secondary-hover: #FFFFFF47;
-  --on-dark-surface-positive: #A6D2A2;
+  --on-dark-surface-transparent-secondary-active: #FFFFFF1A;
   --on-dark-surface-positive-hover: #B3D9B0FF;
   --on-dark-surface-positive-active: #9FCF9BFF;
   --on-dark-surface-warning: #F8AD80;
@@ -443,6 +442,7 @@
   --on-dark-surface-transparent-accent-active: #0BA88824;
   --on-dark-surface-transparent-accent: #0BA68633;
   --on-dark-surface-transparent-accent-hover: #0BA88852;
+  --on-dark-surface-positive: #A6D2A2;
   --on-dark-surface-read-only: #F9F9F905;
   --on-dark-surface-read-only-hover: #FAFAFA0F;
   --on-dark-surface-read-only-active: #FAFAFA00;
@@ -458,7 +458,6 @@
   --on-dark-surface-transparent-negative-active: #F8A5A870;
   --on-dark-surface-transparent-negative: #F8A6A980;
   --on-dark-surface-transparent-negative-hover: #F8A5A89E;
-  --on-light-surface-transparent-secondary-active: #15110F1F;
   --on-light-surface-transparent-tertiary: #15110F1F;
   --on-light-surface-transparent-tertiary-hover: #15110F2E;
   --on-light-surface-transparent-tertiary-active: #15110F33;
@@ -487,6 +486,7 @@
   --on-light-surface-transparent-primary-active: #15110F0F;
   --on-light-surface-transparent-secondary: #15110F14;
   --on-light-surface-transparent-secondary-hover: #15110F1A;
+  --on-light-surface-transparent-secondary-active: #15110F1F;
   --on-light-surface-positive: #239322;
   --on-light-surface-positive-hover: #28A126FF;
   --on-light-surface-positive-active: #20801EFF;
@@ -502,7 +502,6 @@
   --on-light-surface-transparent-accent-active: #0BA88833;
   --on-light-surface-transparent-accent: #0BA6861F;
   --on-light-surface-transparent-accent-hover: #0BA8882E;
-  --on-light-surface-transparent-negative: #E8343929;
   --on-light-surface-transparent-negative-hover: #E9353B38;
   --on-light-surface-read-only: #F9F9F903;
   --on-light-surface-read-only-hover: #FAFAFA05;
@@ -515,7 +514,7 @@
   --inverse-surface-solid-secondary-hover: #333333FF;
   --inverse-surface-solid-secondary-active: #242424FF;
   --on-light-surface-transparent-negative-active: #E9353B3D;
-  --inverse-surface-transparent-secondary-hover: #FFFFFF47;
+  --on-light-surface-transparent-negative: #E8343929;
   --inverse-surface-transparent-secondary-active: #FFFFFF1A;
   --inverse-surface-transparent-tertiary: #FFFFFF3D;
   --inverse-surface-transparent-tertiary-hover: #FFFFFF5C;
@@ -544,6 +543,7 @@
   --inverse-surface-transparent-primary-hover: #FFFFFF24;
   --inverse-surface-transparent-primary-active: #FFFFFF0F;
   --inverse-surface-transparent-secondary: #FFFFFF29;
+  --inverse-surface-transparent-secondary-hover: #FFFFFF47;
   --inverse-surface-positive: #A6D2A2;
   --inverse-surface-positive-hover: #B3D9B0FF;
   --inverse-surface-positive-active: #9FCF9BFF;
@@ -645,7 +645,6 @@
   --inverse-outline-clear: #FFFFFF00;
   --inverse-outline-clear-hover: #FFFFFF00;
   --inverse-outline-clear-active: #FFFFFF00;
-  --inverse-outline-warning-active: #F79C64FF;
   --inverse-outline-negative: #F8A6A9;
   --inverse-outline-negative-hover: #F25A5FFF;
   --inverse-outline-negative-active: #EF343AFF;
@@ -657,6 +656,7 @@
   --inverse-outline-positive-hover: #DBEDD9FF;
   --inverse-outline-warning: #F8AD80;
   --inverse-outline-warning-hover: #FCE0CFFF;
+  --inverse-outline-warning-active: #F79C64FF;
   --text-primary-hover: #15110F97;
   --on-dark-surface-solid-default: #F6F2F0;
   --on-light-surface-accent-minor-active: #BFEDE1FF;
@@ -667,43 +667,42 @@
 
 :root {
   --on-dark-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
-  --on-light-outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.8) 100.0%);
   --on-dark-personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
-  --inverse-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(189, 145, 245) 0.0%, rgb(161, 117, 217) 100.0%);
-  --outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.6) 100.0%);
+  --inverse-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
+  --outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.16) 36.746%, rgba(255, 255, 255, 0.16) 66.734%, rgba(255, 255, 255, 0.8) 100%);
   --personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
-  --inverse-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(153, 215, 217) 0.0%, rgb(116, 198, 200) 100.0%);
+  --inverse-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
   --on-light-personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(252, 153, 153) 0.0%, rgb(223, 105, 105) 100.0%);
   --inverse-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(202, 70, 227) 8.0%, rgb(169, 141, 245) 56.0%, rgb(54, 211, 245) 100.0%);
   --on-dark-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(229, 128, 66) 0.0%, rgb(199, 90, 23) 100.0%);
-  --personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
-  --inverse-personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(252, 153, 153) 0.0%, rgb(223, 105, 105) 100.0%);
+  --personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(153, 215, 217) 0.0%, rgb(116, 198, 200) 100.0%);
+  --inverse-personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(222, 113, 113) 0.0%, rgb(208, 79, 79) 100.0%);
   --on-light-surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
   --inverse-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(229, 128, 66) 0.0%, rgb(199, 90, 23) 100.0%);
   --dark-background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
   --on-dark-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
   --on-dark-surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
-  --inverse-background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
-  --inverse-overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
+  --inverse-background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
+  --inverse-overlay-gradient: linear-gradient(180.00deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%);
   --personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(252, 153, 153) 0.0%, rgb(223, 105, 105) 100.0%);
   --on-light-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(147, 203, 146) 0.0%, rgb(115, 179, 114) 100.0%);
   --inverse-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
   --on-light-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(179, 49, 208) 8.0%, rgb(109, 78, 223) 56.0%, rgb(31, 185, 224) 100.0%);
   --light-background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
   --surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
-  --overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
-  --on-dark-overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
+  --overlay-gradient: linear-gradient(180.00deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
+  --on-dark-overlay-gradient: linear-gradient(180.00deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%);
+  --on-light-outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.16) 36.746%, rgba(255, 255, 255, 0.16) 66.734%, rgba(255, 255, 255, 0.8) 100%);
   --background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
   --on-dark-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
   --inverse-surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
-  --on-light-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
   --surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
-  --inverse-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
+  --inverse-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(26, 158, 127) 0.0%, rgb(3, 135, 104) 100.0%);
   --personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
-  --inverse-outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.6) 100.0%);
+  --inverse-outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.16) 36.746%, rgba(255, 255, 255, 0.16) 66.734%, rgba(255, 255, 255, 0.6) 100%);
   --on-light-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(225, 157, 237) 0.0%, rgb(198, 122, 212) 100.0%);
   --personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(225, 157, 237) 0.0%, rgb(198, 122, 212) 100.0%);
-  --on-dark-outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.6) 100.0%);
+  --on-dark-outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.16) 36.746%, rgba(255, 255, 255, 0.16) 66.734%, rgba(255, 255, 255, 0.6) 100%);
   --inverse-personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
   --on-light-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(153, 215, 217) 0.0%, rgb(116, 198, 200) 100.0%);
   --inverse-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
@@ -717,10 +716,11 @@
   --personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(189, 145, 245) 0.0%, rgb(161, 117, 217) 100.0%);
   --text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(179, 49, 208) 8.0%, rgb(109, 78, 223) 56.0%, rgb(31, 185, 224) 100.0%);
   --on-dark-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
-  --personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
+  --personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 179, 242) 0.0%, rgb(93, 153, 219) 100.0%);
   --inverse-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
   --on-light-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
   --on-light-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
+  --on-light-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
   --on-dark-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
   --surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
   --surface-accent-minor-gradient: linear-gradient(133.15deg, rgb(193, 234, 207) 0%, rgb(160, 222, 207) 100.0%);
@@ -734,24 +734,23 @@
 
 :root {
   --shadow-down-hard-s: 0rem 0.25rem 0.75rem -0.1875rem #08080829, 0rem 0.0625rem 0.25rem -0.125rem #00000014;
-  --shadow-down-soft-l: 0rem 3.75rem 7rem -0.5rem #00000014;
   --shadow-down-soft-s: 0rem 0.25rem 0.875rem -0.25rem #08080814, 0rem 0.0625rem 0.25rem -0.0625rem #0000000A;
   --shadow-down-soft-m: 0rem 1.5rem 3rem -0.5rem #00000014;
+  --shadow-down-soft-l: 0rem 3.75rem 7rem -0.5rem #00000014;
   --shadow-down-hard-m: 0rem 1rem 2rem -0.5rem #0000003D;
   --shadow-down-hard-l: 0rem 3.75rem 7rem -0.5rem #00000066;
-  --shadow-up-hard-s: 0rem -0.25rem 0.75rem -0.1875rem #08080833, 0rem -0.0625rem 0.25rem -0.0625rem #00000008;
   --shadow-up-hard-m: 0rem -1rem 2rem -0.5rem #0000003D;
   --shadow-up-hard-l: 0rem -3.75rem 7rem -0.5rem #00000066;
   --shadow-up-soft-s: 0rem -0.25rem 0.875rem -0.25rem #08080814, 0rem -0.0625rem 0.25rem -0.0625rem #00000008;
   --shadow-up-soft-m: 0rem -1.5rem 3rem -0.5rem #00000014;
   --shadow-up-soft-l: 0rem -3.75rem 7rem -0.5rem #00000014;
+  --shadow-up-hard-s: 0rem -0.25rem 0.75rem -0.1875rem #08080833, 0rem -0.0625rem 0.25rem -0.0625rem #00000008;
 }
 
 :root {
   --border-radius-4xl: 2rem;
-  --border-radius-5xl: 2.5rem;
   --border-radius-3xl: 1.75rem;
-  --border-radius-xxs: 0.25rem;
+  --border-radius-5xl: 2.5rem;
   --border-radius-xs: 0.375rem;
   --border-radius-xxl: 1.5rem;
   --border-radius-s: 0.5rem;
@@ -759,11 +758,11 @@
   --border-radius-circle: 100rem;
   --border-radius-m: 0.75rem;
   --border-radius-l: 1rem;
+  --border-radius-xxs: 0.25rem;
 }
 
 :root {
   --spacing-16x: 2rem;
-  --spacing-10x: 1.25rem;
   --spacing-12x: 1.5rem;
   --spacing-20x: 2.5rem;
   --spacing-24x: 3rem;
@@ -777,6 +776,7 @@
   --spacing-3x: 0.375rem;
   --spacing-6x: 0.75rem;
   --spacing-8x: 1rem;
+  --spacing-10x: 1.25rem;
 }
 
 :root {
@@ -793,9 +793,6 @@
   --plasma-typo-h2-medium-font-family: var(--plasma-typo-display-font-family);
   --plasma-typo-h2-medium-letter-spacing: normal;
   --plasma-typo-h2-medium-font-style: normal;
-  --plasma-typo-dspl-s-font-family: var(--plasma-typo-display-font-family);
-  --plasma-typo-dspl-s-letter-spacing: normal;
-  --plasma-typo-dspl-s-font-style: normal;
   --plasma-typo-dspl-s-bold-font-family: var(--plasma-typo-display-font-family);
   --plasma-typo-dspl-s-bold-letter-spacing: normal;
   --plasma-typo-dspl-s-bold-font-style: normal;
@@ -829,6 +826,9 @@
   --plasma-typo-h4-font-family: var(--plasma-typo-display-font-family);
   --plasma-typo-h4-letter-spacing: normal;
   --plasma-typo-h4-font-style: normal;
+  --plasma-typo-dspl-s-font-family: var(--plasma-typo-display-font-family);
+  --plasma-typo-dspl-s-letter-spacing: normal;
+  --plasma-typo-dspl-s-font-style: normal;
   --plasma-typo-h4-bold-font-family: var(--plasma-typo-display-font-family);
   --plasma-typo-h4-bold-letter-spacing: normal;
   --plasma-typo-h4-bold-font-style: normal;
@@ -923,9 +923,6 @@
     --plasma-typo-h2-medium-font-size: 1.375rem;
     --plasma-typo-h2-medium-font-weight: 500;
     --plasma-typo-h2-medium-line-height: 1.75rem;
-    --plasma-typo-dspl-s-font-size: 2.125rem;
-    --plasma-typo-dspl-s-font-weight: 400;
-    --plasma-typo-dspl-s-line-height: 2.5625rem;
     --plasma-typo-dspl-s-bold-font-size: 2.125rem;
     --plasma-typo-dspl-s-bold-font-weight: 700;
     --plasma-typo-dspl-s-bold-line-height: 2.5625rem;
@@ -959,6 +956,9 @@
     --plasma-typo-h4-font-size: 1rem;
     --plasma-typo-h4-font-weight: 400;
     --plasma-typo-h4-line-height: 1.25rem;
+    --plasma-typo-dspl-s-font-size: 2.125rem;
+    --plasma-typo-dspl-s-font-weight: 400;
+    --plasma-typo-dspl-s-line-height: 2.5625rem;
     --plasma-typo-h4-bold-font-size: 1rem;
     --plasma-typo-h4-bold-font-weight: 700;
     --plasma-typo-h4-bold-line-height: 1.25rem;
@@ -1138,6 +1138,15 @@
     --plasma-typo-body-xxs-medium-font-size: 0.6875rem;
     --plasma-typo-body-xxs-medium-font-weight: 500;
     --plasma-typo-body-xxs-medium-line-height: 0.8125rem;
+    --plasma-typo-text-l-font-size: 1.25rem;
+    --plasma-typo-text-l-font-weight: 400;
+    --plasma-typo-text-l-line-height: 1.75rem;
+    --plasma-typo-text-l-bold-font-size: 1.25rem;
+    --plasma-typo-text-l-bold-font-weight: 600;
+    --plasma-typo-text-l-bold-line-height: 1.75rem;
+    --plasma-typo-text-l-medium-font-size: 1.25rem;
+    --plasma-typo-text-l-medium-font-weight: 500;
+    --plasma-typo-text-l-medium-line-height: 1.75rem;
     --plasma-typo-text-m-bold-font-size: 1rem;
     --plasma-typo-text-m-bold-font-weight: 600;
     --plasma-typo-text-m-bold-line-height: 1.5rem;
@@ -1165,15 +1174,6 @@
     --plasma-typo-text-m-font-size: 1rem;
     --plasma-typo-text-m-font-weight: 400;
     --plasma-typo-text-m-line-height: 1.5rem;
-    --plasma-typo-text-l-font-size: 1.25rem;
-    --plasma-typo-text-l-font-weight: 400;
-    --plasma-typo-text-l-line-height: 1.75rem;
-    --plasma-typo-text-l-bold-font-size: 1.25rem;
-    --plasma-typo-text-l-bold-font-weight: 600;
-    --plasma-typo-text-l-bold-line-height: 1.75rem;
-    --plasma-typo-text-l-medium-font-size: 1.25rem;
-    --plasma-typo-text-l-medium-font-weight: 500;
-    --plasma-typo-text-l-medium-line-height: 1.75rem;
   }
 }
 
@@ -1188,6 +1188,15 @@
     --plasma-typo-dspl-s-medium-font-size: 2.125rem;
     --plasma-typo-dspl-s-medium-font-weight: 500;
     --plasma-typo-dspl-s-medium-line-height: 2.5625rem;
+    --plasma-typo-h3-bold-font-size: 1.25rem;
+    --plasma-typo-h3-bold-font-weight: 700;
+    --plasma-typo-h3-bold-line-height: 1.4375rem;
+    --plasma-typo-h3-medium-font-size: 1.25rem;
+    --plasma-typo-h3-medium-font-weight: 500;
+    --plasma-typo-h3-medium-line-height: 1.4375rem;
+    --plasma-typo-h4-font-size: 1.25rem;
+    --plasma-typo-h4-font-weight: 400;
+    --plasma-typo-h4-line-height: 1.625rem;
     --plasma-typo-h4-bold-font-size: 1rem;
     --plasma-typo-h4-bold-font-weight: 700;
     --plasma-typo-h4-bold-line-height: 1.25rem;
@@ -1239,21 +1248,6 @@
     --plasma-typo-h3-font-size: 1.25rem;
     --plasma-typo-h3-font-weight: 400;
     --plasma-typo-h3-line-height: 1.4375rem;
-    --plasma-typo-h3-bold-font-size: 1.25rem;
-    --plasma-typo-h3-bold-font-weight: 700;
-    --plasma-typo-h3-bold-line-height: 1.4375rem;
-    --plasma-typo-h3-medium-font-size: 1.25rem;
-    --plasma-typo-h3-medium-font-weight: 500;
-    --plasma-typo-h3-medium-line-height: 1.4375rem;
-    --plasma-typo-h4-font-size: 1.25rem;
-    --plasma-typo-h4-font-weight: 400;
-    --plasma-typo-h4-line-height: 1.625rem;
-    --plasma-typo-text-l-font-size: 1.5rem;
-    --plasma-typo-text-l-font-weight: 400;
-    --plasma-typo-text-l-line-height: 2rem;
-    --plasma-typo-text-l-bold-font-size: 1.5rem;
-    --plasma-typo-text-l-bold-font-weight: 600;
-    --plasma-typo-text-l-bold-line-height: 2rem;
     --plasma-typo-text-xs-font-size: 0.75rem;
     --plasma-typo-text-xs-font-weight: 400;
     --plasma-typo-text-xs-line-height: 1rem;
@@ -1305,5 +1299,11 @@
     --plasma-typo-body-xxs-medium-font-size: 0.625rem;
     --plasma-typo-body-xxs-medium-font-weight: 500;
     --plasma-typo-body-xxs-medium-line-height: 0.75rem;
+    --plasma-typo-text-l-font-size: 1.5rem;
+    --plasma-typo-text-l-font-weight: 400;
+    --plasma-typo-text-l-line-height: 2rem;
+    --plasma-typo-text-l-bold-font-size: 1.5rem;
+    --plasma-typo-text-l-bold-font-weight: 600;
+    --plasma-typo-text-l-bold-line-height: 2rem;
   }
 }

package/es/components/Button/Button.config.js

@@ -1,4 +1,4 @@
-import './Button.config_1nf8fsa.css';
+import './Button.config_1b1uwtc.css';
 var config = {
   defaults: {
     view: 'default',
@@ -7,9 +7,9 @@ var config = {
   },
   variations: {
     view: {
-      "default": "d1fnkof5",
-      clear: "c1129msw",
-      accent: "abaqjet",
+      clear: "c1fnkof5",
+      accent: "a1129msw",
+      "default": "dbaqjet",
       secondary: "smxfxlw"
     },
     size: {

package/es/components/Button/Button.config.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.config.js","sources":["../../../src-css/components/Button/Button.config.ts"],"sourcesContent":["import { css, buttonTokens } from '@salutejs/plasma-new-hope';\n\nexport const config = {\n    defaults: {\n        view: 'default',\n        size: 'm',\n        shape: 'rounded',\n    },\n    variations: {\n        view: {\n            default: css`\n                ${buttonTokens.buttonValueColor}: var(--inverse-text-secondary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-solid-default);\n                ${buttonTokens.buttonColor}: var(--inverse-text-primary);\n                ${buttonTokens.buttonSpinnerColor}: var(--inverse-text-primary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-solid-default);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-solid-default-hover);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-solid-default-active);\n            `,\n            clear: css`\n                ${buttonTokens.buttonSpinnerColor}: var(--text-primary);\n                ${buttonTokens.buttonValueColor}: var(--text-secondary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-clear);\n                ${buttonTokens.buttonColor}: var(--text-primary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-clear);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-transparent-secondary-hover);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-transparent-secondary-active);\n            `,\n            accent: css`\n                ${buttonTokens.buttonSpinnerColor}: var(--on-dark-text-primary);\n                ${buttonTokens.buttonValueColor}: var(--on-dark-text-secondary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-accent);\n                ${buttonTokens.buttonColor}: var(--on-dark-text-primary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-accent);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-accent-active);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-accent-hover);\n            `,\n            secondary: css`\n                ${buttonTokens.buttonValueColor}: var(--text-secondary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-transparent-secondary);\n                ${buttonTokens.buttonSpinnerColor}: var(--text-primary);\n                ${buttonTokens.buttonColor}: var(--text-primary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-transparent-secondary);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-transparent-secondary-hover);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-transparent-secondary-active);\n            `,\n        },\n        size: {\n            l: css`\n                ${buttonTokens.buttonWidth}: 12.5rem;\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-l-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-l-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-l-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-l-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-l-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-l-bold-line-height);\n                ${buttonTokens.buttonLeftContentMargin}: 0.5rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.5rem;\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonRadius}: var(--border-radius-l);\n                ${buttonTokens.buttonSpinnerSize}: 1.375rem;\n                ${buttonTokens.buttonHeight}: 3.5rem;\n                ${buttonTokens.buttonPadding}: 1.5rem;\n            `,\n            xl: css`\n                ${buttonTokens.buttonRadius}: var(--border-radius-l);\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonHeight}: 4rem;\n                ${buttonTokens.buttonLeftContentMargin}: 0.625rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.625rem;\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-l-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-l-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-l-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-l-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-l-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-l-bold-line-height);\n                ${buttonTokens.buttonPadding}: 1.75rem;\n                ${buttonTokens.buttonWidth}: 12.5rem;\n                ${buttonTokens.buttonSpinnerSize}: 1.5rem;\n            `,\n            m: css`\n                ${buttonTokens.buttonSpinnerSize}: 1.375rem;\n                ${buttonTokens.buttonHeight}: 3rem;\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonLeftContentMargin}: 0.375rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.375rem;\n                ${buttonTokens.buttonWidth}: 11.25rem;\n                ${buttonTokens.buttonPadding}: 1.25rem;\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-m-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-m-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-m-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-m-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-m-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-m-bold-line-height);\n                ${buttonTokens.buttonRadius}: var(--border-radius-m);\n            `,\n        },\n        shape: {\n            pilled: css`\n                ${buttonTokens.buttonRadius}: var(--border-radius-circle);\n            `,\n            rounded: css``,\n        },\n    },\n    invariants: css`\n        ${buttonTokens.buttonFocusColor}: var(--text-accent);\n        ${buttonTokens.buttonDisabledOpacity}: 0.4;\n    `,\n};\n"],"names":["config","defaults","view","size","shape","variations","default","clear","accent","secondary","l","xl","m","pilled","rounded","invariants"],"mappings":"AAEO,IAAMA,MAAM,GAAG;AAClBC,EAAAA,QAAQ,EAAE;AACNC,IAAAA,IAAI,EAAE,SAAS;AACfC,IAAAA,IAAI,EAAE,GAAG;AACTC,IAAAA,KAAK,EAAE,SAAA;GACV;AACDC,EAAAA,UAAU,EAAE;AACRH,IAAAA,IAAI,EAAE;AACFI,MAAAA,SAAAA,EAQC,UAAA;AACDC,MAAAA,KAAK,EAQJ,UAAA;AACDC,MAAAA,MAAM,EAQL,SAAA;AACDC,MAAAA,SAAS,EAAA,SAAA;KASZ;AACDN,IAAAA,IAAI,EAAE;AACFO,MAAAA,CAAC,EAeA,SAAA;AACDC,MAAAA,EAAE,EAeD,SAAA;AACDC,MAAAA,CAAC,EAAA,UAAA;KAgBJ;AACDR,IAAAA,KAAK,EAAE;AACHS,MAAAA,MAAM,EAEL,SAAA;AACDC,MAAAA,OAAO,EAAA,UAAA;AACX,KAAA;GACH;AACDC,EAAAA,UAAU,EAAA,UAAA;AAId;;;;"}
+{"version":3,"file":"Button.config.js","sources":["../../../src-css/components/Button/Button.config.ts"],"sourcesContent":["import { css, buttonTokens } from '@salutejs/plasma-new-hope';\n\nexport const config = {\n    defaults: {\n        view: 'default',\n        size: 'm',\n        shape: 'rounded',\n    },\n    variations: {\n        view: {\n            clear: css`\n                ${buttonTokens.buttonSpinnerColor}: var(--text-primary);\n                ${buttonTokens.buttonColor}: var(--text-primary);\n                ${buttonTokens.buttonValueColor}: var(--text-secondary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-clear);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-clear);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-transparent-secondary-hover);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-transparent-secondary-active);\n            `,\n            accent: css`\n                ${buttonTokens.buttonValueColor}: var(--on-dark-text-secondary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-accent);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-accent-active);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-accent-hover);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-accent);\n                ${buttonTokens.buttonSpinnerColor}: var(--on-dark-text-primary);\n                ${buttonTokens.buttonColor}: var(--on-dark-text-primary);\n            `,\n            default: css`\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-solid-default);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-solid-default);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-solid-default-hover);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-solid-default-active);\n                ${buttonTokens.buttonColor}: var(--inverse-text-primary);\n                ${buttonTokens.buttonValueColor}: var(--inverse-text-secondary);\n                ${buttonTokens.buttonSpinnerColor}: var(--inverse-text-primary);\n            `,\n            secondary: css`\n                ${buttonTokens.buttonValueColor}: var(--text-secondary);\n                ${buttonTokens.buttonColor}: var(--text-primary);\n                ${buttonTokens.buttonLoadingBackgroundColor}: var(--surface-transparent-secondary);\n                ${buttonTokens.buttonBackgroundColor}: var(--surface-transparent-secondary);\n                ${buttonTokens.buttonBackgroundColorActive}: var(--surface-transparent-secondary-active);\n                ${buttonTokens.buttonBackgroundColorHover}: var(--surface-transparent-secondary-hover);\n                ${buttonTokens.buttonSpinnerColor}: var(--text-primary);\n            `,\n        },\n        size: {\n            l: css`\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-l-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-l-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-l-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-l-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-l-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-l-bold-line-height);\n                ${buttonTokens.buttonWidth}: 12.5rem;\n                ${buttonTokens.buttonLeftContentMargin}: 0.5rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.5rem;\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonRadius}: var(--border-radius-l);\n                ${buttonTokens.buttonSpinnerSize}: 1.375rem;\n                ${buttonTokens.buttonHeight}: 3.5rem;\n                ${buttonTokens.buttonPadding}: 1.5rem;\n            `,\n            xl: css`\n                ${buttonTokens.buttonHeight}: 4rem;\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-l-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-l-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-l-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-l-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-l-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-l-bold-line-height);\n                ${buttonTokens.buttonWidth}: 12.5rem;\n                ${buttonTokens.buttonLeftContentMargin}: 0.625rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.625rem;\n                ${buttonTokens.buttonRadius}: var(--border-radius-l);\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonPadding}: 1.75rem;\n                ${buttonTokens.buttonSpinnerSize}: 1.5rem;\n            `,\n            m: css`\n                ${buttonTokens.buttonSpinnerSize}: 1.375rem;\n                ${buttonTokens.buttonLeftContentMargin}: 0.375rem;\n                ${buttonTokens.buttonRightContentMargin}: 0.375rem;\n                ${buttonTokens.buttonPadding}: 1.25rem;\n                ${buttonTokens.buttonFontFamily}: var(--plasma-typo-body-m-bold-font-family);\n                ${buttonTokens.buttonFontSize}: var(--plasma-typo-body-m-bold-font-size);\n                ${buttonTokens.buttonFontStyle}: var(--plasma-typo-body-m-bold-font-style);\n                ${buttonTokens.buttonFontWeight}: var(--plasma-typo-body-m-bold-font-weight);\n                ${buttonTokens.buttonLetterSpacing}: var(--plasma-typo-body-m-bold-letter-spacing);\n                ${buttonTokens.buttonLineHeight}: var(--plasma-typo-body-m-bold-line-height);\n                ${buttonTokens.buttonHeight}: 3rem;\n                ${buttonTokens.buttonValueMargin}: 0.125rem;\n                ${buttonTokens.buttonWidth}: 11.25rem;\n                ${buttonTokens.buttonRadius}: var(--border-radius-m);\n            `,\n        },\n        shape: {\n            pilled: css`\n                ${buttonTokens.buttonRadius}: var(--border-radius-circle);\n            `,\n            rounded: css``,\n        },\n    },\n    invariants: css`\n        ${buttonTokens.buttonFocusColor}: var(--text-accent);\n        ${buttonTokens.buttonDisabledOpacity}: 0.4;\n    `,\n};\n"],"names":["config","defaults","view","size","shape","variations","clear","accent","default","secondary","l","xl","m","pilled","rounded","invariants"],"mappings":"AAEO,IAAMA,MAAM,GAAG;AAClBC,EAAAA,QAAQ,EAAE;AACNC,IAAAA,IAAI,EAAE,SAAS;AACfC,IAAAA,IAAI,EAAE,GAAG;AACTC,IAAAA,KAAK,EAAE,SAAA;GACV;AACDC,EAAAA,UAAU,EAAE;AACRH,IAAAA,IAAI,EAAE;AACFI,MAAAA,KAAK,EAQJ,UAAA;AACDC,MAAAA,MAAM,EAQL,UAAA;AACDC,MAAAA,SAAAA,EAQC,SAAA;AACDC,MAAAA,SAAS,EAAA,SAAA;KASZ;AACDN,IAAAA,IAAI,EAAE;AACFO,MAAAA,CAAC,EAeA,SAAA;AACDC,MAAAA,EAAE,EAeD,SAAA;AACDC,MAAAA,CAAC,EAAA,UAAA;KAgBJ;AACDR,IAAAA,KAAK,EAAE;AACHS,MAAAA,MAAM,EAEL,SAAA;AACDC,MAAAA,OAAO,EAAA,UAAA;AACX,KAAA;GACH;AACDC,EAAAA,UAAU,EAAA,UAAA;AAId;;;;"}

package/es/components/Button/Button.config_1b1uwtc.css

@@ -0,0 +1,10 @@
+.c1fnkof5{--plasma-button-spinner-color:var(--text-primary);--plasma-button-color:var(--text-primary);--plasma-button-value-color:var(--text-secondary);--plasma-button-loading-background-color:var(--surface-clear);--plasma-button-background-color:var(--surface-clear);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);}
+.a1129msw{--plasma-button-value-color:var(--on-dark-text-secondary);--plasma-button-background-color:var(--surface-accent);--plasma-button-background-color-active:var(--surface-accent-active);--plasma-button-background-color-hover:var(--surface-accent-hover);--plasma-button-loading-background-color:var(--surface-accent);--plasma-button-spinner-color:var(--on-dark-text-primary);--plasma-button-color:var(--on-dark-text-primary);}
+.dbaqjet{--plasma-button-loading-background-color:var(--surface-solid-default);--plasma-button-background-color:var(--surface-solid-default);--plasma-button-background-color-hover:var(--surface-solid-default-hover);--plasma-button-background-color-active:var(--surface-solid-default-active);--plasma-button-color:var(--inverse-text-primary);--plasma-button-value-color:var(--inverse-text-secondary);--plasma-button-spinner-color:var(--inverse-text-primary);}
+.smxfxlw{--plasma-button-value-color:var(--text-secondary);--plasma-button-color:var(--text-primary);--plasma-button-loading-background-color:var(--surface-transparent-secondary);--plasma-button-background-color:var(--surface-transparent-secondary);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-spinner-color:var(--text-primary);}
+.lleczrv{--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-width:12.5rem;--plasma-button-left-content-margin:0.5rem;--plasma-button-right-content-margin:0.5rem;--plasma-button-value-margin:0.125rem;--plasma-button-radius:var(--border-radius-l);--plasma-button-spinner-size:1.375rem;--plasma-button-height:3.5rem;--plasma-button-padding:1.5rem;}
+.xlekduy{--plasma-button-height:4rem;--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-width:12.5rem;--plasma-button-left-content-margin:0.625rem;--plasma-button-right-content-margin:0.625rem;--plasma-button-radius:var(--border-radius-l);--plasma-button-value-margin:0.125rem;--plasma-button-padding:1.75rem;--plasma-button-spinner-size:1.5rem;}
+.m1yfa47j{--plasma-button-spinner-size:1.375rem;--plasma-button-left-content-margin:0.375rem;--plasma-button-right-content-margin:0.375rem;--plasma-button-padding:1.25rem;--plasma-button-font-family:var(--plasma-typo-body-m-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-m-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-m-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-m-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-m-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-m-bold-line-height);--plasma-button-height:3rem;--plasma-button-value-margin:0.125rem;--plasma-button-width:11.25rem;--plasma-button-radius:var(--border-radius-m);}
+.psb1lec{--plasma-button-radius:var(--border-radius-circle);}
+
+.i1w797f8{--plasma-button-focus-color:var(--text-accent);--plasma-button-disabled-opacity:0.4;}

package/es/components/Button/Button.css

@@ -1,10 +1,10 @@
-.Button_config_1nf8fsa_d1fnkof5__4634ce1d{--plasma-button-value-color:var(--inverse-text-secondary);--plasma-button-loading-background-color:var(--surface-solid-default);--plasma-button-color:var(--inverse-text-primary);--plasma-button-spinner-color:var(--inverse-text-primary);--plasma-button-background-color:var(--surface-solid-default);--plasma-button-background-color-hover:var(--surface-solid-default-hover);--plasma-button-background-color-active:var(--surface-solid-default-active);}
-.Button_config_1nf8fsa_c1129msw__4634ce1d{--plasma-button-spinner-color:var(--text-primary);--plasma-button-value-color:var(--text-secondary);--plasma-button-loading-background-color:var(--surface-clear);--plasma-button-color:var(--text-primary);--plasma-button-background-color:var(--surface-clear);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);}
-.Button_config_1nf8fsa_abaqjet__4634ce1d{--plasma-button-spinner-color:var(--on-dark-text-primary);--plasma-button-value-color:var(--on-dark-text-secondary);--plasma-button-loading-background-color:var(--surface-accent);--plasma-button-color:var(--on-dark-text-primary);--plasma-button-background-color:var(--surface-accent);--plasma-button-background-color-active:var(--surface-accent-active);--plasma-button-background-color-hover:var(--surface-accent-hover);}
-.Button_config_1nf8fsa_smxfxlw__4634ce1d{--plasma-button-value-color:var(--text-secondary);--plasma-button-loading-background-color:var(--surface-transparent-secondary);--plasma-button-spinner-color:var(--text-primary);--plasma-button-color:var(--text-primary);--plasma-button-background-color:var(--surface-transparent-secondary);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);}
-.Button_config_1nf8fsa_lleczrv__4634ce1d{--plasma-button-width:12.5rem;--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-left-content-margin:0.5rem;--plasma-button-right-content-margin:0.5rem;--plasma-button-value-margin:0.125rem;--plasma-button-radius:var(--border-radius-l);--plasma-button-spinner-size:1.375rem;--plasma-button-height:3.5rem;--plasma-button-padding:1.5rem;}
-.Button_config_1nf8fsa_xlekduy__4634ce1d{--plasma-button-radius:var(--border-radius-l);--plasma-button-value-margin:0.125rem;--plasma-button-height:4rem;--plasma-button-left-content-margin:0.625rem;--plasma-button-right-content-margin:0.625rem;--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-padding:1.75rem;--plasma-button-width:12.5rem;--plasma-button-spinner-size:1.5rem;}
-.Button_config_1nf8fsa_m1yfa47j__4634ce1d{--plasma-button-spinner-size:1.375rem;--plasma-button-height:3rem;--plasma-button-value-margin:0.125rem;--plasma-button-left-content-margin:0.375rem;--plasma-button-right-content-margin:0.375rem;--plasma-button-width:11.25rem;--plasma-button-padding:1.25rem;--plasma-button-font-family:var(--plasma-typo-body-m-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-m-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-m-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-m-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-m-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-m-bold-line-height);--plasma-button-radius:var(--border-radius-m);}
-.Button_config_1nf8fsa_psb1lec__4634ce1d{--plasma-button-radius:var(--border-radius-circle);}
+.Button_config_1b1uwtc_c1fnkof5__b2dcb155{--plasma-button-spinner-color:var(--text-primary);--plasma-button-color:var(--text-primary);--plasma-button-value-color:var(--text-secondary);--plasma-button-loading-background-color:var(--surface-clear);--plasma-button-background-color:var(--surface-clear);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);}
+.Button_config_1b1uwtc_a1129msw__b2dcb155{--plasma-button-value-color:var(--on-dark-text-secondary);--plasma-button-background-color:var(--surface-accent);--plasma-button-background-color-active:var(--surface-accent-active);--plasma-button-background-color-hover:var(--surface-accent-hover);--plasma-button-loading-background-color:var(--surface-accent);--plasma-button-spinner-color:var(--on-dark-text-primary);--plasma-button-color:var(--on-dark-text-primary);}
+.Button_config_1b1uwtc_dbaqjet__b2dcb155{--plasma-button-loading-background-color:var(--surface-solid-default);--plasma-button-background-color:var(--surface-solid-default);--plasma-button-background-color-hover:var(--surface-solid-default-hover);--plasma-button-background-color-active:var(--surface-solid-default-active);--plasma-button-color:var(--inverse-text-primary);--plasma-button-value-color:var(--inverse-text-secondary);--plasma-button-spinner-color:var(--inverse-text-primary);}
+.Button_config_1b1uwtc_smxfxlw__b2dcb155{--plasma-button-value-color:var(--text-secondary);--plasma-button-color:var(--text-primary);--plasma-button-loading-background-color:var(--surface-transparent-secondary);--plasma-button-background-color:var(--surface-transparent-secondary);--plasma-button-background-color-active:var(--surface-transparent-secondary-active);--plasma-button-background-color-hover:var(--surface-transparent-secondary-hover);--plasma-button-spinner-color:var(--text-primary);}
+.Button_config_1b1uwtc_lleczrv__b2dcb155{--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-width:12.5rem;--plasma-button-left-content-margin:0.5rem;--plasma-button-right-content-margin:0.5rem;--plasma-button-value-margin:0.125rem;--plasma-button-radius:var(--border-radius-l);--plasma-button-spinner-size:1.375rem;--plasma-button-height:3.5rem;--plasma-button-padding:1.5rem;}
+.Button_config_1b1uwtc_xlekduy__b2dcb155{--plasma-button-height:4rem;--plasma-button-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-l-bold-line-height);--plasma-button-width:12.5rem;--plasma-button-left-content-margin:0.625rem;--plasma-button-right-content-margin:0.625rem;--plasma-button-radius:var(--border-radius-l);--plasma-button-value-margin:0.125rem;--plasma-button-padding:1.75rem;--plasma-button-spinner-size:1.5rem;}
+.Button_config_1b1uwtc_m1yfa47j__b2dcb155{--plasma-button-spinner-size:1.375rem;--plasma-button-left-content-margin:0.375rem;--plasma-button-right-content-margin:0.375rem;--plasma-button-padding:1.25rem;--plasma-button-font-family:var(--plasma-typo-body-m-bold-font-family);--plasma-button-font-size:var(--plasma-typo-body-m-bold-font-size);--plasma-button-font-style:var(--plasma-typo-body-m-bold-font-style);--plasma-button-font-weight:var(--plasma-typo-body-m-bold-font-weight);--plasma-button-letter-spacing:var(--plasma-typo-body-m-bold-letter-spacing);--plasma-button-line-height:var(--plasma-typo-body-m-bold-line-height);--plasma-button-height:3rem;--plasma-button-value-margin:0.125rem;--plasma-button-width:11.25rem;--plasma-button-radius:var(--border-radius-m);}
+.Button_config_1b1uwtc_psb1lec__b2dcb155{--plasma-button-radius:var(--border-radius-circle);}
 
-.Button_config_1nf8fsa_i1w797f8__4634ce1d{--plasma-button-focus-color:var(--text-accent);--plasma-button-disabled-opacity:0.4;}
+.Button_config_1b1uwtc_i1w797f8__b2dcb155{--plasma-button-focus-color:var(--text-accent);--plasma-button-disabled-opacity:0.4;}