/* Ripple and Tailwind CSS personalized */
 :root,
[data-theme] {
  background-color: rgb(var(--backgroundPrimary)/var(--tw-bg-opacity, 1));
  color: rgb(var(--content1)/var(--tw-text-opacity, 1))
}

:root {
/* color-scheme: dark; */
  --backgroundPrimary: 22 22 22;
  --backgroundSecondary: 28 28 28;
  --border: 52 52 52;
  --content1: 232 232 232;
  --content2: 186 186 186;
  --content3: 118 118 118;
  --whiteInverted: 255 255 255;
  --blackInverted: 0 0 0;
  --neutral: 105 113 119;
  --primary: 0 114 245;
  --secondary: 151 80 221;
  --success: 23 201 100;
  --error: 243 18 96;
  --warning: 255 184 0;
  --blue-1: 15 23 32;
  --blue-2: 15 27 45;
  --blue-3: 16 36 62;
  --blue-4: 16 42 76;
  --blue-5: 15 48 88;
  --blue-6: 13 56 104;
  --blue-7: 10 68 129;
  --blue-8: 9 84 165;
  --blue-9: 0 145 255;
  --blue-10: 54 158 255;
  --blue-11: 82 169 255;
  --blue-12: 234 246 255;
  --green-1: 13 25 18;
  --green-2: 12 31 23;
  --green-3: 15 41 30;
  --green-4: 17 49 35;
  --green-5: 19 57 41;
  --green-6: 22 68 48;
  --green-7: 27 84 58;
  --green-8: 35 110 74;
  --green-9: 48 164 108;
  --green-10: 60 177 121;
  --green-11: 76 195 138;
  --green-12: 229 251 235;
  --purple-1: 27 20 29;
  --purple-2: 34 21 39;
  --purple-3: 48 26 58;
  --purple-4: 58 30 72;
  --purple-5: 67 33 85;
  --purple-6: 78 38 103;
  --purple-7: 95 45 132;
  --purple-8: 121 56 178;
  --purple-9: 142 78 198;
  --purple-10: 157 91 210;
  --purple-11: 191 122 240;
  --purple-12: 247 236 252;
  --yellow-1: 28 21 0;
  --yellow-2: 34 26 0;
  --yellow-3: 44 33 0;
  --yellow-4: 53 40 0;
  --yellow-5: 62 48 0;
  --yellow-6: 73 60 0;
  --yellow-7: 89 74 5;
  --yellow-8: 112 94 0;
  --yellow-9: 245 217 10;
  --yellow-10: 255 239 92;
  --yellow-11: 240 192 0;
  --yellow-12: 255 250 209;
  --red-1: 31 19 21;
  --red-2: 41 20 21;
  --red-3: 60 24 26;
  --red-4: 72 26 29;
  --red-5: 84 27 31;
  --red-6: 103 30 34;
  --red-7: 130 32 37;
  --red-8: 170 36 41;
  --red-9: 229 72 77;
  --red-10: 242 85 90;
  --red-11: 255 99 105;
  --red-12: 254 236 238;
  --cyan-1: 7 25 29;
  --cyan-2: 6 30 36;
  --cyan-3: 7 40 48;
  --cyan-4: 7 48 59;
  --cyan-5: 7 56 68;
  --cyan-6: 6 65 80;
  --cyan-7: 4 80 99;
  --cyan-8: 0 100 125;
  --cyan-9: 5 162 194;
  --cyan-10: 0 177 204;
  --cyan-11: 0 194 215;
  --cyan-12: 225 248 250;
  --pink-1: 31 18 27;
  --pink-2: 39 20 33;
  --pink-3: 58 24 47;
  --pink-4: 69 26 55;
  --pink-5: 80 27 63;
  --pink-6: 96 29 72;
  --pink-7: 122 29 90;
  --pink-8: 167 24 115;
  --pink-9: 214 64 159;
  --pink-10: 227 75 169;
  --pink-11: 246 92 182;
  --pink-12: 254 235 247;
  --gray-1: 22 22 22;
  --gray-2: 28 28 28;
  --gray-3: 35 35 35;
  --gray-4: 40 40 40;
  --gray-5: 46 46 46;
  --gray-6: 52 52 52;
  --gray-7: 62 62 62;
  --gray-8: 80 80 80;
  --gray-9: 112 112 112;
  --gray-10: 126 126 126;
  --gray-11: 160 160 160;
  --gray-12: 237 237 237;
  --slate-1: 21 23 24;
  --slate-2: 26 29 30;
  --slate-3: 32 36 37;
  --slate-4: 38 41 43;
  --slate-5: 43 47 49;
  --slate-6: 49 53 56;
  --slate-7: 58 63 66;
  --slate-8: 76 81 85;
  --slate-9: 105 113 119;
  --slate-10: 120 127 133;
  --slate-11: 155 161 166;
  --slate-12: 236 237 238;

  --gray-light-1:252 252 252;
  --gray-light-2:248 248 248;
  --gray-light-3:243 243 243;
  --gray-light-4:237 237 237;
  --gray-light-5:232 232 232;
  --gray-light-6:226 226 226;
  --gray-light-7: 219 219 219;
  --gray-light-8: 199 199 199;
  --gray-light-9: 143 143 143;
  --gray-light-10: 133 133 133;
  --gray-light-11: 111 111 111;
  --gray-light-12: 23 23 23;
  --content-light-1:28 28 28;
  --content-light-3:150 150 150;

}
 



