@rovula/ui 0.0.9 → 0.0.11

package/dist/cjs/bundle.css

@@ -534,7 +534,62 @@ video {
     --input-disabled-background-color: 247 247 247;
     
     --input-label-background-color: 249 251 255;
+
+    /* Text */
+    --text-default-dark: 1 1 68;
+    --text-default-medium: 47 78 255;
+    --text-default-light: 213 230 255;
+
+    --text-grey-dark: 29 30 39;
+    --text-grey-medium: 117 121 128;
+    --text-grey-light: 164 169 178;
+    --text-white: 255 255 255;
+
+    /* Other/Popup */
+    --popup-background: 249 251 255;
+    /* Other/Popup Curtain */
+    --popup-overlay: 0 0 0;
+    --popup-overlay-alpha: 0.48;
+    --popup-rounded: 24px;
+  
+    /* TODO for shadcn, wait for refactor */
+    /* --background: 0 0% 100%; */
+    --background: 220 100% 99%;
+    --foreground: 222.2 47.4% 11.2%;
+ 
+    --muted: 210 40% 96.1%;
+    --muted-foreground: 215.4 16.3% 46.9%;
+ 
+    --popover: 0 0% 100%;
+    --popover-foreground: 222.2 47.4% 11.2%;
+ 
+    --border: 214.3 31.8% 91.4%;
+    --input: 214.3 31.8% 91.4%;
+ 
+    --card: 0 0% 100%;
+    --card-foreground: 222.2 47.4% 11.2%;
+ 
+    --primary: var(--primary-default);
+ 
+    --secondary: var(--secondary-default);
+ 
+    --accent: 210 40% 96.1%;
+    --accent-foreground: 222.2 47.4% 11.2%;
+ 
+    --destructive: 0 100% 50%;
+    --destructive-foreground: 210 40% 98%;
+ 
+    --ring: 215 20.2% 65.1%;
+ 
+    --radius: 0.5rem;
   }
