@uipath/apollo-wind 2.66.0 → 2.67.0

package/dist/styles.css

@@ -689,12 +689,24 @@
   .right-5 {
     right: calc(var(--spacing) * 5);
   }
+  .right-6 {
+    right: calc(var(--spacing) * 6);
+  }
   .-bottom-1 {
     bottom: calc(var(--spacing) * -1);
   }
   .bottom-0 {
     bottom: calc(var(--spacing) * 0);
   }
+  .bottom-3 {
+    bottom: calc(var(--spacing) * 3);
+  }
+  .bottom-6 {
+    bottom: calc(var(--spacing) * 6);
+  }
+  .bottom-auto {
+    bottom: auto;
+  }
   .left-0 {
     left: calc(var(--spacing) * 0);
   }
@@ -974,6 +986,12 @@
     -webkit-box-orient: vertical;
     -webkit-line-clamp: 1;
   }
+  .scrollbar-none {
+    scrollbar-width: none;
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  }
   .\!block {
     display: block !important;
   }
@@ -1173,6 +1191,9 @@
   .h-75 {
     height: calc(var(--spacing) * 75);
   }
+  .h-80 {
+    height: calc(var(--spacing) * 80);
+  }
   .h-96 {
     height: calc(var(--spacing) * 96);
   }
@@ -1308,6 +1329,9 @@
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
+  .min-h-4 {
+    min-height: calc(var(--spacing) * 4);
+  }
   .min-h-5 {
     min-height: calc(var(--spacing) * 5);
   }
@@ -1683,6 +1707,9 @@
   .max-w-\[45\%\] {
     max-width: 45%;
   }
+  .max-w-\[80\%\] {
+    max-width: 80%;
+  }
   .max-w-\[85\%\] {
     max-width: 85%;
   }
@@ -1875,6 +1902,14 @@
     --tw-translate-y: calc(var(--spacing) * -2);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .-translate-y-3\/4 {
+    --tw-translate-y: calc(calc(3/4 * 100%) * -1);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+  .translate-y-3\/4 {
+    --tw-translate-y: calc(3/4 * 100%);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
   .translate-y-\[-50\%\] {
     --tw-translate-y: -50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -1906,6 +1941,96 @@
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
+  .shimmer {
+    --_spread: calc(3ch + 40px);
+    --_base: currentColor;
+    --_highlight: oklch(from currentColor l c h / calc(alpha * 0.2));
+    background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), var(--_highlight) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, var(--_highlight) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+    @supports (color: color-mix(in lab, red, red)) {
+      background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+    }
+    background-repeat: no-repeat;
+    background-size: calc(200% + var(--_spread) * 2) 100%;
+    background-position: 0 0;
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: var(--shimmer-text-fill, transparent);
+    animation: tw-shimmer 2s linear infinite;
+    &:is(.dark:not(.react-flow), .dark-hc, .future-dark, .dark:not(.react-flow) *, .dark-hc *, .future-dark *) {
+      --_highlight: oklch(from currentColor max(0.8, calc(l + 0.4)) c h / calc(alpha + 0.4));
+    }
+    &:where([dir='rtl'], [dir='rtl'] *) {
+      animation-direction: reverse;
+    }
+    @media (prefers-reduced-motion: reduce) {
+      animation: none;
+      background-image: none;
+      -webkit-text-fill-color: currentColor;
+    }
+  }
+  .scroll-fade-x {
+    --_scroll-fade-size-s: min(12%, calc(var(--spacing) * 10));
+    --_scroll-fade-size-e: min(12%, calc(var(--spacing) * 10));
+    --scroll-fade-inline: linear-gradient(
+    to right,
+    transparent 0,
+    #000 var(--scroll-fade-s, 0px),
+    #000 calc(100% - var(--scroll-fade-e, 0px)),
+    transparent 100%
+  );
+    &:where([dir='rtl'], [dir='rtl'] *) {
+      --scroll-fade-inline: linear-gradient(
+      to left,
+      transparent 0,
+      #000 var(--scroll-fade-s, 0px),
+      #000 calc(100% - var(--scroll-fade-e, 0px)),
+      transparent 100%
+    );
+    }
+    -webkit-mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));
+    mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));
+    -webkit-mask-composite: source-in;
+    mask-composite: intersect;
+    -webkit-mask-repeat: no-repeat;
+    mask-repeat: no-repeat;
+    @supports (animation-timeline: scroll()) {
+      animation: scroll-fade-reveal-s 1ms ease-in-out, scroll-fade-reveal-e 1ms ease-in-out;
+      animation-timeline: scroll(self inline), scroll(self inline);
+      animation-range: 0 calc(var(--spacing) * 24), calc(100% - calc(var(--spacing) * 24)) 100%;
+      animation-fill-mode: both;
+    }
+    @supports not (animation-timeline: scroll()) {
+      --scroll-fade-s: var(--_scroll-fade-size-s);
+      --scroll-fade-e: var(--_scroll-fade-size-e);
+    }
+  }
+  .scroll-fade-y {
+    --_scroll-fade-size-t: min(12%, calc(var(--spacing) * 10));
+    --_scroll-fade-size-b: min(12%, calc(var(--spacing) * 10));
+    --scroll-fade-block: linear-gradient(
+    to bottom,
+    transparent 0,
+    #000 var(--scroll-fade-t, 0px),
+    #000 calc(100% - var(--scroll-fade-b, 0px)),
+    transparent 100%
+  );
+    -webkit-mask-image: var(--scroll-fade-mask, var(--scroll-fade-block));
+    mask-image: var(--scroll-fade-mask, var(--scroll-fade-block));
+    -webkit-mask-composite: source-in;
+    mask-composite: intersect;
+    -webkit-mask-repeat: no-repeat;
+    mask-repeat: no-repeat;
+    @supports (animation-timeline: scroll()) {
+      animation: scroll-fade-reveal-t 1ms ease-in-out, scroll-fade-reveal-b 1ms ease-in-out;
+      animation-timeline: scroll(self y), scroll(self y);
+      animation-range: 0 calc(var(--spacing) * 24), calc(100% - calc(var(--spacing) * 24)) 100%;
+      animation-fill-mode: both;
+    }
+    @supports not (animation-timeline: scroll()) {
+      --scroll-fade-t: var(--_scroll-fade-size-t);
+      --scroll-fade-b: var(--_scroll-fade-size-b);
+    }
+  }
   .\!animate-none {
     animation: none !important;
   }