.input {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  background-color: rgb(var(--gray-1)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  border-radius: .75rem;
  border-width: 2px;
  color: rgb(var(--content1)/var(--tw-text-opacity));
  /*font-size: 1rem;
   height: 2.5rem; 
  line-height: 1.5rem;
  max-width: 20rem;*/
  outline: 1px solid #0000;
  outline-offset: 1px;
  padding: .3rem .75rem;
 
  /* width: 100%; */
}

.input::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.input::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.input:disabled {
  opacity: .5;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}
 

.input-light {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  background-color: rgb(var(--gray-light-1)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-light-9)/var(--tw-border-opacity));
  border-radius: .55rem;
  border-width: 1px;
  color: rgb(var(--content-light-1)/var(--tw-text-opacity));
  /*font-size: 1rem;
   height: 2.5rem; 
  line-height: 1.5rem;*/
  max-width: 20rem;
  outline: 2px solid #0000;
  outline-offset: 2px;
  padding: .3rem .75rem;

  width: 100%
}

.input-light::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content-light-3)/var(--tw-text-opacity))
}

.input-light::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content-light-3)/var(--tw-text-opacity))
}

.input-light:disabled {
  opacity: .5;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}




.textarea {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  background-color: rgb(var(--gray-1)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  border-radius: .75rem;
  border-width: 2px;
  color: rgb(var(--content1)/var(--tw-text-opacity));
  font-size: 1rem;
  height: -moz-fit-content;
  height: fit-content;
  line-height: 1.5rem;
  max-width: 20rem;
  outline: 2px solid #0000;
  outline-offset: 2px;
  padding: .625rem .75rem;
  width: 100%
}

.textarea::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.textarea::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.textarea:disabled {
  opacity: .5;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

.select {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: rgb(var(--gray-1)/var(--tw-bg-opacity));
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' class='select-icon' style='fill:%237e868c'%3E%3Cpath d='M16.293 9.293 12 13.586 7.707 9.293l-1.414 1.414L12 16.414l5.707-5.707z'/%3E%3C/svg%3E");
  background-position: right .5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  border-radius: .75rem;
  border-width: 2px;
  color: rgb(var(--content1)/var(--tw-text-opacity));
  font-size: 1rem;
  height: 2.5rem;
  line-height: 1.5rem;
  max-width: 20rem;
  outline: 2px solid #0000;
  outline-offset: 2px;
  padding-left: .75rem;
  padding-right: .75rem;
  width: 100%
}

.select::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.select::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--content3)/var(--tw-text-opacity))
}

.select:disabled {
  opacity: .5;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}




.dropdown-container {
  display: flex
}

.dropdown {
  display: inline-block;
  position: relative;
  text-align: left;
  width: -moz-max-content;
  width: max-content;
}

.dropdown-menu a{
  touch-action: manipulation;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
.dropdown-menu {
  --tw-translate-y: -0.5rem;
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  --tw-bg-opacity: 1;
  --tw-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  background-color: rgb(var(--gray-3)/var(--tw-bg-opacity));
  border-radius: .75rem;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  opacity: 0;
  outline: 2px solid transparent;
  outline-offset: 2px;
  position: absolute;
  right: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: top right;
  transition-duration: .15s;
  transition-property: transform, opacity, visibility;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  visibility: hidden;
  width: 14rem;
  will-change: transform;
  z-index: 49;

}

.dropdown-item,
.dropdown-menu {
  display: flex;
  flex-direction: column;
  padding: .5rem
}

.dropdown-item {
  border-radius: 5px;
  cursor: pointer;
  transition: transform .12s ease;
  width: 100%
}

.dropdown-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-4)/var(--tw-bg-opacity))
}

