@medyll/idae-slotui-svelte 0.60.0 → 0.62.0

package/dist/controls/button/Button.svelte

@@ -87,7 +87,7 @@ let startRef = $state(void 0);
 	{/if}
 </button>
 
-<style global>:global(:root) {
+<style global>:root {
   --sld-button-font-size: inherit;
   --sld-button-radius: var(--sld-radius-small);
   --sld-button-border-color: var(--sld-color-primary);
@@ -109,18 +109,18 @@ let startRef = $state(void 0);
   width: var(--w-tiny);
   cursor: pointer;
 }
-
 .actionButton:hover {
   background-color: rgba(255, 255, 255, 0.5);
 }
 
-:global(button),
-:global(.button),
-:global(button.button),
-:global(input[type="button"]),
-:global(input[type="submit"]) {
-  --preset-width: var(--sld-width-small);
-  width: var(--preset-width-small);
+button,
+.button,
+button.button,
+input[type=button],
+input[type=submit] {
+  width: var(--sld-width-small);
+  min-height: var(--preset-tall-small);
+  height: var(--preset-tall-small);
   border: none;
   border-radius: 0;
   margin: 0;
@@ -158,292 +158,266 @@ let startRef = $state(void 0);
   :focus:not(:focus-visible) {
       box-shadow: var(--sld-button-focus-shadow);
   } */
-  --preset-width: var(--sld-width-small);
-  width: var(--preset-width-small);
+  width: var(--sld-width-small);
+  min-height: var(--preset-tall-small);
+  height: var(--preset-tall-small);
 }
-
-:global(button),
-:global(.button),
-:global(button.button),
-:global(input[type="button"]),
-:global(input[type="submit"]) {
+button,
+.button,
+button.button,
+input[type=button],
+input[type=submit] {
   --preset-width: var(--sld-width-small);
-  width: var(--preset-width-small);
-  min-width: var(--preset-width-small);
 }
-
-:global(button)[width=tiny], :global(button).width-tiny,
-:global(.button)[width=tiny],
-:global(.button).width-tiny,
-:global(button.button)[width=tiny],
-:global(button.button).width-tiny,
-:global(input[type="button"])[width=tiny],
-:global(input[type="button"]).width-tiny,
-:global(input[type="submit"])[width=tiny],
-:global(input[type="submit"]).width-tiny {
+button[width=tiny], button.width-tiny,
+.button[width=tiny],
+.button.width-tiny,
+button.button[width=tiny],
+button.button.width-tiny,
+input[type=button][width=tiny],
+input[type=button].width-tiny,
+input[type=submit][width=tiny],
+input[type=submit].width-tiny {
   --preset-width: var(--sld-width-tiny);
   width: var(--sld-width-tiny) !important;
 }
-
-:global(button)[width=mini], :global(button).width-mini,
-:global(.button)[width=mini],
-:global(.button).width-mini,
-:global(button.button)[width=mini],
-:global(button.button).width-mini,
-:global(input[type="button"])[width=mini],
-:global(input[type="button"]).width-mini,
-:global(input[type="submit"])[width=mini],
-:global(input[type="submit"]).width-mini {
+button[width=mini], button.width-mini,
+.button[width=mini],
+.button.width-mini,
+button.button[width=mini],
+button.button.width-mini,
+input[type=button][width=mini],
+input[type=button].width-mini,
+input[type=submit][width=mini],
+input[type=submit].width-mini {
   --preset-width: var(--sld-width-mini);
   width: var(--sld-width-mini) !important;
 }
-
-:global(button)[width=small], :global(button).width-small,
-:global(.button)[width=small],
-:global(.button).width-small,
-:global(button.button)[width=small],
-:global(button.button).width-small,
-:global(input[type="button"])[width=small],
-:global(input[type="button"]).width-small,
-:global(input[type="submit"])[width=small],
-:global(input[type="submit"]).width-small {
+button[width=small], button.width-small,
+.button[width=small],
+.button.width-small,
+button.button[width=small],
+button.button.width-small,
+input[type=button][width=small],
+input[type=button].width-small,
+input[type=submit][width=small],
+input[type=submit].width-small {
   --preset-width: var(--sld-width-small);
   width: var(--sld-width-small) !important;
 }
-
-:global(button)[width=med], :global(button).width-med,
-:global(.button)[width=med],
-:global(.button).width-med,
-:global(button.button)[width=med],
-:global(button.button).width-med,
-:global(input[type="button"])[width=med],
-:global(input[type="button"]).width-med,
-:global(input[type="submit"])[width=med],
-:global(input[type="submit"]).width-med {
+button[width=med], button.width-med,
+.button[width=med],
+.button.width-med,
+button.button[width=med],
+button.button.width-med,
+input[type=button][width=med],
+input[type=button].width-med,
+input[type=submit][width=med],
+input[type=submit].width-med {
   --preset-width: var(--sld-width-med);
   width: var(--sld-width-med) !important;
 }
-
-:global(button)[width=kind], :global(button).width-kind,
-:global(.button)[width=kind],
-:global(.button).width-kind,
-:global(button.button)[width=kind],
-:global(button.button).width-kind,
-:global(input[type="button"])[width=kind],
-:global(input[type="button"]).width-kind,
-:global(input[type="submit"])[width=kind],
-:global(input[type="submit"]).width-kind {
+button[width=kind], button.width-kind,
+.button[width=kind],
+.button.width-kind,
+button.button[width=kind],
+button.button.width-kind,
+input[type=button][width=kind],
+input[type=button].width-kind,
+input[type=submit][width=kind],
+input[type=submit].width-kind {
   --preset-width: var(--sld-width-kind);
   width: var(--sld-width-kind) !important;
 }
-
-:global(button)[width=full], :global(button).width-full,
-:global(.button)[width=full],
-:global(.button).width-full,
-:global(button.button)[width=full],
-:global(button.button).width-full,
-:global(input[type="button"])[width=full],
-:global(input[type="button"]).width-full,
-:global(input[type="submit"])[width=full],
-:global(input[type="submit"]).width-full {
+button[width=full], button.width-full,
+.button[width=full],
+.button.width-full,
+button.button[width=full],
+button.button.width-full,
+input[type=button][width=full],
+input[type=button].width-full,
+input[type=submit][width=full],
+input[type=submit].width-full {
   --preset-width: var(--sld-width-full);
   width: var(--sld-width-full) !important;
 }
-
-:global(button)[width=auto], :global(button).width-auto,
-:global(.button)[width=auto],
-:global(.button).width-auto,
-:global(button.button)[width=auto],
-:global(button.button).width-auto,
-:global(input[type="button"])[width=auto],
-:global(input[type="button"]).width-auto,
-:global(input[type="submit"])[width=auto],
-:global(input[type="submit"]).width-auto {
+button[width=auto], button.width-auto,
+.button[width=auto],
+.button.width-auto,
+button.button[width=auto],
+button.button.width-auto,
+input[type=button][width=auto],
+input[type=button].width-auto,
+input[type=submit][width=auto],
+input[type=submit].width-auto {
   --preset-width: var(--sld-width-auto);
   width: var(--sld-width-auto) !important;
 }
-
-:global(button)[width=default], :global(button).width-default,
-:global(.button)[width=default],
-:global(.button).width-default,
-:global(button.button)[width=default],
-:global(button.button).width-default,
-:global(input[type="button"])[width=default],
-:global(input[type="button"]).width-default,
-:global(input[type="submit"])[width=default],
-:global(input[type="submit"]).width-default {
+button[width=default], button.width-default,
+.button[width=default],
+.button.width-default,
+button.button[width=default],
+button.button.width-default,
+input[type=button][width=default],
+input[type=button].width-default,
+input[type=submit][width=default],
+input[type=submit].width-default {
   --preset-width: var(--sld-width-default);
   width: var(--sld-width-default) !important;
 }
-
-:global(button),
-:global(.button),
-:global(button.button),
-:global(input[type="button"]),
-:global(input[type="submit"]) {
+button,
+.button,
+button.button,
+input[type=button],
+input[type=submit] {
   --preset-tall: var(--sld-tall-small);
-  min-height: var(--preset-tall-small);
-  height: var(--preset-tall-small);
 }
-
-:global(button)[tall=tiny], :global(button).tall-tiny,
-:global(.button)[tall=tiny],
-:global(.button).tall-tiny,
-:global(button.button)[tall=tiny],
-:global(button.button).tall-tiny,
-:global(input[type="button"])[tall=tiny],
-:global(input[type="button"]).tall-tiny,
-:global(input[type="submit"])[tall=tiny],
-:global(input[type="submit"]).tall-tiny {
+button[tall=tiny], button.tall-tiny,
+.button[tall=tiny],
+.button.tall-tiny,
+button.button[tall=tiny],
+button.button.tall-tiny,
+input[type=button][tall=tiny],
+input[type=button].tall-tiny,
+input[type=submit][tall=tiny],
+input[type=submit].tall-tiny {
   min-height: var(--sld-tall-tiny) !important;
 }
-
-:global(button)[tall=mini], :global(button).tall-mini,
-:global(.button)[tall=mini],
-:global(.button).tall-mini,
-:global(button.button)[tall=mini],
-:global(button.button).tall-mini,
-:global(input[type="button"])[tall=mini],
-:global(input[type="button"]).tall-mini,
-:global(input[type="submit"])[tall=mini],
-:global(input[type="submit"]).tall-mini {
+button[tall=mini], button.tall-mini,
+.button[tall=mini],
+.button.tall-mini,
+button.button[tall=mini],
+button.button.tall-mini,
+input[type=button][tall=mini],
+input[type=button].tall-mini,
+input[type=submit][tall=mini],
+input[type=submit].tall-mini {
   min-height: var(--sld-tall-mini) !important;
 }
-
-:global(button)[tall=small], :global(button).tall-small,
-:global(.button)[tall=small],
-:global(.button).tall-small,
-:global(button.button)[tall=small],
-:global(button.button).tall-small,
-:global(input[type="button"])[tall=small],
-:global(input[type="button"]).tall-small,
-:global(input[type="submit"])[tall=small],
-:global(input[type="submit"]).tall-small {
+button[tall=small], button.tall-small,
+.button[tall=small],
+.button.tall-small,
+button.button[tall=small],
+button.button.tall-small,
+input[type=button][tall=small],
+input[type=button].tall-small,
+input[type=submit][tall=small],
+input[type=submit].tall-small {
   min-height: var(--sld-tall-small) !important;
 }
-
-:global(button)[tall=med], :global(button).tall-med,
-:global(.button)[tall=med],
-:global(.button).tall-med,
-:global(button.button)[tall=med],
-:global(button.button).tall-med,
-:global(input[type="button"])[tall=med],
-:global(input[type="button"]).tall-med,
-:global(input[type="submit"])[tall=med],
-:global(input[type="submit"]).tall-med {
+button[tall=med], button.tall-med,
+.button[tall=med],
+.button.tall-med,
+button.button[tall=med],
+button.button.tall-med,
+input[type=button][tall=med],
+input[type=button].tall-med,
+input[type=submit][tall=med],
+input[type=submit].tall-med {
   min-height: var(--sld-tall-med) !important;
 }
-
-:global(button)[tall=kind], :global(button).tall-kind,
-:global(.button)[tall=kind],
-:global(.button).tall-kind,
-:global(button.button)[tall=kind],
-:global(button.button).tall-kind,
-:global(input[type="button"])[tall=kind],
-:global(input[type="button"]).tall-kind,
-:global(input[type="submit"])[tall=kind],
-:global(input[type="submit"]).tall-kind {
+button[tall=kind], button.tall-kind,
+.button[tall=kind],
+.button.tall-kind,
+button.button[tall=kind],
+button.button.tall-kind,
+input[type=button][tall=kind],
+input[type=button].tall-kind,
+input[type=submit][tall=kind],
+input[type=submit].tall-kind {
   min-height: var(--sld-tall-kind) !important;
 }
-
-:global(button)[tall=auto], :global(button).tall-auto,
-:global(.button)[tall=auto],
-:global(.button).tall-auto,
-:global(button.button)[tall=auto],
-:global(button.button).tall-auto,
-:global(input[type="button"])[tall=auto],
-:global(input[type="button"]).tall-auto,
-:global(input[type="submit"])[tall=auto],
-:global(input[type="submit"]).tall-auto {
+button[tall=auto], button.tall-auto,
+.button[tall=auto],
+.button.tall-auto,
+button.button[tall=auto],
+button.button.tall-auto,
+input[type=button][tall=auto],
+input[type=button].tall-auto,
+input[type=submit][tall=auto],
+input[type=submit].tall-auto {
   min-height: var(--sld-tall-auto) !important;
 }
-
-:global(button)[tall=default], :global(button).tall-default,
-:global(.button)[tall=default],
-:global(.button).tall-default,
-:global(button.button)[tall=default],
-:global(button.button).tall-default,
-:global(input[type="button"])[tall=default],
-:global(input[type="button"]).tall-default,
-:global(input[type="submit"])[tall=default],
-:global(input[type="submit"]).tall-default {
+button[tall=default], button.tall-default,
+.button[tall=default],
+.button.tall-default,
+button.button[tall=default],
+button.button.tall-default,
+input[type=button][tall=default],
+input[type=button].tall-default,
+input[type=submit][tall=default],
+input[type=submit].tall-default {
   min-height: var(--sld-tall-default) !important;
 }
-
-:global(button)[variant*=square], :global(button)[square=true], :global(button).square,
-:global(.button)[variant*=square],
-:global(.button)[square=true],
-:global(.button).square,
-:global(button.button)[variant*=square],
-:global(button.button)[square=true],
-:global(button.button).square,
-:global(input[type="button"])[variant*=square],
-:global(input[type="button"])[square=true],
-:global(input[type="button"]).square,
-:global(input[type="submit"])[variant*=square],
-:global(input[type="submit"])[square=true],
-:global(input[type="submit"]).square {
+button[variant*=square], button[square=true], button.square,
+.button[variant*=square],
+.button[square=true],
+.button.square,
+button.button[variant*=square],
+button.button[square=true],
+button.button.square,
+input[type=button][variant*=square],
+input[type=button][square=true],
+input[type=button].square,
+input[type=submit][variant*=square],
+input[type=submit][square=true],
+input[type=submit].square {
   aspect-ratio: 1/1 !important;
   height: auto;
 }
-
-:global(button)[variant*=rounded], :global(button)[rounded=true], :global(button).rounded,
-:global(.button)[variant*=rounded],
-:global(.button)[rounded=true],
-:global(.button).rounded,
-:global(button.button)[variant*=rounded],
-:global(button.button)[rounded=true],
-:global(button.button).rounded,
-:global(input[type="button"])[variant*=rounded],
-:global(input[type="button"])[rounded=true],
-:global(input[type="button"]).rounded,
-:global(input[type="submit"])[variant*=rounded],
-:global(input[type="submit"])[rounded=true],
-:global(input[type="submit"]).rounded {
+button[variant*=rounded], button[rounded=true], button.rounded,
+.button[variant*=rounded],
+.button[rounded=true],
+.button.rounded,
+button.button[variant*=rounded],
+button.button[rounded=true],
+button.button.rounded,
+input[type=button][variant*=rounded],
+input[type=button][rounded=true],
+input[type=button].rounded,
+input[type=submit][variant*=rounded],
+input[type=submit][rounded=true],
+input[type=submit].rounded {
   border-radius: 50%;
 }
-
-:global(button).elevation-0, :global(button)[elevation-0],
-:global(.button).elevation-0,
-:global(.button)[elevation-0],
-:global(button.button).elevation-0,
-:global(button.button)[elevation-0],
-:global(input[type="button"]).elevation-0,
-:global(input[type="button"])[elevation-0],
-:global(input[type="submit"]).elevation-0,
-:global(input[type="submit"])[elevation-0] {
+button.elevation-0, button[elevation-0],
+.button.elevation-0,
+.button[elevation-0],
+button.button.elevation-0,
+button.button[elevation-0],
+input[type=button].elevation-0,
+input[type=button][elevation-0],
+input[type=submit].elevation-0,
+input[type=submit][elevation-0] {
   box-shadow: var(--sld-elevation-0);
 }
-
-:global(button).elevation-through, :global(button)[elevation-through],
-:global(.button).elevation-through,
-:global(.button)[elevation-through],
-:global(button.button).elevation-through,
-:global(button.button)[elevation-through],
-:global(input[type="button"]).elevation-through,
-:global(input[type="button"])[elevation-through],
-:global(input[type="submit"]).elevation-through,
-:global(input[type="submit"])[elevation-through] {
+button.elevation-through, button[elevation-through],
+.button.elevation-through,
+.button[elevation-through],
+button.button.elevation-through,
+button.button[elevation-through],
+input[type=button].elevation-through,
+input[type=button][elevation-through],
+input[type=submit].elevation-through,
+input[type=submit][elevation-through] {
   box-shadow: var(--sld-elevation-through);
 }
-
-:global(button).elevation-5, :global(button)[elevation-5],
-:global(.button).elevation-5,
-:global(.button)[elevation-5],
-:global(button.button).elevation-5,
-:global(button.button)[elevation-5],
-:global(input[type="button"]).elevation-5,
-:global(input[type="button"])[elevation-5],
-:global(input[type="submit"]).elevation-5,
-:global(input[type="submit"])[elevation-5] {
+button.elevation-5, button[elevation-5],
+.button.elevation-5,
+.button[elevation-5],
+button.button.elevation-5,
+button.button[elevation-5],
+input[type=button].elevation-5,
+input[type=button][elevation-5],
+input[type=submit].elevation-5,
+input[type=submit][elevation-5] {
   box-shadow: var(--sld-elevation-5);
 }
-
-:global(button) .button-start,
-:global(.button) .button-start,
-:global(button.button) .button-start,
-:global(input[type="button"]) .button-start,
-:global(input[type="submit"]) .button-start {
+button .button-start,
+.button .button-start,
+button.button .button-start,
+input[type=button] .button-start,
+input[type=submit] .button-start {
   position: relative;
   top: 0;
   left: 0;
@@ -453,21 +427,18 @@ let startRef = $state(void 0);
   padding: 0 0.5rem;
   display: block;
 }
-
-:global(button) .button-start:empty,
-:global(.button) .button-start:empty,
-:global(button.button) .button-start:empty,
-:global(input[type="button"]) .button-start:empty,
-:global(input[type="submit"]) .button-start:empty {
+button .button-start:empty,
+.button .button-start:empty,
+button.button .button-start:empty,
+input[type=button] .button-start:empty,
+input[type=submit] .button-start:empty {
   display: none;
 }
-
-:global(button) .button-central,
-:global(.button) .button-central,
-:global(button.button) .button-central,
-:global(input[type="button"]) .button-central,
-:global(input[type="submit"]) .button-central {
-  --preset-ellipsis-line: 1;
+button .button-central,
+.button .button-central,
+button.button .button-central,
+input[type=button] .button-central,
+input[type=submit] .button-central {
   display: block;
   max-width: 100%;
   max-height: 100%;
@@ -481,26 +452,31 @@ let startRef = $state(void 0);
   text-align: var(--sld-button-text-align, center);
   overflow: hidden;
 }
-
-:global(button) .button-central[ellipsis], :global(button) .button-central.ellipsis,
-:global(.button) .button-central[ellipsis],
-:global(.button) .button-central.ellipsis,
-:global(button.button) .button-central[ellipsis],
-:global(button.button) .button-central.ellipsis,
-:global(input[type="button"]) .button-central[ellipsis],
-:global(input[type="button"]) .button-central.ellipsis,
-:global(input[type="submit"]) .button-central[ellipsis],
-:global(input[type="submit"]) .button-central.ellipsis {
+button .button-central,
+.button .button-central,
+button.button .button-central,
+input[type=button] .button-central,
+input[type=submit] .button-central {
+  --preset-ellipsis-line: 1;
+}
+button .button-central[ellipsis], button .button-central.ellipsis,
+.button .button-central[ellipsis],
+.button .button-central.ellipsis,
+button.button .button-central[ellipsis],
+button.button .button-central.ellipsis,
+input[type=button] .button-central[ellipsis],
+input[type=button] .button-central.ellipsis,
+input[type=submit] .button-central[ellipsis],
+input[type=submit] .button-central.ellipsis {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-
-:global(button) .button-central.ellipsis-line-1,
-:global(.button) .button-central.ellipsis-line-1,
-:global(button.button) .button-central.ellipsis-line-1,
-:global(input[type="button"]) .button-central.ellipsis-line-1,
-:global(input[type="submit"]) .button-central.ellipsis-line-1 {
+button .button-central.ellipsis-line-1,
+.button .button-central.ellipsis-line-1,
+button.button .button-central.ellipsis-line-1,
+input[type=button] .button-central.ellipsis-line-1,
+input[type=submit] .button-central.ellipsis-line-1 {
   display: -webkit-box;
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
@@ -509,12 +485,11 @@ let startRef = $state(void 0);
   white-space: normal;
   --preset-ellipsis-line: 1;
 }
-
-:global(button) .button-central.ellipsis-line-2,
-:global(.button) .button-central.ellipsis-line-2,
-:global(button.button) .button-central.ellipsis-line-2,
-:global(input[type="button"]) .button-central.ellipsis-line-2,
-:global(input[type="submit"]) .button-central.ellipsis-line-2 {
+button .button-central.ellipsis-line-2,
+.button .button-central.ellipsis-line-2,
+button.button .button-central.ellipsis-line-2,
+input[type=button] .button-central.ellipsis-line-2,
+input[type=submit] .button-central.ellipsis-line-2 {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
@@ -523,12 +498,11 @@ let startRef = $state(void 0);
   white-space: normal;
   --preset-ellipsis-line: 2;
 }
-
-:global(button) .button-central.ellipsis-line-3,
-:global(.button) .button-central.ellipsis-line-3,
-:global(button.button) .button-central.ellipsis-line-3,
-:global(input[type="button"]) .button-central.ellipsis-line-3,
-:global(input[type="submit"]) .button-central.ellipsis-line-3 {
+button .button-central.ellipsis-line-3,
+.button .button-central.ellipsis-line-3,
+button.button .button-central.ellipsis-line-3,
+input[type=button] .button-central.ellipsis-line-3,
+input[type=submit] .button-central.ellipsis-line-3 {
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
@@ -537,12 +511,11 @@ let startRef = $state(void 0);
   white-space: normal;
   --preset-ellipsis-line: 3;
 }
-
-:global(button) .button-central.ellipsis-line-4,
-:global(.button) .button-central.ellipsis-line-4,
-:global(button.button) .button-central.ellipsis-line-4,
-:global(input[type="button"]) .button-central.ellipsis-line-4,
-:global(input[type="submit"]) .button-central.ellipsis-line-4 {
+button .button-central.ellipsis-line-4,
+.button .button-central.ellipsis-line-4,
+button.button .button-central.ellipsis-line-4,
+input[type=button] .button-central.ellipsis-line-4,
+input[type=submit] .button-central.ellipsis-line-4 {
   display: -webkit-box;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;
@@ -551,12 +524,11 @@ let startRef = $state(void 0);
   white-space: normal;
   --preset-ellipsis-line: 4;
 }
-
-:global(button) .button-central.ellipsis-line-5,
-:global(.button) .button-central.ellipsis-line-5,
-:global(button.button) .button-central.ellipsis-line-5,
-:global(input[type="button"]) .button-central.ellipsis-line-5,
-:global(input[type="submit"]) .button-central.ellipsis-line-5 {
+button .button-central.ellipsis-line-5,
+.button .button-central.ellipsis-line-5,
+button.button .button-central.ellipsis-line-5,
+input[type=button] .button-central.ellipsis-line-5,
+input[type=submit] .button-central.ellipsis-line-5 {
   display: -webkit-box;
   -webkit-line-clamp: 5;
   -webkit-box-orient: vertical;
@@ -565,20 +537,18 @@ let startRef = $state(void 0);
   white-space: normal;
   --preset-ellipsis-line: 5;
 }
-
-:global(button) .button-central:empty,
-:global(.button) .button-central:empty,
-:global(button.button) .button-central:empty,
-:global(input[type="button"]) .button-central:empty,
-:global(input[type="submit"]) .button-central:empty {
+button .button-central:empty,
+.button .button-central:empty,
+button.button .button-central:empty,
+input[type=button] .button-central:empty,
+input[type=submit] .button-central:empty {
   display: none;
 }
-
-:global(button) .button-end,
-:global(.button) .button-end,
-:global(button.button) .button-end,
-:global(input[type="button"]) .button-end,
-:global(input[type="submit"]) .button-end {
+button .button-end,
+.button .button-end,
+button.button .button-end,
+input[type=button] .button-end,
+input[type=submit] .button-end {
   position: relative;
   align-items: center;
   align-content: center;
@@ -586,46 +556,42 @@ let startRef = $state(void 0);
   text-align: center;
   cursor: pointer;
 }
-
-:global(button) .button-end:empty,
-:global(.button) .button-end:empty,
-:global(button.button) .button-end:empty,
-:global(input[type="button"]) .button-end:empty,
-:global(input[type="submit"]) .button-end:empty {
+button .button-end:empty,
+.button .button-end:empty,
+button.button .button-end:empty,
+input[type=button] .button-end:empty,
+input[type=submit] .button-end:empty {
   display: none;
 }
-
-:global(button) .button-end:hover,
-:global(.button) .button-end:hover,
-:global(button.button) .button-end:hover,
-:global(input[type="button"]) .button-end:hover,
-:global(input[type="submit"]) .button-end:hover {
+button .button-end:hover,
+.button .button-end:hover,
+button.button .button-end:hover,
+input[type=button] .button-end:hover,
+input[type=submit] .button-end:hover {
   background-color: var(--sld-button-action-hover-background);
 }
-
-:global(button).loading, :global(button)[aria-busy=true],
-:global(.button).loading,
-:global(.button)[aria-busy=true],
-:global(button.button).loading,
-:global(button.button)[aria-busy=true],
-:global(input[type="button"]).loading,
-:global(input[type="button"])[aria-busy=true],
-:global(input[type="submit"]).loading,
-:global(input[type="submit"])[aria-busy=true] {
+button.loading, button[aria-busy=true],
+.button.loading,
+.button[aria-busy=true],
+button.button.loading,
+button.button[aria-busy=true],
+input[type=button].loading,
+input[type=button][aria-busy=true],
+input[type=submit].loading,
+input[type=submit][aria-busy=true] {
   position: relative;
   color: transparent;
   pointer-events: none;
 }
-
-:global(button).loading::after, :global(button)[aria-busy=true]::after,
-:global(.button).loading::after,
-:global(.button)[aria-busy=true]::after,
-:global(button.button).loading::after,
-:global(button.button)[aria-busy=true]::after,
-:global(input[type="button"]).loading::after,
-:global(input[type="button"])[aria-busy=true]::after,
-:global(input[type="submit"]).loading::after,
-:global(input[type="submit"])[aria-busy=true]::after {
+button.loading::after, button[aria-busy=true]::after,
+.button.loading::after,
+.button[aria-busy=true]::after,
+button.button.loading::after,
+button.button[aria-busy=true]::after,
+input[type=button].loading::after,
+input[type=button][aria-busy=true]::after,
+input[type=submit].loading::after,
+input[type=submit][aria-busy=true]::after {
   content: " ";
   position: absolute;
   width: 16px;
@@ -640,20 +606,19 @@ let startRef = $state(void 0);
   border-radius: 50%;
   animation: button-spinner 0.6s linear infinite;
 }
-
-:global(button)[disabled], :global(button).disabled, :global(button)[aria-disabled=true],
-:global(.button)[disabled],
-:global(.button).disabled,
-:global(.button)[aria-disabled=true],
-:global(button.button)[disabled],
-:global(button.button).disabled,
-:global(button.button)[aria-disabled=true],
-:global(input[type="button"])[disabled],
-:global(input[type="button"]).disabled,
-:global(input[type="button"])[aria-disabled=true],
-:global(input[type="submit"])[disabled],
-:global(input[type="submit"]).disabled,
-:global(input[type="submit"])[aria-disabled=true] {
+button[disabled], button.disabled, button[aria-disabled=true],
+.button[disabled],
+.button.disabled,
+.button[aria-disabled=true],
+button.button[disabled],
+button.button.disabled,
+button.button[aria-disabled=true],
+input[type=button][disabled],
+input[type=button].disabled,
+input[type=button][aria-disabled=true],
+input[type=submit][disabled],
+input[type=submit].disabled,
+input[type=submit][aria-disabled=true] {
   color: var(--color-gray-800);
   border-color: var(--color-gray-400);
   opacity: 0.6;
@@ -661,26 +626,24 @@ let startRef = $state(void 0);
   box-shadow: none;
   pointer-events: none;
 }
-
-:global(button)[aria-pressed=true], :global(button).selected,
-:global(.button)[aria-pressed=true],
-:global(.button).selected,
-:global(button.button)[aria-pressed=true],
-:global(button.button).selected,
-:global(input[type="button"])[aria-pressed=true],
-:global(input[type="button"]).selected,
-:global(input[type="submit"])[aria-pressed=true],
-:global(input[type="submit"]).selected {
+button[aria-pressed=true], button.selected,
+.button[aria-pressed=true],
+.button.selected,
+button.button[aria-pressed=true],
+button.button.selected,
+input[type=button][aria-pressed=true],
+input[type=button].selected,
+input[type=submit][aria-pressed=true],
+input[type=submit].selected {
   box-shadow: var(--sld-elevation-3);
   background-color: var(--sld-color-secondary);
   font-weight: bold;
 }
-
-:global(button) .chip,
-:global(.button) .chip,
-:global(button.button) .chip,
-:global(input[type="button"]) .chip,
-:global(input[type="submit"]) .chip {
+button .chip,
+.button .chip,
+button.button .chip,
+input[type=button] .chip,
+input[type=submit] .chip {
   position: absolute;
   z-index: 2;
   height: 3px;
@@ -691,12 +654,11 @@ let startRef = $state(void 0);
   border-radius: var(--sld-radius-large);
   bottom: 2px;
 }
-
-:global(button) .loadingButtonZone,
-:global(.button) .loadingButtonZone,
-:global(button.button) .loadingButtonZone,
-:global(input[type="button"]) .loadingButtonZone,
-:global(input[type="submit"]) .loadingButtonZone {
+button .loadingButtonZone,
+.button .loadingButtonZone,
+button.button .loadingButtonZone,
+input[type=button] .loadingButtonZone,
+input[type=submit] .loadingButtonZone {
   z-index: 10;
   position: absolute;
   top: 0;
@@ -708,397 +670,367 @@ let startRef = $state(void 0);
   align-content: center;
   justify-content: space-around;
 }
-
-:global(button),
-:global(.button),
-:global(button.button),
-:global(input[type="button"]),
-:global(input[type="submit"]) {
+button,
+.button,
+button.button,
+input[type=button],
+input[type=submit] {
   --preset-width: var(--sld-width-small);
-  width: var(--preset-width-small);
-  min-width: var(--preset-width-small);
 }
-
-:global(button)[width=tiny], :global(button).width-tiny,
-:global(.button)[width=tiny],
-:global(.button).width-tiny,
-:global(button.button)[width=tiny],
-:global(button.button).width-tiny,
-:global(input[type="button"])[width=tiny],
-:global(input[type="button"]).width-tiny,
-:global(input[type="submit"])[width=tiny],
-:global(input[type="submit"]).width-tiny {
+button[width=tiny], button.width-tiny,
+.button[width=tiny],
+.button.width-tiny,
+button.button[width=tiny],
+button.button.width-tiny,
+input[type=button][width=tiny],
+input[type=button].width-tiny,
+input[type=submit][width=tiny],
+input[type=submit].width-tiny {
   --preset-width: var(--sld-width-tiny);
   width: var(--sld-width-tiny) !important;
 }
-
-:global(button)[width=mini], :global(button).width-mini,
-:global(.button)[width=mini],
-:global(.button).width-mini,
-:global(button.button)[width=mini],
-:global(button.button).width-mini,
-:global(input[type="button"])[width=mini],
-:global(input[type="button"]).width-mini,
-:global(input[type="submit"])[width=mini],
-:global(input[type="submit"]).width-mini {
+button[width=mini], button.width-mini,
+.button[width=mini],
+.button.width-mini,
+button.button[width=mini],
+button.button.width-mini,
+input[type=button][width=mini],
+input[type=button].width-mini,
+input[type=submit][width=mini],
+input[type=submit].width-mini {
   --preset-width: var(--sld-width-mini);
   width: var(--sld-width-mini) !important;
 }
-
-:global(button)[width=small], :global(button).width-small,
-:global(.button)[width=small],
-:global(.button).width-small,
-:global(button.button)[width=small],
-:global(button.button).width-small,
-:global(input[type="button"])[width=small],
-:global(input[type="button"]).width-small,
-:global(input[type="submit"])[width=small],
-:global(input[type="submit"]).width-small {
+button[width=small], button.width-small,
+.button[width=small],
+.button.width-small,
+button.button[width=small],
+button.button.width-small,
+input[type=button][width=small],
+input[type=button].width-small,
+input[type=submit][width=small],
+input[type=submit].width-small {
   --preset-width: var(--sld-width-small);
   width: var(--sld-width-small) !important;
 }
-
-:global(button)[width=med], :global(button).width-med,
-:global(.button)[width=med],
-:global(.button).width-med,
-:global(button.button)[width=med],
-:global(button.button).width-med,
-:global(input[type="button"])[width=med],
-:global(input[type="button"]).width-med,
-:global(input[type="submit"])[width=med],
-:global(input[type="submit"]).width-med {
+button[width=med], button.width-med,
+.button[width=med],
+.button.width-med,
+button.button[width=med],
+button.button.width-med,
+input[type=button][width=med],
+input[type=button].width-med,
+input[type=submit][width=med],
+input[type=submit].width-med {
   --preset-width: var(--sld-width-med);
   width: var(--sld-width-med) !important;
 }
-
-:global(button)[width=kind], :global(button).width-kind,
-:global(.button)[width=kind],
-:global(.button).width-kind,
-:global(button.button)[width=kind],
-:global(button.button).width-kind,
-:global(input[type="button"])[width=kind],
-:global(input[type="button"]).width-kind,
-:global(input[type="submit"])[width=kind],
-:global(input[type="submit"]).width-kind {
+button[width=kind], button.width-kind,
+.button[width=kind],
+.button.width-kind,
+button.button[width=kind],
+button.button.width-kind,
+input[type=button][width=kind],
+input[type=button].width-kind,
+input[type=submit][width=kind],
+input[type=submit].width-kind {
   --preset-width: var(--sld-width-kind);
   width: var(--sld-width-kind) !important;
 }
-
-:global(button)[width=full], :global(button).width-full,
-:global(.button)[width=full],
-:global(.button).width-full,
-:global(button.button)[width=full],
-:global(button.button).width-full,
-:global(input[type="button"])[width=full],
-:global(input[type="button"]).width-full,
-:global(input[type="submit"])[width=full],
-:global(input[type="submit"]).width-full {
+button[width=full], button.width-full,
+.button[width=full],
+.button.width-full,
+button.button[width=full],
+button.button.width-full,
+input[type=button][width=full],
+input[type=button].width-full,
+input[type=submit][width=full],
+input[type=submit].width-full {
   --preset-width: var(--sld-width-full);
   width: var(--sld-width-full) !important;
 }
-
-:global(button)[width=auto], :global(button).width-auto,
-:global(.button)[width=auto],
-:global(.button).width-auto,
-:global(button.button)[width=auto],
-:global(button.button).width-auto,
-:global(input[type="button"])[width=auto],
-:global(input[type="button"]).width-auto,
-:global(input[type="submit"])[width=auto],
-:global(input[type="submit"]).width-auto {
+button[width=auto], button.width-auto,
+.button[width=auto],
+.button.width-auto,
+button.button[width=auto],
+button.button.width-auto,
+input[type=button][width=auto],
+input[type=button].width-auto,
+input[type=submit][width=auto],
+input[type=submit].width-auto {
   --preset-width: var(--sld-width-auto);
   width: var(--sld-width-auto) !important;
 }
-
-:global(button)[width=default], :global(button).width-default,
-:global(.button)[width=default],
-:global(.button).width-default,
-:global(button.button)[width=default],
-:global(button.button).width-default,
-:global(input[type="button"])[width=default],
-:global(input[type="button"]).width-default,
-:global(input[type="submit"])[width=default],
-:global(input[type="submit"]).width-default {
+button[width=default], button.width-default,
+.button[width=default],
+.button.width-default,
+button.button[width=default],
+button.button.width-default,
+input[type=button][width=default],
+input[type=button].width-default,
+input[type=submit][width=default],
+input[type=submit].width-default {
   --preset-width: var(--sld-width-default);
   width: var(--sld-width-default) !important;
 }
-
-:global(button),
-:global(.button),
-:global(button.button),
-:global(input[type="button"]),
-:global(input[type="submit"]) {
+button,
+.button,
+button.button,
+input[type=button],
+input[type=submit] {
   --preset-tall: var(--sld-tall-small);
-  min-height: var(--preset-tall-small);
-  height: var(--preset-tall-small);
 }
-
-:global(button)[tall=tiny], :global(button).tall-tiny,
-:global(.button)[tall=tiny],
-:global(.button).tall-tiny,
-:global(button.button)[tall=tiny],
-:global(button.button).tall-tiny,
-:global(input[type="button"])[tall=tiny],
-:global(input[type="button"]).tall-tiny,
-:global(input[type="submit"])[tall=tiny],
-:global(input[type="submit"]).tall-tiny {
+button[tall=tiny], button.tall-tiny,
+.button[tall=tiny],
+.button.tall-tiny,
+button.button[tall=tiny],
+button.button.tall-tiny,
+input[type=button][tall=tiny],
+input[type=button].tall-tiny,
+input[type=submit][tall=tiny],
+input[type=submit].tall-tiny {
   min-height: var(--sld-tall-tiny) !important;
 }
-
-:global(button)[tall=mini], :global(button).tall-mini,
-:global(.button)[tall=mini],
-:global(.button).tall-mini,
-:global(button.button)[tall=mini],
-:global(button.button).tall-mini,
-:global(input[type="button"])[tall=mini],
-:global(input[type="button"]).tall-mini,
-:global(input[type="submit"])[tall=mini],
-:global(input[type="submit"]).tall-mini {
+button[tall=mini], button.tall-mini,
+.button[tall=mini],
+.button.tall-mini,
+button.button[tall=mini],
+button.button.tall-mini,
+input[type=button][tall=mini],
+input[type=button].tall-mini,
+input[type=submit][tall=mini],
+input[type=submit].tall-mini {
   min-height: var(--sld-tall-mini) !important;
 }
-
-:global(button)[tall=small], :global(button).tall-small,
-:global(.button)[tall=small],
-:global(.button).tall-small,
-:global(button.button)[tall=small],
-:global(button.button).tall-small,
-:global(input[type="button"])[tall=small],
-:global(input[type="button"]).tall-small,
-:global(input[type="submit"])[tall=small],
-:global(input[type="submit"]).tall-small {
+button[tall=small], button.tall-small,
+.button[tall=small],
+.button.tall-small,
+button.button[tall=small],
+button.button.tall-small,
+input[type=button][tall=small],
+input[type=button].tall-small,
+input[type=submit][tall=small],
+input[type=submit].tall-small {
   min-height: var(--sld-tall-small) !important;
 }
-
-:global(button)[tall=med], :global(button).tall-med,
-:global(.button)[tall=med],
-:global(.button).tall-med,
-:global(button.button)[tall=med],
-:global(button.button).tall-med,
-:global(input[type="button"])[tall=med],
-:global(input[type="button"]).tall-med,
-:global(input[type="submit"])[tall=med],
-:global(input[type="submit"]).tall-med {
+button[tall=med], button.tall-med,
+.button[tall=med],
+.button.tall-med,
+button.button[tall=med],
+button.button.tall-med,
+input[type=button][tall=med],
+input[type=button].tall-med,
+input[type=submit][tall=med],
+input[type=submit].tall-med {
   min-height: var(--sld-tall-med) !important;
 }
-
-:global(button)[tall=kind], :global(button).tall-kind,
-:global(.button)[tall=kind],
-:global(.button).tall-kind,
-:global(button.button)[tall=kind],
-:global(button.button).tall-kind,
-:global(input[type="button"])[tall=kind],
-:global(input[type="button"]).tall-kind,
-:global(input[type="submit"])[tall=kind],
-:global(input[type="submit"]).tall-kind {
+button[tall=kind], button.tall-kind,
+.button[tall=kind],
+.button.tall-kind,
+button.button[tall=kind],
+button.button.tall-kind,
+input[type=button][tall=kind],
+input[type=button].tall-kind,
+input[type=submit][tall=kind],
+input[type=submit].tall-kind {
   min-height: var(--sld-tall-kind) !important;
 }
-
-:global(button)[tall=auto], :global(button).tall-auto,
-:global(.button)[tall=auto],
-:global(.button).tall-auto,
-:global(button.button)[tall=auto],
-:global(button.button).tall-auto,
-:global(input[type="button"])[tall=auto],
-:global(input[type="button"]).tall-auto,
-:global(input[type="submit"])[tall=auto],
-:global(input[type="submit"]).tall-auto {
+button[tall=auto], button.tall-auto,
+.button[tall=auto],
+.button.tall-auto,
+button.button[tall=auto],
+button.button.tall-auto,
+input[type=button][tall=auto],
+input[type=button].tall-auto,
+input[type=submit][tall=auto],
+input[type=submit].tall-auto {
   min-height: var(--sld-tall-auto) !important;
 }
-
-:global(button)[tall=default], :global(button).tall-default,
-:global(.button)[tall=default],
-:global(.button).tall-default,
-:global(button.button)[tall=default],
-:global(button.button).tall-default,
-:global(input[type="button"])[tall=default],
-:global(input[type="button"]).tall-default,
-:global(input[type="submit"])[tall=default],
-:global(input[type="submit"]).tall-default {
+button[tall=default], button.tall-default,
+.button[tall=default],
+.button.tall-default,
+button.button[tall=default],
+button.button.tall-default,
+input[type=button][tall=default],
+input[type=button].tall-default,
+input[type=submit][tall=default],
+input[type=submit].tall-default {
   min-height: var(--sld-tall-default) !important;
 }
-
-:global(button)[variant*=square], :global(button)[square=true], :global(button).square,
-:global(.button)[variant*=square],
-:global(.button)[square=true],
-:global(.button).square,
-:global(button.button)[variant*=square],
-:global(button.button)[square=true],
-:global(button.button).square,
-:global(input[type="button"])[variant*=square],
-:global(input[type="button"])[square=true],
-:global(input[type="button"]).square,
-:global(input[type="submit"])[variant*=square],
-:global(input[type="submit"])[square=true],
-:global(input[type="submit"]).square {
+button[variant*=square], button[square=true], button.square,
+.button[variant*=square],
+.button[square=true],
+.button.square,
+button.button[variant*=square],
+button.button[square=true],
+button.button.square,
+input[type=button][variant*=square],
+input[type=button][square=true],
+input[type=button].square,
+input[type=submit][variant*=square],
+input[type=submit][square=true],
+input[type=submit].square {
   aspect-ratio: 1/1 !important;
   height: auto;
 }
-
-:global(button)[variant*=rounded], :global(button)[rounded=true], :global(button).rounded,
-:global(.button)[variant*=rounded],
-:global(.button)[rounded=true],
-:global(.button).rounded,
-:global(button.button)[variant*=rounded],
-:global(button.button)[rounded=true],
-:global(button.button).rounded,
-:global(input[type="button"])[variant*=rounded],
-:global(input[type="button"])[rounded=true],
-:global(input[type="button"]).rounded,
-:global(input[type="submit"])[variant*=rounded],
-:global(input[type="submit"])[rounded=true],
-:global(input[type="submit"]).rounded {
+button[variant*=rounded], button[rounded=true], button.rounded,
+.button[variant*=rounded],
+.button[rounded=true],
+.button.rounded,
+button.button[variant*=rounded],
+button.button[rounded=true],
+button.button.rounded,
+input[type=button][variant*=rounded],
+input[type=button][rounded=true],
+input[type=button].rounded,
+input[type=submit][variant*=rounded],
+input[type=submit][rounded=true],
+input[type=submit].rounded {
   border-radius: 50%;
 }
-
-:global(button)[variant*=bordered], :global(button)[bordered=true], :global(button).bordered,
-:global(.button)[variant*=bordered],
-:global(.button)[bordered=true],
-:global(.button).bordered,
-:global(button.button)[variant*=bordered],
-:global(button.button)[bordered=true],
-:global(button.button).bordered,
-:global(input[type="button"])[variant*=bordered],
-:global(input[type="button"])[bordered=true],
-:global(input[type="button"]).bordered,
-:global(input[type="submit"])[variant*=bordered],
-:global(input[type="submit"])[bordered=true],
-:global(input[type="submit"]).bordered {
+button[variant*=bordered], button[bordered=true], button.bordered,
+.button[variant*=bordered],
+.button[bordered=true],
+.button.bordered,
+button.button[variant*=bordered],
+button.button[bordered=true],
+button.button.bordered,
+input[type=button][variant*=bordered],
+input[type=button][bordered=true],
+input[type=button].bordered,
+input[type=submit][variant*=bordered],
+input[type=submit][bordered=true],
+input[type=submit].bordered {
   color: var(--sld-color-foreground);
   border: var(--sld-button-border-width) solid var(--sld-button-border-color);
   box-shadow: var(--sld-elevation-1);
   background-color: var(--sld-button-background);
 }
-
-:global(button)[variant*=bordered]:hover, :global(button)[bordered=true]:hover, :global(button).bordered:hover,
-:global(.button)[variant*=bordered]:hover,
-:global(.button)[bordered=true]:hover,
-:global(.button).bordered:hover,
-:global(button.button)[variant*=bordered]:hover,
-:global(button.button)[bordered=true]:hover,
-:global(button.button).bordered:hover,
-:global(input[type="button"])[variant*=bordered]:hover,
-:global(input[type="button"])[bordered=true]:hover,
-:global(input[type="button"]).bordered:hover,
-:global(input[type="submit"])[variant*=bordered]:hover,
-:global(input[type="submit"])[bordered=true]:hover,
-:global(input[type="submit"]).bordered:hover {
+button[variant*=bordered]:hover, button[bordered=true]:hover, button.bordered:hover,
+.button[variant*=bordered]:hover,
+.button[bordered=true]:hover,
+.button.bordered:hover,
+button.button[variant*=bordered]:hover,
+button.button[bordered=true]:hover,
+button.button.bordered:hover,
+input[type=button][variant*=bordered]:hover,
+input[type=button][bordered=true]:hover,
+input[type=button].bordered:hover,
+input[type=submit][variant*=bordered]:hover,
+input[type=submit][bordered=true]:hover,
+input[type=submit].bordered:hover {
   border-color: var(--sld-color-primary);
   box-shadow: var(--sld-button-hover-shadow);
 }
-
-:global(button)[variant*=bordered]:focus, :global(button)[variant*=bordered]:active, :global(button)[bordered=true]:focus, :global(button)[bordered=true]:active, :global(button).bordered:focus, :global(button).bordered:active,
-:global(.button)[variant*=bordered]:focus,
-:global(.button)[variant*=bordered]:active,
-:global(.button)[bordered=true]:focus,
-:global(.button)[bordered=true]:active,
-:global(.button).bordered:focus,
-:global(.button).bordered:active,
-:global(button.button)[variant*=bordered]:focus,
-:global(button.button)[variant*=bordered]:active,
-:global(button.button)[bordered=true]:focus,
-:global(button.button)[bordered=true]:active,
-:global(button.button).bordered:focus,
-:global(button.button).bordered:active,
-:global(input[type="button"])[variant*=bordered]:focus,
-:global(input[type="button"])[variant*=bordered]:active,
-:global(input[type="button"])[bordered=true]:focus,
-:global(input[type="button"])[bordered=true]:active,
-:global(input[type="button"]).bordered:focus,
-:global(input[type="button"]).bordered:active,
-:global(input[type="submit"])[variant*=bordered]:focus,
-:global(input[type="submit"])[variant*=bordered]:active,
-:global(input[type="submit"])[bordered=true]:focus,
-:global(input[type="submit"])[bordered=true]:active,
-:global(input[type="submit"]).bordered:focus,
-:global(input[type="submit"]).bordered:active {
+button[variant*=bordered]:focus, button[variant*=bordered]:active, button[bordered=true]:focus, button[bordered=true]:active, button.bordered:focus, button.bordered:active,
+.button[variant*=bordered]:focus,
+.button[variant*=bordered]:active,
+.button[bordered=true]:focus,
+.button[bordered=true]:active,
+.button.bordered:focus,
+.button.bordered:active,
+button.button[variant*=bordered]:focus,
+button.button[variant*=bordered]:active,
+button.button[bordered=true]:focus,
+button.button[bordered=true]:active,
+button.button.bordered:focus,
+button.button.bordered:active,
+input[type=button][variant*=bordered]:focus,
+input[type=button][variant*=bordered]:active,
+input[type=button][bordered=true]:focus,
+input[type=button][bordered=true]:active,
+input[type=button].bordered:focus,
+input[type=button].bordered:active,
+input[type=submit][variant*=bordered]:focus,
+input[type=submit][variant*=bordered]:active,
+input[type=submit][bordered=true]:focus,
+input[type=submit][bordered=true]:active,
+input[type=submit].bordered:focus,
+input[type=submit].bordered:active {
   border-color: var(--sld-button-active-border-color);
   box-shadow: var(--sld-button-active-shadow);
 }
-
-:global(button)[variant*=contained], :global(button)[contained=true], :global(button).contained,
-:global(.button)[variant*=contained],
-:global(.button)[contained=true],
-:global(.button).contained,
-:global(button.button)[variant*=contained],
-:global(button.button)[contained=true],
-:global(button.button).contained,
-:global(input[type="button"])[variant*=contained],
-:global(input[type="button"])[contained=true],
-:global(input[type="button"]).contained,
-:global(input[type="submit"])[variant*=contained],
-:global(input[type="submit"])[contained=true],
-:global(input[type="submit"]).contained {
+button[variant*=contained], button[contained=true], button.contained,
+.button[variant*=contained],
+.button[contained=true],
+.button.contained,
+button.button[variant*=contained],
+button.button[contained=true],
+button.button.contained,
+input[type=button][variant*=contained],
+input[type=button][contained=true],
+input[type=button].contained,
+input[type=submit][variant*=contained],
+input[type=submit][contained=true],
+input[type=submit].contained {
   border: var(--sld-button-border-width) solid var(--sld-button-border-color);
   color: var(--sld-color-on-primary);
   background-color: var(--sld-button-contained-background);
   background-clip: padding-box;
   box-shadow: var(--sld-elevation-1);
 }
-
-:global(button)[variant*=contained]:hover, :global(button)[contained=true]:hover, :global(button).contained:hover,
-:global(.button)[variant*=contained]:hover,
-:global(.button)[contained=true]:hover,
-:global(.button).contained:hover,
-:global(button.button)[variant*=contained]:hover,
-:global(button.button)[contained=true]:hover,
-:global(button.button).contained:hover,
-:global(input[type="button"])[variant*=contained]:hover,
-:global(input[type="button"])[contained=true]:hover,
-:global(input[type="button"]).contained:hover,
-:global(input[type="submit"])[variant*=contained]:hover,
-:global(input[type="submit"])[contained=true]:hover,
-:global(input[type="submit"]).contained:hover {
+button[variant*=contained]:hover, button[contained=true]:hover, button.contained:hover,
+.button[variant*=contained]:hover,
+.button[contained=true]:hover,
+.button.contained:hover,
+button.button[variant*=contained]:hover,
+button.button[contained=true]:hover,
+button.button.contained:hover,
+input[type=button][variant*=contained]:hover,
+input[type=button][contained=true]:hover,
+input[type=button].contained:hover,
+input[type=submit][variant*=contained]:hover,
+input[type=submit][contained=true]:hover,
+input[type=submit].contained:hover {
   background-color: var(--sld-color-secondary);
   color: var(--sld-color-on-secondary);
 }
-
-:global(button)[variant*=contained]:focus, :global(button)[variant*=contained]:active, :global(button)[contained=true]:focus, :global(button)[contained=true]:active, :global(button).contained:focus, :global(button).contained:active,
-:global(.button)[variant*=contained]:focus,
-:global(.button)[variant*=contained]:active,
-:global(.button)[contained=true]:focus,
-:global(.button)[contained=true]:active,
-:global(.button).contained:focus,
-:global(.button).contained:active,
-:global(button.button)[variant*=contained]:focus,
-:global(button.button)[variant*=contained]:active,
-:global(button.button)[contained=true]:focus,
-:global(button.button)[contained=true]:active,
-:global(button.button).contained:focus,
-:global(button.button).contained:active,
-:global(input[type="button"])[variant*=contained]:focus,
-:global(input[type="button"])[variant*=contained]:active,
-:global(input[type="button"])[contained=true]:focus,
-:global(input[type="button"])[contained=true]:active,
-:global(input[type="button"]).contained:focus,
-:global(input[type="button"]).contained:active,
-:global(input[type="submit"])[variant*=contained]:focus,
-:global(input[type="submit"])[variant*=contained]:active,
-:global(input[type="submit"])[contained=true]:focus,
-:global(input[type="submit"])[contained=true]:active,
-:global(input[type="submit"]).contained:focus,
-:global(input[type="submit"]).contained:active {
+button[variant*=contained]:focus, button[variant*=contained]:active, button[contained=true]:focus, button[contained=true]:active, button.contained:focus, button.contained:active,
+.button[variant*=contained]:focus,
+.button[variant*=contained]:active,
+.button[contained=true]:focus,
+.button[contained=true]:active,
+.button.contained:focus,
+.button.contained:active,
+button.button[variant*=contained]:focus,
+button.button[variant*=contained]:active,
+button.button[contained=true]:focus,
+button.button[contained=true]:active,
+button.button.contained:focus,
+button.button.contained:active,
+input[type=button][variant*=contained]:focus,
+input[type=button][variant*=contained]:active,
+input[type=button][contained=true]:focus,
+input[type=button][contained=true]:active,
+input[type=button].contained:focus,
+input[type=button].contained:active,
+input[type=submit][variant*=contained]:focus,
+input[type=submit][variant*=contained]:active,
+input[type=submit][contained=true]:focus,
+input[type=submit][contained=true]:active,
+input[type=submit].contained:focus,
+input[type=submit].contained:active {
   background-color: var(--sld-color-tertiary);
   color: var(--sld-color-on-tertiary);
   box-shadow: var(--sld-button-active-shadow);
 }
-
-:global(button)[variant*=link], :global(button)[link=true], :global(button).link, :global(button)[role=link],
-:global(.button)[variant*=link],
-:global(.button)[link=true],
-:global(.button).link,
-:global(.button)[role=link],
-:global(button.button)[variant*=link],
-:global(button.button)[link=true],
-:global(button.button).link,
-:global(button.button)[role=link],
-:global(input[type="button"])[variant*=link],
-:global(input[type="button"])[link=true],
-:global(input[type="button"]).link,
-:global(input[type="button"])[role=link],
-:global(input[type="submit"])[variant*=link],
-:global(input[type="submit"])[link=true],
-:global(input[type="submit"]).link,
-:global(input[type="submit"])[role=link] {
+button[variant*=link], button[link=true], button.link, button[role=link],
+.button[variant*=link],
+.button[link=true],
+.button.link,
+.button[role=link],
+button.button[variant*=link],
+button.button[link=true],
+button.button.link,
+button.button[role=link],
+input[type=button][variant*=link],
+input[type=button][link=true],
+input[type=button].link,
+input[type=button][role=link],
+input[type=submit][variant*=link],
+input[type=submit][link=true],
+input[type=submit].link,
+input[type=submit][role=link] {
   color: var(--sld-color-primary);
   text-decoration: underline;
   text-underline-offset: 0.35rem;
@@ -1106,208 +1038,199 @@ let startRef = $state(void 0);
   cursor: pointer;
   border: none;
 }
-
-:global(button)[variant*=link]:hover, :global(button)[link=true]:hover, :global(button).link:hover, :global(button)[role=link]:hover,
-:global(.button)[variant*=link]:hover,
-:global(.button)[link=true]:hover,
-:global(.button).link:hover,
-:global(.button)[role=link]:hover,
-:global(button.button)[variant*=link]:hover,
-:global(button.button)[link=true]:hover,
-:global(button.button).link:hover,
-:global(button.button)[role=link]:hover,
-:global(input[type="button"])[variant*=link]:hover,
-:global(input[type="button"])[link=true]:hover,
-:global(input[type="button"]).link:hover,
-:global(input[type="button"])[role=link]:hover,
-:global(input[type="submit"])[variant*=link]:hover,
-:global(input[type="submit"])[link=true]:hover,
-:global(input[type="submit"]).link:hover,
-:global(input[type="submit"])[role=link]:hover {
+button[variant*=link]:hover, button[link=true]:hover, button.link:hover, button[role=link]:hover,
+.button[variant*=link]:hover,
+.button[link=true]:hover,
+.button.link:hover,
+.button[role=link]:hover,
+button.button[variant*=link]:hover,
+button.button[link=true]:hover,
+button.button.link:hover,
+button.button[role=link]:hover,
+input[type=button][variant*=link]:hover,
+input[type=button][link=true]:hover,
+input[type=button].link:hover,
+input[type=button][role=link]:hover,
+input[type=submit][variant*=link]:hover,
+input[type=submit][link=true]:hover,
+input[type=submit].link:hover,
+input[type=submit][role=link]:hover {
   text-decoration: underline;
 }
-
-:global(button)[variant*=link]:focus, :global(button)[variant*=link]:active, :global(button)[link=true]:focus, :global(button)[link=true]:active, :global(button).link:focus, :global(button).link:active, :global(button)[role=link]:focus, :global(button)[role=link]:active,
-:global(.button)[variant*=link]:focus,
-:global(.button)[variant*=link]:active,
-:global(.button)[link=true]:focus,
-:global(.button)[link=true]:active,
-:global(.button).link:focus,
-:global(.button).link:active,
-:global(.button)[role=link]:focus,
-:global(.button)[role=link]:active,
-:global(button.button)[variant*=link]:focus,
-:global(button.button)[variant*=link]:active,
-:global(button.button)[link=true]:focus,
-:global(button.button)[link=true]:active,
-:global(button.button).link:focus,
-:global(button.button).link:active,
-:global(button.button)[role=link]:focus,
-:global(button.button)[role=link]:active,
-:global(input[type="button"])[variant*=link]:focus,
-:global(input[type="button"])[variant*=link]:active,
-:global(input[type="button"])[link=true]:focus,
-:global(input[type="button"])[link=true]:active,
-:global(input[type="button"]).link:focus,
-:global(input[type="button"]).link:active,
-:global(input[type="button"])[role=link]:focus,
-:global(input[type="button"])[role=link]:active,
-:global(input[type="submit"])[variant*=link]:focus,
-:global(input[type="submit"])[variant*=link]:active,
-:global(input[type="submit"])[link=true]:focus,
-:global(input[type="submit"])[link=true]:active,
-:global(input[type="submit"]).link:focus,
-:global(input[type="submit"]).link:active,
-:global(input[type="submit"])[role=link]:focus,
-:global(input[type="submit"])[role=link]:active {
+button[variant*=link]:focus, button[variant*=link]:active, button[link=true]:focus, button[link=true]:active, button.link:focus, button.link:active, button[role=link]:focus, button[role=link]:active,
+.button[variant*=link]:focus,
+.button[variant*=link]:active,
+.button[link=true]:focus,
+.button[link=true]:active,
+.button.link:focus,
+.button.link:active,
+.button[role=link]:focus,
+.button[role=link]:active,
+button.button[variant*=link]:focus,
+button.button[variant*=link]:active,
+button.button[link=true]:focus,
+button.button[link=true]:active,
+button.button.link:focus,
+button.button.link:active,
+button.button[role=link]:focus,
+button.button[role=link]:active,
+input[type=button][variant*=link]:focus,
+input[type=button][variant*=link]:active,
+input[type=button][link=true]:focus,
+input[type=button][link=true]:active,
+input[type=button].link:focus,
+input[type=button].link:active,
+input[type=button][role=link]:focus,
+input[type=button][role=link]:active,
+input[type=submit][variant*=link]:focus,
+input[type=submit][variant*=link]:active,
+input[type=submit][link=true]:focus,
+input[type=submit][link=true]:active,
+input[type=submit].link:focus,
+input[type=submit].link:active,
+input[type=submit][role=link]:focus,
+input[type=submit][role=link]:active {
   text-decoration: underline;
   outline: none;
   box-shadow: none;
 }
-
-:global(button)[variant*=naked], :global(button)[naked=true], :global(button).naked,
-:global(.button)[variant*=naked],
-:global(.button)[naked=true],
-:global(.button).naked,
-:global(button.button)[variant*=naked],
-:global(button.button)[naked=true],
-:global(button.button).naked,
-:global(input[type="button"])[variant*=naked],
-:global(input[type="button"])[naked=true],
-:global(input[type="button"]).naked,
-:global(input[type="submit"])[variant*=naked],
-:global(input[type="submit"])[naked=true],
-:global(input[type="submit"]).naked {
+button[variant*=naked], button[naked=true], button.naked,
+.button[variant*=naked],
+.button[naked=true],
+.button.naked,
+button.button[variant*=naked],
+button.button[naked=true],
+button.button.naked,
+input[type=button][variant*=naked],
+input[type=button][naked=true],
+input[type=button].naked,
+input[type=submit][variant*=naked],
+input[type=submit][naked=true],
+input[type=submit].naked {
   color: inherit;
   background-color: transparent;
   border: 0px solid transparent;
   cursor: pointer;
 }
-
-:global(button)[variant*=naked]:hover, :global(button)[naked=true]:hover, :global(button).naked:hover,
-:global(.button)[variant*=naked]:hover,
-:global(.button)[naked=true]:hover,
-:global(.button).naked:hover,
-:global(button.button)[variant*=naked]:hover,
-:global(button.button)[naked=true]:hover,
-:global(button.button).naked:hover,
-:global(input[type="button"])[variant*=naked]:hover,
-:global(input[type="button"])[naked=true]:hover,
-:global(input[type="button"]).naked:hover,
-:global(input[type="submit"])[variant*=naked]:hover,
-:global(input[type="submit"])[naked=true]:hover,
-:global(input[type="submit"]).naked:hover {
+button[variant*=naked]:hover, button[naked=true]:hover, button.naked:hover,
+.button[variant*=naked]:hover,
+.button[naked=true]:hover,
+.button.naked:hover,
+button.button[variant*=naked]:hover,
+button.button[naked=true]:hover,
+button.button.naked:hover,
+input[type=button][variant*=naked]:hover,
+input[type=button][naked=true]:hover,
+input[type=button].naked:hover,
+input[type=submit][variant*=naked]:hover,
+input[type=submit][naked=true]:hover,
+input[type=submit].naked:hover {
   border-color: var(--sld-hover-border-color);
   background-color: var(--sld-background-disabled);
 }
-
-:global(button)[variant*=naked]:hover, :global(button)[naked=true]:hover, :global(button).naked:hover,
-:global(.button)[variant*=naked]:hover,
-:global(.button)[naked=true]:hover,
-:global(.button).naked:hover,
-:global(button.button)[variant*=naked]:hover,
-:global(button.button)[naked=true]:hover,
-:global(button.button).naked:hover,
-:global(input[type="button"])[variant*=naked]:hover,
-:global(input[type="button"])[naked=true]:hover,
-:global(input[type="button"]).naked:hover,
-:global(input[type="submit"])[variant*=naked]:hover,
-:global(input[type="submit"])[naked=true]:hover,
-:global(input[type="submit"]).naked:hover {
+button[variant*=naked]:hover, button[naked=true]:hover, button.naked:hover,
+.button[variant*=naked]:hover,
+.button[naked=true]:hover,
+.button.naked:hover,
+button.button[variant*=naked]:hover,
+button.button[naked=true]:hover,
+button.button.naked:hover,
+input[type=button][variant*=naked]:hover,
+input[type=button][naked=true]:hover,
+input[type=button].naked:hover,
+input[type=submit][variant*=naked]:hover,
+input[type=submit][naked=true]:hover,
+input[type=submit].naked:hover {
   background-color: var(--sld-button-hover-background);
 }
-
-:global(button)[variant*=naked]:active, :global(button)[variant*=naked]:focus, :global(button)[naked=true]:active, :global(button)[naked=true]:focus, :global(button).naked:active, :global(button).naked:focus,
-:global(.button)[variant*=naked]:active,
-:global(.button)[variant*=naked]:focus,
-:global(.button)[naked=true]:active,
-:global(.button)[naked=true]:focus,
-:global(.button).naked:active,
-:global(.button).naked:focus,
-:global(button.button)[variant*=naked]:active,
-:global(button.button)[variant*=naked]:focus,
-:global(button.button)[naked=true]:active,
-:global(button.button)[naked=true]:focus,
-:global(button.button).naked:active,
-:global(button.button).naked:focus,
-:global(input[type="button"])[variant*=naked]:active,
-:global(input[type="button"])[variant*=naked]:focus,
-:global(input[type="button"])[naked=true]:active,
-:global(input[type="button"])[naked=true]:focus,
-:global(input[type="button"]).naked:active,
-:global(input[type="button"]).naked:focus,
-:global(input[type="submit"])[variant*=naked]:active,
-:global(input[type="submit"])[variant*=naked]:focus,
-:global(input[type="submit"])[naked=true]:active,
-:global(input[type="submit"])[naked=true]:focus,
-:global(input[type="submit"]).naked:active,
-:global(input[type="submit"]).naked:focus {
+button[variant*=naked]:active, button[variant*=naked]:focus, button[naked=true]:active, button[naked=true]:focus, button.naked:active, button.naked:focus,
+.button[variant*=naked]:active,
+.button[variant*=naked]:focus,
+.button[naked=true]:active,
+.button[naked=true]:focus,
+.button.naked:active,
+.button.naked:focus,
+button.button[variant*=naked]:active,
+button.button[variant*=naked]:focus,
+button.button[naked=true]:active,
+button.button[naked=true]:focus,
+button.button.naked:active,
+button.button.naked:focus,
+input[type=button][variant*=naked]:active,
+input[type=button][variant*=naked]:focus,
+input[type=button][naked=true]:active,
+input[type=button][naked=true]:focus,
+input[type=button].naked:active,
+input[type=button].naked:focus,
+input[type=submit][variant*=naked]:active,
+input[type=submit][variant*=naked]:focus,
+input[type=submit][naked=true]:active,
+input[type=submit][naked=true]:focus,
+input[type=submit].naked:active,
+input[type=submit].naked:focus {
   background-color: transparent;
   border: 0.5px solid transparent;
   color: inherit;
 }
-
-:global(button)[variant*=flat], :global(button)[flat=true], :global(button).flat,
-:global(.button)[variant*=flat],
-:global(.button)[flat=true],
-:global(.button).flat,
-:global(button.button)[variant*=flat],
-:global(button.button)[flat=true],
-:global(button.button).flat,
-:global(input[type="button"])[variant*=flat],
-:global(input[type="button"])[flat=true],
-:global(input[type="button"]).flat,
-:global(input[type="submit"])[variant*=flat],
-:global(input[type="submit"])[flat=true],
-:global(input[type="submit"]).flat {
+button[variant*=flat], button[flat=true], button.flat,
+.button[variant*=flat],
+.button[flat=true],
+.button.flat,
+button.button[variant*=flat],
+button.button[flat=true],
+button.button.flat,
+input[type=button][variant*=flat],
+input[type=button][flat=true],
+input[type=button].flat,
+input[type=submit][variant*=flat],
+input[type=submit][flat=true],
+input[type=submit].flat {
   color: inherit;
   background-color: transparent;
   border: none;
   border-radius: 0;
   cursor: pointer;
 }
-
-:global(button)[variant*=flat]:hover, :global(button)[flat=true]:hover, :global(button).flat:hover,
-:global(.button)[variant*=flat]:hover,
-:global(.button)[flat=true]:hover,
-:global(.button).flat:hover,
-:global(button.button)[variant*=flat]:hover,
-:global(button.button)[flat=true]:hover,
-:global(button.button).flat:hover,
-:global(input[type="button"])[variant*=flat]:hover,
-:global(input[type="button"])[flat=true]:hover,
-:global(input[type="button"]).flat:hover,
-:global(input[type="submit"])[variant*=flat]:hover,
-:global(input[type="submit"])[flat=true]:hover,
-:global(input[type="submit"]).flat:hover {
+button[variant*=flat]:hover, button[flat=true]:hover, button.flat:hover,
+.button[variant*=flat]:hover,
+.button[flat=true]:hover,
+.button.flat:hover,
+button.button[variant*=flat]:hover,
+button.button[flat=true]:hover,
+button.button.flat:hover,
+input[type=button][variant*=flat]:hover,
+input[type=button][flat=true]:hover,
+input[type=button].flat:hover,
+input[type=submit][variant*=flat]:hover,
+input[type=submit][flat=true]:hover,
+input[type=submit].flat:hover {
   background-color: var(--sld-button-hover-background);
 }
-
-:global(button)[variant*=flat]:active, :global(button)[variant*=flat]:focus, :global(button)[flat=true]:active, :global(button)[flat=true]:focus, :global(button).flat:active, :global(button).flat:focus,
-:global(.button)[variant*=flat]:active,
-:global(.button)[variant*=flat]:focus,
-:global(.button)[flat=true]:active,
-:global(.button)[flat=true]:focus,
-:global(.button).flat:active,
-:global(.button).flat:focus,
-:global(button.button)[variant*=flat]:active,
-:global(button.button)[variant*=flat]:focus,
-:global(button.button)[flat=true]:active,
-:global(button.button)[flat=true]:focus,
-:global(button.button).flat:active,
-:global(button.button).flat:focus,
-:global(input[type="button"])[variant*=flat]:active,
-:global(input[type="button"])[variant*=flat]:focus,
-:global(input[type="button"])[flat=true]:active,
-:global(input[type="button"])[flat=true]:focus,
-:global(input[type="button"]).flat:active,
-:global(input[type="button"]).flat:focus,
-:global(input[type="submit"])[variant*=flat]:active,
-:global(input[type="submit"])[variant*=flat]:focus,
-:global(input[type="submit"])[flat=true]:active,
-:global(input[type="submit"])[flat=true]:focus,
-:global(input[type="submit"]).flat:active,
-:global(input[type="submit"]).flat:focus {
+button[variant*=flat]:active, button[variant*=flat]:focus, button[flat=true]:active, button[flat=true]:focus, button.flat:active, button.flat:focus,
+.button[variant*=flat]:active,
+.button[variant*=flat]:focus,
+.button[flat=true]:active,
+.button[flat=true]:focus,
+.button.flat:active,
+.button.flat:focus,
+button.button[variant*=flat]:active,
+button.button[variant*=flat]:focus,
+button.button[flat=true]:active,
+button.button[flat=true]:focus,
+button.button.flat:active,
+button.button.flat:focus,
+input[type=button][variant*=flat]:active,
+input[type=button][variant*=flat]:focus,
+input[type=button][flat=true]:active,
+input[type=button][flat=true]:focus,
+input[type=button].flat:active,
+input[type=button].flat:focus,
+input[type=submit][variant*=flat]:active,
+input[type=submit][variant*=flat]:focus,
+input[type=submit][flat=true]:active,
+input[type=submit][flat=true]:focus,
+input[type=submit].flat:active,
+input[type=submit].flat:focus {
   background-color: transparent;
   border: none;
   border-radius: 0;