@@ -1951,6 +2076,15 @@
   .resize-y {
     resize: vertical;
   }
+  .snap-x {
+    scroll-snap-type: x var(--tw-scroll-snap-strictness);
+  }
+  .snap-mandatory {
+    --tw-scroll-snap-strictness: mandatory;
+  }
+  .scroll-px-1 {
+    scroll-padding-inline: calc(var(--spacing) * 1);
+  }
   .list-inside {
     list-style-position: inside;
   }
@@ -2301,6 +2435,9 @@
   .overflow-y-auto {
     overflow-y: auto;
   }
+  .overscroll-contain {
+    overscroll-behavior: contain;
+  }
   .overscroll-x-contain {
     overscroll-behavior-x: contain;
   }
@@ -4548,6 +4685,12 @@
   .text-muted-foreground {
     color: var(--muted-foreground);
   }
+  .text-muted-foreground\/50 {
+    color: var(--muted-foreground);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);
+    }
+  }
   .text-muted-foreground\/70 {
     color: var(--muted-foreground);
     @supports (color: color-mix(in lab, red, red)) {
@@ -4792,6 +4935,9 @@
       --tw-ring-color: color-mix(in oklab, var(--brand) 30%, transparent);
     }
   }
+  .ring-card {
+    --tw-ring-color: var(--card);
+  }
   .ring-emerald-500 {
     --tw-ring-color: var(--color-emerald-500);
   }
@@ -5089,11 +5235,39 @@
       opacity: 50%;
     }
   }
+  .group-has-\[\[data-slot\=message-footer\]\]\/message\:-translate-y-8 {
+    &:is(:where(.group\/message):has(*:is([data-slot=message-footer])) *) {
+      --tw-translate-y: calc(var(--spacing) * -8);
+      translate: var(--tw-translate-x) var(--tw-translate-y);
+    }
+  }
   .group-aria-invalid\/radio-group\:border-error {
     &:is(:where(.group\/radio-group)[aria-invalid="true"] *) {
       border-color: var(--error);
     }
   }