.dropdown-item:active {
  --tw-scale-x: 0.97;
  --tw-scale-y: 0.97;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-5)/var(--tw-bg-opacity));
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.dropdown-item.dropdown-active {
  transition-property: none
}

.dropdown-item.dropdown-active:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-5)/var(--tw-bg-opacity))
}

.dropdown-item.dropdown-active:active {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.dropdown-divider {
  margin-bottom: 1px;
  margin-top: 1px;
  position: relative
}

.dropdown-divider:before {
  --tw-bg-opacity: 1;
  --tw-content: "";
  background-color: rgb(var(--gray-6)/var(--tw-bg-opacity));
  content: var(--tw-content);
  height: 1px;
  left: -.5rem;
  position: absolute;
  right: 0;
  top: 0
}

.dropdown-active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-5)/var(--tw-bg-opacity))
}

.dropdown-item-no-animation {
  transition-property: none
}

.dropdown-item-no-animation:active {
  --tw-scale-x: 1;
  --tw-scale-y: 1
}

.dropdown-item-no-animation:active,
.dropdown-menu-bottom-center {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.dropdown-menu-bottom-center {
  transform-origin: top
}

.dropdown-menu-bottom-center,
.dropdown-menu-top-center {
  --tw-translate-x: -50%;
  left: 50%;
  right: 100%;
  visibility: hidden
}

.dropdown-menu-top-center {
  bottom: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: bottom
}

.dropdown-menu-bottom-right {
  --tw-translate-y: -0.5rem;
  left: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: top left;
  visibility: hidden
}

.dropdown-menu-bottom-left {
  --tw-translate-y: -0.5rem;
  right: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: top right;
  visibility: hidden
}

.dropdown-menu-top-right {
  margin-left: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: bottom left
}

.dropdown-menu-top-left,
.dropdown-menu-top-right {
  --tw-translate-y: -0.5rem;
  bottom: 100%;
  left: 50%;
  visibility: hidden
}

.dropdown-menu-top-left {
  margin-left: auto;
  right: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: bottom right
}

.dropdown-menu-left {
  right: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: right
}

.dropdown-menu-left,
.dropdown-menu-right {
  --tw-translate-y: -50%;
  bottom: auto;
  top: 50%;
  visibility: hidden
}

.dropdown-menu-right {
  left: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: left
}

.dropdown-menu-left-bottom {
  --tw-translate-y: -2.5rem;
  right: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: top right;
  visibility: hidden
}

.dropdown-menu-right-bottom {
  --tw-translate-y: -2.5rem;
  left: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: top left;
  visibility: hidden
}

.dropdown-menu-left-top {
  bottom: 0;
  right: 100%;
  transform-origin: bottom right;
  visibility: hidden
}

.dropdown-menu-right-top {
  --tw-translate-y: -0.5rem;
  bottom: 0;
  left: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: bottom left;
  visibility: hidden
}

.dropdown-hover:hover .dropdown-menu,
.dropdown-hover:hover .dropdown-menu-bottom-left,
.dropdown-hover:hover .dropdown-menu-bottom-right,
.dropdown.dropdown-open .dropdown-menu,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-bottom-left,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-bottom-right,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-bottom-left,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-bottom-right {
  --tw-translate-x: 0px;
  --tw-translate-y: 0px;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-top-left,
.dropdown-hover:hover .dropdown-menu-top-right,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-top-left,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-top-right,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-top-left,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-top-right {
  --tw-translate-x: 0px;
  --tw-translate-y: -0px;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-right,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-right,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-right {
  --tw-translate-x: 0px;
  --tw-translate-y: -50%;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  bottom: auto;
  opacity: 1;
  right: auto;
  top: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-left,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-left,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-left {
  --tw-translate-x: 0px;
  --tw-translate-y: -50%;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  bottom: auto;
  left: auto;
  opacity: 1;
  top: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-left-bottom,
.dropdown-hover:hover .dropdown-menu-right-bottom,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-left-bottom,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-right-bottom,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-left-bottom,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-right-bottom {
  --tw-translate-x: 0px;
  --tw-translate-y: -2.5rem;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-left-top,
.dropdown-hover:hover .dropdown-menu-right-top,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-left-top,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-right-top,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-left-top,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-right-top {
  --tw-translate-x: 0px;
  --tw-translate-y: 0px;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-bottom-center,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-bottom-center,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-bottom-center {
  --tw-translate-x: -50%;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

.dropdown-hover:hover .dropdown-menu-top-center,
.dropdown.dropdown-open .dropdown-menu.dropdown-menu-top-center,
.dropdown:not(.dropdown-hover):where(:focus, :focus-within) .dropdown-menu-top-center {
  --tw-translate-x: -50%;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y));
}
  









.checkbox {
  --checkbox-bg: rgb(var(--gray-1));
  --checkbox-border: rgb(var(--gray-6));
  --checkbox-bg-checked: rgb(var(--primary));
  --checkbox-border-checked: rgb(var(--primary));
  --checkbox-border-hover: rgb(var(--gray-7));
  --checkbox-bg-hover: rgb(var(--gray-3));
  --checkline-color: #fff;
  accent-color: rgb(var(--backgroundPrimary));
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--checkbox-bg);
  border-color: var(--checkbox-border);
  border-radius: .375rem;
  border-width: 1px;
  cursor: pointer;
  display: inline-block;
  height: 1.25rem;
  min-height: 1.25rem;
  margin: 0;
  outline: 2px solid #0000;
  outline-offset: 2px;
  position: relative;
  transition: background .3s, border-color .3s, box-shadow .2s;
  vertical-align: top;
  width: 1.25rem;
  min-width: 1.25rem
}

.checkbox:focus {
  outline-width: 2px
}

.checkbox:focus-visible {
  outline-color: rgb(var(--primary));
  outline-offset: 2px;
  outline-style: solid
}

.checkbox:after {
  --tw-content: "";
  content: var(--tw-content);
  display: block;
  left: 7px;
  position: absolute;
  top: 4px;
  transition: transform var(--d-t, .3s) var(--d-t-e, ease), opacity var(--d-o, .2s);
  border-color: var(--checkline-color);
  border-width: 0 2px 2px 0;
  height: 9px;
  opacity: var(--o, 0);
  transform: rotate(var(--r, 20deg));
  width: 5px
}

.checkbox:checked {
  --d-o: 0.3s;
  --d-t: 0.6s;
  --d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2);
  --o: 1;
  --r: 43deg;
  background-color: var(--checkbox-bg-checked);
  border-color: var(--checkbox-border-checked)
}

.checkbox:disabled {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-7)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-7)/var(--tw-border-opacity));
  cursor: not-allowed;
  opacity: .5
}

.checkbox:disabled+label {
  cursor: not-allowed
}

.checkbox:hover:not(:checked):not(:disabled) {
  background-color: var(--checkbox-bg-hover);
  border-color: var(--checkbox-border-hover)
}

.checkbox.checkbox-xs:after {
  height: 8px;
  left: 2.5px;
  top: .5px;
  width: 5px
}

.checkbox.checkbox-sm:after {
  height: 8px;
  left: 5px;
  top: 2px;
  width: 5px
}

.checkbox.checkbox-md:after {
  height: 9px;
  left: 7px;
  top: 4px;
  width: 5px
}

.checkbox.checkbox-lg:after {
  height: 12px;
  left: 9px;
  top: 4px;
  width: 6px
}

.checkbox.checkbox-xl:after {
  height: 14px;
  left: 10px;
  top: 5px;
  width: 6px
}

.radio {
  --radio-bg: rgb(var(--gray-1));
  --radio-border: rgb(var(--gray-6));
  --radio-bg-checked: rgb(var(--primary));
  --radio-border-checked: rgb(var(--primary));
  --radio-border-hover: rgb(var(--gray-7));
  --radio-bg-hover: rgb(var(--gray-3));
  --checkline-color: #fff;
  accent-color: rgb(var(--backgroundPrimary));
  align-items: center;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--radio-bg);
  border-color: var(--radio-border);
  border-radius: 9999px;
  border-width: 1px;
  cursor: pointer;
  display: flex;
  height: 1.25rem;
  justify-content: center;
  margin: 0;
  position: relative;
  transition: background .3s, border-color .3s, box-shadow .2s;
  vertical-align: top;
  width: 1.25rem
}

