@powerhousedao/document-engineering 1.8.1 → 1.10.0

package/dist/style.css

@@ -7,6 +7,7 @@
     --font-sans: "Inter", sans-serif;
     --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
+    --color-red-300: hsl(6 82% 87%);
     --color-red-400: hsl(5 82% 83%);
     --color-red-500: hsl(5 80% 78%);
     --color-red-600: hsl(4 81% 74%);
@@ -25,13 +26,22 @@
     --color-green-600: hsl(136 53% 60%);
     --color-green-700: hsl(136 52% 55%);
     --color-green-900: hsl(136 53% 43%);
+    --color-cyan-50: oklch(98.4% 0.019 200.873);
+    --color-cyan-200: oklch(91.7% 0.08 205.041);
+    --color-cyan-300: oklch(86.5% 0.127 207.078);
+    --color-cyan-400: oklch(78.9% 0.154 211.53);
+    --color-cyan-500: oklch(71.5% 0.143 215.221);
+    --color-cyan-700: oklch(52% 0.105 223.128);
     --color-blue-50: oklch(97% 0.014 254.604);
     --color-blue-100: hsl(209 100% 90%);
+    --color-blue-200: hsl(209 97% 85%);
+    --color-blue-400: hsl(209 100% 75%);
     --color-blue-500: hsl(209 100% 70%);
     --color-blue-600: hsl(209 100% 65%);
     --color-blue-700: hsl(209 100% 60%);
     --color-blue-800: hsl(209 100% 55%);
     --color-blue-900: hsl(209 100% 50%);
+    --color-pink-400: oklch(71.8% 0.202 349.761);
     --color-slate-50: hsl(210 20% 96%);
     --color-slate-100: hsl(210 9% 74%);
     --color-slate-200: hsl(210 9% 48%);
@@ -68,10 +78,12 @@
     --font-weight-medium: 500;
     --font-weight-semibold: 600;
     --font-weight-bold: 700;
+    --tracking-wider: 0.05em;
     --tracking-widest: 0.1em;
     --radius-sm: 0.25rem;
     --radius-md: 0.375rem;
     --radius-lg: 0.5rem;
+    --radius-xl: 0.75rem;
     --animate-spin: spin 1s linear infinite;
     --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
     --default-transition-duration: 150ms;
@@ -556,9 +568,6 @@
   .h-full {
     height: 100%;
   }
-  .h-px {
-    height: 1px;
-  }
   .h-screen {
     height: 100vh;
   }
@@ -655,6 +664,9 @@
   .w-screen {
     width: 100vw;
   }
+  .max-w-\[40px\] {
+    max-width: 40px;
+  }
   .max-w-full {
     max-width: 100%;
   }
@@ -667,9 +679,6 @@
   .min-w-4 {
     min-width: calc(var(--spacing) * 4);
   }
-  .min-w-9 {
-    min-width: calc(var(--spacing) * 9);
-  }
   .min-w-\[40px\] {
     min-width: 40px;
   }
@@ -747,6 +756,9 @@
   .appearance-none {
     appearance: none;
   }
+  .grid-cols-1 {
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+  }
   .grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
@@ -3256,292 +3268,1479 @@
   .\[\&\]\:\!w-\[120px\] {
     width: 120px !important;
   }