+  .group-data-\[align\=end\]\/bubble\:self-end {
+    &:is(:where(.group\/bubble)[data-align="end"] *) {
+      align-self: flex-end;
+    }
+  }
+  .group-data-\[align\=end\]\/message\:justify-end {
+    &:is(:where(.group\/message)[data-align="end"] *) {
+      justify-content: flex-end;
+    }
+  }
+  .group-data-\[align\=end\]\/message\:self-end {
+    &:is(:where(.group\/message)[data-align="end"] *) {
+      align-self: flex-end;
+    }
+  }
+  .group-data-\[align\=end\]\/message\:\*\:self-end {
+    &:is(:where(.group\/message)[data-align="end"] *) {
+      :is(& > *) {
+        align-self: flex-end;
+      }
+    }
+  }
   .group-data-\[collapsible\=icon\]\:-mt-8 {
     &:is(:where(.group)[data-collapsible="icon"] *) {
       margin-top: calc(var(--spacing) * -8);
@@ -5200,6 +5374,36 @@
       }
     }
   }
+  .group-data-\[orientation\=vertical\]\/attachment\:absolute {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      position: absolute;
+    }
+  }
+  .group-data-\[orientation\=vertical\]\/attachment\:top-3 {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      top: calc(var(--spacing) * 3);
+    }
+  }
+  .group-data-\[orientation\=vertical\]\/attachment\:right-3 {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      right: calc(var(--spacing) * 3);
+    }
+  }
+  .group-data-\[orientation\=vertical\]\/attachment\:w-full {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      width: 100%;
+    }
+  }
+  .group-data-\[orientation\=vertical\]\/attachment\:gap-1 {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      gap: calc(var(--spacing) * 1);
+    }
+  }
+  .group-data-\[orientation\=vertical\]\/attachment\:px-1 {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      padding-inline: calc(var(--spacing) * 1);
+    }
+  }
   .group-data-\[selected\=true\]\:opacity-100 {
     &:is(:where(.group)[data-selected="true"] *) {
       opacity: 100%;
@@ -5242,6 +5446,52 @@
       border-left-width: 1px;
     }
   }
+  .group-data-\[size\=sm\]\/attachment\:w-8 {
+    &:is(:where(.group\/attachment)[data-size="sm"] *) {
+      width: calc(var(--spacing) * 8);
+    }
+  }
+  .group-data-\[size\=xs\]\/attachment\:w-7 {
+    &:is(:where(.group\/attachment)[data-size="xs"] *) {
+      width: calc(var(--spacing) * 7);
+    }
+  }
+  .group-data-\[size\=xs\]\/attachment\:rounded-md {
+    &:is(:where(.group\/attachment)[data-size="xs"] *) {
+      border-radius: var(--radius-md);
+    }
+  }
+  .group-data-\[state\=done\]\/attachment\:opacity-100 {
+    &:is(:where(.group\/attachment)[data-state="done"] *) {
+      opacity: 100%;
+    }
+  }
+  .group-data-\[state\=error\]\/attachment\:bg-destructive\/10 {
+    &:is(:where(.group\/attachment)[data-state="error"] *) {
+      background-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
+      }
+    }
+  }
+  .group-data-\[state\=error\]\/attachment\:text-destructive {
+    &:is(:where(.group\/attachment)[data-state="error"] *) {
+      color: var(--destructive);
+    }
+  }
+  .group-data-\[state\=error\]\/attachment\:text-destructive\/80 {
+    &:is(:where(.group\/attachment)[data-state="error"] *) {
+      color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        color: color-mix(in oklab, var(--destructive) 80%, transparent);
+      }
+    }
+  }
+  .group-data-\[state\=idle\]\/attachment\:opacity-100 {
+    &:is(:where(.group\/attachment)[data-state="idle"] *) {
+      opacity: 100%;
+    }
+  }
   .group-data-\[state\=indeterminate\]\/checkbox\:block {
     &:is(:where(.group\/checkbox)[data-state="indeterminate"] *) {
       display: block;
@@ -5262,6 +5512,64 @@
       rotate: 90deg;
     }
   }