.radio:focus {
  outline-width: 2px
}

.radio:focus-visible {
  outline-color: rgb(var(--primary));
  outline-offset: 2px;
  outline-style: solid
}

.radio:checked {
  --d-o: 0.3s;
  --d-t: 0.6s;
  --d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2);
  --r: 43deg;
  background-color: var(--radio-bg-checked);
  border-color: var(--radio-border-checked);
  --o: 1;
  --s: 0.5
}

.radio:disabled {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-7)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-7)/var(--tw-border-opacity));
  cursor: not-allowed;
  opacity: .5
}

.radio:disabled+label {
  cursor: not-allowed
}

.radio:hover:not(:checked):not(:disabled) {
  background-color: var(--radio-bg-hover);
  border-color: var(--radio-border-hover)
}

.radio:not(.switch):after {
  opacity: var(--o, 0)
}

.radio:after {
  --tw-content: "";
  background-color: var(--checkline-color);
  border-radius: 9999px;
  content: var(--tw-content);
  display: flex;
  height: 100%;
  opacity: 0;
  position: relative;
  transform: scale(var(--s, .7));
  transition-duration: .15s;
  transition-property: transform, opacity;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  width: 1.25rem
}

.radio.radio-xs:after {
  height: 10px;
  width: 10px
}

.radio.radio-sm:after {
  height: 14px;
  width: 14px
}