+  * {
+  border-color: hsl(var(--border));
+}
+  body {
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+}
 
 *, ::before, ::after {
   --tw-border-spacing-x: 0;
@@ -643,15 +698,45 @@ video {
   --tw-contain-paint:  ;
   --tw-contain-style:  ;
 }
+.container {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+}
+@media (min-width: 1400px) {
+
+  .container {
+    max-width: 1400px;
+  }
+}
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
 .pointer-events-none {
   pointer-events: none;
 }
+.fixed {
+  position: fixed;
+}
 .absolute {
   position: absolute;
 }
 .relative {
   position: relative;
 }
+.inset-0 {
+  inset: 0px;
+}
 .inset-y-0 {
   top: 0px;
   bottom: 0px;
@@ -668,15 +753,30 @@ video {
 .left-4 {
   left: 1rem;
 }
+.left-\[50\%\] {
+  left: 50%;
+}
 .right-0 {
   right: 0px;
 }
+.right-4 {
+  right: 1rem;
+}
+.top-4 {
+  top: 1rem;
+}
+.top-\[50\%\] {
+  top: 50%;
+}
 .z-10 {
   z-index: 10;
 }
 .z-50 {
   z-index: 50;
 }
+.col-span-3 {
+  grid-column: span 3 / span 3;
+}
 .mx-auto {
   margin-left: auto;
   margin-right: auto;
@@ -697,6 +797,12 @@ video {
 .mt-1 {
   margin-top: 0.25rem;
 }
+.mt-2 {
+  margin-top: 0.5rem;
+}
+.mt-4 {
+  margin-top: 1rem;
+}
 .mt-\[6px\] {
   margin-top: 6px;
 }
@@ -721,6 +827,17 @@ video {
 .hidden {
   display: none;
 }
+.aspect-square {
+  aspect-ratio: 1 / 1;
+}
+.size-2 {
+  width: 0.5rem;
+  height: 0.5rem;
+}
+.size-2\.5 {
+  width: 0.625rem;
+  height: 0.625rem;
+}
 .size-3 {
   width: 0.75rem;
   height: 0.75rem;
@@ -741,9 +858,30 @@ video {
   width: 14px;
   height: 14px;
 }
+.h-10 {
+  height: 2.5rem;
+}
+.h-12 {
+  height: 3rem;
+}
+.h-24 {
+  height: 6rem;
+}
+.h-4 {
+  height: 1rem;
+}
+.h-\[54px\] {
+  height: 54px;
+}
 .max-h-60 {
   max-height: 15rem;
 }
+.w-4 {
+  width: 1rem;
+}
+.w-\[100px\] {
+  width: 100px;
+}
 .w-\[200px\] {
   width: 200px;
 }
@@ -759,6 +897,23 @@ video {
 .max-w-3xl {
   max-width: 48rem;
 }
+.max-w-lg {
+  max-width: 32rem;
+}
+.shrink-0 {
+  flex-shrink: 0;
+}
+.caption-bottom {
+  caption-side: bottom;
+}
+.translate-x-\[-50\%\] {
+  --tw-translate-x: -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));
+}
+.translate-y-\[-50\%\] {
+  --tw-translate-y: -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));
+}
 .rotate-180 {
   --tw-rotate: 180deg;
   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));
@@ -776,6 +931,9 @@ video {
      -moz-appearance: none;
           appearance: none;
 }
+.grid-cols-4 {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}
 .grid-cols-\[auto_1fr\] {
   grid-template-columns: auto 1fr;
 }
@@ -785,21 +943,36 @@ video {
 .flex-col {
   flex-direction: column;
 }
+.flex-col-reverse {
+  flex-direction: column-reverse;
+}
 .items-center {
   align-items: center;
 }
 .justify-center {
   justify-content: center;
 }
+.justify-between {
+  justify-content: space-between;
+}
 .gap-1 {
   gap: 0.25rem;
 }
+.gap-1\.5 {
+  gap: 0.375rem;
+}
 .gap-2 {
   gap: 0.5rem;
 }
+.gap-3 {
+  gap: 0.75rem;
+}
 .gap-4 {
   gap: 1rem;
 }
+.gap-6 {
+  gap: 1.5rem;
+}
 .gap-x-8 {
   -moz-column-gap: 2rem;
        column-gap: 2rem;
@@ -810,6 +983,24 @@ video {
 .gap-y-6 {
   row-gap: 1.5rem;
 }
+.space-x-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+.space-y-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+}
+.space-y-4 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
+}
+.overflow-auto {
+  overflow: auto;
+}
 .overflow-x-auto {
   overflow-x: auto;
 }
@@ -835,16 +1026,16 @@ video {
   border-radius: 9999px;
 }
 .rounded-lg {
-  border-radius: 0.5rem;
+  border-radius: var(--radius);
 }
 .rounded-md {
-  border-radius: 0.375rem;
+  border-radius: calc(var(--radius) - 2px);
 }
 .rounded-none {
   border-radius: 0px;
 }
 .rounded-sm {
-  border-radius: 0.125rem;
+  border-radius: calc(var(--radius) - 4px);
 }
 .rounded-xl {
   border-radius: 0.75rem;
@@ -855,9 +1046,18 @@ video {
 .border-0 {
   border-width: 0px;
 }
+.border-b {
+  border-bottom-width: 1px;
+}
 .border-b-2 {
   border-bottom-width: 2px;
 }
+.border-b-\[3px\] {
+  border-bottom-width: 3px;
+}
+.border-t {
+  border-top-width: 1px;
+}
 .border-error {
   --tw-border-opacity: 1;
   border-color: rgb(var(--error-100) / var(--tw-border-opacity));
@@ -878,10 +1078,22 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
 }
+.border-primary-10 {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--primary-10) / var(--tw-border-opacity));
+}
+.border-primary-30 {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--primary-30) / var(--tw-border-opacity));
+}
 .border-secondary {
   --tw-border-opacity: 1;
   border-color: rgb(var(--secondary-default) / var(--tw-border-opacity));
 }
+.border-secondary-110 {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
+}
 .border-success {
   --tw-border-opacity: 1;
   border-color: rgb(var(--success-default) / var(--tw-border-opacity));
@@ -890,6 +1102,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(var(--tertiary-120) / var(--tw-border-opacity));
 }
+.border-textcolor-dark {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--text-default-dark) / var(--tw-border-opacity));
+}
 .border-transparent {
   border-color: transparent;
 }
@@ -897,6 +1113,9 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(var(--warning-default) / var(--tw-border-opacity));
 }
+.bg-background {
+  background-color: hsl(var(--background));
+}
 .bg-error {
   --tw-bg-opacity: 1;
   background-color: rgb(var(--error-100) / var(--tw-bg-opacity));
@@ -905,6 +1124,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(229 231 235 / var(--tw-bg-opacity));
 }
+.bg-grey2-300 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(var(--grey2-300) / var(--tw-bg-opacity));
+}
 .bg-info {
   --tw-bg-opacity: 1;
   background-color: rgb(var(--info-default) / var(--tw-bg-opacity));
@@ -913,6 +1136,13 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(var(--input-label-background-color) / var(--tw-bg-opacity));
 }
