rsuite 6.0.0-canary-20250622 → 6.0.0-canary-20250702

package/Pagination/styles/index.css

@@ -103,7 +103,7 @@ body{
   --rs-text-highlight-bg:#fff6c9;
   --rs-border-primary:var(--rs-gray-200);
   --rs-bg-overlay:var(--rs-gray-0);
-  --rs-color-focus-ring:rgb(from var(--rs-primary-500) r g b / 25%);
+  --rs-focus-ring-color:rgb(from var(--rs-primary-500) r g b / 25%);
   --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
   --rs-btn-default-bg:var(--rs-gray-50);
   --rs-btn-default-text:var(--rs-gray-800);
@@ -163,7 +163,7 @@ body{
 }
 @supports not (color: rgb(from white r g b)){
   :root{
-    --rs-color-focus-ring:rgba(52, 152, 255, 0.25);
+    --rs-focus-ring-color:rgba(52, 152, 255, 0.25);
     --rs-loader-ring:rgba(247, 247, 250, 0.8);
     --rs-loader-backdrop:rgba(255, 255, 255, 0.9);
     --rs-loader-ring-inverse:rgba(247, 247, 250, 0.3);
@@ -261,7 +261,6 @@ body{
   --rs-text-disabled:var(--rs-gray-400);
   --rs-border-primary:var(--rs-gray-600);
   --rs-bg-overlay:var(--rs-gray-700);
-  --rs-color-focus-ring:0 0 0 2px rgb(from var(--rs-gray-500) r g b / 25%);
   --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
   --rs-btn-default-bg:var(--rs-gray-600);
   --rs-btn-default-text:var(--rs-gray-50);
@@ -320,7 +319,6 @@ body{
 @supports not (color: rgb(from white r g b)){
   [data-theme=dark],
   .rs-theme-dark{
-    --rs-color-focus-ring:0 0 0 2px rgba(52, 195, 255, 0.25);
     --rs-loader-ring:rgba(233, 235, 240, 0.3);
     --rs-loader-backdrop:rgba(15, 19, 26, 0.83);
     --rs-loader-ring-inverse:rgba(233, 235, 240, 0.8);
@@ -419,7 +417,7 @@ body{
   --rs-text-highlight-bg:var(--rs-primary-500);
   --rs-border-primary:var(--rs-gray-100);
   --rs-bg-overlay:var(--rs-gray-800);
-  --rs-color-focus-ring:var(--rs-gray-0);
+  --rs-focus-ring-color:var(--rs-gray-0);
   --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
   --rs-btn-default-bg:transparent;
   --rs-btn-default-text:var(--rs-primary-500);
@@ -520,7 +518,7 @@ body{
   --rs-ripple-bg:rgb(0 0 0 / 20%);
   --rs-zindex-dropdown:5;
   --rs-zindex-picker-toggle:5;
-  --rs-zindex-picker-popup:calc(var(--rs-zindex-picker-toggle) + 2);
+  --rs-zindex-picker-popup:7;
   --rs-zindex-modal:1050;
   --rs-zindex-drawer:1050;
 }
@@ -636,7 +634,7 @@ body{
   --rs-btn-icon-gap:5px;
 }
 
-.rs-btn, .rs-pagination-btn{
+.rs-btn{
   display:inline-flex;
   align-items:center;
   justify-content:center;
@@ -663,43 +661,51 @@ body{
   padding-inline:var(--rs-btn-padding-inline);
   padding-block:var(--rs-btn-padding-block);
 }
-[data-theme=high-contrast] .rs-btn, [data-theme=high-contrast] .rs-pagination-btn, .rs-theme-high-contrast .rs-btn, .rs-theme-high-contrast .rs-pagination-btn{
+[data-theme=high-contrast] .rs-btn, .rs-theme-high-contrast .rs-btn{
   transition:none;
   border-width:1px;
   border-color:var(--rs-btn-default-border-color);
 }
-.rs-btn:focus-visible, .rs-pagination-btn:focus-visible{
-  outline:2px solid var(--rs-color-focus-ring);
+.rs-btn:focus-visible{
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
 }
-.rs-btn:hover, .rs-pagination-btn:hover{
+.rs-btn:hover{
   color:var(--rs-btn-default-hover-text);
   background-color:var(--rs-btn-default-hover-bg);
   text-decoration:none;
 }
-.rs-btn:active, .rs-pagination-btn:active, .rs-btn.rs-btn-active, .rs-btn-active.rs-pagination-btn{
+.rs-btn:active, .rs-btn.rs-btn[data-active=true]{
   color:var(--rs-btn-default-active-text);
   background-color:var(--rs-btn-default-active-bg);
 }
-.rs-btn:disabled, .rs-pagination-btn:disabled, .rs-btn.rs-btn-disabled, .rs-btn-disabled.rs-pagination-btn{
+.rs-btn:disabled, .rs-btn.rs-btn[data-disabled=true]{
   cursor:var(--rs-cursor-disabled);
   color:var(--rs-btn-default-disabled-text);
   background-color:var(--rs-btn-default-disabled-bg);
 }
-[data-theme=high-contrast] .rs-btn:disabled, [data-theme=high-contrast] .rs-pagination-btn:disabled, .rs-theme-high-contrast .rs-btn:disabled, .rs-theme-high-contrast .rs-pagination-btn:disabled, [data-theme=high-contrast] .rs-btn.rs-btn-disabled, [data-theme=high-contrast] .rs-btn-disabled.rs-pagination-btn, .rs-theme-high-contrast .rs-btn.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-disabled.rs-pagination-btn{
+[data-theme=high-contrast] .rs-btn:disabled, .rs-theme-high-contrast .rs-btn:disabled, [data-theme=high-contrast] .rs-btn.rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn.rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
-.rs-btn, .rs-pagination-btn{
+.rs-btn{
   position:relative;
   overflow:hidden;
 }
 @media not all and (min-resolution: 0.001dpcm){
-  .rs-btn, .rs-pagination-btn{
+  .rs-btn{
     -webkit-mask-image:radial-gradient(white, black);
             mask-image:radial-gradient(white, black);
   }
 }
-.rs-btn.rs-btn-lg, .rs-btn-lg.rs-pagination-btn{
+.rs-btn{
+  --rs-btn-size:var(--rs-btn-size-md);
+  --rs-btn-font-size:var(--rs-btn-font-size-md);
+  --rs-btn-line-height:var(--rs-btn-line-height-md);
+  --rs-btn-padding-inline:var(--rs-btn-padding-inline-md);
+  --rs-btn-padding-block:var(--rs-btn-padding-block-md);
+  --rs-btn-icon-size:var(--rs-btn-icon-size-md);
+}
+.rs-btn[data-size=lg]{
   --rs-btn-size:var(--rs-btn-size-lg);
   --rs-btn-font-size:var(--rs-btn-font-size-lg);
   --rs-btn-line-height:var(--rs-btn-line-height-lg);
@@ -707,7 +713,7 @@ body{
   --rs-btn-padding-block:var(--rs-btn-padding-block-lg);
   --rs-btn-icon-size:var(--rs-btn-icon-size-lg);
 }
-.rs-btn.rs-btn-md, .rs-btn-md.rs-pagination-btn{
+.rs-btn[data-size=md]{
   --rs-btn-size:var(--rs-btn-size-md);
   --rs-btn-font-size:var(--rs-btn-font-size-md);
   --rs-btn-line-height:var(--rs-btn-line-height-md);
@@ -715,7 +721,7 @@ body{
   --rs-btn-padding-block:var(--rs-btn-padding-block-md);
   --rs-btn-icon-size:var(--rs-btn-icon-size-md);
 }
-.rs-btn.rs-btn-sm, .rs-btn-sm.rs-pagination-btn{
+.rs-btn[data-size=sm]{
   --rs-btn-size:var(--rs-btn-size-sm);
   --rs-btn-font-size:var(--rs-btn-font-size-sm);
   --rs-btn-line-height:var(--rs-btn-line-height-sm);
@@ -723,7 +729,7 @@ body{
   --rs-btn-padding-block:var(--rs-btn-padding-block-sm);
   --rs-btn-icon-size:var(--rs-btn-icon-size-sm);
 }
-.rs-btn.rs-btn-xs, .rs-btn-xs.rs-pagination-btn{
+.rs-btn[data-size=xs]{
   --rs-btn-size:var(--rs-btn-size-xs);
   --rs-btn-font-size:var(--rs-btn-font-size-xs);
   --rs-btn-line-height:var(--rs-btn-line-height-xs);
@@ -742,101 +748,111 @@ body{
   margin-inline-start:var(--rs-btn-icon-gap);
 }
 
-.rs-btn-primary{
+.rs-btn[data-appearance=primary]{
   color:var(--rs-btn-primary-text);
   background-color:var(--rs-btn-primary-bg);
   border-color:var(--rs-btn-primary-border-color);
 }
-.rs-btn-primary:hover{
+.rs-btn[data-appearance=primary]:hover{
   color:var(--rs-btn-primary-text);
   background-color:var(--rs-btn-primary-hover-bg);
 }
-.rs-btn-primary:active, .rs-btn-primary.rs-btn-active{
+.rs-btn[data-appearance=primary]:active, .rs-btn[data-appearance=primary].rs-btn[data-active=true]{
   color:var(--rs-btn-primary-text);
   background-color:var(--rs-btn-primary-active-bg);
 }
-.rs-btn-primary:disabled, .rs-btn-primary.rs-btn-disabled{
+.rs-btn[data-appearance=primary]:disabled, .rs-btn[data-appearance=primary].rs-btn[data-disabled=true]{
   color:var(--rs-btn-primary-text);
   background-color:var(--rs-btn-primary-bg);
   opacity:0.3;
 }
-[data-theme=high-contrast] .rs-btn-primary:disabled, .rs-theme-high-contrast .rs-btn-primary:disabled, [data-theme=high-contrast] .rs-btn-primary.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-primary.rs-btn-disabled{
+[data-theme=high-contrast] .rs-btn[data-appearance=primary]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=primary]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=primary].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=primary].rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
-.rs-btn-subtle, .rs-pagination-btn{
+.rs-btn[data-appearance=subtle],
+.rs-btn-subtle{
   color:var(--rs-btn-subtle-text);
   background-color:transparent;
 }
-.rs-btn-subtle:hover, .rs-pagination-btn:hover{
+.rs-btn[data-appearance=subtle]:hover,
+.rs-btn-subtle:hover{
   color:var(--rs-btn-subtle-hover-text);
   background-color:var(--rs-btn-subtle-hover-bg);
 }
-.rs-btn-subtle:active, .rs-pagination-btn:active, .rs-btn-subtle.rs-btn-active, .rs-btn-active.rs-pagination-btn{
+.rs-btn[data-appearance=subtle]:active, .rs-btn[data-appearance=subtle].rs-btn[data-active=true],
+.rs-btn-subtle:active,
+.rs-btn-subtle.rs-btn[data-active=true]{
   color:var(--rs-btn-subtle-active-text);
   background-color:var(--rs-btn-subtle-active-bg);
 }
-.rs-btn-subtle:disabled, .rs-pagination-btn:disabled, .rs-btn-subtle.rs-btn-disabled, .rs-btn-disabled.rs-pagination-btn{
+.rs-btn[data-appearance=subtle]:disabled, .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true],
+.rs-btn-subtle:disabled,
+.rs-btn-subtle.rs-btn[data-disabled=true]{
   color:var(--rs-btn-subtle-disabled-text);
   background:none;
 }
-[data-theme=high-contrast] .rs-btn-subtle:disabled, [data-theme=high-contrast] .rs-pagination-btn:disabled, .rs-theme-high-contrast .rs-btn-subtle:disabled, .rs-theme-high-contrast .rs-pagination-btn:disabled, [data-theme=high-contrast] .rs-btn-subtle.rs-btn-disabled, [data-theme=high-contrast] .rs-btn-disabled.rs-pagination-btn, .rs-theme-high-contrast .rs-btn-subtle.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-disabled.rs-pagination-btn{
+[data-theme=high-contrast] .rs-btn[data-appearance=subtle]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=subtle]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true],
+[data-theme=high-contrast] .rs-btn-subtle:disabled,
+.rs-theme-high-contrast .rs-btn-subtle:disabled,
+[data-theme=high-contrast] .rs-btn-subtle.rs-btn[data-disabled=true],
+.rs-theme-high-contrast .rs-btn-subtle.rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
-.rs-btn-link{
+.rs-btn[data-appearance=link]{
   color:var(--rs-btn-link-text);
   background-color:transparent;
 }
-.rs-btn-link:hover{
+.rs-btn[data-appearance=link]:hover{
   color:var(--rs-btn-link-hover-text);
   background-color:transparent;
   -webkit-text-decoration:var(--rs-link-hover-decoration);
           text-decoration:var(--rs-link-hover-decoration);
 }
-.rs-btn-link:active, .rs-btn-link.rs-btn-active{
+.rs-btn[data-appearance=link]:active, .rs-btn[data-appearance=link].rs-btn[data-active=true]{
   color:var(--rs-btn-link-active-text);
   background-color:transparent;
 }
-.rs-btn-link:disabled, .rs-btn-link.rs-btn-disabled{
+.rs-btn[data-appearance=link]:disabled, .rs-btn[data-appearance=link].rs-btn[data-disabled=true]{
   color:var(--rs-btn-link-hover-text);
   background-color:transparent;
   text-decoration:none;
   opacity:0.3;
 }
-[data-theme=high-contrast] .rs-btn-link:disabled, .rs-theme-high-contrast .rs-btn-link:disabled, [data-theme=high-contrast] .rs-btn-link.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-link.rs-btn-disabled{
+[data-theme=high-contrast] .rs-btn[data-appearance=link]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=link]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=link].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=link].rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
-.rs-btn-ghost{
+.rs-btn[data-appearance=ghost]{
   color:var(--rs-btn-ghost-text);
   background-color:transparent;
   border:var(--rs-btn-ghost-border-width) solid var(--rs-btn-ghost-border);
   padding-inline:calc(var(--rs-btn-padding-inline) - var(--rs-btn-ghost-border-width));
 }
-.rs-btn-ghost:hover{
+.rs-btn[data-appearance=ghost]:hover{
   color:var(--rs-btn-ghost-hover-text);
   background-color:transparent;
   border-color:var(--rs-btn-ghost-hover-border);
   box-shadow:0 0 0 1px var(--rs-btn-ghost-hover-border);
 }
-.rs-btn-ghost:active, .rs-btn-ghost.rs-btn-active{
+.rs-btn[data-appearance=ghost]:active, .rs-btn[data-appearance=ghost].rs-btn[data-active=true]{
   color:var(--rs-btn-ghost-active-text);
   background-color:transparent;
   border-color:var(--rs-btn-ghost-active-border);
 }
-.rs-btn-ghost:disabled, .rs-btn-ghost.rs-btn-disabled{
+.rs-btn[data-appearance=ghost]:disabled, .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true]{
   color:var(--rs-btn-ghost-text);
   background-color:transparent;
   opacity:0.3;
   border-color:var(--rs-btn-ghost-border);
   box-shadow:var(--rs-shadow-none);
 }
-[data-theme=high-contrast] .rs-btn-ghost:disabled, .rs-theme-high-contrast .rs-btn-ghost:disabled, [data-theme=high-contrast] .rs-btn-ghost.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-ghost.rs-btn-disabled{
+[data-theme=high-contrast] .rs-btn[data-appearance=ghost]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=ghost]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
-.rs-btn-red{
+.rs-btn[data-color=red]{
   --rs-btn-primary-bg:var(--rs-red-500);
   --rs-btn-primary-hover-bg:var(--rs-red-700);
   --rs-btn-primary-active-bg:var(--rs-red-800);
@@ -858,7 +874,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-red-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-red-900);
 }
-[data-theme=dark] .rs-btn-red, .rs-theme-dark .rs-btn-red{
+[data-theme=dark] .rs-btn[data-color=red], .rs-theme-dark .rs-btn[data-color=red]{
   --rs-btn-primary-bg:var(--rs-red-700);
   --rs-btn-primary-hover-bg:var(--rs-red-500);
   --rs-btn-primary-active-bg:var(--rs-red-400);
@@ -880,7 +896,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-red-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-red-300);
 }
-[data-theme=high-contrast] .rs-btn-red, .rs-theme-high-contrast .rs-btn-red{
+[data-theme=high-contrast] .rs-btn[data-color=red], .rs-theme-high-contrast .rs-btn[data-color=red]{
   --rs-btn-primary-bg:var(--rs-red-700);
   --rs-btn-primary-hover-bg:var(--rs-red-600);
   --rs-btn-primary-active-bg:var(--rs-red-400);
@@ -899,7 +915,7 @@ body{
   --rs-btn-link-active-text:var(--rs-red-200);
 }
 
-.rs-btn-orange{
+.rs-btn[data-color=orange]{
   --rs-btn-primary-bg:var(--rs-orange-500);
   --rs-btn-primary-hover-bg:var(--rs-orange-700);
   --rs-btn-primary-active-bg:var(--rs-orange-800);
@@ -921,7 +937,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-orange-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-orange-900);
 }
-[data-theme=dark] .rs-btn-orange, .rs-theme-dark .rs-btn-orange{
+[data-theme=dark] .rs-btn[data-color=orange], .rs-theme-dark .rs-btn[data-color=orange]{
   --rs-btn-primary-bg:var(--rs-orange-700);
   --rs-btn-primary-hover-bg:var(--rs-orange-500);
   --rs-btn-primary-active-bg:var(--rs-orange-400);
@@ -943,7 +959,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-orange-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-orange-300);
 }
-[data-theme=high-contrast] .rs-btn-orange, .rs-theme-high-contrast .rs-btn-orange{
+[data-theme=high-contrast] .rs-btn[data-color=orange], .rs-theme-high-contrast .rs-btn[data-color=orange]{
   --rs-btn-primary-bg:var(--rs-orange-700);
   --rs-btn-primary-hover-bg:var(--rs-orange-600);
   --rs-btn-primary-active-bg:var(--rs-orange-400);
@@ -962,7 +978,7 @@ body{
   --rs-btn-link-active-text:var(--rs-orange-200);
 }
 
-.rs-btn-yellow{
+.rs-btn[data-color=yellow]{
   --rs-btn-primary-bg:var(--rs-yellow-500);
   --rs-btn-primary-hover-bg:var(--rs-yellow-700);
   --rs-btn-primary-active-bg:var(--rs-yellow-800);
@@ -984,7 +1000,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-yellow-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-yellow-900);
 }
-[data-theme=dark] .rs-btn-yellow, .rs-theme-dark .rs-btn-yellow{
+[data-theme=dark] .rs-btn[data-color=yellow], .rs-theme-dark .rs-btn[data-color=yellow]{
   --rs-btn-primary-bg:var(--rs-yellow-700);
   --rs-btn-primary-hover-bg:var(--rs-yellow-500);
   --rs-btn-primary-active-bg:var(--rs-yellow-400);
@@ -1006,7 +1022,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-yellow-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-yellow-300);
 }
-[data-theme=high-contrast] .rs-btn-yellow, .rs-theme-high-contrast .rs-btn-yellow{
+[data-theme=high-contrast] .rs-btn[data-color=yellow], .rs-theme-high-contrast .rs-btn[data-color=yellow]{
   --rs-btn-primary-bg:var(--rs-yellow-700);
   --rs-btn-primary-hover-bg:var(--rs-yellow-600);
   --rs-btn-primary-active-bg:var(--rs-yellow-400);
@@ -1025,7 +1041,7 @@ body{
   --rs-btn-link-active-text:var(--rs-yellow-200);
 }
 
-.rs-btn-green{
+.rs-btn[data-color=green]{
   --rs-btn-primary-bg:var(--rs-green-500);
   --rs-btn-primary-hover-bg:var(--rs-green-700);
   --rs-btn-primary-active-bg:var(--rs-green-800);
@@ -1047,7 +1063,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-green-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-green-900);
 }
-[data-theme=dark] .rs-btn-green, .rs-theme-dark .rs-btn-green{
+[data-theme=dark] .rs-btn[data-color=green], .rs-theme-dark .rs-btn[data-color=green]{
   --rs-btn-primary-bg:var(--rs-green-700);
   --rs-btn-primary-hover-bg:var(--rs-green-500);
   --rs-btn-primary-active-bg:var(--rs-green-400);
@@ -1069,7 +1085,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-green-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-green-300);
 }
-[data-theme=high-contrast] .rs-btn-green, .rs-theme-high-contrast .rs-btn-green{
+[data-theme=high-contrast] .rs-btn[data-color=green], .rs-theme-high-contrast .rs-btn[data-color=green]{
   --rs-btn-primary-bg:var(--rs-green-700);
   --rs-btn-primary-hover-bg:var(--rs-green-600);
   --rs-btn-primary-active-bg:var(--rs-green-400);
@@ -1088,7 +1104,7 @@ body{
   --rs-btn-link-active-text:var(--rs-green-200);
 }
 
-.rs-btn-cyan{
+.rs-btn[data-color=cyan]{
   --rs-btn-primary-bg:var(--rs-cyan-500);
   --rs-btn-primary-hover-bg:var(--rs-cyan-700);
   --rs-btn-primary-active-bg:var(--rs-cyan-800);
@@ -1110,7 +1126,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-cyan-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-cyan-900);
 }
-[data-theme=dark] .rs-btn-cyan, .rs-theme-dark .rs-btn-cyan{
+[data-theme=dark] .rs-btn[data-color=cyan], .rs-theme-dark .rs-btn[data-color=cyan]{
   --rs-btn-primary-bg:var(--rs-cyan-700);
   --rs-btn-primary-hover-bg:var(--rs-cyan-500);
   --rs-btn-primary-active-bg:var(--rs-cyan-400);
@@ -1132,7 +1148,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-cyan-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-cyan-300);
 }
-[data-theme=high-contrast] .rs-btn-cyan, .rs-theme-high-contrast .rs-btn-cyan{
+[data-theme=high-contrast] .rs-btn[data-color=cyan], .rs-theme-high-contrast .rs-btn[data-color=cyan]{
   --rs-btn-primary-bg:var(--rs-cyan-700);
   --rs-btn-primary-hover-bg:var(--rs-cyan-600);
   --rs-btn-primary-active-bg:var(--rs-cyan-400);
@@ -1151,7 +1167,7 @@ body{
   --rs-btn-link-active-text:var(--rs-cyan-200);
 }
 
-.rs-btn-blue{
+.rs-btn[data-color=blue]{
   --rs-btn-primary-bg:var(--rs-blue-500);
   --rs-btn-primary-hover-bg:var(--rs-blue-700);
   --rs-btn-primary-active-bg:var(--rs-blue-800);
@@ -1173,7 +1189,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-blue-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-blue-900);
 }
-[data-theme=dark] .rs-btn-blue, .rs-theme-dark .rs-btn-blue{
+[data-theme=dark] .rs-btn[data-color=blue], .rs-theme-dark .rs-btn[data-color=blue]{
   --rs-btn-primary-bg:var(--rs-blue-700);
   --rs-btn-primary-hover-bg:var(--rs-blue-500);
   --rs-btn-primary-active-bg:var(--rs-blue-400);
@@ -1195,7 +1211,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-blue-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-blue-300);
 }
-[data-theme=high-contrast] .rs-btn-blue, .rs-theme-high-contrast .rs-btn-blue{
+[data-theme=high-contrast] .rs-btn[data-color=blue], .rs-theme-high-contrast .rs-btn[data-color=blue]{
   --rs-btn-primary-bg:var(--rs-blue-700);
   --rs-btn-primary-hover-bg:var(--rs-blue-600);
   --rs-btn-primary-active-bg:var(--rs-blue-400);
@@ -1214,7 +1230,7 @@ body{
   --rs-btn-link-active-text:var(--rs-blue-200);
 }
 
-.rs-btn-violet{
+.rs-btn[data-color=violet]{
   --rs-btn-primary-bg:var(--rs-violet-500);
   --rs-btn-primary-hover-bg:var(--rs-violet-700);
   --rs-btn-primary-active-bg:var(--rs-violet-800);
@@ -1236,7 +1252,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-violet-800);
   --rs-iconbtn-primary-pressed-addon:var(--rs-violet-900);
 }
-[data-theme=dark] .rs-btn-violet, .rs-theme-dark .rs-btn-violet{
+[data-theme=dark] .rs-btn[data-color=violet], .rs-theme-dark .rs-btn[data-color=violet]{
   --rs-btn-primary-bg:var(--rs-violet-700);
   --rs-btn-primary-hover-bg:var(--rs-violet-500);
   --rs-btn-primary-active-bg:var(--rs-violet-400);
@@ -1258,7 +1274,7 @@ body{
   --rs-iconbtn-primary-activated-addon:var(--rs-violet-400);
   --rs-iconbtn-primary-pressed-addon:var(--rs-violet-300);
 }
-[data-theme=high-contrast] .rs-btn-violet, .rs-theme-high-contrast .rs-btn-violet{
+[data-theme=high-contrast] .rs-btn[data-color=violet], .rs-theme-high-contrast .rs-btn[data-color=violet]{
   --rs-btn-primary-bg:var(--rs-violet-700);
   --rs-btn-primary-hover-bg:var(--rs-violet-600);
   --rs-btn-primary-active-bg:var(--rs-violet-400);
@@ -1277,20 +1293,20 @@ body{
   --rs-btn-link-active-text:var(--rs-violet-200);
 }
 
-.rs-btn-block{
+.rs-btn[data-block=true]{
   width:100%;
 }
-.rs-btn-block + .rs-btn-block{
+.rs-btn[data-block=true] + .rs-btn[data-block=true]{
   margin-top:5px;
 }
 
-.rs-btn-loading{
+.rs-btn[data-loading=true]{
   color:transparent !important;
   position:relative;
   cursor:default;
   pointer-events:none;
 }
-.rs-btn-loading > .rs-btn-spin::before, .rs-btn-loading > .rs-btn-spin::after{
+.rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-btn[data-loading=true] > .rs-btn-spin::after{
   content:"";
   position:absolute;
   width:var(--rs-btn-loading-spin-default-diameter);
@@ -1303,29 +1319,29 @@ body{
   border-radius:var(--rs-radius-full);
   z-index:1;
 }
-.rs-btn-xs .rs-btn-loading > .rs-btn-spin::before, .rs-btn-xs .rs-btn-loading > .rs-btn-spin::after{
+.rs-btn[data-size=xs] .rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-btn[data-size=xs] .rs-btn[data-loading=true] > .rs-btn-spin::after{
   width:var(--rs-btn-loading-spin-xs-diameter);
   height:var(--rs-btn-loading-spin-xs-diameter);
 }
-.rs-btn-loading > .rs-btn-spin::before{
+.rs-btn[data-loading=true] > .rs-btn-spin::before{
   border:var(--rs-btn-loading-spin-ring-wide) solid var(--rs-loader-ring);
 }
-.rs-btn-primary .rs-btn-loading > .rs-btn-spin::before{
+.rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before{
   border-color:rgba(248, 247, 250, 0.3);
 }
-[data-theme=high-contrast] .rs-btn-primary .rs-btn-loading > .rs-btn-spin::before, .rs-theme-high-contrast .rs-btn-primary .rs-btn-loading > .rs-btn-spin::before{
+[data-theme=high-contrast] .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-theme-high-contrast .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before{
   border-color:var(--rs-loader-ring-inverse);
 }
-.rs-btn-loading > .rs-btn-spin::after{
+.rs-btn[data-loading=true] > .rs-btn-spin::after{
   border-width:var(--rs-btn-loading-spin-ring-wide);
   border-color:var(--rs-loader-rotor) transparent transparent;
   border-style:solid;
   animation:buttonSpin 0.6s infinite linear;
 }
-.rs-btn-primary .rs-btn-loading > .rs-btn-spin::after{
+.rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after{
   border-top-color:#fff;
 }
-[data-theme=high-contrast] .rs-btn-primary .rs-btn-loading > .rs-btn-spin::after, .rs-theme-high-contrast .rs-btn-primary .rs-btn-loading > .rs-btn-spin::after{
+[data-theme=high-contrast] .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after, .rs-theme-high-contrast .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after{
   border-top-color:var(--rs-loader-rotor-inverse);
 }
 @keyframes buttonSpin{
@@ -1405,9 +1421,6 @@ body{
   --rs-stack-direction:row;
   --rs-stack-align:center;
   --rs-stack-justify:flex-start;
-  --rs-stack-item-grow:0;
-  --rs-stack-item-shrink:1;
-  --rs-stack-item-basis:auto;
 }
 
 .rs-stack{
@@ -1434,7 +1447,7 @@ body{
   --rs-stack-align:center;
   flex-direction:row-reverse;
 }
-.rs-stack-wrap{
+.rs-stack[data-wrap=true]{
   flex-wrap:wrap;
 }
 .rs-stack-xs-column{
@@ -1520,12 +1533,6 @@ body{
   }
 }
 
-.rs-stack-item{
-  align-self:var(--rs-stack-item-align-self);
-  order:var(--rs-stack-item-order);
-  flex:var(--rs-stack-item-flex, var(--rs-stack-item-grow) var(--rs-stack-item-shrink) var(--rs-stack-item-basis));
-}
-
 :root{
   --rs-loader-duration-fast:0.4s;
   --rs-loader-duration-normal:0.6s;
@@ -1542,7 +1549,7 @@ body{
   --rs-loader-spin-ring-width:3px;
 }
 
-.rs-loader{
+.rs-loader-box{
   display:inline-flex;
   align-items:center;
   justify-content:center;
@@ -1584,34 +1591,34 @@ body{
   height:100%;
   background:var(--rs-loader-backdrop);
 }
-.rs-loader-vertical .rs-loader{
+.rs-loader[data-direction=vertical] .rs-loader-box{
   flex-direction:column;
 }
-.rs-loader-inverse .rs-loader-content{
+.rs-loader[data-inverse=true] .rs-loader-content{
   color:var(--rs-text-inverse);
 }
-.rs-loader-inverse .rs-loader-backdrop{
+.rs-loader[data-inverse=true] .rs-loader-backdrop{
   background:var(--rs-loader-backdrop-inverse);
 }
-.rs-loader-inverse .rs-loader-spin::before{
+.rs-loader[data-inverse=true] .rs-loader-spin::before{
   border-color:var(--rs-loader-ring-inverse);
 }
-.rs-loader-inverse .rs-loader-spin::after{
+.rs-loader[data-inverse=true] .rs-loader-spin::after{
   border-top-color:var(--rs-loader-rotor-inverse);
 }
-.rs-loader-speed-fast .rs-loader-spin::after{
+.rs-loader[data-speed=fast] .rs-loader-spin::after{
   animation-duration:var(--rs-loader-duration-fast);
 }
-.rs-loader-speed-normal .rs-loader-spin::after{
+.rs-loader[data-speed=normal] .rs-loader-spin::after{
   animation-duration:var(--rs-loader-duration-normal);
 }
-.rs-loader-speed-slow .rs-loader-spin::after{
+.rs-loader[data-speed=slow] .rs-loader-spin::after{
   animation-duration:var(--rs-loader-duration-slow);
 }
-.rs-loader-speed-paused .rs-loader-spin::after{
+.rs-loader[data-speed=paused] .rs-loader-spin::after{
   animation-play-state:var(--rs-loader-duration-paused);
 }
-.rs-loader-center{
+.rs-loader[data-center=true]{
   position:absolute;
   top:0;
   bottom:0;
@@ -1624,26 +1631,26 @@ body{
   align-items:center;
   justify-content:center;
 }
-.rs-loader-center .rs-loader-content{
+.rs-loader[data-center=true] .rs-loader-content{
   z-index:1;
 }
 
-.rs-loader-xs{
+.rs-loader[data-size=xs]{
   --rs-loader-size:var(--rs-loader-size-xs);
   --rs-loader-font-size:var(--rs-loader-font-size-xs);
 }
 
-.rs-loader-sm{
+.rs-loader[data-size=sm]{
   --rs-loader-size:var(--rs-loader-size-sm);
   --rs-loader-font-size:var(--rs-loader-font-size-sm);
 }
 
-.rs-loader-md{
+.rs-loader[data-size=md]{
   --rs-loader-size:var(--rs-loader-size-md);
   --rs-loader-font-size:var(--rs-loader-font-size-md);
 }
 
-.rs-loader-lg{
+.rs-loader[data-size=lg]{
   --rs-loader-size:var(--rs-loader-size-lg);
   --rs-loader-font-size:var(--rs-loader-font-size-lg);
 }
@@ -1705,32 +1712,32 @@ body{
   border-color:var(--rs-input-focus-border);
 }
 .rs-input:focus-visible{
-  outline:2px solid var(--rs-color-focus-ring);
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
 }
 .rs-input:disabled{
   background-color:var(--rs-input-disabled-bg);
   color:var(--rs-text-disabled);
 }
-.rs-input.rs-input-xs{
+.rs-input[data-size=xs]{
   --rs-input-font-size:var(--rs-input-font-size-xs);
   --rs-input-line-height:var(--rs-input-line-height-xs);
   --rs-input-padding-block:var(--rs-input-padding-block-xs);
   --rs-input-padding-inline:var(--rs-input-padding-inline-xs);
 }
-.rs-input.rs-input-sm{
+.rs-input[data-size=sm]{
   --rs-input-font-size:var(--rs-input-font-size-sm);
   --rs-input-line-height:var(--rs-input-line-height-sm);
   --rs-input-padding-block:var(--rs-input-padding-block-sm);
   --rs-input-padding-inline:var(--rs-input-padding-inline-sm);
 }
-.rs-input.rs-input-md{
+.rs-input[data-size=md]{
   --rs-input-font-size:var(--rs-input-font-size-md);
   --rs-input-line-height:var(--rs-input-line-height-md);
   --rs-input-padding-block:var(--rs-input-padding-block-md);
   --rs-input-padding-inline:var(--rs-input-padding-inline-md);
 }
-.rs-input.rs-input-lg{
+.rs-input[data-size=lg]{
   --rs-input-font-size:var(--rs-input-font-size-lg);
   --rs-input-line-height:var(--rs-input-line-height-lg);
   --rs-input-padding-block:var(--rs-input-padding-block-lg);
@@ -1770,25 +1777,25 @@ body{
   border:1px solid var(--rs-border-primary);
   overflow:hidden;
 }
-.rs-input-group.rs-input-group-xs{
+.rs-input-group[data-size=xs]{
   --rs-input-group-input-height:var(--rs-input-group-input-height-xs);
   --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-xs);
   --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-xs);
   --rs-input-group-font-size:var(--rs-input-group-font-size-xs);
 }
-.rs-input-group.rs-input-group-sm{
+.rs-input-group[data-size=sm]{
   --rs-input-group-input-height:var(--rs-input-group-input-height-sm);
   --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-sm);
   --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-sm);
   --rs-input-group-font-size:var(--rs-input-group-font-size-sm);
 }
-.rs-input-group.rs-input-group-md{
+.rs-input-group[data-size=md]{
   --rs-input-group-input-height:var(--rs-input-group-input-height-md);
   --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-md);
   --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-md);
   --rs-input-group-font-size:var(--rs-input-group-font-size-md);
 }
-.rs-input-group.rs-input-group-lg{
+.rs-input-group[data-size=lg]{
   --rs-input-group-input-height:var(--rs-input-group-input-height-lg);
   --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-lg);
   --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-lg);
@@ -1797,11 +1804,11 @@ body{
 [data-theme=high-contrast] .rs-input-group, .rs-theme-high-contrast .rs-input-group{
   transition:none;
 }
-.rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus, .rs-input-group:focus-within{
+.rs-input-group:not([data-disabled=true]).rs-input-group-focus, .rs-input-group:focus-within{
   border-color:var(--rs-input-focus-border);
 }
-.rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus, .rs-input-group:focus-within{
-  outline:2px solid var(--rs-color-focus-ring);
+.rs-input-group:not([data-disabled=true]).rs-input-group-focus, .rs-input-group:focus-within{
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
 }
 .rs-input-group .rs-input-group{
@@ -1836,23 +1843,23 @@ body{
 .rs-input-group > .rs-input-group-addon > .rs-icon{
   font-size:inherit;
 }
-.rs-input-group.rs-input-group-inside{
+.rs-input-group[data-inside=true]{
   width:var(--rs-input-group-width);
   align-items:center;
   background-color:var(--rs-input-bg);
 }
-.rs-input-group.rs-input-group-inside .rs-input{
+.rs-input-group[data-inside=true] .rs-input{
   display:block;
   width:100%;
   border:none;
   outline:none;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn,
-.rs-input-group.rs-input-group-inside .rs-input-group-addon{
+.rs-input-group[data-inside=true] .rs-input-group-btn,
+.rs-input-group[data-inside=true] .rs-input-group-addon{
   flex:0 0 auto;
   width:auto;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn{
+.rs-input-group[data-inside=true] .rs-input-group-btn{
   border-radius:var(--rs-input-group-border-radius);
   height:calc(var(--rs-input-group-input-height) - var(--rs-input-group-inside-btn-spacing) * 2);
   margin-inline:var(--rs-input-group-inside-btn-spacing);
@@ -1861,42 +1868,42 @@ body{
   background-color:transparent;
   color:inherit;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:hover{
+.rs-input-group[data-inside=true] .rs-input-group-btn:hover{
   color:var(--rs-btn-subtle-hover-text);
   background-color:var(--rs-btn-subtle-hover-bg);
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:active, .rs-input-group.rs-input-group-inside .rs-input-group-btn.rs-btn-active{
+.rs-input-group[data-inside=true] .rs-input-group-btn:active, .rs-input-group[data-inside=true] .rs-input-group-btn[data-active=true]{
   color:var(--rs-btn-subtle-active-text);
   background-color:var(--rs-btn-subtle-active-bg);
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:disabled, .rs-input-group.rs-input-group-inside .rs-input-group-btn.rs-btn-disabled{
+.rs-input-group[data-inside=true] .rs-input-group-btn:disabled, .rs-input-group[data-inside=true] .rs-input-group-btn[data-disabled=true]{
   color:var(--rs-btn-subtle-disabled-text);
   background:none;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-btn:focus{
+.rs-input-group[data-inside=true] .rs-input-group-btn:focus{
   outline:none;
 }
-.rs-input-group.rs-input-group-inside .rs-input-group-addon{
+.rs-input-group[data-inside=true] .rs-input-group-addon{
   background:none;
   border:none;
 }
-.rs-input-group.rs-input-group-inside .rs-input:not(:first-child),
-.rs-input-group.rs-input-group-inside .rs-auto-complete:not(:first-child) .rs-input{
+.rs-input-group[data-inside=true] .rs-input:not(:first-child),
+.rs-input-group[data-inside=true] .rs-auto-complete:not(:first-child) .rs-input{
   padding-inline-start:0;
 }
-.rs-input-group.rs-input-group-inside .rs-input:not(:last-child),
-.rs-input-group.rs-input-group-inside .rs-auto-complete:not(:last-child) .rs-input{
+.rs-input-group[data-inside=true] .rs-input:not(:last-child),
+.rs-input-group[data-inside=true] .rs-auto-complete:not(:last-child) .rs-input{
   padding-inline-end:0;
 }
 
-.rs-input-group.rs-input-group-disabled{
+.rs-input-group[data-disabled=true]{
   background-color:var(--rs-input-disabled-bg);
   color:var(--rs-text-disabled);
   cursor:not-allowed;
 }
-.rs-input-group.rs-input-group-disabled .rs-input,
-.rs-input-group.rs-input-group-disabled .rs-input-group-btn,
-.rs-input-group.rs-input-group-disabled .rs-input-group-addon{
+.rs-input-group[data-disabled=true] .rs-input,
+.rs-input-group[data-disabled=true] .rs-input-group-btn,
+.rs-input-group[data-disabled=true] .rs-input-group-addon{
   color:inherit;
 }
 
@@ -1916,16 +1923,16 @@ body{
   padding-inline:var(--rs-spacing);
   min-width:var(--rs-input-group-input-height);
 }
-.rs-input-group-addon.rs-input-sm{
+.rs-input-group-addon[data-size=sm]{
   padding-block:var(--rs-spacing-block-sm);
   padding-inline:var(--rs-spacing-inline-sm);
   font-size:var(--rs-font-size-sm);
 }
-.rs-input-group-addon.rs-input-xs{
+.rs-input-group-addon[data-size=xs]{
   padding:var(--rs-spacing-inline-xs);
   font-size:var(--rs-font-size-xs);
 }
-.rs-input-group-addon.rs-input-lg{
+.rs-input-group-addon[data-size=lg]{
   padding-block:var(--rs-spacing-block-lg);
   padding-inline:var(--rs-spacing-inline-lg);
   font-size:var(--rs-font-size-md);
@@ -1960,14 +1967,14 @@ body{
   font-size:var(--rs-btn-icon-size);
   vertical-align:bottom;
 }
-.rs-btn-icon:not(.rs-btn-icon-with-text){
+.rs-btn-icon:not([data-with-text]){
   width:var(--rs-btn-size);
 }
-.rs-btn-icon.rs-btn-icon-circle{
+.rs-btn-icon[data-shape=circle]{
   border-radius:var(--rs-radius-full);
 }
 
-.rs-btn-icon-with-text > .rs-icon{
+.rs-btn-icon[data-with-text] > .rs-icon{
   position:absolute;
   top:0;
   display:block;
@@ -1977,45 +1984,45 @@ body{
   height:var(--rs-btn-size);
   padding:calc((var(--rs-btn-size) - var(--rs-btn-icon-size)) / 2);
 }
-.rs-btn-icon-with-text.rs-btn-icon-placement-left{
+.rs-btn-icon[data-with-text]:where([data-placement=start], [data-placement=left]){
   padding-inline-start:calc(var(--rs-btn-padding-inline) + var(--rs-btn-size));
 }
-.rs-btn-icon-with-text.rs-btn-icon-placement-left > .rs-icon{
+.rs-btn-icon[data-with-text]:where([data-placement=start], [data-placement=left]) > .rs-icon{
   inset-inline-start:0;
   border-right-width:1px;
 }
-.rs-btn-icon-with-text.rs-btn-icon-placement-right{
+.rs-btn-icon[data-with-text]:where([data-placement=end], [data-placement=right]){
   padding-inline-end:calc(var(--rs-btn-padding-inline) + var(--rs-btn-size));
 }
-.rs-btn-icon-with-text.rs-btn-icon-placement-right > .rs-icon{
+.rs-btn-icon[data-with-text]:where([data-placement=end], [data-placement=right]) > .rs-icon{
   inset-inline-end:0;
 }
-.rs-btn-icon-with-text:hover > .rs-icon{
+.rs-btn-icon[data-with-text]:hover > .rs-icon{
   background-color:var(--rs-iconbtn-activated-addon);
 }
-.rs-btn-icon-with-text:active > .rs-icon, .rs-btn-icon-with-text.rs-btn-active > .rs-icon{
+.rs-btn-icon[data-with-text]:active > .rs-icon, .rs-btn-icon[data-with-text].rs-btn[data-active=true] > .rs-icon{
   background-color:var(--rs-iconbtn-pressed-addon);
 }
-.rs-btn-icon-with-text:disabled > .rs-icon, .rs-btn-icon-with-text.rs-btn-disabled > .rs-icon{
+.rs-btn-icon[data-with-text]:disabled > .rs-icon, .rs-btn-icon[data-with-text].rs-btn[data-disabled=true] > .rs-icon{
   background-color:var(--rs-iconbtn-addon);
 }
-[data-theme=high-contrast] .rs-btn-icon-with-text:disabled, .rs-theme-high-contrast .rs-btn-icon-with-text:disabled, [data-theme=high-contrast] .rs-btn-icon-with-text.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-icon-with-text.rs-btn-disabled{
+[data-theme=high-contrast] .rs-btn-icon[data-with-text]:disabled, .rs-theme-high-contrast .rs-btn-icon[data-with-text]:disabled, [data-theme=high-contrast] .rs-btn-icon[data-with-text].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn-icon[data-with-text].rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
-.rs-btn-icon-with-text.rs-btn-primary > .rs-icon{
+.rs-btn-icon[data-with-text][data-appearance=primary] > .rs-icon{
   background-color:var(--rs-iconbtn-primary-addon);
 }
-.rs-btn-icon-with-text.rs-btn-primary:hover > .rs-icon{
+.rs-btn-icon[data-with-text][data-appearance=primary]:hover > .rs-icon{
   background-color:var(--rs-iconbtn-primary-activated-addon);
 }
-.rs-btn-icon-with-text.rs-btn-primary:active > .rs-icon, .rs-btn-icon-with-text.rs-btn-primary.rs-btn-active > .rs-icon{
+.rs-btn-icon[data-with-text][data-appearance=primary]:active > .rs-icon, .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-active=true] > .rs-icon{
   background-color:var(--rs-iconbtn-primary-pressed-addon);
 }
-.rs-btn-icon-with-text.rs-btn-primary:disabled > .rs-icon, .rs-btn-icon-with-text.rs-btn-primary.rs-btn-disabled > .rs-icon{
+.rs-btn-icon[data-with-text][data-appearance=primary]:disabled > .rs-icon, .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true] > .rs-icon{
   background-color:var(--rs-iconbtn-primary-addon);
 }
-[data-theme=high-contrast] .rs-btn-icon-with-text.rs-btn-primary:disabled, .rs-theme-high-contrast .rs-btn-icon-with-text.rs-btn-primary:disabled, [data-theme=high-contrast] .rs-btn-icon-with-text.rs-btn-primary.rs-btn-disabled, .rs-theme-high-contrast .rs-btn-icon-with-text.rs-btn-primary.rs-btn-disabled{
+[data-theme=high-contrast] .rs-btn-icon[data-with-text][data-appearance=primary]:disabled, .rs-theme-high-contrast .rs-btn-icon[data-with-text][data-appearance=primary]:disabled, [data-theme=high-contrast] .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true]{
   border-color:var(--rs-btn-default-disabled-border-color);
 }
 
@@ -2070,7 +2077,7 @@ body{
 .rs-picker-toggle .rs-picker-toggle-placeholder{
   color:var(--rs-text-secondary);
 }
-.rs-picker-has-value .rs-btn .rs-picker-toggle-value, .rs-picker-has-value .rs-pagination-btn .rs-picker-toggle-value, .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value{
+.rs-picker-has-value .rs-btn .rs-picker-toggle-value, .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value{
   color:var(--rs-picker-value);
 }
 .rs-picker-value-list{
@@ -2093,7 +2100,7 @@ body{
 }
 .rs-picker-toggle-active, .rs-picker.rs-picker-focused{
   --rs-picker-toggle-border-color:var(--rs-input-focus-border);
-  outline:2px solid var(--rs-color-focus-ring);
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
 }
 .rs-picker-label.rs-input-group-addon{
@@ -2254,18 +2261,18 @@ body{
   background-color:var(--rs-input-bg);
   outline:none;
 }
-.rs-picker-toggle.rs-btn-lg .rs-picker-toggle-textbox{
+.rs-picker-toggle-textbox:where([readonly]){
+  opacity:0;
+}
+.rs-picker-toggle:where([data-size=lg]) .rs-picker-toggle-textbox{
   padding-inline-start:14px;
 }
-.rs-picker-toggle.rs-btn-sm .rs-picker-toggle-textbox{
+.rs-picker-toggle:where([data-size=sm]) .rs-picker-toggle-textbox{
   padding-inline-start:8px;
 }
-.rs-picker-toggle.rs-btn-xs .rs-picker-toggle-textbox{
+.rs-picker-toggle:where([data-size=xs]) .rs-picker-toggle-textbox{
   padding-inline-start:6px;
 }
-.rs-picker-toggle-read-only{
-  opacity:0;
-}
 .rs-picker-toggle .rs-picker[data-variant=default], .rs-picker-toggle{
   transition:var(--rs-picker-transition);
 }
@@ -2280,22 +2287,10 @@ body{
   background-color:transparent;
   transition:none;
 }
-.rs-picker[data-variant=subtle] .rs-picker-toggle:hover{
+.rs-picker[data-variant=subtle] .rs-picker-toggle:hover,.rs-picker[data-variant=subtle] .rs-picker-toggle-active{
   color:var(--rs-btn-subtle-hover-text);
   background-color:var(--rs-btn-subtle-hover-bg);
 }
-.rs-picker[data-variant=subtle] .rs-picker-toggle:active, .rs-picker[data-variant=subtle] .rs-picker-toggle.rs-btn-active{
-  color:var(--rs-btn-subtle-active-text);
-  background-color:var(--rs-btn-subtle-active-bg);
-}
-.rs-picker[data-variant=subtle] .rs-picker-toggle:disabled, .rs-picker[data-variant=subtle] .rs-picker-toggle.rs-btn-disabled{
-  color:var(--rs-btn-subtle-disabled-text);
-  background:none;
-}
-.rs-picker[data-variant=subtle] .rs-picker-toggle-active{
-  background-color:var(--rs-btn-subtle-hover-bg);
-  color:var(--rs-btn-subtle-hover-text);
-}
 .rs-picker-toggle[data-size=lg] .rs-picker-clean .rs-icon{
   width:16px;
   height:16px;
@@ -2315,14 +2310,14 @@ body{
   align-items:center;
 }
 
-.rs-picker-toggle.rs-btn, .rs-picker-toggle.rs-pagination-btn{
+.rs-picker-toggle.rs-btn{
   text-align:start;
   display:inline-flex;
   align-items:center;
   justify-content:flex-start;
   padding-inline:calc(var(--rs-btn-padding-inline) - var(--rs-picker-toggle-border-width));
 }
-[data-block=true] .rs-picker-toggle.rs-btn, [data-block=true] .rs-picker-toggle.rs-pagination-btn{
+[data-block=true] .rs-picker-toggle.rs-btn{
   display:flex;
 }
 
@@ -2350,10 +2345,9 @@ body{
   color:var(--rs-text-secondary);
 }
 
-.rs-picker[data-variant=default] .rs-btn, .rs-picker[data-variant=default] .rs-pagination-btn,
+.rs-picker[data-variant=default] .rs-btn,
 .rs-picker[data-variant=default] .rs-picker-toggle,
 .rs-picker-input .rs-btn,
-.rs-picker-input .rs-pagination-btn,
 .rs-picker-input .rs-picker-toggle{
   background-color:var(--rs-picker-toggle-bg);
 }
@@ -2370,7 +2364,7 @@ body{
   color:var(--rs-listbox-option-hover-text);
 }
 [data-theme=high-contrast] .rs-check-item:not(.rs-checkbox-disabled):hover, .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover, [data-theme=high-contrast] .rs-check-item:focus, .rs-theme-high-contrast .rs-check-item:focus, [data-theme=high-contrast] .rs-check-item.rs-check-item-focus, .rs-theme-high-contrast .rs-check-item.rs-check-item-focus{
-  outline:2px solid var(--rs-color-focus-ring);
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
   outline-offset:-3px;
   outline-width:2px;
@@ -2470,7 +2464,7 @@ body{
   color:var(--rs-listbox-option-hover-text);
 }
 [data-theme=high-contrast] .rs-picker-select-menu-item:hover, .rs-theme-high-contrast .rs-picker-select-menu-item:hover, [data-theme=high-contrast] .rs-picker-select-menu-item:focus, .rs-theme-high-contrast .rs-picker-select-menu-item:focus, [data-theme=high-contrast] .rs-picker-select-menu-item.rs-picker-select-menu-item-focus, .rs-theme-high-contrast .rs-picker-select-menu-item.rs-picker-select-menu-item-focus{
-  outline:2px solid var(--rs-color-focus-ring);
+  outline:2px solid var(--rs-focus-ring-color);
   outline-offset:-1px;
   outline-offset:-3px;
   outline-width:2px;
@@ -2518,45 +2512,39 @@ body{
   padding-inline-start:0;
   margin-bottom:0;
 }
-.rs-pagination-lg .rs-pagination-btn{
+.rs-pagination[data-size=lg] .rs-pagination-btn{
   min-width:42px;
 }
-.rs-pagination-lg .rs-pagination-btn .rs-pagination-symbol{
+.rs-pagination[data-size=lg] .rs-pagination-btn .rs-pagination-symbol{
   height:var(--rs-line-height-plus);
 }
-.rs-pagination-lg .rs-pagination-btn-active{
+.rs-pagination[data-size=lg] .rs-pagination-btn-active{
   padding-block:calc(var(--rs-spacing-block-lg) - 1px);
   padding-inline:calc(var(--rs-spacing-inline-lg) - 1px);
 }
-.rs-pagination-md .rs-pagination-btn{
+.rs-pagination[data-size=md] .rs-pagination-btn{
   min-width:36px;
 }
-.rs-pagination-md .rs-pagination-btn-active{
+.rs-pagination[data-size=md] .rs-pagination-btn-active{
   padding-block:calc(var(--rs-padding-block-md) - 1px);
   padding-inline:calc(var(--rs-padding-inline-md) - 1px);
 }
-.rs-pagination-sm .rs-pagination-btn{
+.rs-pagination[data-size=sm] .rs-pagination-btn{
   min-width:30px;
 }
-.rs-pagination-sm .rs-pagination-btn-active{
+.rs-pagination[data-size=sm] .rs-pagination-btn-active{
   padding-block:calc(var(--rs-spacing-block-sm) - 1px);
   padding-inline:calc(var(--rs-spacing-inline-sm) - 1px);
 }
-.rs-pagination-xs .rs-pagination-btn{
+.rs-pagination[data-size=xs] .rs-pagination-btn{
   min-width:24px;
 }
-.rs-pagination-xs .rs-pagination-btn-active{
+.rs-pagination[data-size=xs] .rs-pagination-btn-active{
   padding-block:calc(var(--rs-spacing-block-xs) - 1px);
   padding-inline:calc(var(--rs-spacing-inline-xs) - 1px);
 }
 
 .rs-pagination-btn{
-  --rs-btn-size:var(--rs-btn-size-sm);
-  --rs-btn-font-size:var(--rs-btn-font-size-sm);
-  --rs-btn-line-height:var(--rs-btn-line-height-sm);
-  --rs-btn-padding-inline:var(--rs-btn-padding-inline-sm);
-  --rs-btn-padding-block:var(--rs-btn-padding-block-sm);
-  --rs-btn-icon-size:var(--rs-btn-icon-size-sm);
   margin:0 2px;
   position:relative;
   float:inline-start;
@@ -2592,17 +2580,6 @@ body{
   padding-inline:calc(var(--rs-btn-padding-inline) - var(--rs-btn-ghost-border-width, 1px));
   padding-block:calc(var(--rs-btn-padding-block) - var(--rs-btn-ghost-border-width, 1px));
 }
-.rs-pagination-btn.rs-pagination-btn-active:hover{
-  color:var(--rs-btn-ghost-hover-text);
-  background-color:transparent;
-  border-color:var(--rs-btn-ghost-hover-border);
-  box-shadow:0 0 0 1px var(--rs-btn-ghost-hover-border);
-}
-.rs-pagination-btn.rs-pagination-btn-active:active, .rs-pagination-btn.rs-pagination-btn-active.rs-btn-active{
-  color:var(--rs-btn-ghost-active-text);
-  background-color:transparent;
-  border-color:var(--rs-btn-ghost-active-border);
-}
 .high-contrast-mode .rs-pagination-btn.rs-pagination-btn-active{
   color:var(--rs-pagination-item-current-text);
   text-decoration:underline;