.radio-md,
.radio.radio-md:after {
  width: 1.25rem
}

.radio.radio-lg:after {
  height: 22px;
  width: 22px
}

.radio.radio-xl:after {
  height: 26px;
  width: 26px
}

.switch {
  --switch-bg: rgb(var(--gray-6));
  --switch-border: rgb(var(--gray-6));
  --switch-bg-checked: rgb(var(--primary));
  --switch-border-checked: rgb(var(--primary));
  --switch-border-hover: rgb(var(--gray-6));
  --switch-bg-hover: rgb(var(--gray-6));
  --checkline-color: #fff;
  --circle-color: rgb(var(--gray-1));
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--switch-bg);
  border-color: var(--switch-border);
  border-radius: .75rem;
  border-width: 1px;
  cursor: pointer;
  display: inline-block;
  height: 21px;
  margin: 0;
  outline: 2px solid #0000;
  outline-offset: 2px;
  position: relative;
  transition: background .15s, border-color .15s, box-shadow .15s;
  vertical-align: top;
  width: 38px
}

.switch:focus {
  outline-width: 2px
}

.switch:focus-visible {
  outline-color: rgb(var(--primary));
  outline-offset: 2px;
  outline-style: solid
}

.switch:after {
  --tw-content: "";
  content: var(--tw-content);
  display: block;
  left: 2px;
  position: absolute;
  top: 2px;
  transition: transform var(--d-t, .15s) var(--d-t-e, ease), opacity var(--d-o, .15s);
  background-color: var(--circle-color);
  border-radius: 9999px;
  height: 15px;
  transform: translateX(var(--x, 0));
  width: 15px
}

.switch:checked {
  --circle-color: #fff;
  --o: 1;
  --r: 43deg;
  background-color: var(--switch-bg-checked);
  border-color: var(--switch-border-checked);
  --x: 17px
}

.switch:disabled {
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-7)/var(--tw-bg-opacity));
  border-color: rgb(var(--gray-7)/var(--tw-border-opacity));
  cursor: not-allowed;
  opacity: .5
}

.switch:disabled:checked {
  --circle-color: #fff
}

.switch:disabled+label {
  cursor: not-allowed
}

.switch:hover:not(:checked):not(:disabled) {
  background-color: var(--switch-bg-hover);
  border-color: var(--switch-border-hover)
}

.switch:disabled:not(:checked):after {
  opacity: .6
}

.switch.switch-xs:checked {
  --x: 8px
}

.switch.switch-xs:after {
  height: 12px;
  left: 1.4px;
  top: 1px;
  width: 12px
}

.switch.switch-sm:checked {
  --x: 14px
}

.switch.switch-sm:after {
  height: 13px;
  left: 1.7px;
  top: 2px;
  width: 13px
}

.switch.switch-md:after {
  height: 15px;
  left: 2px;
  top: 2px;
  width: 15px
}

.switch.switch-lg:checked {
  --x: 22px
}