+.bg-popup-background {
+  --tw-bg-opacity: 1;
+  background-color: rgb(var(--popup-background) / var(--tw-bg-opacity));
+}
+.bg-popup-overlay {
+  background-color: rgb(var(--popup-overlay) / var(--popup-overlay-alpha));
+}
 .bg-primary {
   --tw-bg-opacity: 1;
   background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
@@ -944,6 +1174,9 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
+.fill-current {
+  fill: currentColor;
+}
 .fill-error {
   fill: rgb(var(--error-100) / 1);
 }
@@ -959,6 +1192,9 @@ video {
 .fill-input-text-disabled {
   fill: rgb(var(--input-disabled-text-color) / 1);
 }
+.fill-secondary-110 {
+  fill: rgb(var(--secondary-110) / 1);
+}
 .p-1 {
   padding: 0.25rem;
 }
@@ -971,6 +1207,16 @@ video {
 .p-5 {
   padding: 1.25rem;
 }
+.p-6 {
+  padding: 1.5rem;
+}
+.p-8 {
+  padding: 2rem;
+}
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
 .px-3 {
   padding-left: 0.75rem;
   padding-right: 0.75rem;
@@ -1012,9 +1258,15 @@ video {
 .pe-\[48px\] {
   padding-inline-end: 48px;
 }
+.text-left {
+  text-align: left;
+}
 .text-center {
   text-align: center;
 }
+.text-right {
+  text-align: right;
+}
 .align-middle {
   vertical-align: middle;
 }
@@ -1143,13 +1395,22 @@ video {
 .capitalize {
   text-transform: capitalize;
 }
+.leading-none {
+  line-height: 1;
+}
 .tracking-\[\.02857em\] {
   letter-spacing: .02857em;
 }
+.tracking-tight {
+  letter-spacing: -0.025em;
+}
 .text-black {
   --tw-text-opacity: 1;
   color: rgb(0 0 0 / var(--tw-text-opacity));
 }
+.text-current {
+  color: currentColor;
+}
 .text-error {
   --tw-text-opacity: 1;
   color: rgb(var(--error-100) / var(--tw-text-opacity));
@@ -1186,6 +1447,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
 }
+.text-secondary-110 {
+  --tw-text-opacity: 1;
+  color: rgb(var(--secondary-110) / var(--tw-text-opacity));
+}
 .text-secondary-130 {
   --tw-text-opacity: 1;
   color: rgb(var(--secondary-130) / var(--tw-text-opacity));
@@ -1210,6 +1475,18 @@ video {
   --tw-text-opacity: 1;
   color: rgb(var(--tertiary-foreground) / var(--tw-text-opacity));
 }
+.text-textcolor-dark {
+  --tw-text-opacity: 1;
+  color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
+}
+.text-textcolor-grey-dark {
+  --tw-text-opacity: 1;
+  color: rgb(var(--text-grey-dark) / var(--tw-text-opacity));
+}
+.text-textcolor-grey-light {
+  --tw-text-opacity: 1;
+  color: rgb(var(--text-grey-light) / var(--tw-text-opacity));
+}
 .text-warning {
   --tw-text-opacity: 1;
   color: rgb(var(--warning-default) / var(--tw-text-opacity));
@@ -1231,6 +1508,14 @@ video {
 .underline-offset-4 {
   text-underline-offset: 4px;
 }
+.opacity-70 {
+  opacity: 0.7;
+}
+.shadow-lg {
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .shadow-md {
   --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -1243,6 +1528,11 @@ video {
 .outline {
   outline-style: solid;
 }
+.ring {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
 .ring-1 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -1263,6 +1553,13 @@ video {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(var(--input-disabled-stroke-color) / var(--tw-ring-opacity));
 }
+.ring-offset-background {
+  --tw-ring-offset-color: hsl(var(--background));
+}
+.blur {
+  --tw-blur: blur(8px);
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
 .filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -1276,12 +1573,23 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
+.transition-opacity {
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.duration-200 {
+  transition-duration: 200ms;
+}
 .duration-300 {
   transition-duration: 300ms;
 }
 .ease-in-out {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
+.ease-out {
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
 .typography-h1 {
   font-size: 64px;
   line-height: 80px;
@@ -1387,6 +1695,19 @@ video {
   line-height: 10px;
   font-weight: 400;
 }
+.file\:border-0::file-selector-button {
+  border-width: 0px;
+}
+.file\:bg-transparent::file-selector-button {
+  background-color: transparent;
+}
+.file\:text-sm::file-selector-button {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+.file\:font-medium::file-selector-button {
+  font-weight: 500;
+}
 .placeholder\:text-input-text-disabled::-moz-placeholder {
   --tw-text-opacity: 1;
   color: rgb(var(--input-disabled-text-color) / var(--tw-text-opacity));
@@ -1457,9 +1778,16 @@ video {
 .hover\:fill-input-text:hover {
   fill: rgb(var(--input-default-text-color) / 1);
 }
+.hover\:text-textcolor-dark:hover {
+  --tw-text-opacity: 1;
+  color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
+}
 .hover\:text-opacity-80:hover {
   --tw-text-opacity: 0.8;
 }
+.hover\:opacity-100:hover {
+  opacity: 1;
+}
 .focus\:border-input-stroke:focus {
   --tw-border-opacity: 1;
   border-color: rgb(var(--input-default-stroke-color) / var(--tw-border-opacity));
@@ -1473,11 +1801,20 @@ video {
 .focus\:pe-8:focus {
   padding-inline-end: 2rem;
 }
+.focus\:outline-none:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
 .focus\:ring-1:focus {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
+.focus\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
 .focus\:ring-inset:focus {
   --tw-ring-inset: inset;
 }
@@ -1489,11 +1826,48 @@ video {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(var(--input-active-stroke-color) / var(--tw-ring-opacity));
 }
+.focus\:ring-ring:focus {
+  --tw-ring-color: hsl(var(--ring));
+}
+.focus\:ring-offset-2:focus {
+  --tw-ring-offset-width: 2px;
+}
+.focus-visible\:outline-none:focus-visible {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+.focus-visible\:ring-2:focus-visible {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.focus-visible\:ring-ring:focus-visible {
+  --tw-ring-color: hsl(var(--ring));
+}
+.focus-visible\:ring-offset-2:focus-visible {
+  --tw-ring-offset-width: 2px;
+}
 .active\:scale-\[98\%\]:active {
   --tw-scale-x: 98%;
   --tw-scale-y: 98%;
   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));
 }
+.disabled\:pointer-events-none:disabled {
+  pointer-events: none;
+}
+.disabled\:cursor-not-allowed:disabled {
+  cursor: not-allowed;
+}
+.disabled\:border-secondary-110:disabled {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
+}
+.disabled\:fill-secondary-110:disabled {
+  fill: rgb(var(--secondary-110) / 1);
+}
+.disabled\:opacity-50:disabled {
+  opacity: 0.5;
+}
 .peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:top-2 {
   top: 0.5rem;
 }
@@ -1555,6 +1929,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(var(--input-label-background-color) / var(--tw-bg-opacity));
 }
+.peer:focus ~ .peer-focus\:bg-red-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
+}
 .peer:focus ~ .peer-focus\:text-input-text-active {
   --tw-text-opacity: 1;
   color: rgb(var(--input-active-text-color) / var(--tw-text-opacity));
@@ -1569,6 +1947,12 @@ video {
   line-height: 10px;
   font-weight: 400;
 }
+.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
+  cursor: not-allowed;
+}
+.peer:disabled ~ .peer-disabled\:opacity-70 {
+  opacity: 0.7;
+}
 .aria-disabled\:pointer-events-none[aria-disabled="true"] {
   pointer-events: none;
 }
@@ -1577,4 +1961,60 @@ video {
 }
 .aria-disabled\:opacity-50[aria-disabled="true"] {
   opacity: 0.5;
+}
+.data-\[state\=checked\]\:border-primary[data-state=checked] {
+  --tw-border-opacity: 1;
+  border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
+}
+.data-\[state\=checked\]\:bg-primary[data-state=checked] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
+}
+.data-\[state\=checked\]\:text-primary-foreground[data-state=checked] {
+  --tw-text-opacity: 1;
+  color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
+}
+@media (min-width: 640px) {
+
+  .sm\:mt-0 {
+    margin-top: 0px;
+  }
+
+  .sm\:max-w-\[425px\] {
+    max-width: 425px;
+  }
+
+  .sm\:flex-row {
+    flex-direction: row;
+  }
+
+  .sm\:justify-end {
+    justify-content: flex-end;
+  }
+
+  .sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-x-reverse: 0;
+    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+  }
+
+  .sm\:rounded-\[var\(--popup-rounded\)\] {
+    border-radius: var(--popup-rounded);
+  }
+
+  .sm\:text-left {
+    text-align: left;
+  }
+}
+.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
+  padding-right: 0px;
+}
+.\[\&\>tr\]\:last\:border-b-0:last-child>tr {
+  border-bottom-width: 0px;
+}
+.\[\&_tr\:last-child\]\:border-0 tr:last-child {
+  border-width: 0px;
+}
+.\[\&_tr\]\:border-b tr {
+  border-bottom-width: 1px;
 }