vue-toastflow 1.2.0-beta.3 → 1.2.0-beta.5

package/dist/components/Toast.vue.d.mts

@@ -0,0 +1,51 @@
+import { ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare var __VLS_11: {
+    toast: ToastInstance;
+}, __VLS_18: {
+    toast: ToastInstance;
+}, __VLS_20: {
+    toast: ToastInstance;
+    formatted: string;
+}, __VLS_32: {
+    toast: ToastInstance;
+}, __VLS_39: {
+    toast: ToastInstance;
+    formatted: string;
+}, __VLS_41: {
+    toast: ToastInstance;
+};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_11) => any;
+} & {
+    default?: (props: typeof __VLS_18) => any;
+} & {
+    'created-at'?: (props: typeof __VLS_20) => any;
+} & {
+    progress?: (props: typeof __VLS_32) => any;
+} & {
+    'created-at'?: (props: typeof __VLS_39) => any;
+} & {
+    'close-icon'?: (props: typeof __VLS_41) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    dismiss: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDismiss?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Toast.vue.d.ts

@@ -0,0 +1,51 @@
+import { ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare var __VLS_11: {
+    toast: ToastInstance;
+}, __VLS_18: {
+    toast: ToastInstance;
+}, __VLS_20: {
+    toast: ToastInstance;
+    formatted: string;
+}, __VLS_32: {
+    toast: ToastInstance;
+}, __VLS_39: {
+    toast: ToastInstance;
+    formatted: string;
+}, __VLS_41: {
+    toast: ToastInstance;
+};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_11) => any;
+} & {
+    default?: (props: typeof __VLS_18) => any;
+} & {
+    'created-at'?: (props: typeof __VLS_20) => any;
+} & {
+    progress?: (props: typeof __VLS_32) => any;
+} & {
+    'created-at'?: (props: typeof __VLS_39) => any;
+} & {
+    'close-icon'?: (props: typeof __VLS_41) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    dismiss: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDismiss?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ToastButtonsGroup.vue.d.mts

@@ -0,0 +1,9 @@
+import { ToastButton } from 'toastflow-core';
+type __VLS_Props = {
+    buttons: ToastButton[];
+    classes: Array<string | undefined>;
+    onButtonClick: (button: ToastButton, event: MouseEvent) => void;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/ToastButtonsGroup.vue.d.ts

@@ -0,0 +1,9 @@
+import { ToastButton } from 'toastflow-core';
+type __VLS_Props = {
+    buttons: ToastButton[];
+    classes: Array<string | undefined>;
+    onButtonClick: (button: ToastButton, event: MouseEvent) => void;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/ToastContainer.vue.d.mts

@@ -0,0 +1,24 @@
+import { ToastId, ToastInstance } from 'toastflow-core';
+declare var __VLS_17: {
+    toast: ToastInstance;
+    progressResetKey: number | undefined;
+    duplicateKey: number | undefined;
+    updateKey: number | undefined;
+    bumpAnimationClass: string | undefined;
+    clearAllAnimationClass: string | undefined;
+    updateAnimationClass: string | undefined;
+    dismiss: (id: ToastId) => void;
+    ui: import('..').ToastUI;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_17) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ToastContainer.vue.d.ts

@@ -0,0 +1,24 @@
+import { ToastId, ToastInstance } from 'toastflow-core';
+declare var __VLS_17: {
+    toast: ToastInstance;
+    progressResetKey: number | undefined;
+    duplicateKey: number | undefined;
+    updateKey: number | undefined;
+    bumpAnimationClass: string | undefined;
+    clearAllAnimationClass: string | undefined;
+    updateAnimationClass: string | undefined;
+    dismiss: (id: ToastId) => void;
+    ui: import('..').ToastUI;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_17) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/{src/components → components}/ToastProgress.vue.d.mts

@@ -6,8 +6,9 @@ type __VLS_Props = {
     trackProps?: ToastSlotProps;
     barProps?: ToastSlotProps;
 };
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     type: ToastType;
     progressAlignment: ToastProgressAlignment;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/{src/components → components}/ToastProgress.vue.d.ts

@@ -6,8 +6,9 @@ type __VLS_Props = {
     trackProps?: ToastSlotProps;
     barProps?: ToastSlotProps;
 };
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     type: ToastType;
     progressAlignment: ToastProgressAlignment;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/ToastSlotProvider.vue.d.mts

@@ -0,0 +1,34 @@
+import { ToastId, ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare function dismiss(id: ToastId): void;
+declare var __VLS_1: {
+    toast: ToastInstance;
+    progressResetKey: number | undefined;
+    duplicateKey: number | undefined;
+    updateKey: number | undefined;
+    bumpAnimationClass: string | undefined;
+    clearAllAnimationClass: string | undefined;
+    updateAnimationClass: string | undefined;
+    dismiss: typeof dismiss;
+    ui: import('..').ToastUI;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ToastSlotProvider.vue.d.ts

@@ -0,0 +1,34 @@
+import { ToastId, ToastInstance, ToastStandaloneInstance } from 'toastflow-core';
+type __VLS_Props = {
+    toast: ToastStandaloneInstance | ToastInstance;
+    progressResetKey?: number;
+    duplicateKey?: number;
+    updateKey?: number;
+    bumpAnimationClass?: string;
+    clearAllAnimationClass?: string;
+    updateAnimationClass?: string;
+};
+declare function dismiss(id: ToastId): void;
+declare var __VLS_1: {
+    toast: ToastInstance;
+    progressResetKey: number | undefined;
+    duplicateKey: number | undefined;
+    updateKey: number | undefined;
+    bumpAnimationClass: string | undefined;
+    clearAllAnimationClass: string | undefined;
+    updateAnimationClass: string | undefined;
+    dismiss: typeof dismiss;
+    ui: import('..').ToastUI;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/icons/ArrowPath.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/ArrowPath.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/Bell.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/Bell.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/CheckCircle.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/CheckCircle.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/InfoCircle.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/InfoCircle.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/QuestionMarkCircle.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/QuestionMarkCircle.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/XCircle.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/XCircle.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/XMark.vue.d.mts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/XMark.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/toastflow.es.js

@@ -73,7 +73,7 @@ var z = {
 	info: R("info"),
 	warning: R("warning"),
 	custom: R("custom")
-}, B = "@layer tf-defaults {\n  :root {\n    /* base look */\n    --tf-toast-font-family:\n      inherit, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n      sans-serif;\n    --tf-toast-border-radius: 12px;\n    --tf-toast-border-width: 1px;\n    --tf-toast-padding: 16px;\n\n    /* layout inside toast */\n    --tf-toast-gap: 10px;\n    --tf-toast-buttons-gap: calc(var(--tf-toast-gap) / 2);\n    --tf-toast-buttons-content-gap: calc(var(--tf-toast-gap) / 2);\n\n    /* stack padding (used for scrollable stack) */\n    --tf-toast-stack-padding-top: 8px;\n    --tf-toast-stack-padding-right: 8px;\n    --tf-toast-stack-padding-bottom: 18px;\n    --tf-toast-stack-padding-left: 0;\n\n    /* title */\n    --tf-toast-title-font-size: 14px;\n    --tf-toast-title-font-weight: 600;\n    --tf-toast-title-line-height: 1.25;\n\n    /* description */\n    --tf-toast-description-font-size: 13px;\n    --tf-toast-description-line-height: 1.4;\n\n    /* created at and close floating bar */\n    --tf-toast-float-x: 0.4;\n    --tf-toast-float-y: -0.4;\n\n    /* created at badge */\n    --tf-toast-created-at-font-size: 11px;\n    --tf-toast-created-at-offset: 0;\n    --tf-toast-created-at-padding-x: 8px;\n    --tf-toast-created-at-border-radius: 999px;\n\n    /* close button */\n    --tf-toast-close-size: 18px;\n    --tf-toast-close-icon-size: 12px;\n    --tf-toast-close-border-width: var(--tf-toast-border-width);\n    --tf-toast-close-border-radius: var(--tf-toast-border-radius);\n    --tf-toast-close-font-size: 11px;\n\n    /* buttons */\n    --tf-toast-button-font-size: 12px;\n    --tf-toast-button-line-height: 1;\n    --tf-toast-button-padding-y: 7px;\n    --tf-toast-button-padding-x: 9px;\n    --tf-toast-button-border-radius: 10px;\n    --tf-toast-button-border-width: var(--tf-toast-border-width);\n\n    /* icon */\n    --tf-toast-icon-size: 24px;\n    --tf-toast-icon-loading: var(--tf-toast-loading-text-default);\n    --tf-toast-icon-default: var(--tf-toast-normal-text-default);\n    --tf-toast-icon-success: var(--tf-toast-success-text-default);\n    --tf-toast-icon-error: var(--tf-toast-error-text-default);\n    --tf-toast-icon-warning: var(--tf-toast-warning-text-default);\n    --tf-toast-icon-info: var(--tf-toast-info-text-default);\n    --tf-toast-icon-custom: var(--tf-toast-normal-text-default);\n\n    /* progress bar */\n    --tf-toast-progress-height: 4px;\n    --tf-toast-progress-border-radius: var(--tf-toast-border-radius);\n    --tf-toast-progress-duration: 5000ms;\n\n    /* accent presets */\n    --tf-toast-normal-bg-default: #fff;\n    --tf-toast-normal-border-default: #e6e8eb;\n    --tf-toast-normal-text-default: #11181c;\n    --tf-toast-normal-progress-bar-bg-default: var(\n      --tf-toast-normal-text-default\n    );\n    --tf-toast-normal-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-normal-text-default) 20%,\n      transparent\n    );\n    --tf-toast-normal-color-default: var(--tf-toast-normal-text-default);\n    --tf-toast-normal-title-color-default: var(--tf-toast-normal-text-default);\n    --tf-toast-normal-description-color-default: var(\n      --tf-toast-normal-text-default\n    );\n\n    --tf-toast-loading-bg-default: hsl(48, 100%, 96%);\n    --tf-toast-loading-border-default: hsl(46, 100%, 88%);\n    --tf-toast-loading-text-default: hsl(40, 100%, 32%);\n    --tf-toast-loading-progress-bar-bg-default: var(\n      --tf-toast-loading-text-default\n    );\n    --tf-toast-loading-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-loading-text-default) 20%,\n      transparent\n    );\n    --tf-toast-loading-color-default: var(--tf-toast-loading-text-default);\n    --tf-toast-loading-title-color-default: var(\n      --tf-toast-loading-text-default\n    );\n    --tf-toast-loading-description-color-default: var(\n      --tf-toast-loading-text-default\n    );\n\n    --tf-toast-success-bg-default: hsl(143, 85%, 96%);\n    --tf-toast-success-border-default: hsl(145, 92%, 87%);\n    --tf-toast-success-text-default: hsl(140, 100%, 27%);\n    --tf-toast-success-progress-bar-bg-default: var(\n      --tf-toast-success-text-default\n    );\n    --tf-toast-success-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-success-text-default) 20%,\n      transparent\n    );\n    --tf-toast-success-color-default: var(--tf-toast-success-text-default);\n    --tf-toast-success-title-color-default: var(\n      --tf-toast-success-text-default\n    );\n    --tf-toast-success-description-color-default: var(\n      --tf-toast-success-text-default\n    );\n\n    --tf-toast-info-bg-default: hsl(208, 100%, 97%);\n    --tf-toast-info-border-default: hsl(221, 91%, 93%);\n    --tf-toast-info-text-default: hsl(210, 92%, 45%);\n    --tf-toast-info-progress-bar-bg-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-info-text-default) 20%,\n      transparent\n    );\n    --tf-toast-info-color-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-title-color-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-description-color-default: var(\n      --tf-toast-info-text-default\n    );\n\n    --tf-toast-warning-bg-default: hsl(49, 100%, 97%);\n    --tf-toast-warning-border-default: hsl(49, 91%, 84%);\n    --tf-toast-warning-text-default: hsl(31, 92%, 45%);\n    --tf-toast-warning-progress-bar-bg-default: var(\n      --tf-toast-warning-text-default\n    );\n    --tf-toast-warning-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-warning-text-default) 20%,\n      transparent\n    );\n    --tf-toast-warning-color-default: var(--tf-toast-warning-text-default);\n    --tf-toast-warning-title-color-default: var(\n      --tf-toast-warning-text-default\n    );\n    --tf-toast-warning-description-color-default: var(\n      --tf-toast-warning-text-default\n    );\n\n    --tf-toast-error-bg-default: hsl(359, 100%, 97%);\n    --tf-toast-error-border-default: hsl(359, 100%, 94%);\n    --tf-toast-error-text-default: hsl(360, 100%, 45%);\n    --tf-toast-error-progress-bar-bg-default: var(\n      --tf-toast-error-text-default\n    );\n    --tf-toast-error-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-error-text-default) 20%,\n      transparent\n    );\n    --tf-toast-error-color-default: var(--tf-toast-error-text-default);\n    --tf-toast-error-title-color-default: var(--tf-toast-error-text-default);\n    --tf-toast-error-description-color-default: var(\n      --tf-toast-error-text-default\n    );\n\n    /* animations */\n    --tf-toast-motion-offset: 10px;\n    --tf-toast-animation-in-duration: 260ms;\n    --tf-toast-animation-out-duration: 220ms;\n  }\n}\n\n.tf-toast--paused .tf-toast-progress-bar {\n  animation-play-state: paused;\n}\n\n.tf-toast-progress-wrapper {\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  margin: 0;\n}\n\n.tf-toast-progress {\n  height: var(--tf-toast-progress-height);\n  width: 100%;\n  border-radius: 0 0 var(--tf-toast-progress-border-radius)\n    var(--tf-toast-progress-border-radius);\n  background: var(--_tf-resolved-progress-bg);\n}\n\n.tf-toast-progress-bar {\n  height: 100%;\n  width: 100%;\n  background: var(--_tf-resolved-progress-bar-bg);\n  transform-origin: left;\n  animation-name: tf-toast-progress-rtl;\n  animation-duration: var(--tf-toast-progress-duration, 5000ms);\n  animation-timing-function: linear;\n  animation-fill-mode: forwards;\n  will-change: transform;\n}\n\n.tf-toast-progress[data-align=\"left-to-right\"] .tf-toast-progress-bar {\n  transform-origin: right;\n  animation-name: tf-toast-progress-ltr;\n}\n\n@keyframes tf-toast-progress-rtl {\n  from {\n    transform: scaleX(1);\n  }\n  to {\n    transform: scaleX(0);\n  }\n}\n\n@keyframes tf-toast-progress-ltr {\n  from {\n    transform: scaleX(0);\n  }\n  to {\n    transform: scaleX(1);\n  }\n}\n\n.tf-toast-item[data-position^=\"top-\"] {\n  --tf-toast-motion-offset: -10px;\n}\n\n.tf-toast-item[data-position^=\"bottom-\"] {\n  --tf-toast-motion-offset: 10px;\n}\n\n.tf-toast-motion {\n  width: 100%;\n  transform-origin: center;\n}\n\n/* MOVE */\n.Toastflow__animation-move {\n  transition: transform var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.5, 1, 0.25, 1);\n  will-change: transform;\n}\n\n/* ENTER */\n.Toastflow__animation-enter-from > .tf-toast-motion,\n.Toastflow__animation-appear-from > .tf-toast-motion {\n  opacity: 0;\n  transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.96);\n}\n\n.Toastflow__animation-enter-active > .tf-toast-motion,\n.Toastflow__animation-appear-active > .tf-toast-motion {\n  transition:\n    opacity var(--tf-toast-animation-in-duration) cubic-bezier(0.5, 1, 0.25, 1),\n    transform var(--tf-toast-animation-in-duration)\n      cubic-bezier(0.5, 1, 0.25, 1);\n}\n\n.Toastflow__animation-enter-to > .tf-toast-motion,\n.Toastflow__animation-appear-to > .tf-toast-motion {\n  opacity: 1;\n  transform: translate3d(0, 0, 0) scale(1);\n}\n\n/* LEAVE */\n.Toastflow__animation-leave-from > .tf-toast-motion {\n  opacity: 1;\n  transform: translate3d(0, 0, 0) scale(1);\n}\n\n.Toastflow__animation-leave-active > .tf-toast-motion {\n  transition:\n    opacity var(--tf-toast-animation-out-duration) ease,\n    transform var(--tf-toast-animation-out-duration) ease;\n}\n\n.Toastflow__animation-leave-to > .tf-toast-motion {\n  opacity: 0;\n  transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.96);\n}\n\n/* CLEAR ALL */\n.Toastflow__animation-clearAll .tf-toast-motion {\n  animation: Toastflow__clearAll-kf var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.22, 1, 0.36, 1) both;\n}\n\n/* BUMP & UPDATE */\n.Toastflow__animation-bump {\n  animation: Toastflow__bump-kf var(--tf-toast-animation-in-duration) ease-out;\n}\n\n.Toastflow__animation-update {\n  animation: Toastflow__bump-kf var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.33, 1, 0.68, 1);\n}\n\n@keyframes Toastflow__clearAll-kf {\n  0% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n  }\n}\n\n@keyframes Toastflow__bump-kf {\n  0% {\n    transform: scale(1);\n  }\n  40% {\n    transform: scale(1.01);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .Toastflow__animation-move {\n    transition: none;\n  }\n\n  .Toastflow__animation-enter-active .tf-toast-motion,\n  .Toastflow__animation-leave-active .tf-toast-motion {\n    transition: none;\n  }\n\n  .Toastflow__animation-clearAll .tf-toast-motion {\n    animation: none;\n  }\n}\n\n/* Toast container */\n.tf-toast-root {\n  pointer-events: none;\n  position: fixed;\n  inset: 0;\n}\n\n.tf-toast-stack {\n  position: absolute;\n  height: 100%;\n  display: flex;\n  align-items: flex-start;\n}\n\n.tf-toast-stack-inner {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.tf-toast-stack-inner--scroll {\n  max-height: 100%;\n  overflow-y: auto;\n  overflow-x: hidden;\n  overscroll-behavior: contain;\n  padding-top: var(--tf-toast-stack-padding-top);\n  padding-right: var(--tf-toast-stack-padding-right);\n  padding-bottom: var(--tf-toast-stack-padding-bottom);\n  padding-left: var(--tf-toast-stack-padding-left);\n  scroll-padding: var(--tf-toast-stack-padding-top)\n    var(--tf-toast-stack-padding-right) var(--tf-toast-stack-padding-bottom)\n    var(--tf-toast-stack-padding-left);\n}\n\n.tf-toast-stack-inner--bottom {\n  min-height: 100%;\n  justify-content: flex-end;\n}\n\n.tf-toast-stack--left {\n  justify-content: flex-start;\n}\n\n.tf-toast-stack--center {\n  justify-content: center;\n}\n\n.tf-toast-stack--right {\n  justify-content: flex-end;\n}\n\n.tf-toast-item {\n  pointer-events: auto;\n  width: 100%;\n  position: relative;\n  z-index: 1;\n}\n\n/* Toast component */\n.tf-toast-wrapper {\n  pointer-events: auto;\n  width: 100%;\n}\n\n.tf-toast {\n  cursor: pointer;\n  position: relative;\n  width: 100%;\n  --_tf-resolved-bg: var(\n    --tf-toast-bg,\n    var(--_tf-bg, var(--tf-toast-normal-bg-default))\n  );\n  --_tf-resolved-color: var(\n    --tf-toast-color,\n    var(\n      --tf-toast-accent-color,\n      var(--_tf-color, var(--tf-toast-normal-text-default))\n    )\n  );\n  --_tf-resolved-border: var(\n    --tf-toast-border-color,\n    var(--_tf-border-color, var(--tf-toast-normal-border-default))\n  );\n  --_tf-resolved-title-color: var(\n    --tf-toast-title-color,\n    var(\n      --tf-toast-color,\n      var(\n        --tf-toast-accent-color,\n        var(--_tf-title-color, var(--_tf-resolved-color))\n      )\n    )\n  );\n  --_tf-resolved-desc-color: var(\n    --tf-toast-description-color,\n    var(\n      --tf-toast-color,\n      var(\n        --tf-toast-accent-color,\n        var(--_tf-desc-color, var(--_tf-resolved-color))\n      )\n    )\n  );\n  --_tf-resolved-progress-bg: var(\n    --tf-toast-progress-bg,\n    var(\n      --_tf-progress-bg,\n      color-mix(in srgb, var(--_tf-resolved-color) 20%, transparent)\n    )\n  );\n  --_tf-resolved-progress-bar-bg: var(\n    --tf-toast-progress-bar-bg,\n    var(\n      --tf-toast-accent-color,\n      var(--_tf-progress-bar-bg, var(--_tf-resolved-color))\n    )\n  );\n  --tf-toast-button-color: var(--_tf-resolved-color);\n  --tf-toast-button-border-color: var(--_tf-resolved-border);\n  --tf-toast-button-border-width: var(--tf-toast-border-width);\n  --tf-toast-button-bg: var(--_tf-resolved-bg);\n  --tf-toast-close-color: var(--_tf-resolved-color);\n  --tf-toast-close-border-color: var(--_tf-resolved-border);\n  --tf-toast-close-bg: var(--_tf-resolved-bg);\n  --tf-toast-close-ring-color: var(--tf-toast-close-border-color);\n  --tf-toast-created-at-color: var(--_tf-resolved-desc-color);\n  --tf-toast-created-at-border-color: var(--_tf-resolved-border);\n  --tf-toast-created-at-bg: var(--_tf-resolved-bg);\n}\n\n.tf-toast--swipe-enabled {\n  touch-action: pan-y;\n  -webkit-user-select: none;\n  user-select: none;\n  cursor: grab;\n}\n\n.tf-toast--swipe-enabled:active {\n  cursor: grabbing;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-main-content {\n  flex-direction: row-reverse;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-text {\n  text-align: right;\n}\n\n.tf-toast-accent--default {\n  --_tf-bg: var(--tf-toast-normal-bg-default);\n  --_tf-color: var(--tf-toast-normal-color-default);\n  --_tf-border-color: var(--tf-toast-normal-border-default);\n  --_tf-title-color: var(--tf-toast-normal-title-color-default);\n  --_tf-desc-color: var(--tf-toast-normal-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-normal-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-normal-progress-bar-bg-default);\n}\n\n.tf-toast-accent--loading {\n  --_tf-bg: var(--tf-toast-loading-bg-default);\n  --_tf-color: var(--tf-toast-loading-color-default);\n  --_tf-border-color: var(--tf-toast-loading-border-default);\n  --_tf-title-color: var(--tf-toast-loading-title-color-default);\n  --_tf-desc-color: var(--tf-toast-loading-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-loading-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-loading-progress-bar-bg-default);\n}\n\n.tf-toast-accent--success {\n  --_tf-bg: var(--tf-toast-success-bg-default);\n  --_tf-color: var(--tf-toast-success-color-default);\n  --_tf-border-color: var(--tf-toast-success-border-default);\n  --_tf-title-color: var(--tf-toast-success-title-color-default);\n  --_tf-desc-color: var(--tf-toast-success-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-success-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-success-progress-bar-bg-default);\n}\n\n.tf-toast-accent--error {\n  --_tf-bg: var(--tf-toast-error-bg-default);\n  --_tf-color: var(--tf-toast-error-color-default);\n  --_tf-border-color: var(--tf-toast-error-border-default);\n  --_tf-title-color: var(--tf-toast-error-title-color-default);\n  --_tf-desc-color: var(--tf-toast-error-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-error-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-error-progress-bar-bg-default);\n}\n\n.tf-toast-accent--warning {\n  --_tf-bg: var(--tf-toast-warning-bg-default);\n  --_tf-color: var(--tf-toast-warning-color-default);\n  --_tf-border-color: var(--tf-toast-warning-border-default);\n  --_tf-title-color: var(--tf-toast-warning-title-color-default);\n  --_tf-desc-color: var(--tf-toast-warning-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-warning-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-warning-progress-bar-bg-default);\n}\n\n.tf-toast-accent--info {\n  --_tf-bg: var(--tf-toast-info-bg-default);\n  --_tf-color: var(--tf-toast-info-color-default);\n  --_tf-border-color: var(--tf-toast-info-border-default);\n  --_tf-title-color: var(--tf-toast-info-title-color-default);\n  --_tf-desc-color: var(--tf-toast-info-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-info-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-info-progress-bar-bg-default);\n}\n\n.tf-toast-accent--custom {\n  --_tf-bg: var(\n    --tf-toast-custom-bg-default,\n    var(--tf-toast-normal-bg-default)\n  );\n  --_tf-color: var(\n    --tf-toast-custom-color-default,\n    var(--tf-toast-normal-color-default)\n  );\n  --_tf-border-color: var(\n    --tf-toast-custom-border-default,\n    var(--tf-toast-normal-border-default)\n  );\n  --_tf-title-color: var(\n    --tf-toast-custom-title-color-default,\n    var(--tf-toast-normal-title-color-default)\n  );\n  --_tf-desc-color: var(\n    --tf-toast-custom-description-color-default,\n    var(--tf-toast-normal-description-color-default)\n  );\n  --_tf-progress-bg: var(\n    --tf-toast-custom-progress-bg-default,\n    var(--tf-toast-normal-progress-bg-default)\n  );\n  --_tf-progress-bar-bg: var(\n    --tf-toast-custom-progress-bar-bg-default,\n    var(--tf-toast-normal-progress-bar-bg-default)\n  );\n}\n\n.tf-toast-surface {\n  position: relative;\n  display: block;\n  min-width: 0;\n  padding: var(--tf-toast-padding);\n  border-radius: var(--tf-toast-border-radius);\n  background-color: var(--_tf-resolved-bg);\n  color: var(--_tf-resolved-color);\n  border: var(--tf-toast-border-width) solid var(--_tf-resolved-border);\n  font-family: var(--tf-toast-font-family), sans-serif;\n  overflow: hidden;\n}\n\n.tf-toast-main {\n  display: flex;\n  align-items: stretch;\n  gap: var(--tf-toast-buttons-content-gap);\n  width: 100%;\n}\n\n.tf-toast-main--full > .tf-toast-main-content {\n  width: 100%;\n  min-width: 0;\n  flex: 1 1 100%;\n}\n\n.tf-toast-main--content-end > .tf-toast-main-content {\n  margin-left: auto;\n  max-width: 100%;\n  flex: 0 1 auto;\n}\n\n.tf-toast-main--content-end > .tf-toast-main-content > .tf-toast-body {\n  flex: 0 1 auto;\n  min-width: 0;\n}\n\n.tf-toast-main-content {\n  display: flex;\n  align-items: center;\n  gap: var(--tf-toast-gap);\n  min-width: 0;\n  flex: 1 1 auto;\n}\n\n.tf-toast-meta {\n  display: flex;\n  flex-direction: column;\n  gap: calc(var(--tf-toast-gap) / 2);\n  min-width: 0;\n  flex-shrink: 0;\n}\n\n.tf-toast-meta--left {\n  align-items: flex-start;\n}\n\n.tf-toast-meta--right {\n  align-items: flex-end;\n}\n\n.tf-toast-meta-row {\n  display: flex;\n  min-width: 0;\n}\n\n.tf-toast-meta-row--top {\n  margin-bottom: var(--tf-toast-buttons-content-gap);\n}\n\n.tf-toast-meta-row--bottom {\n  margin-top: var(--tf-toast-buttons-content-gap);\n}\n\n.tf-toast-meta-row .tf-toast-actions--start {\n  margin-right: auto;\n}\n\n.tf-toast-meta-row .tf-toast-actions--end {\n  margin-left: auto;\n}\n\n.tf-toast-actions {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  gap: var(--tf-toast-buttons-gap);\n}\n\n.tf-toast-buttons--center {\n  margin-top: auto;\n  margin-bottom: auto;\n}\n\n.tf-toast-buttons--bottom {\n  margin-top: auto;\n}\n\n.tf-toast-actions--start {\n  justify-content: flex-start;\n}\n\n.tf-toast-actions--end {\n  justify-content: flex-end;\n}\n\n.tf-toast-button {\n  appearance: none;\n  border: var(--tf-toast-button-border-width) solid\n    var(--tf-toast-button-border-color);\n  background: var(--tf-toast-button-bg);\n  color: var(--tf-toast-button-color);\n  border-radius: var(--tf-toast-button-border-radius);\n  font-size: var(--tf-toast-button-font-size);\n  line-height: var(--tf-toast-button-line-height);\n  padding: var(--tf-toast-button-padding-y) var(--tf-toast-button-padding-x);\n  cursor: pointer;\n  user-select: none;\n  font-family: inherit;\n}\n\n.tf-toast-icon-spin {\n  display: inline-block;\n  animation: tf-toast-spin 0.8s linear infinite;\n  transform-origin: center;\n}\n\n@keyframes tf-toast-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n.tf-toast-icon-svg {\n  width: var(--tf-toast-icon-size);\n  height: var(--tf-toast-icon-size);\n}\n\n.tf-toast-icon--loading .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-loading));\n}\n\n.tf-toast-icon--default .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-default));\n}\n\n.tf-toast-icon--success .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-success));\n}\n\n.tf-toast-icon--error .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-error));\n}\n\n.tf-toast-icon--warning .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-warning));\n}\n\n.tf-toast-icon--info .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-info));\n}\n\n.tf-toast-icon--custom .tf-toast-icon-svg {\n  color: var(\n    --tf-toast-icon-color,\n    var(--tf-toast-icon-custom, var(--tf-toast-icon-default))\n  );\n}\n\n.tf-toast-body {\n  position: relative;\n  z-index: 1;\n  min-width: 0;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n}\n\n.tf-toast-body--has-created-at {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  column-gap: calc(var(--tf-toast-gap) / 2);\n  grid-auto-flow: row;\n}\n\n.tf-toast-body--has-created-at > :not(.tf-toast-created-at) {\n  grid-column: 1;\n}\n\n.tf-toast-text {\n  min-width: 0;\n}\n\n.tf-toast-created-at {\n  color: var(--tf-toast-created-at-color);\n  font-size: var(--tf-toast-created-at-font-size);\n  font-style: italic;\n  white-space: nowrap;\n  align-self: end;\n  justify-self: end;\n  grid-column: 2;\n  grid-row: 1;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-created-at {\n  text-align: right;\n  width: 100%;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-body--has-created-at {\n  grid-template-columns: auto minmax(0, 1fr);\n}\n\n.tf-toast[data-align=\"right\"]\n  .tf-toast-body--has-created-at\n  > .tf-toast-created-at {\n  grid-column: 1;\n  justify-self: start;\n}\n\n.tf-toast[data-align=\"right\"]\n  .tf-toast-body--has-created-at\n  > :not(.tf-toast-created-at) {\n  grid-column: 2;\n}\n\n.tf-toast-floating-bar {\n  position: absolute;\n  top: 0;\n  right: 0;\n  transform: translate(\n    calc(var(--tf-toast-close-size) * var(--tf-toast-float-x)),\n    calc(var(--tf-toast-close-size) * var(--tf-toast-float-y))\n  );\n  display: inline-flex;\n  align-items: center;\n  gap: var(--tf-toast-created-at-offset);\n  height: var(--tf-toast-close-size);\n  pointer-events: auto;\n  z-index: 2;\n}\n\n.tf-toast-created-at-float {\n  display: inline-flex;\n  align-items: center;\n  height: var(--tf-toast-close-size);\n  padding: 0 var(--tf-toast-created-at-padding-x);\n  border-radius: var(--tf-toast-created-at-border-radius);\n  border: var(--tf-toast-close-border-width) solid\n    var(--tf-toast-created-at-border-color);\n  background: var(--tf-toast-created-at-bg);\n  color: var(--tf-toast-created-at-color);\n  font-size: var(--tf-toast-created-at-font-size);\n  font-style: italic;\n  white-space: nowrap;\n  pointer-events: none;\n}\n\n.tf-toast-title {\n  margin: 0;\n  font-size: var(--tf-toast-title-font-size);\n  font-weight: var(--tf-toast-title-font-weight);\n  line-height: var(--tf-toast-title-line-height);\n  color: var(--_tf-resolved-title-color);\n  word-wrap: break-word;\n}\n\n.tf-toast-description {\n  margin: 0;\n  font-size: var(--tf-toast-description-font-size);\n  line-height: var(--tf-toast-description-line-height);\n  color: var(--_tf-resolved-desc-color);\n  word-wrap: break-word;\n}\n\n.tf-toast-close {\n  position: relative;\n  height: var(--tf-toast-close-size);\n  width: var(--tf-toast-close-size);\n  border-radius: var(--tf-toast-close-border-radius);\n  border: var(--tf-toast-close-border-width) solid\n    var(--tf-toast-close-border-color);\n  background: var(--tf-toast-close-bg);\n  color: var(--tf-toast-close-color);\n  font-size: var(--tf-toast-close-font-size);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  cursor: pointer;\n  flex-shrink: 0;\n  pointer-events: auto;\n  z-index: 2;\n}\n\n.tf-toast-close-icon {\n  width: var(--tf-toast-close-icon-size);\n  height: var(--tf-toast-close-icon-size);\n}\n\n.tf-toast-close:focus-visible {\n  outline: 2px solid var(--tf-toast-close-ring-color);\n  outline-offset: 2px;\n}\n", V = "data-toastflow-styles", H = !1;
+}, B = "@layer tf-defaults {\n  :root {\n    /* base look */\n    --tf-toast-font-family:\n      inherit, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n      sans-serif;\n    --tf-toast-border-radius: 12px;\n    --tf-toast-border-width: 1px;\n    --tf-toast-padding: 16px;\n\n    /* layout inside toast */\n    --tf-toast-gap: 10px;\n    --tf-toast-buttons-gap: calc(var(--tf-toast-gap) / 2);\n    --tf-toast-buttons-content-gap: calc(var(--tf-toast-gap) / 2);\n\n    /* stack padding (used for scrollable stack) */\n    --tf-toast-stack-padding-top: 8px;\n    --tf-toast-stack-padding-right: 8px;\n    --tf-toast-stack-padding-bottom: 18px;\n    --tf-toast-stack-padding-left: 0;\n\n    /* title */\n    --tf-toast-title-font-size: 14px;\n    --tf-toast-title-font-weight: 600;\n    --tf-toast-title-line-height: 1.25;\n\n    /* description */\n    --tf-toast-description-font-size: 13px;\n    --tf-toast-description-line-height: 1.4;\n\n    /* created at and close floating bar */\n    --tf-toast-float-x: 0.4;\n    --tf-toast-float-y: -0.4;\n\n    /* created at badge */\n    --tf-toast-created-at-font-size: 11px;\n    --tf-toast-created-at-offset: 0;\n    --tf-toast-created-at-padding-x: 8px;\n    --tf-toast-created-at-border-radius: 999px;\n\n    /* close button */\n    --tf-toast-close-size: 18px;\n    --tf-toast-close-icon-size: 12px;\n    --tf-toast-close-border-width: var(--tf-toast-border-width);\n    --tf-toast-close-border-radius: var(--tf-toast-border-radius);\n    --tf-toast-close-font-size: 11px;\n\n    /* buttons */\n    --tf-toast-button-font-size: 12px;\n    --tf-toast-button-line-height: 1;\n    --tf-toast-button-padding-y: 7px;\n    --tf-toast-button-padding-x: 9px;\n    --tf-toast-button-border-radius: 10px;\n    --tf-toast-button-border-width: var(--tf-toast-border-width);\n\n    /* icon */\n    --tf-toast-icon-size: 24px;\n    --tf-toast-icon-loading: var(--tf-toast-loading-text-default);\n    --tf-toast-icon-default: var(--tf-toast-normal-text-default);\n    --tf-toast-icon-success: var(--tf-toast-success-text-default);\n    --tf-toast-icon-error: var(--tf-toast-error-text-default);\n    --tf-toast-icon-warning: var(--tf-toast-warning-text-default);\n    --tf-toast-icon-info: var(--tf-toast-info-text-default);\n    --tf-toast-icon-custom: var(--tf-toast-normal-text-default);\n\n    /* progress bar */\n    --tf-toast-progress-height: 4px;\n    --tf-toast-progress-border-radius: var(--tf-toast-border-radius);\n    --tf-toast-progress-duration: 5000ms;\n\n    /* accent presets */\n    --tf-toast-normal-bg-default: #fff;\n    --tf-toast-normal-border-default: #e6e8eb;\n    --tf-toast-normal-text-default: #11181c;\n    --tf-toast-normal-progress-bar-bg-default: var(\n      --tf-toast-normal-text-default\n    );\n    --tf-toast-normal-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-normal-text-default) 20%,\n      transparent\n    );\n    --tf-toast-normal-color-default: var(--tf-toast-normal-text-default);\n    --tf-toast-normal-title-color-default: var(--tf-toast-normal-text-default);\n    --tf-toast-normal-description-color-default: var(\n      --tf-toast-normal-text-default\n    );\n\n    --tf-toast-loading-bg-default: hsl(48, 100%, 96%);\n    --tf-toast-loading-border-default: hsl(46, 100%, 88%);\n    --tf-toast-loading-text-default: hsl(40, 100%, 32%);\n    --tf-toast-loading-progress-bar-bg-default: var(\n      --tf-toast-loading-text-default\n    );\n    --tf-toast-loading-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-loading-text-default) 20%,\n      transparent\n    );\n    --tf-toast-loading-color-default: var(--tf-toast-loading-text-default);\n    --tf-toast-loading-title-color-default: var(\n      --tf-toast-loading-text-default\n    );\n    --tf-toast-loading-description-color-default: var(\n      --tf-toast-loading-text-default\n    );\n\n    --tf-toast-success-bg-default: hsl(143, 85%, 96%);\n    --tf-toast-success-border-default: hsl(145, 92%, 87%);\n    --tf-toast-success-text-default: hsl(140, 100%, 27%);\n    --tf-toast-success-progress-bar-bg-default: var(\n      --tf-toast-success-text-default\n    );\n    --tf-toast-success-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-success-text-default) 20%,\n      transparent\n    );\n    --tf-toast-success-color-default: var(--tf-toast-success-text-default);\n    --tf-toast-success-title-color-default: var(\n      --tf-toast-success-text-default\n    );\n    --tf-toast-success-description-color-default: var(\n      --tf-toast-success-text-default\n    );\n\n    --tf-toast-info-bg-default: hsl(208, 100%, 97%);\n    --tf-toast-info-border-default: hsl(221, 91%, 93%);\n    --tf-toast-info-text-default: hsl(210, 92%, 45%);\n    --tf-toast-info-progress-bar-bg-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-info-text-default) 20%,\n      transparent\n    );\n    --tf-toast-info-color-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-title-color-default: var(--tf-toast-info-text-default);\n    --tf-toast-info-description-color-default: var(\n      --tf-toast-info-text-default\n    );\n\n    --tf-toast-warning-bg-default: hsl(49, 100%, 97%);\n    --tf-toast-warning-border-default: hsl(49, 91%, 84%);\n    --tf-toast-warning-text-default: hsl(31, 92%, 45%);\n    --tf-toast-warning-progress-bar-bg-default: var(\n      --tf-toast-warning-text-default\n    );\n    --tf-toast-warning-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-warning-text-default) 20%,\n      transparent\n    );\n    --tf-toast-warning-color-default: var(--tf-toast-warning-text-default);\n    --tf-toast-warning-title-color-default: var(\n      --tf-toast-warning-text-default\n    );\n    --tf-toast-warning-description-color-default: var(\n      --tf-toast-warning-text-default\n    );\n\n    --tf-toast-error-bg-default: hsl(359, 100%, 97%);\n    --tf-toast-error-border-default: hsl(359, 100%, 94%);\n    --tf-toast-error-text-default: hsl(360, 100%, 45%);\n    --tf-toast-error-progress-bar-bg-default: var(\n      --tf-toast-error-text-default\n    );\n    --tf-toast-error-progress-bg-default: color-mix(\n      in srgb,\n      var(--tf-toast-error-text-default) 20%,\n      transparent\n    );\n    --tf-toast-error-color-default: var(--tf-toast-error-text-default);\n    --tf-toast-error-title-color-default: var(--tf-toast-error-text-default);\n    --tf-toast-error-description-color-default: var(\n      --tf-toast-error-text-default\n    );\n\n    /* animations */\n    --tf-toast-motion-offset: 10px;\n    --tf-toast-animation-in-duration: 260ms;\n    --tf-toast-animation-out-duration: 220ms;\n  }\n}\n\n.tf-toast--paused .tf-toast-progress-bar {\n  animation-play-state: paused;\n}\n\n.tf-toast-progress-wrapper {\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  margin: 0;\n}\n\n.tf-toast-progress {\n  height: var(--tf-toast-progress-height);\n  width: 100%;\n  border-radius: 0 0 var(--tf-toast-progress-border-radius)\n    var(--tf-toast-progress-border-radius);\n  background: var(--_tf-resolved-progress-bg);\n}\n\n.tf-toast-progress-bar {\n  height: 100%;\n  width: 100%;\n  background: var(--_tf-resolved-progress-bar-bg);\n  transform-origin: left;\n  animation-name: tf-toast-progress-rtl;\n  animation-duration: var(--tf-toast-progress-duration, 5000ms);\n  animation-timing-function: linear;\n  animation-fill-mode: forwards;\n  will-change: transform;\n}\n\n.tf-toast-progress[data-align=\"left-to-right\"] .tf-toast-progress-bar {\n  transform-origin: right;\n  animation-name: tf-toast-progress-ltr;\n}\n\n@keyframes tf-toast-progress-rtl {\n  from {\n    transform: scaleX(1);\n  }\n  to {\n    transform: scaleX(0);\n  }\n}\n\n@keyframes tf-toast-progress-ltr {\n  from {\n    transform: scaleX(0);\n  }\n  to {\n    transform: scaleX(1);\n  }\n}\n\n.tf-toast-item[data-position^=\"top-\"] {\n  --tf-toast-motion-offset: -10px;\n}\n\n.tf-toast-item[data-position^=\"bottom-\"] {\n  --tf-toast-motion-offset: 10px;\n}\n\n.tf-toast-motion {\n  width: 100%;\n  transform-origin: center;\n  backface-visibility: hidden;\n}\n\n/* MOVE */\n.Toastflow__animation-move {\n  transition: transform var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.5, 1, 0.25, 1);\n  will-change: transform;\n}\n\n/* ENTER */\n.Toastflow__animation-enter-from > .tf-toast-motion,\n.Toastflow__animation-appear-from > .tf-toast-motion {\n  opacity: 0;\n  transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.96);\n}\n\n.Toastflow__animation-enter-active > .tf-toast-motion,\n.Toastflow__animation-appear-active > .tf-toast-motion {\n  transition:\n    opacity var(--tf-toast-animation-in-duration) cubic-bezier(0.5, 1, 0.25, 1),\n    transform var(--tf-toast-animation-in-duration)\n      cubic-bezier(0.5, 1, 0.25, 1);\n}\n\n.Toastflow__animation-enter-to > .tf-toast-motion,\n.Toastflow__animation-appear-to > .tf-toast-motion {\n  opacity: 1;\n  transform: translate3d(0, 0, 0) scale(1);\n}\n\n/* LEAVE */\n.Toastflow__animation-leave-from > .tf-toast-motion {\n  opacity: 1;\n  transform: translate3d(0, 0, 0) scale(1);\n}\n\n.Toastflow__animation-leave-active > .tf-toast-motion {\n  transition:\n    opacity var(--tf-toast-animation-out-duration) ease,\n    transform var(--tf-toast-animation-out-duration) ease;\n}\n\n.Toastflow__animation-leave-to > .tf-toast-motion {\n  opacity: 0;\n  transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.96);\n}\n\n@media (max-width: 640px) {\n  .tf-toast-item[data-position^=\"top-\"] {\n    --tf-toast-motion-offset: -18px;\n  }\n\n  .tf-toast-item[data-position^=\"bottom-\"] {\n    --tf-toast-motion-offset: 18px;\n  }\n\n  .Toastflow__animation-enter-from > .tf-toast-motion,\n  .Toastflow__animation-appear-from > .tf-toast-motion {\n    transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.98);\n  }\n\n  .Toastflow__animation-leave-to > .tf-toast-motion {\n    transform: translate3d(0, var(--tf-toast-motion-offset), 0) scale(0.98);\n  }\n}\n\n/* CLEAR ALL */\n.Toastflow__animation-clearAll .tf-toast-motion {\n  animation: Toastflow__clearAll-kf var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.22, 1, 0.36, 1) both;\n}\n\n/* BUMP & UPDATE */\n.Toastflow__animation-bump {\n  animation: Toastflow__bump-kf var(--tf-toast-animation-in-duration) ease-out;\n}\n\n.Toastflow__animation-update {\n  animation: Toastflow__bump-kf var(--tf-toast-animation-in-duration)\n    cubic-bezier(0.33, 1, 0.68, 1);\n}\n\n@keyframes Toastflow__clearAll-kf {\n  0% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n  }\n}\n\n@keyframes Toastflow__bump-kf {\n  0% {\n    transform: scale(1);\n  }\n  40% {\n    transform: scale(1.01);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .Toastflow__animation-move {\n    transition: none;\n  }\n\n  .Toastflow__animation-enter-active .tf-toast-motion,\n  .Toastflow__animation-leave-active .tf-toast-motion {\n    transition: none;\n  }\n\n  .Toastflow__animation-clearAll .tf-toast-motion {\n    animation: none;\n  }\n}\n\n/* Toast container */\n.tf-toast-root {\n  pointer-events: none;\n  position: fixed;\n  inset: 0;\n}\n\n.tf-toast-stack {\n  position: absolute;\n  height: 100%;\n  display: flex;\n  align-items: flex-start;\n}\n\n.tf-toast-stack-inner {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.tf-toast-stack-inner--scroll {\n  max-height: 100%;\n  overflow-y: auto;\n  overflow-x: hidden;\n  overscroll-behavior: contain;\n  padding-top: var(--tf-toast-stack-padding-top);\n  padding-right: var(--tf-toast-stack-padding-right);\n  padding-bottom: var(--tf-toast-stack-padding-bottom);\n  padding-left: var(--tf-toast-stack-padding-left);\n  scroll-padding: var(--tf-toast-stack-padding-top)\n    var(--tf-toast-stack-padding-right) var(--tf-toast-stack-padding-bottom)\n    var(--tf-toast-stack-padding-left);\n}\n\n.tf-toast-stack-inner--bottom {\n  min-height: 100%;\n  justify-content: flex-end;\n}\n\n.tf-toast-stack--left {\n  justify-content: flex-start;\n}\n\n.tf-toast-stack--center {\n  justify-content: center;\n}\n\n.tf-toast-stack--right {\n  justify-content: flex-end;\n}\n\n.tf-toast-item {\n  pointer-events: auto;\n  width: 100%;\n  position: relative;\n  z-index: 1;\n}\n\n/* Toast component */\n.tf-toast-wrapper {\n  pointer-events: auto;\n  width: 100%;\n}\n\n.tf-toast {\n  cursor: pointer;\n  position: relative;\n  width: 100%;\n  --_tf-resolved-bg: var(\n    --tf-toast-bg,\n    var(--_tf-bg, var(--tf-toast-normal-bg-default))\n  );\n  --_tf-resolved-color: var(\n    --tf-toast-color,\n    var(\n      --tf-toast-accent-color,\n      var(--_tf-color, var(--tf-toast-normal-text-default))\n    )\n  );\n  --_tf-resolved-border: var(\n    --tf-toast-border-color,\n    var(--_tf-border-color, var(--tf-toast-normal-border-default))\n  );\n  --_tf-resolved-title-color: var(\n    --tf-toast-title-color,\n    var(\n      --tf-toast-color,\n      var(\n        --tf-toast-accent-color,\n        var(--_tf-title-color, var(--_tf-resolved-color))\n      )\n    )\n  );\n  --_tf-resolved-desc-color: var(\n    --tf-toast-description-color,\n    var(\n      --tf-toast-color,\n      var(\n        --tf-toast-accent-color,\n        var(--_tf-desc-color, var(--_tf-resolved-color))\n      )\n    )\n  );\n  --_tf-resolved-progress-bg: var(\n    --tf-toast-progress-bg,\n    var(\n      --_tf-progress-bg,\n      color-mix(in srgb, var(--_tf-resolved-color) 20%, transparent)\n    )\n  );\n  --_tf-resolved-progress-bar-bg: var(\n    --tf-toast-progress-bar-bg,\n    var(\n      --tf-toast-accent-color,\n      var(--_tf-progress-bar-bg, var(--_tf-resolved-color))\n    )\n  );\n  --tf-toast-button-color: var(--_tf-resolved-color);\n  --tf-toast-button-border-color: var(--_tf-resolved-border);\n  --tf-toast-button-border-width: var(--tf-toast-border-width);\n  --tf-toast-button-bg: var(--_tf-resolved-bg);\n  --tf-toast-close-color: var(--_tf-resolved-color);\n  --tf-toast-close-border-color: var(--_tf-resolved-border);\n  --tf-toast-close-bg: var(--_tf-resolved-bg);\n  --tf-toast-close-ring-color: var(--tf-toast-close-border-color);\n  --tf-toast-created-at-color: var(--_tf-resolved-desc-color);\n  --tf-toast-created-at-border-color: var(--_tf-resolved-border);\n  --tf-toast-created-at-bg: var(--_tf-resolved-bg);\n}\n\n.tf-toast--swipe-enabled {\n  touch-action: pan-y;\n  -webkit-user-select: none;\n  user-select: none;\n  cursor: grab;\n}\n\n.tf-toast--swipe-enabled:active {\n  cursor: grabbing;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-main-content {\n  flex-direction: row-reverse;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-text {\n  text-align: right;\n}\n\n.tf-toast-accent--default {\n  --_tf-bg: var(--tf-toast-normal-bg-default);\n  --_tf-color: var(--tf-toast-normal-color-default);\n  --_tf-border-color: var(--tf-toast-normal-border-default);\n  --_tf-title-color: var(--tf-toast-normal-title-color-default);\n  --_tf-desc-color: var(--tf-toast-normal-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-normal-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-normal-progress-bar-bg-default);\n}\n\n.tf-toast-accent--loading {\n  --_tf-bg: var(--tf-toast-loading-bg-default);\n  --_tf-color: var(--tf-toast-loading-color-default);\n  --_tf-border-color: var(--tf-toast-loading-border-default);\n  --_tf-title-color: var(--tf-toast-loading-title-color-default);\n  --_tf-desc-color: var(--tf-toast-loading-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-loading-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-loading-progress-bar-bg-default);\n}\n\n.tf-toast-accent--success {\n  --_tf-bg: var(--tf-toast-success-bg-default);\n  --_tf-color: var(--tf-toast-success-color-default);\n  --_tf-border-color: var(--tf-toast-success-border-default);\n  --_tf-title-color: var(--tf-toast-success-title-color-default);\n  --_tf-desc-color: var(--tf-toast-success-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-success-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-success-progress-bar-bg-default);\n}\n\n.tf-toast-accent--error {\n  --_tf-bg: var(--tf-toast-error-bg-default);\n  --_tf-color: var(--tf-toast-error-color-default);\n  --_tf-border-color: var(--tf-toast-error-border-default);\n  --_tf-title-color: var(--tf-toast-error-title-color-default);\n  --_tf-desc-color: var(--tf-toast-error-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-error-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-error-progress-bar-bg-default);\n}\n\n.tf-toast-accent--warning {\n  --_tf-bg: var(--tf-toast-warning-bg-default);\n  --_tf-color: var(--tf-toast-warning-color-default);\n  --_tf-border-color: var(--tf-toast-warning-border-default);\n  --_tf-title-color: var(--tf-toast-warning-title-color-default);\n  --_tf-desc-color: var(--tf-toast-warning-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-warning-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-warning-progress-bar-bg-default);\n}\n\n.tf-toast-accent--info {\n  --_tf-bg: var(--tf-toast-info-bg-default);\n  --_tf-color: var(--tf-toast-info-color-default);\n  --_tf-border-color: var(--tf-toast-info-border-default);\n  --_tf-title-color: var(--tf-toast-info-title-color-default);\n  --_tf-desc-color: var(--tf-toast-info-description-color-default);\n  --_tf-progress-bg: var(--tf-toast-info-progress-bg-default);\n  --_tf-progress-bar-bg: var(--tf-toast-info-progress-bar-bg-default);\n}\n\n.tf-toast-accent--custom {\n  --_tf-bg: var(\n    --tf-toast-custom-bg-default,\n    var(--tf-toast-normal-bg-default)\n  );\n  --_tf-color: var(\n    --tf-toast-custom-color-default,\n    var(--tf-toast-normal-color-default)\n  );\n  --_tf-border-color: var(\n    --tf-toast-custom-border-default,\n    var(--tf-toast-normal-border-default)\n  );\n  --_tf-title-color: var(\n    --tf-toast-custom-title-color-default,\n    var(--tf-toast-normal-title-color-default)\n  );\n  --_tf-desc-color: var(\n    --tf-toast-custom-description-color-default,\n    var(--tf-toast-normal-description-color-default)\n  );\n  --_tf-progress-bg: var(\n    --tf-toast-custom-progress-bg-default,\n    var(--tf-toast-normal-progress-bg-default)\n  );\n  --_tf-progress-bar-bg: var(\n    --tf-toast-custom-progress-bar-bg-default,\n    var(--tf-toast-normal-progress-bar-bg-default)\n  );\n}\n\n.tf-toast-surface {\n  position: relative;\n  display: block;\n  min-width: 0;\n  padding: var(--tf-toast-padding);\n  border-radius: var(--tf-toast-border-radius);\n  background-color: var(--_tf-resolved-bg);\n  color: var(--_tf-resolved-color);\n  border: var(--tf-toast-border-width) solid var(--_tf-resolved-border);\n  font-family: var(--tf-toast-font-family), sans-serif;\n  overflow: hidden;\n}\n\n.tf-toast-main {\n  display: flex;\n  align-items: stretch;\n  gap: var(--tf-toast-buttons-content-gap);\n  width: 100%;\n}\n\n.tf-toast-main--full > .tf-toast-main-content {\n  width: 100%;\n  min-width: 0;\n  flex: 1 1 100%;\n}\n\n.tf-toast-main--content-end > .tf-toast-main-content {\n  margin-left: auto;\n  max-width: 100%;\n  flex: 0 1 auto;\n}\n\n.tf-toast-main--content-end > .tf-toast-main-content > .tf-toast-body {\n  flex: 0 1 auto;\n  min-width: 0;\n}\n\n.tf-toast-main-content {\n  display: flex;\n  align-items: center;\n  gap: var(--tf-toast-gap);\n  min-width: 0;\n  flex: 1 1 auto;\n}\n\n.tf-toast-meta {\n  display: flex;\n  flex-direction: column;\n  gap: calc(var(--tf-toast-gap) / 2);\n  min-width: 0;\n  flex-shrink: 0;\n}\n\n.tf-toast-meta--left {\n  align-items: flex-start;\n}\n\n.tf-toast-meta--right {\n  align-items: flex-end;\n}\n\n.tf-toast-meta-row {\n  display: flex;\n  min-width: 0;\n}\n\n.tf-toast-meta-row--top {\n  margin-bottom: var(--tf-toast-buttons-content-gap);\n}\n\n.tf-toast-meta-row--bottom {\n  margin-top: var(--tf-toast-buttons-content-gap);\n}\n\n.tf-toast-meta-row .tf-toast-actions--start {\n  margin-right: auto;\n}\n\n.tf-toast-meta-row .tf-toast-actions--end {\n  margin-left: auto;\n}\n\n.tf-toast-actions {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  gap: var(--tf-toast-buttons-gap);\n}\n\n.tf-toast-buttons--center {\n  margin-top: auto;\n  margin-bottom: auto;\n}\n\n.tf-toast-buttons--bottom {\n  margin-top: auto;\n}\n\n.tf-toast-actions--start {\n  justify-content: flex-start;\n}\n\n.tf-toast-actions--end {\n  justify-content: flex-end;\n}\n\n.tf-toast-button {\n  appearance: none;\n  border: var(--tf-toast-button-border-width) solid\n    var(--tf-toast-button-border-color);\n  background: var(--tf-toast-button-bg);\n  color: var(--tf-toast-button-color);\n  border-radius: var(--tf-toast-button-border-radius);\n  font-size: var(--tf-toast-button-font-size);\n  line-height: var(--tf-toast-button-line-height);\n  padding: var(--tf-toast-button-padding-y) var(--tf-toast-button-padding-x);\n  cursor: pointer;\n  user-select: none;\n  font-family: inherit;\n}\n\n.tf-toast-icon-spin {\n  display: inline-block;\n  animation: tf-toast-spin 0.8s linear infinite;\n  transform-origin: center;\n}\n\n@keyframes tf-toast-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n.tf-toast-icon-svg {\n  width: var(--tf-toast-icon-size);\n  height: var(--tf-toast-icon-size);\n}\n\n.tf-toast-icon--loading .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-loading));\n}\n\n.tf-toast-icon--default .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-default));\n}\n\n.tf-toast-icon--success .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-success));\n}\n\n.tf-toast-icon--error .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-error));\n}\n\n.tf-toast-icon--warning .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-warning));\n}\n\n.tf-toast-icon--info .tf-toast-icon-svg {\n  color: var(--tf-toast-icon-color, var(--tf-toast-icon-info));\n}\n\n.tf-toast-icon--custom .tf-toast-icon-svg {\n  color: var(\n    --tf-toast-icon-color,\n    var(--tf-toast-icon-custom, var(--tf-toast-icon-default))\n  );\n}\n\n.tf-toast-body {\n  position: relative;\n  z-index: 1;\n  min-width: 0;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n}\n\n.tf-toast-body--has-created-at {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  column-gap: calc(var(--tf-toast-gap) / 2);\n  grid-auto-flow: row;\n}\n\n.tf-toast-body--has-created-at > :not(.tf-toast-created-at) {\n  grid-column: 1;\n}\n\n.tf-toast-text {\n  min-width: 0;\n}\n\n.tf-toast-created-at {\n  color: var(--tf-toast-created-at-color);\n  font-size: var(--tf-toast-created-at-font-size);\n  font-style: italic;\n  white-space: nowrap;\n  align-self: end;\n  justify-self: end;\n  grid-column: 2;\n  grid-row: 1;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-created-at {\n  text-align: right;\n  width: 100%;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.tf-toast[data-align=\"right\"] .tf-toast-body--has-created-at {\n  grid-template-columns: auto minmax(0, 1fr);\n}\n\n.tf-toast[data-align=\"right\"]\n  .tf-toast-body--has-created-at\n  > .tf-toast-created-at {\n  grid-column: 1;\n  justify-self: start;\n}\n\n.tf-toast[data-align=\"right\"]\n  .tf-toast-body--has-created-at\n  > :not(.tf-toast-created-at) {\n  grid-column: 2;\n}\n\n.tf-toast-floating-bar {\n  position: absolute;\n  top: 0;\n  right: 0;\n  transform: translate(\n    calc(var(--tf-toast-close-size) * var(--tf-toast-float-x)),\n    calc(var(--tf-toast-close-size) * var(--tf-toast-float-y))\n  );\n  display: inline-flex;\n  align-items: center;\n  gap: var(--tf-toast-created-at-offset);\n  height: var(--tf-toast-close-size);\n  pointer-events: auto;\n  z-index: 2;\n}\n\n.tf-toast-created-at-float {\n  display: inline-flex;\n  align-items: center;\n  height: var(--tf-toast-close-size);\n  padding: 0 var(--tf-toast-created-at-padding-x);\n  border-radius: var(--tf-toast-created-at-border-radius);\n  border: var(--tf-toast-close-border-width) solid\n    var(--tf-toast-created-at-border-color);\n  background: var(--tf-toast-created-at-bg);\n  color: var(--tf-toast-created-at-color);\n  font-size: var(--tf-toast-created-at-font-size);\n  font-style: italic;\n  white-space: nowrap;\n  pointer-events: none;\n}\n\n.tf-toast-title {\n  margin: 0;\n  font-size: var(--tf-toast-title-font-size);\n  font-weight: var(--tf-toast-title-font-weight);\n  line-height: var(--tf-toast-title-line-height);\n  color: var(--_tf-resolved-title-color);\n  word-wrap: break-word;\n}\n\n.tf-toast-description {\n  margin: 0;\n  font-size: var(--tf-toast-description-font-size);\n  line-height: var(--tf-toast-description-line-height);\n  color: var(--_tf-resolved-desc-color);\n  word-wrap: break-word;\n}\n\n.tf-toast-close {\n  position: relative;\n  height: var(--tf-toast-close-size);\n  width: var(--tf-toast-close-size);\n  border-radius: var(--tf-toast-close-border-radius);\n  border: var(--tf-toast-close-border-width) solid\n    var(--tf-toast-close-border-color);\n  background: var(--tf-toast-close-bg);\n  color: var(--tf-toast-close-color);\n  font-size: var(--tf-toast-close-font-size);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  cursor: pointer;\n  flex-shrink: 0;\n  pointer-events: auto;\n  z-index: 2;\n}\n\n.tf-toast-close-icon {\n  width: var(--tf-toast-close-icon-size);\n  height: var(--tf-toast-close-icon-size);\n}\n\n.tf-toast-close:focus-visible {\n  outline: 2px solid var(--tf-toast-close-ring-color);\n  outline-offset: 2px;\n}\n", V = "data-toastflow-styles", H = !1;
 function U() {
 	if (H || typeof document > "u") return;
 	if (document.head.querySelector(`style[${V}]`)) {
@@ -419,7 +419,8 @@ function Ne({ toast: e, store: t, progressResetKey: n, duplicateKey: i, updateKe
 	}), ye = o(function() {
 		return {
 			class: "tf-toast-progress",
-			"data-align": d.value.progressAlignment
+			"data-align": d.value.progressAlignment,
+			style: E.value
 		};
 	}), be = o(function() {
 		return { class: ["tf-toast-progress-bar", `tf-toast-progress-bar--${d.value.type}`] };
@@ -719,20 +720,22 @@ function Re(e, t) {
 function ze(e, t, n) {
 	let r = C(!1), i = "";
 	function a() {
-		i === "touch" || i === "pen" || l() && d();
+		d() && (i === "touch" || i === "pen" || l() && f());
 	}
 	function o() {
-		if (i === "touch" || i === "pen") {
-			i = "";
-			return;
+		if (d()) {
+			if (i === "touch" || i === "pen") {
+				i = "";
+				return;
+			}
+			l() && p();
 		}
-		l() && f();
 	}
 	function s(e) {
-		i = e.pointerType, l(e, !0) && d();
+		i = e.pointerType, l(e, !0) && f();
 	}
 	function c(e) {
-		l(e, !0) && f();
+		l(e, !0) && p();
 	}
 	function l(t, r = !1) {
 		return !n.value || !e.value.pauseOnHover ? !1 : !(r && t && !u(t));
@@ -741,15 +744,18 @@ function ze(e, t, n) {
 		return e.pointerType === "touch" || e.pointerType === "pen";
 	}
 	function d() {
-		r.value = !0, t.pause(e.value.id);
+		return typeof window > "u" || !window.matchMedia ? !0 : window.matchMedia("(hover: hover), (any-hover: hover) and (any-pointer: fine)").matches;
 	}
 	function f() {
+		r.value = !0, t.pause(e.value.id);
+	}
+	function p() {
 		r.value = !1, t.resume(e.value.id);
 	}
 	return {
 		isHovered: r,
-		pause: d,
-		resume: f,
+		pause: f,
+		resume: p,
 		handleMouseEnter: a,
 		handleMouseLeave: o,
 		handlePointerDown: s,