-  .focus\:\[\&_\.input-field\]\:bg-transparent {
-    &:focus {
-      & .input-field {
-        background-color: transparent;
-      }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:rounded-full {
+    & .date-picker\_\_button-next {
+      border-radius: calc(infinity * 1px);
     }
   }
-  .\[\&_\[cmdk-group-heading\]\]\:px-2 {
-    & [cmdk-group-heading] {
-      padding-inline: calc(var(--spacing) * 2);
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:border-2 {
+    & .date-picker\_\_button-next {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
     }
   }
-  .\[\&_\[cmdk-group-heading\]\]\:py-1\.5 {
-    & [cmdk-group-heading] {
-      padding-block: calc(var(--spacing) * 1.5);
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:border-cyan-400 {
+    & .date-picker\_\_button-next {
+      border-color: var(--color-cyan-400);
     }
   }
-  .\[\&_\[cmdk-group-heading\]\]\:text-xs {
-    & [cmdk-group-heading] {
-      font-size: var(--text-xs);
-      line-height: var(--tw-leading, var(--text-xs--line-height));
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:bg-blue-500 {
+    & .date-picker\_\_button-next {
+      background-color: var(--color-blue-500);
     }
   }
-  .\[\&_\[cmdk-group-heading\]\]\:font-medium {
-    & [cmdk-group-heading] {
-      --tw-font-weight: var(--font-weight-medium);
-      font-weight: var(--font-weight-medium);
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:bg-transparent {
+    & .date-picker\_\_button-next {
+      background-color: transparent;
     }
   }
-  .\[\&_\[cmdk-label\]\]\:hidden {
-    & [cmdk-label] {
-      display: none;
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:bg-white {
+    & .date-picker\_\_button-next {
+      background-color: var(--color-white);
     }
   }
-  .\[\&_\[data-state\=checked\]_span\]\:after\:\!bg-blue-500 {
-    & [data-state=checked] span {
-      &::after {
-        content: var(--tw-content);
-        background-color: var(--color-blue-500) !important;
-      }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:p-2 {
+    & .date-picker\_\_button-next {
+      padding: calc(var(--spacing) * 2);
     }
   }
-  .\[\&_\[data-state\=checked\]_span\]\:after\:\!bg-red-500 {
-    & [data-state=checked] span {
-      &::after {
-        content: var(--tw-content);
-        background-color: var(--color-red-500) !important;
-      }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:text-cyan-400 {
+    & .date-picker\_\_button-next {
+      color: var(--color-cyan-400);
     }
   }
-  .\[\&_button\]\:border-blue-600 {
-    & button {
-      border-color: var(--color-blue-600);
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:text-gray-700 {
+    & .date-picker\_\_button-next {
+      color: var(--color-gray-700);
     }
   }
-  .\[\&_button\]\:hover\:border-green-600 {
-    & button {
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:text-white {
+    & .date-picker\_\_button-next {
+      color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:shadow-sm {
+    & .date-picker\_\_button-next {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:transition-all {
+    & .date-picker\_\_button-next {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:duration-300 {
+    & .date-picker\_\_button-next {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:hover\:scale-110 {
+    & .date-picker\_\_button-next {
       &:hover {
         @media (hover: hover) {
-          border-color: var(--color-green-600);
+          --tw-scale-x: 110%;
+          --tw-scale-y: 110%;
+          --tw-scale-z: 110%;
+          scale: var(--tw-scale-x) var(--tw-scale-y);
         }
       }
     }
   }
-  .\[\&_label\]\:text-blue-600 {
-    & label {
-      color: var(--color-blue-600);
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:hover\:bg-cyan-400\/10 {
+    & .date-picker\_\_button-next {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 10%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-cyan-400) 10%, transparent);
+          }
+        }
+      }
     }
   }
-  .\[\&_label\]\:hover\:text-green-600 {
-    & label {
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:hover\:bg-gray-50 {
+    & .date-picker\_\_button-next {
       &:hover {
         @media (hover: hover) {
-          color: var(--color-green-600);
+          background-color: var(--color-gray-50);
         }
       }
     }
   }
-  .\[\&_svg\]\:pointer-events-none {
-    & svg {
-      pointer-events: none;
+  .\[\&_\.date-picker\\\\_\\\\_button-next\]\:hover\:shadow-\[0_0_15px_rgba\(34\,211\,238\,0\.6\)\] {
+    & .date-picker\_\_button-next {
+      &:hover {
+        @media (hover: hover) {
+          --tw-shadow: 0 0 15px var(--tw-shadow-color, rgba(34,211,238,0.6));
+          box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+        }
+      }
     }
   }
-  .\[\&_svg\]\:size-4 {
-    & svg {
-      width: calc(var(--spacing) * 4);
-      height: calc(var(--spacing) * 4);
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:rounded-full {
+    & .date-picker\_\_button-previous {
+      border-radius: calc(infinity * 1px);
     }
   }
-  .\[\&_svg\]\:shrink-0 {
-    & svg {
-      flex-shrink: 0;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:border-2 {
+    & .date-picker\_\_button-previous {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
     }
   }
-  .\[\&\:\:-webkit-scrollbar\]\:\!hidden {
-    &::-webkit-scrollbar {
-      display: none !important;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:border-cyan-400 {
+    & .date-picker\_\_button-previous {
+      border-color: var(--color-cyan-400);
     }
   }
-  .\[\&\:\:-webkit-scrollbar-thumb\]\:\!hidden {
-    &::-webkit-scrollbar-thumb {
-      display: none !important;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:bg-transparent {
+    & .date-picker\_\_button-previous {
+      background-color: transparent;
     }
   }
-  .\[\&\:\:-webkit-scrollbar-track\]\:\!hidden {
-    &::-webkit-scrollbar-track {
-      display: none !important;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:bg-white {
+    & .date-picker\_\_button-previous {
+      background-color: var(--color-white);
     }
   }
-  .\[\&\:\:-webkit-search-cancel-button\]\:hidden {
-    &::-webkit-search-cancel-button {
-      display: none;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:p-2 {
+    & .date-picker\_\_button-previous {
+      padding: calc(var(--spacing) * 2);
     }
   }
-  .\[\&\>button\]\:bg-transparent {
-    &>button {
-      background-color: transparent;
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:text-cyan-400 {
+    & .date-picker\_\_button-previous {
+      color: var(--color-cyan-400);
     }
   }
-  .\[\&\>button\]\:hover\:\!bg-transparent {
-    &>button {
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:text-gray-700 {
+    & .date-picker\_\_button-previous {
+      color: var(--color-gray-700);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:shadow-sm {
+    & .date-picker\_\_button-previous {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:transition-all {
+    & .date-picker\_\_button-previous {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:duration-300 {
+    & .date-picker\_\_button-previous {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:hover\:scale-110 {
+    & .date-picker\_\_button-previous {
       &:hover {
         @media (hover: hover) {
-          background-color: transparent !important;
+          --tw-scale-x: 110%;
+          --tw-scale-y: 110%;
+          --tw-scale-z: 110%;
+          scale: var(--tw-scale-x) var(--tw-scale-y);
         }
       }
     }
   }
-  .\[\&\>button\]\:hover\:bg-transparent {
-    &>button {
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:hover\:bg-cyan-400\/10 {
+    & .date-picker\_\_button-previous {
       &:hover {
         @media (hover: hover) {
-          background-color: transparent;
+          background-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 10%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-cyan-400) 10%, transparent);
+          }
         }
       }
     }
   }
-  .\[\&\>label\]\:text-blue-500 {
-    &>label {
-      color: var(--color-blue-500);
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:hover\:bg-gray-50 {
+    & .date-picker\_\_button-previous {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-gray-50);
+        }
+      }
     }
   }
-  .\[\&\>label\]\:text-green-500 {
-    &>label {
-      color: var(--color-green-500);
+  .\[\&_\.date-picker\\\\_\\\\_button-previous\]\:hover\:shadow-\[0_0_15px_rgba\(34\,211\,238\,0\.6\)\] {
+    & .date-picker\_\_button-previous {
+      &:hover {
+        @media (hover: hover) {
+          --tw-shadow: 0 0 15px var(--tw-shadow-color, rgba(34,211,238,0.6));
+          box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+        }
+      }
     }
   }
-  .\[\&\>label\]\:text-red-500 {
-    &>label {
-      color: var(--color-red-500);
+  .\[\&_\.date-picker\\\\_\\\\_calendar\]\:rounded-xl {
+    & .date-picker\_\_calendar {
+      border-radius: var(--radius-xl);
     }
   }
-  .\[\&\>label\]\:text-red-900 {
-    &>label {
-      color: var(--color-red-900);
+  .\[\&_\.date-picker\\\\_\\\\_calendar\]\:rounded-b-lg {
+    & .date-picker\_\_calendar {
+      border-bottom-right-radius: var(--radius-lg);
+      border-bottom-left-radius: var(--radius-lg);
     }
   }
-  .\[\&\>label\]\:text-yellow-500 {
-    &>label {
-      color: var(--color-yellow-500);
+  .\[\&_\.date-picker\\\\_\\\\_calendar\]\:bg-white {
+    & .date-picker\_\_calendar {
+      background-color: var(--color-white);
     }
   }
-  .\[\&\>span\]\:truncate {
-    &>span {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
+  .\[\&_\.date-picker\\\\_\\\\_calendar_button\]\:text-gray-700 {
+    & .date-picker\_\_calendar button {
+      color: var(--color-gray-700);
     }
   }
-  .\[\&\>span\]\:text-blue-900 {
-    &>span {
-      color: var(--color-blue-900);
+  .\[\&_\.date-picker\\\\_\\\\_calendar_button\[data-selected\=true\]\]\:bg-blue-500 {
+    & .date-picker\_\_calendar button[data-selected=true] {
+      background-color: var(--color-blue-500);
     }
   }
-  .\[\&\>span\]\:text-green-900 {
-    &>span {
-      color: var(--color-green-900);
+  .\[\&_\.date-picker\\\\_\\\\_calendar_button\[data-selected\=true\]\]\:bg-green-600 {
+    & .date-picker\_\_calendar button[data-selected=true] {
+      background-color: var(--color-green-600);
     }
   }
-  .\[\&\>span\]\:text-red-900 {
-    &>span {
-      color: var(--color-red-900);
+  .\[\&_\.date-picker\\\\_\\\\_calendar_button\[data-selected\=true\]\]\:text-white {
+    & .date-picker\_\_calendar button[data-selected=true] {
+      color: var(--color-white);
     }
   }
-  .\[\&\>span\]\:text-yellow-900 {
-    &>span {
-      color: var(--color-yellow-900);
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:gap-2 {
+    & .date-picker\_\_date-footer {
+      gap: calc(var(--spacing) * 2);
     }
   }
-  .\[\&\>svg\]\:size-4 {
-    &>svg {
-      width: calc(var(--spacing) * 4);
-      height: calc(var(--spacing) * 4);
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:flex {
+    & .date-picker\_\_day-button {
+      display: flex;
     }
   }
-  .\[\&\>svg\]\:shrink-0 {
-    &>svg {
-      flex-shrink: 0;
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:h-6 {
+    & .date-picker\_\_day-button {
+      height: calc(var(--spacing) * 6);
     }
   }
-  .\[\&\>svg\]\:text-green-900 {
-    &>svg {
-      color: var(--color-green-900);
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:w-6 {
+    & .date-picker\_\_day-button {
+      width: calc(var(--spacing) * 6);
     }
   }
-}
-:root {
-  --toastify-toast-min-height: 48px;
-  --toastify-toast-bd-radius: 8px;
-  --toastify-text-color-light: var(--color-gray-800);
-  --toastify-color-progress-info: var(--color-gray-300);
-  --toastify-color-progress-success: var(--color-gray-300);
-  --toastify-color-progress-warning: var(--color-gray-300);
-  --toastify-color-progress-error: var(--color-gray-300);
-  --toastify-color-progress-light: var(--color-gray-300);
-}
-html:has(dialog[open]) {
-  overflow: hidden;
-}
-.checkbox-container input[type="checkbox"] {
-  accent-color: var(--color-gray-900);
-}
-.rmsc {
-  --rmsc-main: var(--color-gray-300) !important;
-  --rmsc-hover: var(--color-gray-100) !important;
-  --rmsc-selected: var(--color-gray-300) !important;
-}
-.Toastify__toast-body {
-  padding: 0;
-  margin: 0;
-  font-size: 14px;
-  font-weight: 600;
-}
-.Toastify__toast {
-  box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.32);
-  padding: 12px 16px 12px 16px;
-}
-.Toastify__progress-bar--wrp {
-  height: 2px;
-}
-input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  margin: 0;
-}
-input[type="number"] {
-  -moz-appearance: textfield;
-}
-@layer base {
-  h1, h2, h3, h4, h5, h6, p {
-    color: var(--color-gray-900);
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:items-center {
+    & .date-picker\_\_day-button {
+      align-items: center;
+    }
   }
-  button {
-    cursor: pointer;
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:justify-center {
+    & .date-picker\_\_day-button {
+      justify-content: center;
+    }
   }
-}
-@layer base {
-  * {
-    scrollbar-color: initial;
-    scrollbar-width: initial;
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:rounded-full {
+    & .date-picker\_\_day-button {
+      border-radius: calc(infinity * 1px);
+    }
   }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:font-medium {
+    & .date-picker\_\_day-button {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:text-cyan-400 {
+    & .date-picker\_\_day-button {
+      color: var(--color-cyan-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:text-gray-700 {
+    & .date-picker\_\_day-button {
+      color: var(--color-gray-700);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:transition-all {
+    & .date-picker\_\_day-button {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:duration-300 {
+    & .date-picker\_\_day-button {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:scale-110 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          --tw-scale-x: 110%;
+          --tw-scale-y: 110%;
+          --tw-scale-z: 110%;
+          scale: var(--tw-scale-x) var(--tw-scale-y);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:bg-blue-100 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-blue-100);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:bg-cyan-400\/10 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 10%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-cyan-400) 10%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:bg-gray-50 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-gray-50);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:text-cyan-300 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          color: var(--color-cyan-300);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_day-button\]\:hover\:text-gray-900 {
+    & .date-picker\_\_day-button {
+      &:hover {
+        @media (hover: hover) {
+          color: var(--color-gray-900);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:mb-4 {
+    & .date-picker\_\_month-caption {
+      margin-bottom: calc(var(--spacing) * 4);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:border-b {
+    & .date-picker\_\_month-caption {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 1px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:border-cyan-400\/30 {
+    & .date-picker\_\_month-caption {
+      border-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 30%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        border-color: color-mix(in oklab, var(--color-cyan-400) 30%, transparent);
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:bg-white {
+    & .date-picker\_\_month-caption {
+      background-color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:p-2 {
+    & .date-picker\_\_month-caption {
+      padding: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:font-mono {
+    & .date-picker\_\_month-caption {
+      font-family: var(--font-mono);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:text-lg {
+    & .date-picker\_\_month-caption {
+      font-size: var(--text-lg);
+      line-height: var(--tw-leading, var(--text-lg--line-height));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:font-bold {
+    & .date-picker\_\_month-caption {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:text-cyan-400 {
+    & .date-picker\_\_month-caption {
+      color: var(--color-cyan-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-caption\]\:text-gray-900 {
+    & .date-picker\_\_month-caption {
+      color: var(--color-gray-900);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid\]\:mt-2 {
+    & .date-picker\_\_month-grid {
+      margin-top: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid\]\:gap-1 {
+    & .date-picker\_\_month-grid {
+      gap: calc(var(--spacing) * 1);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:rounded-lg {
+    & .date-picker\_\_month-grid--view {
+      border-radius: var(--radius-lg);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:border {
+    & .date-picker\_\_month-grid--view {
+      border-style: var(--tw-border-style);
+      border-width: 1px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:border-2 {
+    & .date-picker\_\_month-grid--view {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:border-blue-400 {
+    & .date-picker\_\_month-grid--view {
+      border-color: var(--color-blue-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:border-gray-100 {
+    & .date-picker\_\_month-grid--view {
+      border-color: var(--color-gray-100);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:bg-red-500 {
+    & .date-picker\_\_month-grid--view {
+      background-color: var(--color-red-500);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:bg-white {
+    & .date-picker\_\_month-grid--view {
+      background-color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:p-2 {
+    & .date-picker\_\_month-grid--view {
+      padding: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:font-bold {
+    & .date-picker\_\_month-grid--view {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:font-medium {
+    & .date-picker\_\_month-grid--view {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:text-gray-700 {
+    & .date-picker\_\_month-grid--view {
+      color: var(--color-gray-700);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:text-white {
+    & .date-picker\_\_month-grid--view {
+      color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:shadow-sm {
+    & .date-picker\_\_month-grid--view {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:transition-all {
+    & .date-picker\_\_month-grid--view {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_month-grid--view\]\:hover\:bg-gray-50 {
+    & .date-picker\_\_month-grid--view {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-gray-50);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_outside\]\:\!bg-gray-900 {
+    & .date-picker\_\_outside {
+      background-color: var(--color-gray-900) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_outside\]\:\!bg-transparent {
+    & .date-picker\_\_outside {
+      background-color: transparent !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_outside\]\:opacity-30 {
+    & .date-picker\_\_outside {
+      opacity: 30%;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_outside\]\:opacity-40 {
+    & .date-picker\_\_outside {
+      opacity: 40%;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!rounded-full {
+    & .date-picker\_\_selected {
+      border-radius: calc(infinity * 1px) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!bg-\[\#FF5A5F\] {
+    & .date-picker\_\_selected {
+      background-color: #FF5A5F !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!bg-blue-500 {
+    & .date-picker\_\_selected {
+      background-color: var(--color-blue-500) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!bg-cyan-400 {
+    & .date-picker\_\_selected {
+      background-color: var(--color-cyan-400) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!font-mono {
+    & .date-picker\_\_selected {
+      font-family: var(--font-mono) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!font-medium {
+    & .date-picker\_\_selected {
+      --tw-font-weight: var(--font-weight-medium) !important;
+      font-weight: var(--font-weight-medium) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!text-black {
+    & .date-picker\_\_selected {
+      color: var(--color-black) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:\!text-white {
+    & .date-picker\_\_selected {
+      color: var(--color-white) !important;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:shadow-sm {
+    & .date-picker\_\_selected {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:transition-all {
+    & .date-picker\_\_selected {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:duration-300 {
+    & .date-picker\_\_selected {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:hover\:\!bg-\[\#FF5A5F\]\/90 {
+    & .date-picker\_\_selected {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in oklab, #FF5A5F 90%, transparent) !important;
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_selected\]\:hover\:\!bg-cyan-500 {
+    & .date-picker\_\_selected {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-cyan-500) !important;
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:rounded-full {
+    & .date-picker\_\_today {
+      border-radius: calc(infinity * 1px);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:border-2 {
+    & .date-picker\_\_today {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:border-\[\#FF5A5F\] {
+    & .date-picker\_\_today {
+      border-color: #FF5A5F;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:border-blue-500 {
+    & .date-picker\_\_today {
+      border-color: var(--color-blue-500);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:border-cyan-400 {
+    & .date-picker\_\_today {
+      border-color: var(--color-cyan-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:border-pink-400 {
+    & .date-picker\_\_today {
+      border-color: var(--color-pink-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:font-medium {
+    & .date-picker\_\_today {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_today\]\:text-pink-400 {
+    & .date-picker\_\_today {
+      color: var(--color-pink-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:font-mono {
+    & .date-picker\_\_weekday {
+      font-family: var(--font-mono);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:text-sm {
+    & .date-picker\_\_weekday {
+      font-size: var(--text-sm);
+      line-height: var(--tw-leading, var(--text-sm--line-height));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:font-medium {
+    & .date-picker\_\_weekday {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:tracking-wider {
+    & .date-picker\_\_weekday {
+      --tw-tracking: var(--tracking-wider);
+      letter-spacing: var(--tracking-wider);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:text-blue-500 {
+    & .date-picker\_\_weekday {
+      color: var(--color-blue-500);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:text-cyan-400 {
+    & .date-picker\_\_weekday {
+      color: var(--color-cyan-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:text-gray-500 {
+    & .date-picker\_\_weekday {
+      color: var(--color-gray-500);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_weekday\]\:uppercase {
+    & .date-picker\_\_weekday {
+      text-transform: uppercase;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:rounded-lg {
+    & .date-picker\_\_year-grid--view {
+      border-radius: var(--radius-lg);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:border {
+    & .date-picker\_\_year-grid--view {
+      border-style: var(--tw-border-style);
+      border-width: 1px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:border-2 {
+    & .date-picker\_\_year-grid--view {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:border-gray-100 {
+    & .date-picker\_\_year-grid--view {
+      border-color: var(--color-gray-100);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:border-red-400 {
+    & .date-picker\_\_year-grid--view {
+      border-color: var(--color-red-400);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:bg-blue-500 {
+    & .date-picker\_\_year-grid--view {
+      background-color: var(--color-blue-500);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:bg-white {
+    & .date-picker\_\_year-grid--view {
+      background-color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:p-2 {
+    & .date-picker\_\_year-grid--view {
+      padding: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:font-bold {
+    & .date-picker\_\_year-grid--view {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:font-medium {
+    & .date-picker\_\_year-grid--view {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:text-gray-700 {
+    & .date-picker\_\_year-grid--view {
+      color: var(--color-gray-700);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:text-white {
+    & .date-picker\_\_year-grid--view {
+      color: var(--color-white);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:shadow-sm {
+    & .date-picker\_\_year-grid--view {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:transition-all {
+    & .date-picker\_\_year-grid--view {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_year-grid--view\]\:hover\:bg-gray-50 {
+    & .date-picker\_\_year-grid--view {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-gray-50);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_content\]\:rounded-lg {
+    & .date-time-picker\_\_content {
+      border-radius: var(--radius-lg);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_content\]\:border-cyan-200 {
+    & .date-time-picker\_\_content {
+      border-color: var(--color-cyan-200);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_content\]\:from-cyan-50 {
+    & .date-time-picker\_\_content {
+      --tw-gradient-from: var(--color-cyan-50);
+      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_content\]\:to-blue-50 {
+    & .date-time-picker\_\_content {
+      --tw-gradient-to: var(--color-blue-50);
+      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs\]\:border-cyan-200 {
+    & .date-time-picker\_\_tabs {
+      border-color: var(--color-cyan-200);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\]\:text-green-700 {
+    & .date-time-picker\_\_tabs svg {
+      color: var(--color-green-700);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\[data-selected\=true\]\]\:scale-110 {
+    & .date-time-picker\_\_tabs svg[data-selected=true] {
+      --tw-scale-x: 110%;
+      --tw-scale-y: 110%;
+      --tw-scale-z: 110%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\[data-selected\=true\]\]\:font-bold {
+    & .date-time-picker\_\_tabs svg[data-selected=true] {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\[data-selected\=true\]\]\:text-red-600 {
+    & .date-time-picker\_\_tabs svg[data-selected=true] {
+      color: var(--color-red-600);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\[data-state\=active\]\]\:text-green-900 {
+    & .date-time-picker\_\_tabs svg[data-state=active] {
+      color: var(--color-green-900);
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs_svg\[data-state\=active\]\]\:text-red-900 {
+    & .date-time-picker\_\_tabs svg[data-state=active] {
+      color: var(--color-red-900);
+    }
+  }
+  .focus\:\[\&_\.input-field\]\:bg-transparent {
+    &:focus {
+      & .input-field {
+        background-color: transparent;
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:rounded-lg {
+    & .time-picker\_\_content {
+      border-radius: var(--radius-lg);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:border-2 {
+    & .time-picker\_\_content {
+      border-style: var(--tw-border-style);
+      border-width: 2px;
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:border-b {
+    & .time-picker\_\_content {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 1px;
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:border-cyan-400 {
+    & .time-picker\_\_content {
+      border-color: var(--color-cyan-400);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:border-cyan-400\/30 {
+    & .time-picker\_\_content {
+      border-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 30%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        border-color: color-mix(in oklab, var(--color-cyan-400) 30%, transparent);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:bg-blue-100 {
+    & .time-picker\_\_content {
+      background-color: var(--color-blue-100);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:bg-red-300 {
+    & .time-picker\_\_content {
+      background-color: var(--color-red-300);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:p-2 {
+    & .time-picker\_\_content {
+      padding: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:font-mono {
+    & .time-picker\_\_content {
+      font-family: var(--font-mono);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:text-lg {
+    & .time-picker\_\_content {
+      font-size: var(--text-lg);
+      line-height: var(--tw-leading, var(--text-lg--line-height));
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:transition-all {
+    & .time-picker\_\_content {
+      transition-property: all;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_content\]\:duration-300 {
+    & .time-picker\_\_content {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_option\]\:text-cyan-700 {
+    & .time-picker\_\_option {
+      color: var(--color-cyan-700);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:rounded-lg {
+    & .time-picker\_\_select {
+      border-radius: var(--radius-lg);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:border-cyan-200 {
+    & .time-picker\_\_select {
+      border-color: var(--color-cyan-200);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_timezone\]\:border-cyan-200 {
+    & .time-picker\_\_timezone {
+      border-color: var(--color-cyan-200);
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_timezone-option\]\:text-cyan-700 {
+    & .time-picker\_\_timezone-option {
+      color: var(--color-cyan-700);
+    }
+  }
+  .\[\&_\[cmdk-group-heading\]\]\:px-2 {
+    & [cmdk-group-heading] {
+      padding-inline: calc(var(--spacing) * 2);
+    }
+  }
+  .\[\&_\[cmdk-group-heading\]\]\:py-1\.5 {
+    & [cmdk-group-heading] {
+      padding-block: calc(var(--spacing) * 1.5);
+    }
+  }
+  .\[\&_\[cmdk-group-heading\]\]\:text-xs {
+    & [cmdk-group-heading] {
+      font-size: var(--text-xs);
+      line-height: var(--tw-leading, var(--text-xs--line-height));
+    }
+  }
+  .\[\&_\[cmdk-group-heading\]\]\:font-medium {
+    & [cmdk-group-heading] {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .\[\&_\[cmdk-label\]\]\:hidden {
+    & [cmdk-label] {
+      display: none;
+    }
+  }
+  .\[\&_\[data-state\=checked\]_span\]\:after\:\!bg-blue-500 {
+    & [data-state=checked] span {
+      &::after {
+        content: var(--tw-content);
+        background-color: var(--color-blue-500) !important;
+      }
+    }
+  }
+  .\[\&_\[data-state\=checked\]_span\]\:after\:\!bg-red-500 {
+    & [data-state=checked] span {
+      &::after {
+        content: var(--tw-content);
+        background-color: var(--color-red-500) !important;
+      }
+    }
+  }
+  .\[\&_button\]\:border-blue-600 {
+    & button {
+      border-color: var(--color-blue-600);
+    }
+  }
+  .\[\&_button\]\:hover\:border-green-600 {
+    & button {
+      &:hover {
+        @media (hover: hover) {
+          border-color: var(--color-green-600);
+        }
+      }
+    }
+  }
+  .\[\&_\.date-time-picker\\\\_\\\\_tabs\]\:\[\&_button\[data-selected\=true\]\]\:border-blue-200 {
+    & .date-time-picker\_\_tabs {
+      & button[data-selected=true] {
+        border-color: var(--color-blue-200);
+      }
+    }
+  }
+  .\[\&_label\]\:text-blue-600 {
+    & label {
+      color: var(--color-blue-600);
+    }
+  }
+  .\[\&_label\]\:hover\:text-green-600 {
+    & label {
+      &:hover {
+        @media (hover: hover) {
+          color: var(--color-green-600);
+        }
+      }
+    }
+  }
+  .\[\&_svg\]\:pointer-events-none {
+    & svg {
+      pointer-events: none;
+    }
+  }
+  .\[\&_svg\]\:size-4 {
+    & svg {
+      width: calc(var(--spacing) * 4);
+      height: calc(var(--spacing) * 4);
+    }
+  }
+  .\[\&_svg\]\:shrink-0 {
+    & svg {
+      flex-shrink: 0;
+    }
+  }
+  .\[\&\:\:-webkit-scrollbar\]\:\!hidden {
+    &::-webkit-scrollbar {
+      display: none !important;
+    }
+  }
+  .\[\&\:\:-webkit-scrollbar-thumb\]\:\!hidden {
+    &::-webkit-scrollbar-thumb {
+      display: none !important;
+    }
+  }
+  .\[\&\:\:-webkit-scrollbar-track\]\:\!hidden {
+    &::-webkit-scrollbar-track {
+      display: none !important;
+    }
+  }
+  .\[\&\:\:-webkit-search-cancel-button\]\:hidden {
+    &::-webkit-search-cancel-button {
+      display: none;
+    }
+  }
+  .\[\&\>button\]\:bg-transparent {
+    &>button {
+      background-color: transparent;
+    }
+  }
+  .\[\&\>button\]\:hover\:\!bg-transparent {
+    &>button {
+      &:hover {
+        @media (hover: hover) {
+          background-color: transparent !important;
+        }
+      }
+    }
+  }
+  .\[\&\>button\]\:hover\:bg-transparent {
+    &>button {
+      &:hover {
+        @media (hover: hover) {
+          background-color: transparent;
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:rounded-full {
+    & .date-picker\_\_date-footer {
+      &>button {
+        border-radius: calc(infinity * 1px);
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:p-2 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        padding: calc(var(--spacing) * 2);
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:font-medium {
+    & .date-picker\_\_date-footer {
+      &>button {
+        --tw-font-weight: var(--font-weight-medium);
+        font-weight: var(--font-weight-medium);
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:text-\[\#FF5A5F\] {
+    & .date-picker\_\_date-footer {
+      &>button {
+        color: #FF5A5F;
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:text-blue-400 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        color: var(--color-blue-400);
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:transition-all {
+    & .date-picker\_\_date-footer {
+      &>button {
+        transition-property: all;
+        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+        transition-duration: var(--tw-duration, var(--default-transition-duration));
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:duration-200 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        --tw-duration: 200ms;
+        transition-duration: 200ms;
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:duration-300 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        --tw-duration: 300ms;
+        transition-duration: 300ms;
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:hover\:bg-\[\#FF5A5F\]\/10 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        &:hover {
+          @media (hover: hover) {
+            background-color: color-mix(in oklab, #FF5A5F 10%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:hover\:bg-blue-400\/10 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        &:hover {
+          @media (hover: hover) {
+            background-color: color-mix(in srgb, hsl(209 100% 75%) 10%, transparent);
+            @supports (color: color-mix(in lab, red, red)) {
+              background-color: color-mix(in oklab, var(--color-blue-400) 10%, transparent);
+            }
+          }
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:hover\:text-\[\#FF5A5F\]\/90 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        &:hover {
+          @media (hover: hover) {
+            color: color-mix(in oklab, #FF5A5F 90%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[\&_\.date-picker\\\\_\\\\_date-footer\]\:\[\&\>button\]\:hover\:text-blue-500 {
+    & .date-picker\_\_date-footer {
+      &>button {
+        &:hover {
+          @media (hover: hover) {
+            color: var(--color-blue-500);
+          }
+        }
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_buttons\]\:\[\&\>button\]\:bg-gray-800 {
+    & .time-picker\_\_buttons {
+      &>button {
+        background-color: var(--color-gray-800);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_buttons\]\:\[\&\>button\]\:text-gray-900 {
+    & .time-picker\_\_buttons {
+      &>button {
+        color: var(--color-gray-900);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_period\]\:\[\&\>button\]\:text-blue-500 {
+    & .time-picker\_\_period {
+      &>button {
+        color: var(--color-blue-500);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_period\]\:\[\&\>button\]\:text-red-500 {
+    & .time-picker\_\_period {
+      &>button {
+        color: var(--color-red-500);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:rounded-lg {
+    & .time-picker\_\_select {
+      &>button {
+        border-radius: var(--radius-lg);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:bg-red-500 {
+    & .time-picker\_\_select {
+      &>button {
+        background-color: var(--color-red-500);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:p-2 {
+    & .time-picker\_\_select {
+      &>button {
+        padding: calc(var(--spacing) * 2);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:text-gray-900 {
+    & .time-picker\_\_select {
+      &>button {
+        color: var(--color-gray-900);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:transition-all {
+    & .time-picker\_\_select {
+      &>button {
+        transition-property: all;
+        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+        transition-duration: var(--tw-duration, var(--default-transition-duration));
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_select\]\:\[\&\>button\]\:duration-300 {
+    & .time-picker\_\_select {
+      &>button {
+        --tw-duration: 300ms;
+        transition-duration: 300ms;
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_period\]\:\[\&\>button\[data-selected\=true\]\]\:rounded-md {
+    & .time-picker\_\_period {
+      &>button[data-selected=true] {
+        border-radius: var(--radius-md);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_period\]\:\[\&\>button\[data-selected\=true\]\]\:bg-blue-100 {
+    & .time-picker\_\_period {
+      &>button[data-selected=true] {
+        background-color: var(--color-blue-100);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_period\]\:\[\&\>button\[data-selected\=true\]\]\:font-bold {
+    & .time-picker\_\_period {
+      &>button[data-selected=true] {
+        --tw-font-weight: var(--font-weight-bold);
+        font-weight: var(--font-weight-bold);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_selector\]\:\[\&\>div\]\:bg-green-100 {
+    & .time-picker\_\_selector {
+      &>div {
+        background-color: var(--color-green-100);
+      }
+    }
+  }
+  .\[\&_\.time-picker\\\\_\\\\_selector\]\:\[\&\>div\]\:bg-green-500 {
+    & .time-picker\_\_selector {
+      &>div {
+        background-color: var(--color-green-500);
+      }
+    }
+  }
+  .\[\&\>label\]\:text-blue-500 {
+    &>label {
+      color: var(--color-blue-500);
+    }
+  }
+  .\[\&\>label\]\:text-green-500 {
+    &>label {
+      color: var(--color-green-500);
+    }
+  }
+  .\[\&\>label\]\:text-red-500 {
+    &>label {
+      color: var(--color-red-500);
+    }
+  }
+  .\[\&\>label\]\:text-red-900 {
+    &>label {
+      color: var(--color-red-900);
+    }
+  }
+  .\[\&\>label\]\:text-yellow-500 {
+    &>label {
+      color: var(--color-yellow-500);
+    }
+  }
+  .\[\&\>span\]\:truncate {
+    &>span {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+  .\[\&\>span\]\:text-blue-900 {
+    &>span {
+      color: var(--color-blue-900);
+    }
+  }
+  .\[\&\>span\]\:text-green-900 {
+    &>span {
+      color: var(--color-green-900);
+    }
+  }
+  .\[\&\>span\]\:text-red-900 {
+    &>span {
+      color: var(--color-red-900);
+    }
+  }
+  .\[\&\>span\]\:text-yellow-900 {
+    &>span {
+      color: var(--color-yellow-900);
+    }
+  }
+  .\[\&\>svg\]\:size-4 {
+    &>svg {
+      width: calc(var(--spacing) * 4);
+      height: calc(var(--spacing) * 4);
+    }
+  }
+  .\[\&\>svg\]\:shrink-0 {
+    &>svg {
+      flex-shrink: 0;
+    }
+  }
+  .\[\&\>svg\]\:text-green-900 {
+    &>svg {
+      color: var(--color-green-900);
+    }
+  }
+}
+:root {
+  --toastify-toast-min-height: 48px;
+  --toastify-toast-bd-radius: 8px;
+  --toastify-text-color-light: var(--color-gray-800);
+  --toastify-color-progress-info: var(--color-gray-300);
+  --toastify-color-progress-success: var(--color-gray-300);
+  --toastify-color-progress-warning: var(--color-gray-300);
+  --toastify-color-progress-error: var(--color-gray-300);
+  --toastify-color-progress-light: var(--color-gray-300);
+}
+html:has(dialog[open]) {
+  overflow: hidden;
+}
+.checkbox-container input[type="checkbox"] {
+  accent-color: var(--color-gray-900);
+}
+.rmsc {
+  --rmsc-main: var(--color-gray-300) !important;
+  --rmsc-hover: var(--color-gray-100) !important;
+  --rmsc-selected: var(--color-gray-300) !important;
+}
+.Toastify__toast-body {
+  padding: 0;
+  margin: 0;
+  font-size: 14px;
+  font-weight: 600;
+}
+.Toastify__toast {
+  box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.32);
+  padding: 12px 16px 12px 16px;
+}
+.Toastify__progress-bar--wrp {
+  height: 2px;
+}
+input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  margin: 0;
+}
+input[type="number"] {
+  -moz-appearance: textfield;
+}
+@layer base {
+  h1, h2, h3, h4, h5, h6, p {
+    color: var(--color-gray-900);
+  }
+  button {
+    cursor: pointer;
+  }
+}
+.object-set-table {
+  height: 1px;
+}
+.object-set-table__td {
+  height: 1px;
+}
+@-moz-document url-prefix() {
+  .object-set-table__td {
+    height: 100%;
+  }
+}
+@layer base {
+  * {
+    scrollbar-color: initial;
+    scrollbar-width: initial;
+  }
+}
+@property --tw-translate-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+@property --tw-translate-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+@property --tw-translate-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+@property --tw-rotate-x {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-rotate-y {
+  syntax: "*";
+  inherits: false;
 }
-@property --tw-translate-x {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-translate-y {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-translate-z {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-rotate-x {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-rotate-y {
-  syntax: "*";
-  inherits: false;
-}
 @property --tw-rotate-z {
   syntax: "*";
   inherits: false;
@@ -3717,6 +4916,63 @@ input[type="number"] {
   initial-value: "";
   inherits: false;
 }
+@property --tw-scale-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-gradient-position {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-from {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-via {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-to {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-stops {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-via-stops {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-from-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 0%;
+}
+@property --tw-gradient-via-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 50%;
+}
+@property --tw-gradient-to-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
 @keyframes spin {
   to {
     transform: rotate(360deg);
@@ -3839,6 +5095,18 @@ input[type="number"] {
       --tw-duration: initial;
       --tw-ease: initial;
       --tw-content: "";
+      --tw-scale-x: 1;
+      --tw-scale-y: 1;
+      --tw-scale-z: 1;
+      --tw-gradient-position: initial;
+      --tw-gradient-from: #0000;
+      --tw-gradient-via: #0000;
+      --tw-gradient-to: #0000;
+      --tw-gradient-stops: initial;
+      --tw-gradient-via-stops: initial;
+      --tw-gradient-from-position: 0%;
+      --tw-gradient-via-position: 50%;
+      --tw-gradient-to-position: 100%;
     }
   }
 }