.switch.switch-lg:after {
  height: 20px;
  left: 2.5px;
  top: 2.5px;
  width: 20px
}

.switch.switch-xl:checked {
  --x: 26px
}

.switch.switch-xl:after {
  height: 23px;
  left: 2.5px;
  top: 3px;
  width: 23px
}

.modal {
  align-items: center;
  background-color: #0009;
  display: flex;
  inset: 0;
  justify-content: center;
  opacity: 0;
  overscroll-behavior: none;
  padding-left: 1rem;
  padding-right: 1rem;
  position: fixed;
  text-align: left;
  transition-duration: .15s;
  transition-property: all;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  visibility: hidden;
  z-index: 60
}

.modal-overlay {
  inset: 0;
  position: absolute
}

.modal-state { display: none }

.modal-state:checked+.modal {
  --tw-translate-y: 0px;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  opacity: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  visibility: visible
}

html:has(.modal-state:checked) {
  overflow: hidden
}

.modal-state:checked+.modal .modal-content {
  --tw-translate-y: 0px;
  --tw-scale-x: 1;
  --tw-scale-y: 1
}

.modal-content,
.modal-state:checked+.modal .modal-content {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.modal-content {
  --tw-scale-x: .9;
  --tw-scale-y: .9;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-1)/var(--tw-bg-opacity));
  border-radius: .75rem;
  height: -moz-max-content;
  height: max-content;
  max-height: 90%;
  max-width: 36rem;
  overflow: auto;
  padding: 2.5rem 2rem 2rem 2rem;
  position: relative;
  transition-duration: 75ms;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

 




.table {
  --tw-border-spacing-x: 0px;
  --tw-border-spacing-y: 0px;
  border-collapse: initial;
  border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
  width: 100%
}

.table>thead>tr th:first-child {
  --tw-border-opacity: 1;
  border-bottom-left-radius: .375rem;
  border-bottom-width: 1px;
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  border-left-width: 1px;
  border-top-left-radius: .375rem;
  border-top-width: 1px
}

.table>thead>tr th:last-child {
  border-bottom-right-radius: .375rem;
  border-right-width: 1px;
  border-top-right-radius: .375rem
}

.table>thead>tr :not(.th:first-child, .th:last-child),
.table>thead>tr th:last-child {
  --tw-border-opacity: 1;
  border-bottom-width: 1px;
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  border-top-width: 1px
}

.table>thead>tr>th {
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  background-color: rgb(var(--gray-3)/var(--tw-bg-opacity));
  color: rgb(var(--content1)/var(--tw-text-opacity));
  font-weight: 400
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>thead>tr>th {
  font-size: .875rem;
  line-height: 1.25rem;
  padding: 1rem .625rem;
  text-align: start;
  white-space: nowrap
}

.table>tbody>tr>td,
.table>tbody>tr>th {
  --tw-border-opacity: 1;
  --tw-text-opacity: 1;
  border-bottom-width: 1px;
  border-color: rgb(var(--gray-6)/var(--tw-border-opacity));
  color: rgb(var(--content2)/var(--tw-text-opacity))
}

.table.table-compact>tbody>tr>td,
.table.table-compact>tbody>tr>th {
  padding-bottom: .625rem;
  padding-top: .625rem
}

.table.table-compact>tbody>tr>td:first-child,
.table.table-compact>tbody>tr>td:last-child,
.table.table-compact>tbody>tr>td:not(:first-child):not(:last-child),
.table.table-compact>tbody>tr>th:first-child,
.table.table-compact>tbody>tr>th:last-child,
.table.table-compact>tbody>tr>th:not(:first-child):not(:last-child) {
  padding-left: .625rem;
  padding-right: .625rem
}

.table.table-compact>thead>tr>th {
  padding-bottom: .625rem;
  padding-top: .625rem
}

.table.table-compact>thead>tr>th:first-child {
  padding-left: .625rem;
  padding-right: .625rem
}

.card,
.table.table-hover>tbody>tr:hover>td,
.table.table-hover>tbody>tr:hover>th,
.table.table-zebra>tbody>tr:nth-child(2n)>td,
.table.table-zebra>tbody>tr:nth-child(2n)>th {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-3)/var(--tw-bg-opacity))
}

.divider:not(:empty) {
  gap: 1rem
}