+  .group-data-\[state\=processing\]\/attachment\:shimmer {
+    &:is(:where(.group\/attachment)[data-state="processing"] *) {
+      --_spread: calc(3ch + 40px);
+      --_base: currentColor;
+      --_highlight: oklch(from currentColor l c h / calc(alpha * 0.2));
+      background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), var(--_highlight) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, var(--_highlight) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+      @supports (color: color-mix(in lab, red, red)) {
+        background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+      }
+      background-repeat: no-repeat;
+      background-size: calc(200% + var(--_spread) * 2) 100%;
+      background-position: 0 0;
+      background-clip: text;
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: var(--shimmer-text-fill, transparent);
+      animation: tw-shimmer 2s linear infinite;
+      &:is(.dark:not(.react-flow), .dark-hc, .future-dark, .dark:not(.react-flow) *, .dark-hc *, .future-dark *) {
+        --_highlight: oklch(from currentColor max(0.8, calc(l + 0.4)) c h / calc(alpha + 0.4));
+      }
+      &:where([dir='rtl'], [dir='rtl'] *) {
+        animation-direction: reverse;
+      }
+      @media (prefers-reduced-motion: reduce) {
+        animation: none;
+        background-image: none;
+        -webkit-text-fill-color: currentColor;
+      }
+    }
+  }
+  .group-data-\[state\=uploading\]\/attachment\:shimmer {
+    &:is(:where(.group\/attachment)[data-state="uploading"] *) {
+      --_spread: calc(3ch + 40px);
+      --_base: currentColor;
+      --_highlight: oklch(from currentColor l c h / calc(alpha * 0.2));
+      background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), var(--_highlight) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, var(--_highlight) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+      @supports (color: color-mix(in lab, red, red)) {
+        background-image: var( --shimmer-image, linear-gradient( calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% - var(--_spread) * 0.5), var(--_highlight) 50%, color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% + var(--_spread) * 0.5), var(--_base) calc(50% + var(--_spread)) ) );
+      }
+      background-repeat: no-repeat;
+      background-size: calc(200% + var(--_spread) * 2) 100%;
+      background-position: 0 0;
+      background-clip: text;
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: var(--shimmer-text-fill, transparent);
+      animation: tw-shimmer 2s linear infinite;
+      &:is(.dark:not(.react-flow), .dark-hc, .future-dark, .dark:not(.react-flow) *, .dark-hc *, .future-dark *) {
+        --_highlight: oklch(from currentColor max(0.8, calc(l + 0.4)) c h / calc(alpha + 0.4));
+      }
+      &:where([dir='rtl'], [dir='rtl'] *) {
+        animation-direction: reverse;
+      }
+      @media (prefers-reduced-motion: reduce) {
+        animation: none;
+        background-image: none;
+        -webkit-text-fill-color: currentColor;
+      }
+    }
+  }
   .group-data-\[variant\=floating\]\:rounded-lg {
     &:is(:where(.group)[data-variant="floating"] *) {
       border-radius: var(--radius-lg);
@@ -5284,6 +5592,16 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
+  .group-data-\[variant\=separator\]\/marker\:flex-none {
+    &:is(:where(.group\/marker)[data-variant="separator"] *) {
+      flex: none;
+    }
+  }
+  .group-data-\[variant\=separator\]\/marker\:text-center {
+    &:is(:where(.group\/marker)[data-variant="separator"] *) {
+      text-align: center;
+    }
+  }
   .group-\[\.toast\]\:bg-muted {
     &:is(:where(.group):is(.toast) *) {
       background-color: var(--muted);
@@ -5414,6 +5732,36 @@
       }
     }
   }
+  .before\:mr-1 {
+    &::before {
+      content: var(--tw-content);
+      margin-right: calc(var(--spacing) * 1);
+    }
+  }
+  .before\:h-px {
+    &::before {
+      content: var(--tw-content);
+      height: 1px;
+    }
+  }
+  .before\:min-w-0 {
+    &::before {
+      content: var(--tw-content);
+      min-width: calc(var(--spacing) * 0);
+    }
+  }
+  .before\:flex-1 {
+    &::before {
+      content: var(--tw-content);
+      flex: 1;
+    }
+  }
+  .before\:bg-border {
+    &::before {
+      content: var(--tw-content);
+      background-color: var(--ap-wind-border);
+    }
+  }
   .after\:absolute {
     &::after {
       content: var(--tw-content);
@@ -5438,6 +5786,18 @@
       left: calc(1/2 * 100%);
     }
   }
+  .after\:ml-1 {
+    &::after {
+      content: var(--tw-content);
+      margin-left: calc(var(--spacing) * 1);
+    }
+  }
+  .after\:h-px {
+    &::after {
+      content: var(--tw-content);
+      height: 1px;
+    }
+  }
   .after\:w-1 {
     &::after {
       content: var(--tw-content);
@@ -5450,6 +5810,18 @@
       width: 2px;
     }
   }
+  .after\:min-w-0 {
+    &::after {
+      content: var(--tw-content);
+      min-width: calc(var(--spacing) * 0);
+    }
+  }
+  .after\:flex-1 {
+    &::after {
+      content: var(--tw-content);
+      flex: 1;
+    }
+  }
   .after\:-translate-x-1\/2 {
     &::after {
       content: var(--tw-content);
@@ -5457,6 +5829,12 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
+  .after\:bg-border {
+    &::after {
+      content: var(--tw-content);
+      background-color: var(--ap-wind-border);
+    }
+  }
   .group-data-\[collapsible\=offcanvas\]\:after\:left-full {
     &:is(:where(.group)[data-collapsible="offcanvas"] *) {
       &::after {
@@ -5535,6 +5913,12 @@
       border-color: var(--ring);
     }
   }
+  .focus-within\:ring-1 {
+    &:focus-within {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
   .focus-within\:ring-2 {
     &:focus-within {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -5546,6 +5930,14 @@
       --tw-ring-color: var(--ring);
     }
   }
+  .focus-within\:ring-ring\/50 {
+    &:focus-within {
+      --tw-ring-color: var(--ring);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+      }
+    }
+  }
   .focus-within\:ring-offset-2 {
     &:focus-within {
       --tw-ring-offset-width: 2px;
@@ -6399,6 +6791,56 @@
       }
     }
   }
+  .has-data-\[slot\=attachment-content\]\:w-30 {
+    &:has(*[data-slot="attachment-content"]) {
+      width: calc(var(--spacing) * 30);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:px-1\.5 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-inline: calc(var(--spacing) * 1.5);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:px-2 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-inline: calc(var(--spacing) * 2);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:px-2\.5 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-inline: calc(var(--spacing) * 2.5);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:py-1 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-block: calc(var(--spacing) * 1);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:py-1\.5 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-block: calc(var(--spacing) * 1.5);
+    }
+  }
+  .has-data-\[slot\=attachment-content\]\:py-2 {
+    &:has(*[data-slot="attachment-content"]) {
+      padding-block: calc(var(--spacing) * 2);
+    }
+  }
+  .has-data-\[slot\=attachment-media\]\:p-1 {
+    &:has(*[data-slot="attachment-media"]) {
+      padding: calc(var(--spacing) * 1);
+    }
+  }
+  .has-data-\[slot\=attachment-media\]\:p-1\.5 {
+    &:has(*[data-slot="attachment-media"]) {
+      padding: calc(var(--spacing) * 1.5);
+    }
+  }
+  .has-data-\[slot\=attachment-media\]\:p-2 {
+    &:has(*[data-slot="attachment-media"]) {
+      padding: calc(var(--spacing) * 2);
+    }
+  }
   .has-data-\[variant\=inset\]\:bg-surface {
     &:has(*[data-variant="inset"]) {
       background-color: var(--surface);
@@ -6499,6 +6941,18 @@
       border-top-width: 0px;
     }
   }
+  .has-\[\>a\,\>button\]\:hover\:bg-muted\/50 {
+    &:has(>a,>button) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--muted);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--muted) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
   .has-\[\>textarea\]\:h-auto {
     &:has(>textarea) {
       height: auto;
@@ -6588,6 +7042,16 @@
       }
     }
   }
+  .data-\[active\=false\]\:pointer-events-none {
+    &[data-active="false"] {
+      pointer-events: none;
+    }
+  }
+  .data-\[active\=false\]\:opacity-0 {
+    &[data-active="false"] {
+      opacity: 0%;
+    }
+  }
   .data-\[active\=true\]\:bg-surface-overlay {
     &[data-active="true"] {
       background-color: var(--surface-overlay);
@@ -6618,6 +7082,16 @@
       }
     }
   }
+  .data-\[align\=end\]\:flex-row-reverse {
+    &[data-align="end"] {
+      flex-direction: row-reverse;
+    }
+  }
+  .data-\[align\=end\]\:self-end {
+    &[data-align="end"] {
+      align-self: flex-end;
+    }
+  }
   .data-\[disabled\]\:pointer-events-none {
     &[data-disabled] {
       pointer-events: none;
@@ -6762,6 +7236,20 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
+  .\*\:data-\[slot\=attachment\]\:flex-none {
+    :is(& > *) {
+      &[data-slot="attachment"] {
+        flex: none;
+      }
+    }
+  }
+  .\*\:data-\[slot\=attachment\]\:snap-start {
+    :is(& > *) {
+      &[data-slot="attachment"] {
+        scroll-snap-align: start;
+      }
+    }
+  }
   .data-\[spacing\=0\]\:rounded-none {
     &[data-spacing="0"] {
       border-radius: 0;
@@ -6865,6 +7353,20 @@
       transition-duration: 300ms;
     }
   }
+  .data-\[state\=error\]\:border-destructive\/30 {
+    &[data-state="error"] {
+      border-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        border-color: color-mix(in oklab, var(--destructive) 30%, transparent);
+      }
+    }
+  }
+  .data-\[state\=idle\]\:border-dashed {
+    &[data-state="idle"] {
+      --tw-border-style: dashed;
+      border-style: dashed;
+    }
+  }
   .data-\[state\=indeterminate\]\:bg-primary {
     &[data-state="indeterminate"] {
       background-color: var(--primary);
@@ -7733,6 +8235,13 @@
       }
     }
   }
+  .future\:focus\:ring-primary {
+    :is(.future-dark, .future-light) & {
+      &:focus {
+        --tw-ring-color: var(--primary);
+      }
+    }
+  }
   .future\:focus-visible\:ring-0 {
     :is(.future-dark, .future-light) & {
       &:focus-visible {
@@ -7741,6 +8250,20 @@
       }
     }
   }
+  .future\:focus-visible\:ring-foreground {
+    :is(.future-dark, .future-light) & {
+      &:focus-visible {
+        --tw-ring-color: var(--foreground);
+      }
+    }
+  }
+  .future\:focus-visible\:ring-primary {
+    :is(.future-dark, .future-light) & {
+      &:focus-visible {
+        --tw-ring-color: var(--primary);
+      }
+    }
+  }
   .future\:focus-visible\:ring-offset-0 {
     :is(.future-dark, .future-light) & {
       &:focus-visible {
@@ -7771,6 +8294,13 @@
       }
     }
   }
+  .future\:has-\[\[data-slot\=input-group-control\]_\:focus-visible\]\:ring-primary {
+    :is(.future-dark, .future-light) & {
+      &:has(*:is([data-slot=input-group-control] :focus-visible)) {
+        --tw-ring-color: var(--primary);
+      }
+    }
+  }
   .future\:has-\[\[data-slot\=input-group-control\]_\:focus-visible\]\:ring-offset-2 {
     :is(.future-dark, .future-light) & {
       &:has(*:is([data-slot=input-group-control] :focus-visible)) {
@@ -7786,6 +8316,13 @@
       }
     }
   }
+  .future\:has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-primary {
+    :is(.future-dark, .future-light) & {
+      &:has(*:is([data-slot=input-group-control]:focus-visible)) {
+        --tw-ring-color: var(--primary);
+      }
+    }
+  }
   .future\:has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-offset-2 {
     :is(.future-dark, .future-light) & {
       &:has(*:is([data-slot=input-group-control]:focus-visible)) {
@@ -7885,6 +8422,24 @@
       }
     }
   }
+  .future\:aria-invalid\:focus\:ring-error {
+    :is(.future-dark, .future-light) & {
+      &[aria-invalid="true"] {
+        &:focus {
+          --tw-ring-color: var(--error);
+        }
+      }
+    }
+  }
+  .future\:aria-invalid\:focus-visible\:ring-error {
+    :is(.future-dark, .future-light) & {
+      &[aria-invalid="true"] {
+        &:focus-visible {
+          --tw-ring-color: var(--error);
+        }
+      }
+    }
+  }
   .future\:data-\[state\=checked\]\:border-foreground-accent {
     :is(.future-dark, .future-light) & {
       &[data-state="checked"] {
@@ -8130,6 +8685,25 @@
       white-space: nowrap;
     }
   }
+  .\[\&_a\]\:underline {
+    & a {
+      text-decoration-line: underline;
+    }
+  }
+  .\[\&_a\]\:underline-offset-3 {
+    & a {
+      text-underline-offset: 3px;
+    }
+  }
+  .\[\&_a\]\:hover\:text-foreground {
+    & a {
+      &:hover {
+        @media (hover: hover) {
+          color: var(--foreground);
+        }
+      }
+    }
+  }
   .\[\&_p\]\:leading-4 {
     & p {
       --tw-leading: calc(var(--spacing) * 4);
@@ -8181,6 +8755,22 @@
       height: calc(var(--spacing) * 4);
     }
   }
+  .group-data-\[orientation\=vertical\]\/attachment\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-6 {
+    &:is(:where(.group\/attachment)[data-orientation="vertical"] *) {
+      & svg:not([class*='size-']) {
+        width: calc(var(--spacing) * 6);
+        height: calc(var(--spacing) * 6);
+      }
+    }
+  }
+  .group-data-\[size\=xs\]\/attachment\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3\.5 {
+    &:is(:where(.group\/attachment)[data-size="xs"] *) {
+      & svg:not([class*='size-']) {
+        width: calc(var(--spacing) * 3.5);
+        height: calc(var(--spacing) * 3.5);
+      }
+    }
+  }
   .\[\&_table\]\:\!w-full {
     & table {
       width: 100% !important;
@@ -8243,6 +8833,27 @@
       }
     }
   }
+  .\*\:\[img\]\:aspect-square {
+    :is(& > *) {
+      &:is(img) {
+        aspect-ratio: 1 / 1;
+      }
+    }
+  }
+  .\*\:\[img\]\:w-full {
+    :is(& > *) {
+      &:is(img) {
+        width: 100%;
+      }
+    }
+  }
+  .\*\:\[img\]\:object-cover {
+    :is(& > *) {
+      &:is(img) {
+        object-fit: cover;
+      }
+    }
+  }
   .\[\&\:not\(\:last-child\)\]\:border-b {
     &:not(:last-child) {
       border-bottom-style: var(--tw-border-style);
@@ -8264,6 +8875,75 @@
       justify-content: center;
     }
   }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:rounded-none {
+    &>[data-slot=bubble-content] {
+      border-radius: 0;
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:border-0 {
+    &>[data-slot=bubble-content] {
+      border-style: var(--tw-border-style);
+      border-width: 0px;
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:border-border {
+    &>[data-slot=bubble-content] {
+      border-color: var(--ap-wind-border);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-background {
+    &>[data-slot=bubble-content] {
+      background-color: var(--background);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-destructive\/10 {
+    &>[data-slot=bubble-content] {
+      background-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
+      }
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-primary {
+    &>[data-slot=bubble-content] {
+      background-color: var(--primary);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-secondary {
+    &>[data-slot=bubble-content] {
+      background-color: var(--secondary);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-surface-overlay {
+    &>[data-slot=bubble-content] {
+      background-color: var(--surface-overlay);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:bg-transparent {
+    &>[data-slot=bubble-content] {
+      background-color: transparent;
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:p-0 {
+    &>[data-slot=bubble-content] {
+      padding: calc(var(--spacing) * 0);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:text-destructive {
+    &>[data-slot=bubble-content] {
+      color: var(--destructive);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:text-primary-foreground {
+    &>[data-slot=bubble-content] {
+      color: var(--primary-foreground);
+    }
+  }
+  .\[\&\>\[data-slot\=bubble-content\]\]\:text-secondary-foreground {
+    &>[data-slot=bubble-content] {
+      color: var(--secondary-foreground);
+    }
+  }
   .\[\&\>\[data-slot\=form-field-error\]\]\:mt-0 {
     &>[data-slot=form-field-error] {
       margin-top: calc(var(--spacing) * 0);
@@ -11456,6 +12136,43 @@ html[dir='rtl'], [data-sonner-toaster][dir='rtl'] {
     animation: apollo-fade-in 150ms ease-out;
   }
 }
+@property --scroll-fade-t {
+  syntax: '<length-percentage>';
+  inherits: false;
+  initial-value: 0px;
+}
+@property --scroll-fade-b {
+  syntax: '<length-percentage>';
+  inherits: false;
+  initial-value: 0px;
+}
+@property --scroll-fade-s {
+  syntax: '<length-percentage>';
+  inherits: false;
+  initial-value: 0px;
+}
+@property --scroll-fade-e {
+  syntax: '<length-percentage>';
+  inherits: false;
+  initial-value: 0px;
+}
+@property --scroll-fade-mask {
+  syntax: '*';
+  inherits: false;
+}
+@property --shimmer-angle {
+  syntax: '<angle>';
+  inherits: true;
+  initial-value: 20deg;
+}
+@property --shimmer-image {
+  syntax: '*';
+  inherits: false;
+}
+@property --shimmer-text-fill {
+  syntax: '*';
+  inherits: false;
+}
 :root {
   --radius: 0.75rem;
   --tabs-active-shadow: 0 0 #0000;
@@ -11965,6 +12682,11 @@ body.canvas, .canvas {
   syntax: "*";
   inherits: false;
 }
+@property --tw-scroll-snap-strictness {
+  syntax: "*";
+  inherits: false;
+  initial-value: proximity;
+}
 @property --tw-space-y-reverse {
   syntax: "*";
   inherits: false;
@@ -12241,8 +12963,51 @@ body.canvas, .canvas {
     opacity: 0.5;
   }
 }
+@keyframes scroll-fade-reveal-t {
+  from {
+    --scroll-fade-t: 0px;
+  }
+  to {
+    --scroll-fade-t: var(--_scroll-fade-size-t, min(12%, calc(var(--spacing) * 10)));
+  }
+}
+@keyframes scroll-fade-reveal-b {
+  from {
+    --scroll-fade-b: var(--_scroll-fade-size-b, min(12%, calc(var(--spacing) * 10)));
+  }
+  to {
+    --scroll-fade-b: 0px;
+  }
+}
+@keyframes scroll-fade-reveal-s {
+  from {
+    --scroll-fade-s: 0px;
+  }
+  to {
+    --scroll-fade-s: var(--_scroll-fade-size-s, min(12%, calc(var(--spacing) * 10)));
+  }
+}
+@keyframes scroll-fade-reveal-e {
+  from {
+    --scroll-fade-e: var(--_scroll-fade-size-e, min(12%, calc(var(--spacing) * 10)));
+  }
+  to {
+    --scroll-fade-e: 0px;
+  }
+}
+@keyframes tw-shimmer {
+  from {
+    background-position: 100% 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    :root, :host {
+      --shimmer-angle: 20deg;
+    }
     *, ::before, ::after, ::backdrop {
       --tw-translate-x: 0;
       --tw-translate-y: 0;
@@ -12255,6 +13020,7 @@ body.canvas, .canvas {
       --tw-rotate-z: initial;
       --tw-skew-x: initial;
       --tw-skew-y: initial;
+      --tw-scroll-snap-strictness: proximity;
       --tw-space-y-reverse: 0;
       --tw-space-x-reverse: 0;
       --tw-divide-y-reverse: 0;
@@ -12316,6 +13082,13 @@ body.canvas, .canvas {
       --tw-duration: initial;
       --tw-ease: initial;
       --tw-content: "";
+      --scroll-fade-t: 0px;
+      --scroll-fade-b: 0px;
+      --scroll-fade-s: 0px;
+      --scroll-fade-e: 0px;
+      --scroll-fade-mask: initial;
+      --shimmer-image: initial;
+      --shimmer-text-fill: initial;
     }
   }
 }