.divider {
  align-items: center;
  display: flex;
  flex-direction: row;
  height: 1rem;
  margin-bottom: 1rem;
  margin-top: 1rem;
  white-space: nowrap
}

.divider-horizontal:after,
.divider-horizontal:before,
.divider:after,
.divider:before {
  --tw-bg-opacity: 1;
  --tw-content: "";
  background-color: rgb(var(--gray-6)/var(--tw-bg-opacity));
  content: var(--tw-content);
  height: 1px;
  width: 100%
}
 
 
.step,
.steps-horizontal {
  align-items: center;
  flex-direction: row;
  width: 100%
}

.step {
  display: flex;
  gap: .5rem;
  white-space: nowrap
}

.steps-horizontal .step {
  flex-direction: row;
  white-space: nowrap;
  width: 100%
}

.steps-vertical .step {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  width: -moz-fit-content;
  width: fit-content
}

.step:not(:last-child):after {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-6)/var(--tw-bg-opacity))
}

.step:not(:last-child):after,
.steps-horizontal .step:not(:last-child):after {
  --tw-content: "";
  content: var(--tw-content);
  flex: 1 1 0%;
  height: 1px;
  min-height: 0;
  min-width: 2rem;
  position: relative;
  width: 100%
}

.steps-vertical .step:not(:last-child):after {
  --tw-content: "";
  content: var(--tw-content);
  flex: 1 1 0%;
  height: 100%;
  min-height: 2rem;
  min-width: 0;
  position: relative;
  width: 1px
}

@keyframes indeterminate-progress-bar {
  0% {
    left: -50%
  }

  to {
    left: 100%
  }
}

.progress {
  --tw-bg-opacity: 1;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: rgb(var(--gray-5)/var(--tw-bg-opacity));
  border-radius: 9999px;
  height: 1rem;
  overflow: hidden;
  position: relative;
  width: 10rem
}

.progress::-webkit-progress-bar {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-5)/var(--tw-bg-opacity));
  border-radius: 9999px
}

.progress::-moz-progress-bar {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--primary)/var(--tw-bg-opacity));
  border-radius: 9999px
}

.progress::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--primary)/var(--tw-bg-opacity));
  border-radius: 9999px
}

.progress-indeterminate:after,
.progress:indeterminate:after {
  --tw-bg-opacity: 1;
  --tw-content: "";
  animation: indeterminate-progress-bar .9s infinite;
  background-color: rgb(var(--primary)/var(--tw-bg-opacity));
  border-radius: 9999px;
  bottom: 0;
  content: var(--tw-content);
  position: absolute;
  top: 0;
  width: 33.333333%
}

.progress-flat-primary.progress-indeterminate:after,
.progress-flat-primary.progress:indeterminate:after,
.progress-flat-primary::-webkit-progress-value,
.progress-primary.progress-indeterminate:after,
.progress-primary.progress:indeterminate:after,
.progress-primary::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--primary)/var(--tw-bg-opacity))
}

.progress-flat-secondary.progress-indeterminate:after,
.progress-flat-secondary.progress:indeterminate:after,
.progress-flat-secondary::-webkit-progress-value,
.progress-secondary.progress-indeterminate:after,
.progress-secondary.progress:indeterminate:after,
.progress-secondary::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--secondary)/var(--tw-bg-opacity))
}

.progress-flat-success.progress-indeterminate:after,
.progress-flat-success.progress:indeterminate:after,
.progress-flat-success::-webkit-progress-value,
.progress-success.progress-indeterminate:after,
.progress-success.progress:indeterminate:after,
.progress-success::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--success)/var(--tw-bg-opacity))
}

.progress-error.progress-indeterminate:after,
.progress-error.progress:indeterminate:after,
.progress-error::-webkit-progress-value,
.progress-flat-error.progress-indeterminate:after,
.progress-flat-error.progress:indeterminate:after,
.progress-flat-error::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--error)/var(--tw-bg-opacity))
}

.progress-flat-warning.progress-indeterminate:after,
.progress-flat-warning.progress:indeterminate:after,
.progress-flat-warning::-webkit-progress-value,
.progress-warning.progress-indeterminate:after,
.progress-warning.progress:indeterminate:after,
.progress-warning::-webkit-progress-value {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--warning)/var(--tw-bg-opacity))
}

@supports (-moz-appearance:none) {
  .progress-flat-primary {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--blue-5)/var(--tw-bg-opacity))
  }

  .progress-flat-secondary {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--purple-5)/var(--tw-bg-opacity))
  }

  .progress-flat-success {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--green-5)/var(--tw-bg-opacity))
  }

  .progress-flat-error {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--red-5)/var(--tw-bg-opacity))
  }

  .progress-flat-warning {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--yellow-5)/var(--tw-bg-opacity))
  }

  .progress-flat-primary::-moz-progress-bar,
  .progress-primary::-moz-progress-bar {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--primary)/var(--tw-bg-opacity))
  }

  .progress-flat-secondary::-moz-progress-bar,
  .progress-secondary::-moz-progress-bar {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--secondary)/var(--tw-bg-opacity))
  }

  .progress-flat-success::-moz-progress-bar,
  .progress-success::-moz-progress-bar {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--success)/var(--tw-bg-opacity))
  }

  .progress-error::-moz-progress-bar,
  .progress-flat-error::-moz-progress-bar {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--error)/var(--tw-bg-opacity))
  }

  .progress-flat-warning::-moz-progress-bar,
  .progress-warning::-moz-progress-bar {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--warning)/var(--tw-bg-opacity))
  }

  .progress:indeterminate::-moz-progress-bar {
    background-color: initial
  }
}

.dot {
  background-color: rgb(var(--gray-8)/var(--tw-bg-opacity));
  border-radius: 50%;
  display: inline-flex;
  height: .625rem;
  line-height: .75rem;
  min-height: 10px;
  min-width: 10px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  width: .625rem
}

.dot,
.dot-primary {
  --tw-bg-opacity: 1
}

.dot-primary {
  background-color: rgb(var(--primary)/var(--tw-bg-opacity))
}

.dot-success {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--success)/var(--tw-bg-opacity))
}

.menu {
  width: 100%
}

.menu,
.menu-section {
  display: flex;
  flex-direction: column;
  gap: .5rem
}

.menu-title {
  font-size: .75rem;
  font-weight: 400;
  line-height: 1rem
}

.menu-item {
  --tw-text-opacity: 1;
  align-items: center;
  border-radius: .5rem;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  font-size: .875rem;
  gap: .5rem;
  line-height: 1.25rem;
  padding: .5rem 1rem;
  transition-duration: .15s;
  transition-property: transform, opacity, visibility, background-color;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  will-change: transform
}

.menu-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-3)/var(--tw-bg-opacity))
}

.menu-item:active- {
  --tw-scale-x: 0.97;
  --tw-scale-y: 0.97;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.menu-item.menu-active,
.menu-item:active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--gray-4)/var(--tw-bg-opacity))
}

.menu-item.menu-active {
  transition-property: none
}

.menu-item.menu-active:active {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.menu-toggle {
  display: none
}

.menu-item-collapse {
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  transition: padding .15s, grid-template-rows .15s
}

.menu-item:focus-within~.menu-item-collapse,
.menu-toggle:checked~.menu-item-collapse {
  border-style: none;
  grid-template-rows: 1fr
}

.menu-icon {
  transition-duration: .3s;
  transition-property: transform;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.menu-toggle:checked~.menu-item .menu-icon {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
 

@keyframes rotate {
  to {
    transform: rotate(1turn)
  }
}

@keyframes spinner-ring-stretch {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0
  }

  50% {
    stroke-dasharray: 90, 200;
    stroke-dashoffset: -35px
  }

  to {
    stroke-dashoffset: -124px
  }
}

@keyframes spinner-pulse {

  0%,
  to {
    transform: scale(0)
  }

  50% {
    transform: scale(1.5)
  }
}

@keyframes jump {

  0%,
  to {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-200%)
  }
}

@keyframes circle-spin {
  0% {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(1turn)
  }
}

@keyframes flash {
  0% {
    background-color: var(--spinner-color-opacity);
    box-shadow: var(--calculation-1) 0 var(--spinner-color-opacity), var(--calculation-2) 0 rgb(var(--spinner-color))
  }

  50% {
    background-color: rgb(var(--spinner-color));
    box-shadow: var(--calculation-1) 0 var(--spinner-color-opacity), var(--calculation-2) 0 var(--spinner-color-opacity)
  }

  to {
    background-color: var(--spinner-color-opacity);
    box-shadow: var(--calculation-1) 0 rgb(var(--spinner-color)), var(--calculation-2) 0 var(--spinner-color-opacity)
  }
}