@duskmoon-dev/core 1.19.4 → 1.19.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/README.md +1 -1
  2. package/dist/components/alert.css +81 -3
  3. package/dist/components/dialog.css +29 -3
  4. package/dist/components/dropdown.css +91 -0
  5. package/dist/components/fab.css +182 -0
  6. package/dist/components/index.css +1119 -232
  7. package/dist/components/loading.css +105 -0
  8. package/dist/components/modal.css +66 -4
  9. package/dist/components/navigation.css +94 -54
  10. package/dist/components/progress.css +74 -0
  11. package/dist/components/radial-progress.css +47 -0
  12. package/dist/components/skeleton.css +13 -1
  13. package/dist/components/snackbar.css +48 -18
  14. package/dist/components/swap.css +116 -0
  15. package/dist/components/toast.css +188 -34
  16. package/dist/components/tooltip.css +2 -47
  17. package/dist/esm/components/alert.js +81 -3
  18. package/dist/esm/components/dialog.js +29 -3
  19. package/dist/esm/components/dropdown.d.ts +5 -0
  20. package/dist/esm/components/dropdown.js +100 -0
  21. package/dist/esm/components/fab.d.ts +5 -0
  22. package/dist/esm/components/fab.js +191 -0
  23. package/dist/esm/components/loading.d.ts +5 -0
  24. package/dist/esm/components/loading.js +114 -0
  25. package/dist/esm/components/modal.js +66 -4
  26. package/dist/esm/components/navigation.js +94 -54
  27. package/dist/esm/components/progress.js +74 -0
  28. package/dist/esm/components/radial-progress.d.ts +5 -0
  29. package/dist/esm/components/radial-progress.js +56 -0
  30. package/dist/esm/components/skeleton.js +13 -1
  31. package/dist/esm/components/snackbar.js +48 -18
  32. package/dist/esm/components/swap.d.ts +5 -0
  33. package/dist/esm/components/swap.js +125 -0
  34. package/dist/esm/components/toast.js +188 -34
  35. package/dist/esm/components/tooltip.js +2 -47
  36. package/dist/index.css +1119 -232
  37. package/dist/index.min.css +1 -1
  38. package/dist/standalone/duskmoonui-themes.css +1 -1
  39. package/dist/standalone/duskmoonui.css +1120 -233
  40. package/dist/standalone/duskmoonui.js +25 -9
  41. package/dist/standalone/duskmoonui.mjs +25 -9
  42. package/package.json +31 -1
package/dist/standalone/duskmoonui.js CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
- * @duskmoon-dev/core v1.19.4
3
- * @duskmoon-dev/css-art v1.19.4
2
+ * @duskmoon-dev/core v1.19.6
3
+ * @duskmoon-dev/css-art v1.19.6
4
4
  * Standalone Tailwind CSS v4 plugin bundle
5
5
  * https://github.com/duskmoon-dev/duskmoonui
6
6
  * @license MIT
@@ -147,10 +147,23 @@ var tailwind_plugin_default = duskmoonPlugin;
147
147
 
148
148
  // dist/standalone/.standalone-entry.ts
149
149
  var baseStyles = { html: { scrollBehavior: "smooth", WebkitTextSizeAdjust: "100%", textSizeAdjust: "100%" }, ":root,\n[data-theme]": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" }, ":focus-visible": { outline: "2px solid var(--color-primary)", outlineOffset: "2px" }, "[disabled],\n.disabled": { pointerEvents: "none", opacity: 0.5 }, "::selection": { backgroundColor: "color-mix(in oklch, var(--color-primary) 20%, transparent)", color: "var(--color-base-content)" }, "::-webkit-scrollbar": { width: "8px", height: "8px" }, "::-webkit-scrollbar-track": { background: "var(--color-base-200)" }, "::-webkit-scrollbar-thumb": { background: "var(--color-base-300)", borderRadius: "4px" }, "::-webkit-scrollbar-thumb:hover": { background: "color-mix(in oklch, var(--color-base-content) 30%, transparent)" }, "*": { scrollbarWidth: "thin", scrollbarColor: "var(--color-base-300) var(--color-base-200)" }, "@media (prefers-reduced-motion: reduce)": { "*,\n *::before,\n *::after": { animationDuration: "0.01ms !important", animationIterationCount: "1 !important", transitionDuration: "0.01ms !important", scrollBehavior: "auto !important" } }, ":root": [{ colorScheme: "light", "--theme-name": '"sunshine"', "--theme-mode": '"light"', "--theme-family": '"duskmoon"', "--theme-pair": '"moonlight"', "--theme-description": '"Warm amber/coral"', "--color-primary": "oklch(52% 0.17 75)", "--color-primary-content": "oklch(100% 0 0)", "--color-primary-container": "oklch(95% 0.035 95.91)", "--color-on-primary-container": "oklch(25% 0.03 95.91)", "--color-secondary": "oklch(55% 0.19 20)", "--color-secondary-content": "oklch(100% 0 0)", "--color-secondary-container": "oklch(94% 0.05 87.01)", "--color-on-secondary-container": "oklch(25% 0.05 87.01)", "--color-tertiary": "oklch(52% 0.085 235)", "--color-tertiary-content": "oklch(100% 0 0)", "--color-tertiary-container": "oklch(95% 0.035 235)", "--color-on-tertiary-container": "oklch(22% 0.012 235)", "--color-accent": "oklch(52% 0.14 327)", "--color-accent-content": "oklch(100% 0 0)", "--color-neutral": "oklch(0% 0 0)", "--color-neutral-content": "oklch(80% 0.015 50)", "--color-neutral-variant": "oklch(50% 0.02 260)", "--color-surface": "oklch(100% 0 0)", "--color-surface-dim": "oklch(96% 0.01 85)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(99% 0.01 85)", "--color-surface-container": "oklch(97% 0.01 85)", "--color-surface-container-high": "oklch(96% 0.01 85)", "--color-surface-container-highest": "oklch(94% 0.01 85)", "--color-surface-variant": "oklch(94% 0.02 85)", "--color-on-surface": "oklch(27% 0.02 260)", "--color-on-surface-variant": "oklch(50% 0.02 260)", "--color-base-100": "oklch(100% 0.005 255)", "--color-base-200": "oklch(95% 0.008 255)", "--color-base-300": "oklch(90% 0.01 255)", "--color-base-400": "oklch(55% 0.06 255)", "--color-base-500": "oklch(45% 0.05 255)", "--color-base-600": "oklch(35% 0.04 255)", "--color-base-700": "oklch(25% 0.03 255)", "--color-base-800": "oklch(18% 0.02 255)", "--color-base-900": "oklch(12% 0.01 255)", "--color-base-content": "oklch(10% 0 255)", "--color-outline": "oklch(75% 0.01 260)", "--color-outline-variant": "oklch(85% 0.01 260)", "--color-inverse-surface": "oklch(25% 0.02 260)", "--color-inverse-on-surface": "oklch(95% 0.01 260)", "--color-inverse-primary": "oklch(80% 0.14 55)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 50%)", "--color-info": "oklch(41.94% 0.114 254.39)", "--color-info-content": "oklch(91.94% 0.114 254.39)", "--color-info-container": "oklch(95% 0.03 235)", "--color-on-info-container": "oklch(35% 0.08 235)", "--color-success": "oklch(50% 0.19 133.55)", "--color-success-content": "oklch(100% 0 0)", "--color-success-container": "oklch(93% 0.04 150)", "--color-on-success-container": "oklch(30% 0.08 150)", "--color-warning": "oklch(52% 0.203 42.44)", "--color-warning-content": "oklch(100% 0 0)", "--color-warning-container": "oklch(93% 0.05 80)", "--color-on-warning-container": "oklch(38% 0.10 80)", "--color-error": "oklch(52% 0.237 28.15)", "--color-error-content": "oklch(100% 0 0)", "--color-error-container": "oklch(93% 0.04 25)", "--color-on-error-container": "oklch(32% 0.10 25)", "--radius-selector": "0.25rem", "--radius-field": "0.625rem", "--radius-box": "2rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "0.5px", "--depth": "1", "--noise": "1", "--spacing-0": "0px", "--spacing-1": "4px", "--spacing-2": "8px", "--spacing-3": "12px", "--spacing-4": "16px", "--spacing-5": "20px", "--spacing-6": "24px", "--spacing-7": "28px", "--spacing-8": "32px", "--spacing-10": "40px", "--spacing-12": "48px", "--spacing-16": "64px", "--spacing-20": "80px", "--spacing-24": "96px", "--radius-none": "0px", "--radius-xs": "4px", "--radius-sm": "8px", "--radius-md": "12px", "--radius-lg": "16px", "--radius-xl": "20px", "--radius-2xl": "28px", "--radius-full": "9999px", "--elevation-level0": "0px", "--elevation-level1": "1px", "--elevation-level2": "3px", "--elevation-level3": "6px", "--elevation-level4": "8px", "--elevation-level5": "12px" }, { "--shadow-xs": "0 1px 2px 0 color-mix(in srgb, var(--color-shadow) 5%, transparent)", "--shadow-sm": "0 1px 3px 0 color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 1px 2px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-md": "0 4px 6px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 2px 4px -2px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-lg": "0 10px 15px -3px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 4px 6px -4px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-xl": "0 20px 25px -5px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 8px 10px -6px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-2xl": "0 25px 50px -12px color-mix(in srgb, var(--color-shadow) 25%, transparent)", "--shadow-elevation-0": "none", "--shadow-elevation-1": "var(--shadow-xs)", "--shadow-elevation-2": "var(--shadow-sm)", "--shadow-elevation-3": "var(--shadow-md)", "--shadow-elevation-4": "var(--shadow-lg)", "--shadow-elevation-5": "var(--shadow-xl)" }], "@media (prefers-color-scheme: dark)": { ":root:not([data-theme])": { colorScheme: "dark", "--theme-name": '"moonlight"', "--theme-mode": '"dark"', "--theme-family": '"duskmoon"', "--theme-pair": '"sunshine"', "--theme-description": '"Neutral white/gold"', "--color-primary": "oklch(85.45% 0 0)", "--color-primary-content": "oklch(14.94% 0.031 39.947)", "--color-primary-container": "oklch(25% 0.01 0)", "--color-on-primary-container": "oklch(85% 0.01 0)", "--color-secondary": "oklch(83.33% 0.0981 73.78)", "--color-secondary-content": "oklch(14.507% 0.035 2.72)", "--color-secondary-container": "oklch(28% 0.03 73.78)", "--color-on-secondary-container": "oklch(88% 0.03 73.78)", "--color-tertiary": "oklch(72% 0.090 255)", "--color-tertiary-content": "oklch(14% 0.012 255)", "--color-tertiary-container": "oklch(28% 0.030 255)", "--color-on-tertiary-container": "oklch(88% 0.010 255)", "--color-accent": "oklch(75.65% 0.1303 335.51)", "--color-accent-content": "oklch(14.258% 0.033 299.844)", "--color-neutral": "oklch(23% 0 0)", "--color-neutral-content": "oklch(52.43% 0 0)", "--color-neutral-variant": "oklch(55% 0.01 260)", "--color-surface": "oklch(20% 0.02 260)", "--color-surface-dim": "oklch(17% 0.02 260)", "--color-surface-bright": "oklch(28% 0.02 260)", "--color-surface-container-lowest": "oklch(14% 0.02 260)", "--color-surface-container-low": "oklch(20% 0.02 260)", "--color-surface-container": "oklch(22% 0.02 260)", "--color-surface-container-high": "oklch(25% 0.02 260)", "--color-surface-container-highest": "oklch(28% 0.01 260)", "--color-surface-variant": "oklch(30% 0.02 260)", "--color-on-surface": "oklch(95% 0.01 260)", "--color-on-surface-variant": "oklch(75% 0.01 260)", "--color-base-100": "oklch(22% 0.019 237.69)", "--color-base-200": "oklch(20% 0.019 237.69)", "--color-base-300": "oklch(18% 0.019 237.69)", "--color-base-400": "oklch(26% 0.019 237.69)", "--color-base-500": "oklch(32% 0.019 237.69)", "--color-base-600": "oklch(40% 0.018 237.69)", "--color-base-700": "oklch(55% 0.017 237.69)", "--color-base-800": "oklch(70% 0.016 237.69)", "--color-base-900": "oklch(85% 0.015 237.69)", "--color-base-content": "oklch(77.383% 0.043 245.096)", "--color-outline": "oklch(44% 0.01 260)", "--color-outline-variant": "oklch(35% 0.01 260)", "--color-inverse-surface": "oklch(95% 0.01 260)", "--color-inverse-on-surface": "oklch(25% 0.02 260)", "--color-inverse-primary": "oklch(55% 0.16 255)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(82.42% 0.09757279812867503 240.7677443360475)", "--color-info-content": "oklch(17.111% 0.017 206.015)", "--color-info-container": "oklch(32% 0.06 235)", "--color-on-info-container": "oklch(88% 0.06 235)", "--color-success": "oklch(82.19% 0.0621 133.3)", "--color-success-content": "oklch(17.112% 0.017 144.778)", "--color-success-container": "oklch(30% 0.05 150)", "--color-on-success-container": "oklch(85% 0.06 150)", "--color-warning": "oklch(76.36% 0.1752731353930708 61.96388739129725)", "--color-warning-content": "oklch(17.113% 0.016 74.427)", "--color-warning-container": "oklch(35% 0.06 80)", "--color-on-warning-container": "oklch(90% 0.06 80)", "--color-error": "oklch(46.38% 0.1898 29.17)", "--color-error-content": "oklch(86.38% 0.298 39.17)", "--color-error-container": "oklch(30% 0.08 25)", "--color-on-error-container": "oklch(88% 0.06 25)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.8", "--noise": "0.6" } }, '[data-theme="sunshine"]': { colorScheme: "light", "--theme-name": '"sunshine"', "--theme-mode": '"light"', "--theme-family": '"duskmoon"', "--theme-pair": '"moonlight"', "--theme-description": '"Warm amber/coral"', "--color-primary": "oklch(52% 0.17 75)", "--color-primary-content": "oklch(100% 0 0)", "--color-primary-container": "oklch(95% 0.035 95.91)", "--color-on-primary-container": "oklch(25% 0.03 95.91)", "--color-secondary": "oklch(55% 0.19 20)", "--color-secondary-content": "oklch(100% 0 0)", "--color-secondary-container": "oklch(94% 0.05 87.01)", "--color-on-secondary-container": "oklch(25% 0.05 87.01)", "--color-tertiary": "oklch(52% 0.085 235)", "--color-tertiary-content": "oklch(100% 0 0)", "--color-tertiary-container": "oklch(95% 0.035 235)", "--color-on-tertiary-container": "oklch(22% 0.012 235)", "--color-accent": "oklch(52% 0.14 327)", "--color-accent-content": "oklch(100% 0 0)", "--color-neutral": "oklch(0% 0 0)", "--color-neutral-content": "oklch(80% 0.015 50)", "--color-neutral-variant": "oklch(50% 0.02 260)", "--color-surface": "oklch(100% 0 0)", "--color-surface-dim": "oklch(96% 0.01 85)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(99% 0.01 85)", "--color-surface-container": "oklch(97% 0.01 85)", "--color-surface-container-high": "oklch(96% 0.01 85)", "--color-surface-container-highest": "oklch(94% 0.01 85)", "--color-surface-variant": "oklch(94% 0.02 85)", "--color-on-surface": "oklch(27% 0.02 260)", "--color-on-surface-variant": "oklch(50% 0.02 260)", "--color-base-100": "oklch(100% 0.005 255)", "--color-base-200": "oklch(95% 0.008 255)", "--color-base-300": "oklch(90% 0.01 255)", "--color-base-400": "oklch(55% 0.06 255)", "--color-base-500": "oklch(45% 0.05 255)", "--color-base-600": "oklch(35% 0.04 255)", "--color-base-700": "oklch(25% 0.03 255)", "--color-base-800": "oklch(18% 0.02 255)", "--color-base-900": "oklch(12% 0.01 255)", "--color-base-content": "oklch(10% 0 255)", "--color-outline": "oklch(75% 0.01 260)", "--color-outline-variant": "oklch(85% 0.01 260)", "--color-inverse-surface": "oklch(25% 0.02 260)", "--color-inverse-on-surface": "oklch(95% 0.01 260)", "--color-inverse-primary": "oklch(80% 0.14 55)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 50%)", "--color-info": "oklch(41.94% 0.114 254.39)", "--color-info-content": "oklch(91.94% 0.114 254.39)", "--color-info-container": "oklch(95% 0.03 235)", "--color-on-info-container": "oklch(35% 0.08 235)", "--color-success": "oklch(50% 0.19 133.55)", "--color-success-content": "oklch(100% 0 0)", "--color-success-container": "oklch(93% 0.04 150)", "--color-on-success-container": "oklch(30% 0.08 150)", "--color-warning": "oklch(52% 0.203 42.44)", "--color-warning-content": "oklch(100% 0 0)", "--color-warning-container": "oklch(93% 0.05 80)", "--color-on-warning-container": "oklch(38% 0.10 80)", "--color-error": "oklch(52% 0.237 28.15)", "--color-error-content": "oklch(100% 0 0)", "--color-error-container": "oklch(93% 0.04 25)", "--color-on-error-container": "oklch(32% 0.10 25)", "--radius-selector": "0.25rem", "--radius-field": "0.625rem", "--radius-box": "2rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "0.5px", "--depth": "1", "--noise": "1" }, '[data-theme="moonlight"]': { colorScheme: "dark", "--theme-name": '"moonlight"', "--theme-mode": '"dark"', "--theme-family": '"duskmoon"', "--theme-pair": '"sunshine"', "--theme-description": '"Neutral white/gold"', "--color-primary": "oklch(85.45% 0 0)", "--color-primary-content": "oklch(14.94% 0.031 39.947)", "--color-primary-container": "oklch(25% 0.01 0)", "--color-on-primary-container": "oklch(85% 0.01 0)", "--color-secondary": "oklch(83.33% 0.0981 73.78)", "--color-secondary-content": "oklch(14.507% 0.035 2.72)", "--color-secondary-container": "oklch(28% 0.03 73.78)", "--color-on-secondary-container": "oklch(88% 0.03 73.78)", "--color-tertiary": "oklch(72% 0.090 255)", "--color-tertiary-content": "oklch(14% 0.012 255)", "--color-tertiary-container": "oklch(28% 0.030 255)", "--color-on-tertiary-container": "oklch(88% 0.010 255)", "--color-accent": "oklch(75.65% 0.1303 335.51)", "--color-accent-content": "oklch(14.258% 0.033 299.844)", "--color-neutral": "oklch(23% 0 0)", "--color-neutral-content": "oklch(52.43% 0 0)", "--color-neutral-variant": "oklch(55% 0.01 260)", "--color-surface": "oklch(20% 0.02 260)", "--color-surface-dim": "oklch(17% 0.02 260)", "--color-surface-bright": "oklch(28% 0.02 260)", "--color-surface-container-lowest": "oklch(14% 0.02 260)", "--color-surface-container-low": "oklch(20% 0.02 260)", "--color-surface-container": "oklch(22% 0.02 260)", "--color-surface-container-high": "oklch(25% 0.02 260)", "--color-surface-container-highest": "oklch(28% 0.01 260)", "--color-surface-variant": "oklch(30% 0.02 260)", "--color-on-surface": "oklch(95% 0.01 260)", "--color-on-surface-variant": "oklch(75% 0.01 260)", "--color-base-100": "oklch(22% 0.019 237.69)", "--color-base-200": "oklch(20% 0.019 237.69)", "--color-base-300": "oklch(18% 0.019 237.69)", "--color-base-400": "oklch(26% 0.019 237.69)", "--color-base-500": "oklch(32% 0.019 237.69)", "--color-base-600": "oklch(40% 0.018 237.69)", "--color-base-700": "oklch(55% 0.017 237.69)", "--color-base-800": "oklch(70% 0.016 237.69)", "--color-base-900": "oklch(85% 0.015 237.69)", "--color-base-content": "oklch(77.383% 0.043 245.096)", "--color-outline": "oklch(44% 0.01 260)", "--color-outline-variant": "oklch(35% 0.01 260)", "--color-inverse-surface": "oklch(95% 0.01 260)", "--color-inverse-on-surface": "oklch(25% 0.02 260)", "--color-inverse-primary": "oklch(55% 0.16 255)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(82.42% 0.09757279812867503 240.7677443360475)", "--color-info-content": "oklch(17.111% 0.017 206.015)", "--color-info-container": "oklch(32% 0.06 235)", "--color-on-info-container": "oklch(88% 0.06 235)", "--color-success": "oklch(82.19% 0.0621 133.3)", "--color-success-content": "oklch(17.112% 0.017 144.778)", "--color-success-container": "oklch(30% 0.05 150)", "--color-on-success-container": "oklch(85% 0.06 150)", "--color-warning": "oklch(76.36% 0.1752731353930708 61.96388739129725)", "--color-warning-content": "oklch(17.113% 0.016 74.427)", "--color-warning-container": "oklch(35% 0.06 80)", "--color-on-warning-container": "oklch(90% 0.06 80)", "--color-error": "oklch(46.38% 0.1898 29.17)", "--color-error-content": "oklch(86.38% 0.298 39.17)", "--color-error-container": "oklch(30% 0.08 25)", "--color-on-error-container": "oklch(88% 0.06 25)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.8", "--noise": "0.6" }, '[data-theme="ocean"]': { colorScheme: "dark", "--theme-name": '"ocean"', "--theme-mode": '"dark"', "--theme-family": '"ecotone"', "--theme-pair": '"forest"', "--theme-description": '"Cool blue"', "--color-primary": "oklch(72% 0.12 210)", "--color-primary-content": "oklch(15% 0.02 210)", "--color-primary-container": "oklch(30% 0.08 210)", "--color-on-primary-container": "oklch(90% 0.04 210)", "--color-secondary": "oklch(75% 0.10 175)", "--color-secondary-content": "oklch(15% 0.02 175)", "--color-secondary-container": "oklch(28% 0.06 175)", "--color-on-secondary-container": "oklch(90% 0.04 175)", "--color-tertiary": "oklch(72% 0.10 280)", "--color-tertiary-content": "oklch(15% 0.02 280)", "--color-tertiary-container": "oklch(28% 0.06 280)", "--color-on-tertiary-container": "oklch(90% 0.04 280)", "--color-accent": "oklch(70% 0.12 190)", "--color-accent-content": "oklch(15% 0.03 190)", "--color-neutral": "oklch(90% 0.01 210)", "--color-neutral-content": "oklch(16% 0.02 220)", "--color-neutral-variant": "oklch(50% 0.02 220)", "--color-surface": "oklch(16% 0.02 220)", "--color-surface-dim": "oklch(10% 0.015 220)", "--color-surface-bright": "oklch(24% 0.025 220)", "--color-surface-container-lowest": "oklch(8% 0.01 220)", "--color-surface-container-low": "oklch(12% 0.015 220)", "--color-surface-container": "oklch(16% 0.02 220)", "--color-surface-container-high": "oklch(20% 0.022 220)", "--color-surface-container-highest": "oklch(24% 0.025 220)", "--color-surface-variant": "oklch(22% 0.025 220)", "--color-on-surface": "oklch(90% 0.01 210)", "--color-on-surface-variant": "oklch(70% 0.015 210)", "--color-base-100": "oklch(16% 0.02 220)", "--color-base-200": "oklch(14% 0.015 220)", "--color-base-300": "oklch(10% 0.01 220)", "--color-base-400": "oklch(30% 0.02 220)", "--color-base-500": "oklch(40% 0.02 220)", "--color-base-600": "oklch(55% 0.015 220)", "--color-base-700": "oklch(70% 0.01 220)", "--color-base-800": "oklch(82% 0.01 220)", "--color-base-900": "oklch(92% 0.005 220)", "--color-base-content": "oklch(90% 0.01 210)", "--color-outline": "oklch(45% 0.02 220)", "--color-outline-variant": "oklch(32% 0.015 220)", "--color-inverse-surface": "oklch(90% 0.01 210)", "--color-inverse-on-surface": "oklch(16% 0.02 220)", "--color-inverse-primary": "oklch(45% 0.12 210)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(70% 0.12 230)", "--color-info-content": "oklch(15% 0.03 230)", "--color-info-container": "oklch(28% 0.06 230)", "--color-on-info-container": "oklch(88% 0.04 230)", "--color-success": "oklch(72% 0.15 155)", "--color-success-content": "oklch(15% 0.03 155)", "--color-success-container": "oklch(28% 0.06 155)", "--color-on-success-container": "oklch(88% 0.04 155)", "--color-warning": "oklch(75% 0.14 75)", "--color-warning-content": "oklch(18% 0.04 75)", "--color-warning-container": "oklch(30% 0.06 75)", "--color-on-warning-container": "oklch(88% 0.05 75)", "--color-error": "oklch(70% 0.16 20)", "--color-error-content": "oklch(15% 0.03 20)", "--color-error-container": "oklch(28% 0.06 20)", "--color-on-error-container": "oklch(88% 0.05 20)", "--radius-selector": "0.25rem", "--radius-field": "0.75rem", "--radius-box": "1.5rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.7", "--noise": "0.3" }, '[data-theme="forest"]': { colorScheme: "light", "--theme-name": '"forest"', "--theme-mode": '"light"', "--theme-family": '"ecotone"', "--theme-pair": '"ocean"', "--theme-description": '"Cool green/teal"', "--color-primary": "oklch(50% 0.14 150)", "--color-primary-content": "oklch(98% 0.01 150)", "--color-primary-container": "oklch(92% 0.04 150)", "--color-on-primary-container": "oklch(22% 0.06 150)", "--color-secondary": "oklch(52% 0.10 55)", "--color-secondary-content": "oklch(98% 0.01 55)", "--color-secondary-container": "oklch(92% 0.03 55)", "--color-on-secondary-container": "oklch(24% 0.05 55)", "--color-tertiary": "oklch(58% 0.08 175)", "--color-tertiary-content": "oklch(98% 0.01 175)", "--color-tertiary-container": "oklch(93% 0.03 175)", "--color-on-tertiary-container": "oklch(22% 0.04 175)", "--color-accent": "oklch(60% 0.12 85)", "--color-accent-content": "oklch(20% 0.04 85)", "--color-neutral": "oklch(14% 0.01 100)", "--color-neutral-content": "oklch(92% 0.01 100)", "--color-neutral-variant": "oklch(48% 0.015 100)", "--color-surface": "oklch(99% 0.005 100)", "--color-surface-dim": "oklch(95% 0.01 100)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(98% 0.008 100)", "--color-surface-container": "oklch(96% 0.01 100)", "--color-surface-container-high": "oklch(94% 0.012 100)", "--color-surface-container-highest": "oklch(92% 0.015 100)", "--color-surface-variant": "oklch(93% 0.02 100)", "--color-on-surface": "oklch(22% 0.02 100)", "--color-on-surface-variant": "oklch(42% 0.02 100)", "--color-base-100": "oklch(99% 0.005 100)", "--color-base-200": "oklch(92% 0.01 100)", "--color-base-300": "oklch(80% 0.01 100)", "--color-base-400": "oklch(60% 0.01 100)", "--color-base-500": "oklch(48% 0.01 100)", "--color-base-600": "oklch(38% 0.01 100)", "--color-base-700": "oklch(28% 0.01 100)", "--color-base-800": "oklch(20% 0.008 100)", "--color-base-900": "oklch(14% 0.005 100)", "--color-base-content": "oklch(14% 0.01 100)", "--color-outline": "oklch(60% 0.015 100)", "--color-outline-variant": "oklch(78% 0.01 100)", "--color-inverse-surface": "oklch(22% 0.02 100)", "--color-inverse-on-surface": "oklch(95% 0.01 100)", "--color-inverse-primary": "oklch(75% 0.10 150)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 40%)", "--color-info": "oklch(48% 0.12 240)", "--color-info-content": "oklch(98% 0.01 240)", "--color-info-container": "oklch(94% 0.03 240)", "--color-on-info-container": "oklch(28% 0.06 240)", "--color-success": "oklch(55% 0.16 145)", "--color-success-content": "oklch(98% 0.01 145)", "--color-success-container": "oklch(93% 0.04 145)", "--color-on-success-container": "oklch(25% 0.07 145)", "--color-warning": "oklch(62% 0.16 65)", "--color-warning-content": "oklch(18% 0.04 65)", "--color-warning-container": "oklch(93% 0.04 65)", "--color-on-warning-container": "oklch(32% 0.08 65)", "--color-error": "oklch(52% 0.18 15)", "--color-error-content": "oklch(98% 0.01 15)", "--color-error-container": "oklch(93% 0.04 15)", "--color-on-error-container": "oklch(28% 0.08 15)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "1px", "--depth": "0.5", "--noise": "0.8" }, '\n label[aria-required="true"]::after': { "@layer components": { content: "' *'", color: "var(--color-error)" } }, "@property --art-circular-gallery-rotation": { syntax: '"<angle>"', inherits: "true", initialValue: "0deg" }, "@property --art-gemini-input-rotation": { syntax: "'<angle>'", inherits: "false", initialValue: "0deg" } };
150
- var componentStyles = { ".btn": [{ "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", "--btn-text-color": "var(--color-on-surface)", display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", paddingInline: "var(--btn-p)", paddingBlock: "var(--btn-py)", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", textAlign: "center", textDecoration: "none", whiteSpace: "nowrap", verticalAlign: "middle", cursor: "pointer", userSelect: "none", border: "1px solid transparent", borderRadius: "var(--radius-sm)", transition: "all 150ms ease-in-out", backgroundColor: "var(--color-surface-container)", color: "var(--btn-text-color)" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".btn:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn:active": { "@layer components": { transform: "scale(0.98)" } }, ".btn:focus": { "@layer components": { outline: "none" } }, ".btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".btn:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, pointerEvents: "none" } }, ".btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".btn-primary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary), black 10%)", borderColor: "color-mix(in oklch, var(--color-primary), black 10%)", filter: "none" } }, ".btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".btn-secondary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary), black 10%)", borderColor: "color-mix(in oklch, var(--color-secondary), black 10%)", filter: "none" } }, ".btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".btn-tertiary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", borderColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", filter: "none" } }, ".btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".btn-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent), black 10%)", borderColor: "color-mix(in oklch, var(--color-accent), black 10%)", filter: "none" } }, ".btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".btn-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral), black 10%)", borderColor: "color-mix(in oklch, var(--color-neutral), black 10%)", filter: "none" } }, ".btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)", borderColor: "var(--color-base-100)" } }, ".btn-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-200)", filter: "none" } }, ".btn-info": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)", borderColor: "var(--color-info)" } }, ".btn-info:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-info), black 10%)", borderColor: "color-mix(in oklch, var(--color-info), black 10%)", filter: "none" } }, ".btn-success": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)", borderColor: "var(--color-success)" } }, ".btn-success:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-success), black 10%)", borderColor: "color-mix(in oklch, var(--color-success), black 10%)", filter: "none" } }, ".btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".btn-warning:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-warning), black 10%)", borderColor: "color-mix(in oklch, var(--color-warning), black 10%)", filter: "none" } }, ".btn-error": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)", borderColor: "var(--color-error)" } }, ".btn-error:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-error), black 10%)", borderColor: "color-mix(in oklch, var(--color-error), black 10%)", filter: "none" } }, ".btn-outline, \n .btn-outlined": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".btn-outline:hover, \n .btn-outlined:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-outline.btn-primary, \n .btn-outlined.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)", borderColor: "currentColor" } }, ".btn-outline.btn-primary:hover, \n .btn-outlined.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)" } }, ".btn-outline.btn-secondary, \n .btn-outlined.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)", borderColor: "currentColor" } }, ".btn-outline.btn-secondary:hover, \n .btn-outlined.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)" } }, ".btn-outline.btn-tertiary, \n .btn-outlined.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)", borderColor: "currentColor" } }, ".btn-outline.btn-tertiary:hover, \n .btn-outlined.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)" } }, ".btn-outline.btn-accent, \n .btn-outlined.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)", borderColor: "currentColor" } }, ".btn-outline.btn-accent:hover, \n .btn-outlined.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)" } }, ".btn-outline.btn-neutral, \n .btn-outlined.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)", borderColor: "currentColor" } }, ".btn-outline.btn-neutral:hover, \n .btn-outlined.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)" } }, ".btn-outline.btn-base, \n .btn-outlined.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", borderColor: "currentColor" } }, ".btn-outline.btn-base:hover, \n .btn-outlined.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)" } }, ".btn-outline.btn-info, \n .btn-outlined.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)", borderColor: "currentColor" } }, ".btn-outline.btn-info:hover, \n .btn-outlined.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)" } }, ".btn-outline.btn-success, \n .btn-outlined.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)", borderColor: "currentColor" } }, ".btn-outline.btn-success:hover, \n .btn-outlined.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)" } }, ".btn-outline.btn-warning, \n .btn-outlined.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)", borderColor: "currentColor" } }, ".btn-outline.btn-warning:hover, \n .btn-outlined.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)" } }, ".btn-outline.btn-error, \n .btn-outlined.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)", borderColor: "currentColor" } }, ".btn-outline.btn-error:hover, \n .btn-outlined.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)" } }, ".btn-ghost": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-ghost:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-ghost.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-ghost.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-ghost.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-ghost.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-ghost.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-ghost.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-ghost.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-ghost.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-ghost.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-ghost.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-ghost.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-ghost.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-ghost.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-ghost.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-ghost.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-ghost.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-ghost.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-ghost.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-ghost.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-ghost.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-text": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-text:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-text.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-text.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-text.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-text.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-text.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-text.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-text.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-text.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-text.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-text.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-text.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-text.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-text.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-text.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-text.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-text.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-text.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-text.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-text.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-text.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-tonal": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "transparent" } }, ".btn-tonal:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn-tonal.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-tonal.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-tonal.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-tonal.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-tonal.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-tonal.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-tonal.btn-info": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-tonal.btn-success": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-tonal.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-tonal.btn-error": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-xs": { "@layer components": { "--btn-p": "0.5rem", "--btn-py": "0.25rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)" } }, ".btn-sm": { "@layer components": { "--btn-p": "0.75rem", "--btn-py": "0.375rem", fontSize: "0.8125rem", lineHeight: "1.125rem", borderRadius: "var(--radius-xs)" } }, ".btn-md": { "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-sm)" } }, ".btn-lg": { "@layer components": { "--btn-p": "1.75rem", "--btn-py": "0.875rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "var(--radius-sm)" } }, ".btn-block": { "@layer components": { display: "flex", width: "100%" } }, ".btn-group": { "@layer components": { display: "inline-flex" } }, ".btn-group .btn": { "@layer components": { borderRadius: "0" } }, ".btn-group .btn:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".btn-group .btn:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".btn-group .btn:not(:first-child)": { "@layer components": { marginInlineStart: "-1px" } }, ".btn-loading": { "@layer components": { pointerEvents: "none", position: "relative", color: "transparent !important" } }, ".btn-loading::after": [{ "@layer components": { content: "''", position: "absolute", width: "1rem", height: "1rem", border: "2px solid var(--btn-text-color)", borderRightColor: "transparent", borderRadius: "var(--radius-full)", animation: "btn-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes btn-spin": { to: { transform: "rotate(360deg)" } }, ".btn-icon": { "@layer components": { padding: "0.75rem", width: "2.5rem", height: "2.5rem", borderRadius: "var(--radius-full)" } }, ".btn-icon-sm": { "@layer components": { padding: "0.5rem", width: "2rem", height: "2rem" } }, ".btn-icon-lg": { "@layer components": { padding: "1rem", width: "3rem", height: "3rem" } }, ".btn-circle": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".btn-square": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", aspectRatio: "1" } }, ".card": [{ "@layer components": { display: "flex", flexDirection: "column", position: "relative", overflow: "hidden", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)", transition: "box-shadow 150ms ease-in-out, transform 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".card:hover": { "@layer components": { boxShadow: "var(--shadow-md)" } }, ".card figure, \n .card-image": { "@layer components": { overflow: "hidden" } }, ".card figure img, \n .card-image img": { "@layer components": { width: "100%", height: "auto", objectFit: "cover" } }, ".card-body": { "@layer components": { minInlineSize: "0", overflowWrap: "anywhere", "--card-p": "1.5rem", display: "flex", flexDirection: "column", gap: "0.5rem", padding: "var(--card-p)", flex: 1 } }, ".card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockEnd: "1px solid var(--color-outline-variant)" } }, ".card-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockStart: "1px solid var(--color-outline-variant)", marginBlockStart: "auto" } }, ".card-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", color: "var(--color-on-surface)" } }, ".card-actions": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "center", gap: "0.5rem", marginBlockStart: "auto", paddingBlockStart: "0.5rem" } }, ".card-actions.justify-end": { "@layer components": { justifyContent: "flex-end" } }, ".card-actions.justify-start": { "@layer components": { justifyContent: "flex-start" } }, ".card-actions.justify-center": { "@layer components": { justifyContent: "center" } }, ".card-bordered": { "@layer components": { border: "1px solid var(--color-outline)", boxShadow: "none" } }, ".card-outlined": { "@layer components": { border: "1px solid var(--color-outline)", boxShadow: "none" } }, ".card-outlined:hover": { "@layer components": { boxShadow: "none" } }, ".card-filled": { "@layer components": { background: "var(--color-surface-container-highest)", boxShadow: "none" } }, ".card-lowest": { "@layer components": { background: "var(--color-surface-container-lowest)", boxShadow: "none" } }, ".card-low": { "@layer components": { background: "var(--color-surface-container-low)", boxShadow: "var(--shadow-sm)" } }, ".card-default": { "@layer components": { background: "var(--color-surface-container)", boxShadow: "var(--shadow-md)" } }, ".card-high": { "@layer components": { background: "var(--color-surface-container-high)", boxShadow: "var(--shadow-lg)" } }, ".card-highest": { "@layer components": { background: "var(--color-surface-container-highest)", boxShadow: "var(--shadow-xl)" } }, ".card-subtitle": { "@layer components": { color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".card-comfortable .card-body": { "@layer components": { "--card-p": "2rem" } }, ".card-bordered:hover": { "@layer components": { boxShadow: "none", borderColor: "var(--color-outline-variant)" } }, ".card-compact .card-header, \n .card-compact .card-body, \n .card-compact .card-footer": { "@layer components": { "--card-p": "1rem" } }, ".card-compact .card-title": { "@layer components": { fontSize: "1rem" } }, ".card-side": { "@layer components": { flexDirection: "row" } }, ".card-side figure, \n .card-side .card-image": { "@layer components": { width: "40%", flexShrink: 0 } }, ".card-side figure img, \n .card-side .card-image img": { "@layer components": { height: "100%", objectFit: "cover" } }, ".card-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".card-primary .card-title": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".card-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".card-secondary .card-title": { "@layer components": { color: "var(--color-on-secondary-container)" } }, ".card-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".card-tertiary .card-title": { "@layer components": { color: "var(--color-on-tertiary-container)" } }, ".card-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".card-info .card-title": { "@layer components": { color: "var(--color-on-info-container)" } }, ".card-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".card-success .card-title": { "@layer components": { color: "var(--color-on-success-container)" } }, ".card-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".card-warning .card-title": { "@layer components": { color: "var(--color-on-warning-container)" } }, ".card-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".card-error .card-title": { "@layer components": { color: "var(--color-on-error-container)" } }, ".card-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-accent .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-neutral .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".card-base .card-title": { "@layer components": { color: "var(--color-base-content)" } }, ".card-glass": { "@layer components": { backgroundColor: "rgb(255 255 255 / 0.1)", backdropFilter: "blur(12px)", border: "1px solid rgb(255 255 255 / 0.2)" } }, ".card-elevated": { "@layer components": { boxShadow: "var(--shadow-lg)" } }, ".card-elevated:hover": { "@layer components": { boxShadow: "var(--shadow-xl)", transform: "translateY(-2px)" } }, ".card-interactive": { "@layer components": { cursor: "pointer" } }, ".card-interactive:active": { "@layer components": { transform: "scale(0.99)" } }, ".card-interactive:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".card-full-image": { "@layer components": { position: "relative" } }, ".card-full-image figure, \n .card-full-image .card-image": { "@layer components": { position: "absolute", inset: "0", zIndex: 0 } }, ".card-full-image .card-body": { "@layer components": { position: "relative", zIndex: 1, background: "linear-gradient(to top, color-mix(in srgb, var(--color-shadow) 70%, transparent), transparent)", color: "white", marginTop: "auto", minHeight: "50%" } }, ".card-full-image .card-title": { "@layer components": { color: "white" } }, ":is(.form-group-info, .form-control.info)": { "@layer components": { "--dm-validation-color": "var(--color-info)" } }, ":is(.form-group-warning, .form-control.warning)": { "@layer components": { "--dm-validation-color": "var(--color-warning)" } }, ":is(.form-group-success, .form-control.success)": { "@layer components": { "--dm-validation-color": "var(--color-success)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is(.validate :valid, .validate:valid, .validator.validator-success:user-valid):not([aria-invalid="true"]):not(:where(.form-group-error *, .form-control.error *)):not(:disabled)': { "@layer components": { "--dm-validation-color": "var(--color-success)", "--dm-validation-content": "var(--color-success-content)" } }, ":is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is(.validate :invalid, .validate:invalid, .validator:user-invalid):not(:disabled)": { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ":is(.form-group-error, .form-control.error)": { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .form-group-error *, .form-control.error *):not(:disabled):is(:focus, :not(:focus))': { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .validator:user-invalid, .validator.validator-success:user-valid, .validate :invalid, .validate :valid, .validate:invalid, .validate:valid, .form-group-error *, .form-group-success *, .form-group-warning *, .form-group-info *, .form-control.error *, .form-control.success *, .form-control.warning *, .form-control.info *):not(:disabled)': { "@layer components": { color: "var(--dm-validation-color)", borderColor: "var(--dm-validation-color)", "--checkbox-color": "var(--dm-validation-color)", "--radio-color": "var(--dm-validation-color)", "--switch-color": "var(--dm-validation-color)", "--switch-content-color": "var(--dm-validation-content, var(--color-primary-content))", "--toggle-color": "var(--dm-validation-color)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .validator:user-invalid, .validator.validator-success:user-valid, .validate :invalid, .validate :valid, .validate:invalid, .validate:valid, .form-group-error *, .form-group-success *, .form-group-warning *, .form-group-info *, .form-control.error *, .form-control.success *, .form-control.warning *, .form-control.info *):not(:disabled):focus': { "@layer components": { borderColor: "var(--dm-validation-color)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--dm-validation-color) 20%, transparent)" } }, ":is(.form-group-error, .form-control.error) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-error)" } }, ":is(.form-group-success, .form-control.success) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-success)" } }, ":is(.form-group-warning, .form-control.warning) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-warning)" } }, ":is(.form-group-info, .form-control.info) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-info)" } }, ".validator-hint": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".validator-error": { "@layer components": { display: "none", fontSize: "0.75rem", color: "var(--color-error)" } }, ".otp-code ~ .validator-error": { "@layer components": { display: "block", visibility: "hidden" } }, ':is(.form-group, .form-control):has(:is([aria-invalid="true"], .validator:user-invalid, .validate :invalid, .validate:invalid):not(:disabled)) > .validator-error, \n :is(.form-group-error, .form-control.error) > .validator-error': { "@layer components": { display: "block", visibility: "visible" } }, ":is(input, select, textarea):is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):focus-visible": { "@layer components": { "@media (forced-colors: active)": { outline: "2px solid Highlight", outlineOffset: "2px" } } }, "input:is(.checkbox, .radio, .switch, .toggle)": { "@layer components": { "@media (forced-colors: active)": { appearance: "auto" } } }, "input:is(.checkbox, .radio, .switch, .toggle)::before, \n input:is(.checkbox, .radio, .switch, .toggle)::after": { "@layer components": { "@media (forced-colors: active)": { content: "none" } } }, ".file-input": { "@layer components": { display: "block", boxSizing: "border-box", width: "100%", minWidth: "0", padding: "0", font: "inherit", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer" } }, ".file-input::file-selector-button": { "@layer components": { padding: "0.75rem 1rem", marginInlineEnd: "0.75rem", font: "inherit", color: "inherit", backgroundColor: "var(--color-surface-container)", border: "none", borderInlineEnd: "1px solid currentColor", cursor: "inherit" } }, ".file-input:hover:not(:disabled)::file-selector-button": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".file-input:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".file-input:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".file-input-xs::file-selector-button": { "@layer components": { padding: "0.375rem 0.625rem" } }, ".file-input-sm::file-selector-button": { "@layer components": { padding: "0.5rem 0.75rem" } }, ".file-input-lg::file-selector-button": { "@layer components": { padding: "1rem 1.25rem" } }, ".file-input-primary": { "@layer components": { color: "var(--color-primary)" } }, ".file-input-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".file-input-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".file-input-info": { "@layer components": { color: "var(--color-info)" } }, ".file-input-success": { "@layer components": { color: "var(--color-success)" } }, ".file-input-warning": { "@layer components": { color: "var(--color-warning)" } }, ".file-input-error": { "@layer components": { color: "var(--color-error)" } }, ".file-input-ghost": { "@layer components": { borderColor: "transparent" } }, ".input": { "@layer components": { boxSizing: "border-box", minWidth: "0", display: "flex", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".input:focus": { "@layer components": { outline: "none" } }, ".input:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", outline: "none" } }, ".input:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".input-outlined": { "@layer components": { backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".input-bordered": { "@layer components": { borderColor: "var(--color-outline)", backgroundColor: "var(--color-surface)" } }, ".input-bordered:hover:not(:disabled):not(:focus)": { "@layer components": { borderColor: "var(--color-outline-variant)" } }, ".input-primary": { "@layer components": { color: "var(--color-primary)" } }, ".input-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".input-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".input-info": { "@layer components": { color: "var(--color-info)" } }, ".input-success": { "@layer components": { color: "var(--color-success)" } }, ".input-warning": { "@layer components": { color: "var(--color-warning)" } }, ".input-error": { "@layer components": { color: "var(--color-error)" } }, ".input-accent": { "@layer components": { color: "var(--color-accent)" } }, ".input-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".input-base": { "@layer components": { color: "var(--color-base-content)" } }, ".input-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", height: "1.75rem" } }, ".input-sm": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", height: "2.25rem" } }, ".input-lg": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", height: "3.5rem" } }, ".input-md": { "@layer components": { height: "3rem" } }, ".input-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".input-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".input-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".input-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".input-filled.input-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".input-filled.input-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".input-filled.input-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".input-filled.input-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".input-filled.input-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".input-filled.input-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".input-filled.input-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".input-filled.input-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".input-filled.input-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".input-filled.input-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".input-group": { "@layer components": { display: "flex", alignItems: "stretch" } }, ".input-group > .input": { "@layer components": { flex: 1, borderRadius: "0" } }, ".input-group > .input:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".input-group > .input:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".input-group-text": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", padding: "0 1rem", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", border: "1px solid var(--color-outline)" } }, ".input-group-text:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)", borderRight: "none" } }, ".input-group-text:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)", borderLeft: "none" } }, ".input, \n .input-filled, \n .file-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.checkbox)": { "@layer components": { boxSizing: "border-box" } }, ".checkbox": { "@layer components": { "--checkbox-size": "1.25rem", "--checkbox-color": "var(--color-primary)", "--checkbox-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--checkbox-size)", height: "var(--checkbox-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--checkbox-border-color)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }, ".checkbox::before": { "@layer components": { content: '""', width: "0.65em", height: "0.35em", transform: "scale(0) rotate(-45deg)", transformOrigin: "center", borderBottom: "2px solid var(--dm-validation-content, var(--color-primary-content))", borderLeft: "2px solid var(--dm-validation-content, var(--color-primary-content))", transition: "transform 150ms ease-in-out" } }, ".checkbox:checked": { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }, ".checkbox:checked::before": { "@layer components": { transform: "scale(1) rotate(-45deg)" } }, ".checkbox:indeterminate": { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }, ".checkbox:indeterminate::before": { "@layer components": { width: "0.5em", height: "0", borderBottom: "2px solid var(--dm-validation-content, var(--color-primary-content))", borderLeft: "0", transform: "scale(1) rotate(0deg)" } }, ".checkbox:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".checkbox:checked:hover:not(:disabled), \n .checkbox:indeterminate:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--checkbox-color), black 10%)", borderColor: "color-mix(in oklch, var(--checkbox-color), black 10%)" } }, ".checkbox:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--checkbox-color) 20%, transparent)" } }, ".checkbox:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".checkbox-xs": { "@layer components": { "--checkbox-size": "0.875rem" } }, ".checkbox-sm": { "@layer components": { "--checkbox-size": "1rem" } }, ".checkbox-md": { "@layer components": { "--checkbox-size": "1.25rem" } }, ".checkbox-lg": { "@layer components": { "--checkbox-size": "1.5rem" } }, ".checkbox-xl": { "@layer components": { "--checkbox-size": "1.75rem" } }, ".checkbox-primary": { "@layer components": { "--checkbox-color": "var(--color-primary)" } }, ".checkbox-primary:checked::before, \n .checkbox-primary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-primary-content))" } }, ".checkbox-secondary": { "@layer components": { "--checkbox-color": "var(--color-secondary)" } }, ".checkbox-secondary:checked::before, \n .checkbox-secondary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-secondary-content))" } }, ".checkbox-tertiary": { "@layer components": { "--checkbox-color": "var(--color-tertiary)" } }, ".checkbox-tertiary:checked::before, \n .checkbox-tertiary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-tertiary-content))" } }, ".checkbox-success": { "@layer components": { "--checkbox-color": "var(--color-success)" } }, ".checkbox-success:checked::before, \n .checkbox-success:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-success-content))" } }, ".checkbox-warning": { "@layer components": { "--checkbox-color": "var(--color-warning)" } }, ".checkbox-warning:checked::before, \n .checkbox-warning:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-warning-content))" } }, ".checkbox-error": { "@layer components": { "--checkbox-color": "var(--color-error)" } }, ".checkbox-error:checked::before, \n .checkbox-error:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-error-content))" } }, ".checkbox-info": { "@layer components": { "--checkbox-color": "var(--color-info)" } }, ".checkbox-info:checked::before, \n .checkbox-info:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-info-content))" } }, ".checkbox-accent": { "@layer components": { "--checkbox-color": "var(--color-accent)" } }, ".checkbox-accent:checked::before, \n .checkbox-accent:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-accent-content))" } }, ".checkbox-neutral": { "@layer components": { "--checkbox-color": "var(--color-neutral)" } }, ".checkbox-neutral:checked::before, \n .checkbox-neutral:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-neutral-content))" } }, ".checkbox-base": { "@layer components": { "--checkbox-color": "var(--color-base-100)" } }, ".checkbox-base:checked::before, \n .checkbox-base:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-base-content))" } }, ".checkbox-ghost": { "@layer components": { "--checkbox-border-color": "transparent" } }, ".checkbox-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".checkbox-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".checkbox-label:has(.checkbox:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".checkbox-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".checkbox-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".checkbox-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".checkbox, \n .checkbox::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.radio)": { "@layer components": { boxSizing: "border-box" } }, ".radio": { "@layer components": { "--radio-size": "1.25rem", "--radio-color": "var(--color-primary)", "--radio-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--radio-size)", height: "var(--radio-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--radio-border-color)", borderRadius: "var(--radius-full)", transition: "border-color 150ms ease-in-out" } }, ".radio::before": { "@layer components": { content: '""', width: "0.5em", height: "0.5em", borderRadius: "var(--radius-full)", backgroundColor: "var(--radio-color)", transform: "scale(0)", transition: "transform 150ms ease-in-out" } }, ".radio:checked": { "@layer components": { borderColor: "var(--radio-color)" } }, ".radio:checked::before": { "@layer components": { transform: "scale(1)" } }, ".radio:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".radio:checked:hover:not(:disabled)": { "@layer components": { borderColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio:checked:hover:not(:disabled)::before": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--radio-color) 20%, transparent)" } }, ".radio:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".radio-xs": { "@layer components": { "--radio-size": "0.875rem" } }, ".radio-sm": { "@layer components": { "--radio-size": "1rem" } }, ".radio-md": { "@layer components": { "--radio-size": "1.25rem" } }, ".radio-lg": { "@layer components": { "--radio-size": "1.5rem" } }, ".radio-xl": { "@layer components": { "--radio-size": "1.75rem" } }, ".radio-primary": { "@layer components": { "--radio-color": "var(--color-primary)" } }, ".radio-secondary": { "@layer components": { "--radio-color": "var(--color-secondary)" } }, ".radio-tertiary": { "@layer components": { "--radio-color": "var(--color-tertiary)" } }, ".radio-success": { "@layer components": { "--radio-color": "var(--color-success)" } }, ".radio-warning": { "@layer components": { "--radio-color": "var(--color-warning)" } }, ".radio-error": { "@layer components": { "--radio-color": "var(--color-error)" } }, ".radio-info": { "@layer components": { "--radio-color": "var(--color-info)" } }, ".radio-accent": { "@layer components": { "--radio-color": "var(--color-accent)" } }, ".radio-neutral": { "@layer components": { "--radio-color": "var(--color-neutral)" } }, ".radio-base": { "@layer components": { "--radio-color": "var(--color-base-content)" } }, ".radio-ghost": { "@layer components": { "--radio-border-color": "transparent" } }, ".radio-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".radio-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".radio-label:has(.radio:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".radio-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".radio-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".radio-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".radio, \n .radio::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".toggle": { "@layer components": { "--toggle-color": "var(--color-primary)", boxSizing: "border-box", color: "var(--color-on-surface)", border: "1px solid currentColor", appearance: "none", width: "3rem", height: "1.5rem", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface-container-highest)", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative" } }, ".toggle::after": { "@layer components": { content: "''", position: "absolute", insetInlineStart: "0.25rem", top: "50%", transform: "translateY(-50%)", width: "1rem", height: "1rem", backgroundColor: "var(--color-on-surface-variant)", borderRadius: "var(--radius-full)", transition: "all 150ms ease-in-out" } }, ".toggle:checked": { "@layer components": { backgroundColor: "var(--toggle-color)" } }, ".toggle:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1.25rem)", backgroundColor: "var(--dm-validation-content, var(--color-primary-content))" } }, ".toggle:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, ".toggle-xs": { "@layer components": { width: "2rem", height: "1rem" } }, ".toggle-xs::after": { "@layer components": { width: "0.625rem", height: "0.625rem", insetInlineStart: "0.1875rem" } }, ".toggle-xs:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 0.8125rem)" } }, ".toggle-sm": { "@layer components": { width: "2.5rem", height: "1.25rem" } }, ".toggle-sm::after": { "@layer components": { width: "0.75rem", height: "0.75rem" } }, ".toggle-lg": { "@layer components": { width: "4rem", height: "2rem" } }, ".toggle-lg::after": { "@layer components": { width: "1.5rem", height: "1.5rem" } }, ".toggle-sm:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1rem)" } }, ".toggle-lg:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1.75rem)" } }, ".toggle-primary": { "@layer components": { "--toggle-color": "var(--color-primary)" } }, ".toggle-secondary": { "@layer components": { "--toggle-color": "var(--color-secondary)" } }, ".toggle-tertiary": { "@layer components": { "--toggle-color": "var(--color-tertiary)" } }, ".toggle-info": { "@layer components": { "--toggle-color": "var(--color-info)" } }, ".toggle-success": { "@layer components": { "--toggle-color": "var(--color-success)" } }, ".toggle-warning": { "@layer components": { "--toggle-color": "var(--color-warning)" } }, ".toggle-error": { "@layer components": { "--toggle-color": "var(--color-error)" } }, ".toggle-ghost": { "@layer components": { borderColor: "transparent" } }, ".toggle, .toggle::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.select)": { "@layer components": { boxSizing: "border-box" } }, ".select": [{ "@layer components": { display: "block", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", cursor: "pointer", appearance: "none", backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: "right 0.75rem center", backgroundRepeat: "no-repeat", backgroundSize: "1.25rem 1.25rem", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".select:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".select:focus": { "@layer components": { outline: "none" } }, ".select:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".select:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".select-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".select-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".select-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".select-filled.select-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".select-filled.select-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".select-filled.select-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".select-filled.select-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".select-filled.select-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".select-filled.select-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".select-filled.select-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".select-filled.select-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".select-filled.select-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".select-filled.select-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".select-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".select-primary": { "@layer components": { color: "var(--color-primary)" } }, ".select-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".select-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".select-info": { "@layer components": { color: "var(--color-info)" } }, ".select-success": { "@layer components": { color: "var(--color-success)" } }, ".select-warning": { "@layer components": { color: "var(--color-warning)" } }, ".select-error": { "@layer components": { color: "var(--color-error)" } }, ".select-accent": { "@layer components": { color: "var(--color-accent)" } }, ".select-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".select-base": { "@layer components": { color: "var(--color-base-content)" } }, ".select-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".select-md": { "@layer components": { fontSize: "1rem" } }, ".select:dir(rtl)": { "@layer components": { paddingInline: "1rem 2.5rem", backgroundPosition: "left 0.75rem center" } }, ".select-xs": { "@layer components": { padding: "0.375rem 2rem 0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", backgroundSize: "1rem 1rem" } }, ".select-sm": { "@layer components": { padding: "0.5rem 2.25rem 0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", backgroundSize: "1.125rem 1.125rem" } }, ".select-lg": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", backgroundSize: "1.5rem 1.5rem", backgroundPosition: "right 1rem center" } }, ".select-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".select-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".select-helper": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".select-container-error .select-helper": { "@layer components": { color: "var(--color-error)" } }, ".select-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem" } }, ".select-multiple": { "@layer components": { padding: "0.5rem", height: "auto", minHeight: "6rem", backgroundImage: "none" } }, ".select-multiple option": { "@layer components": { padding: "0.5rem 0.75rem", borderRadius: "var(--radius-xs)" } }, ".select-multiple option:checked": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".select-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".select-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".select-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ":where(.textarea)": { "@layer components": { boxSizing: "border-box" } }, ".textarea-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".textarea-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".textarea-label-floating": { "@layer components": { position: "absolute", top: "0.75rem", left: "1rem", fontSize: "1rem", fontWeight: 400, color: "var(--color-on-surface-variant)", pointerEvents: "none", transition: "all 150ms ease-in-out", transformOrigin: "left top", zIndex: 1 } }, ".textarea:focus ~ .textarea-label-floating, \n .textarea:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "-0.5rem", left: "0.75rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "var(--color-surface)", padding: "0 0.25rem" } }, ".textarea-filled ~ .textarea-label-floating": { "@layer components": { backgroundColor: "transparent" } }, ".textarea-filled:focus ~ .textarea-label-floating, \n .textarea-filled:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "0.25rem", left: "0.75rem", backgroundColor: "transparent" } }, ".textarea-helper": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, ".textarea": { "@layer components": { display: "block", width: "100%", minHeight: "6rem", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", fontFamily: "inherit", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", resize: "vertical", fieldSizing: "content", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".textarea::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".textarea:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".textarea:focus": { "@layer components": { outline: "none" } }, ".textarea:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".textarea:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)", resize: "none" } }, ".textarea[readonly]": { "@layer components": { backgroundColor: "var(--color-surface-container)", cursor: "default" } }, ".textarea-full": { "@layer components": { width: "100%" } }, ".textarea-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".textarea-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".textarea-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".textarea-filled.textarea-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".textarea-filled.textarea-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".textarea-filled.textarea-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".textarea-filled.textarea-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".textarea-filled.textarea-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".textarea-filled.textarea-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".textarea-filled.textarea-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".textarea-filled.textarea-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".textarea-filled.textarea-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".textarea-filled.textarea-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".textarea-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".textarea-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".textarea-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".textarea-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".textarea-primary": { "@layer components": { color: "var(--color-primary)" } }, ".textarea-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".textarea-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".textarea-info": { "@layer components": { color: "var(--color-info)" } }, ".textarea-success": { "@layer components": { color: "var(--color-success)" } }, ".textarea-warning": { "@layer components": { color: "var(--color-warning)" } }, ".textarea-error": { "@layer components": { color: "var(--color-error)" } }, ".textarea-accent": { "@layer components": { color: "var(--color-accent)" } }, ".textarea-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".textarea-base": { "@layer components": { color: "var(--color-base-content)" } }, ".textarea-xs": { "@layer components": { minHeight: "3rem", padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".textarea-md": { "@layer components": { minHeight: "6rem" } }, ".textarea-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".textarea-sm": { "@layer components": { minHeight: "4rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)" } }, ".textarea-lg": { "@layer components": { minHeight: "8rem", padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)" } }, ".textarea-resize-none": { "@layer components": { resize: "none" } }, ".textarea-resize-vertical": { "@layer components": { resize: "vertical" } }, ".textarea-resize-horizontal": { "@layer components": { resize: "horizontal" } }, ".textarea-resize-both": { "@layer components": { resize: "both" } }, ".textarea-auto-resize, \n .textarea-autosize": { "@layer components": { resize: "none", overflow: "hidden", minHeight: "3rem", fieldSizing: "content" } }, ".textarea-counter": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", textAlign: "right" } }, ".textarea-counter-error, \n .textarea-counter-exceeded": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-helper": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-success .textarea-label": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-helper": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea, \n .textarea-label-floating": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".range": [{ "@layer components": { "--range-thumb-size": "1.25rem", appearance: "none", display: "block", boxSizing: "border-box", width: "100%", minWidth: "0", height: "var(--range-thumb-size)", margin: "0", color: "var(--color-on-surface)", accentColor: "currentColor", background: "transparent", cursor: "pointer" } }, { "@layer components": { "@media (forced-colors: active)": { appearance: "auto" } } }], ".range::-webkit-slider-runnable-track": { "@layer components": { height: "0.5rem", background: "var(--color-surface-container-highest)", borderRadius: "var(--radius-xs)" } }, ".range::-moz-range-track": { "@layer components": { height: "0.5rem", background: "var(--color-surface-container-highest)", borderRadius: "var(--radius-xs)" } }, ".range::-webkit-slider-thumb": { "@layer components": { appearance: "none", width: "var(--range-thumb-size)", height: "var(--range-thumb-size)", marginTop: "calc((0.5rem - var(--range-thumb-size)) / 2)", background: "currentColor", border: "1px solid currentColor", borderRadius: "var(--radius-full)" } }, ".range::-moz-range-thumb": { "@layer components": { width: "var(--range-thumb-size)", height: "var(--range-thumb-size)", background: "currentColor", border: "1px solid currentColor", borderRadius: "var(--radius-full)" } }, ".range:focus-visible": [{ "@layer components": { outline: "2px solid currentColor", outlineOffset: "3px" } }, { "@layer components": { "@media (forced-colors: active)": { outlineColor: "Highlight" } } }], ".range:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".range-xs": { "@layer components": { "--range-thumb-size": "0.875rem" } }, ".range-sm": { "@layer components": { "--range-thumb-size": "1rem" } }, ".range-lg": { "@layer components": { "--range-thumb-size": "1.5rem" } }, ".range-primary": { "@layer components": { color: "var(--color-primary)" } }, ".range-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".range-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".range-info": { "@layer components": { color: "var(--color-info)" } }, ".range-success": { "@layer components": { color: "var(--color-success)" } }, ".range-warning": { "@layer components": { color: "var(--color-warning)" } }, ".range-error": { "@layer components": { color: "var(--color-error)" } }, ".form-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".form-group-horizontal": [{ "@layer components": { flexDirection: "row", alignItems: "flex-start", gap: "1rem" } }, { "@layer components": { "@media (max-width: 640px)": { flexDirection: "column" } } }], ".form-group-horizontal .form-label": { "@layer components": { minWidth: "8rem", paddingTop: "0.75rem" } }, ".form-group-horizontal .form-control": { "@layer components": { flex: 1 } }, ".form-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".form-label-required::after": { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".form-label-optional::after": { "@layer components": { content: "' (optional)'", fontSize: "0.75rem", fontWeight: 400, color: "var(--color-on-surface-variant)" } }, ".form-label-sm": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem" } }, ".form-label-lg": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".form-control": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%", marginBottom: "1rem", color: "var(--color-on-surface)" } }, ".helper-text": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, ".helper-text-error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text-success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text-warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text-info": { "@layer components": { color: "var(--color-info)" } }, ".helper-text-icon": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem" } }, ".helper-text-icon svg, \n .helper-text-icon .icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".form-hint": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginBottom: "0.25rem" } }, ".fieldset": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem", padding: "1rem", margin: "0", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", backgroundColor: "transparent", minInlineSize: "0" } }, ".fieldset-legend": { "@layer components": { padding: "0 0.5rem", fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".fieldset-filled": { "@layer components": { backgroundColor: "var(--color-surface-container-lowest)", borderColor: "transparent" } }, ".fieldset-borderless": { "@layer components": { border: "none", padding: "0" } }, ".fieldset-card": { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "transparent", boxShadow: "var(--shadow-xs)", padding: "1.5rem" } }, ".form-row": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "1rem" } }, ".form-row > .form-group": [{ "@layer components": { flex: 1, minWidth: "200px" } }, { "@layer components": { "@media (max-width: 640px)": { minWidth: "0", flexBasis: "100%" } } }], ".form-grid": { "@layer components": { display: "grid", gap: "1rem" } }, ".form-grid-2": { "@layer components": { gridTemplateColumns: "repeat(2, 1fr)" } }, ".form-grid-3": { "@layer components": { gridTemplateColumns: "repeat(3, 1fr)" } }, ".form-grid-4": { "@layer components": { gridTemplateColumns: "repeat(4, 1fr)" } }, ".form-grid-2, \n .form-grid-3, \n .form-grid-4": { "@layer components": { "@media (max-width: 640px)": { gridTemplateColumns: "1fr" } } }, ".form-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", marginTop: "1rem" } }, ".form-actions-right": { "@layer components": { justifyContent: "flex-end" } }, ".form-actions-center": { "@layer components": { justifyContent: "center" } }, ".form-actions-between": { "@layer components": { justifyContent: "space-between" } }, ".form-divider": { "@layer components": { height: "1px", backgroundColor: "var(--color-outline-variant)", margin: "1rem 0" } }, ".form-divider-text": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", color: "var(--color-on-surface-variant)", fontSize: "0.75rem", textTransform: "uppercase" } }, ".form-divider-text::before, \n .form-divider-text::after": { "@layer components": { content: "''", flex: 1, height: "1px", backgroundColor: "var(--color-outline-variant)" } }, ".form-section": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem" } }, ".form-section-title": { "@layer components": { fontSize: "1rem", fontWeight: 600, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".form-section-description": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)", marginBottom: "1rem" } }, ".form-inline": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "flex-end", gap: "0.75rem" } }, ".form-inline .form-group": { "@layer components": { flex: "none", width: "auto" } }, ".form-counter": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", textAlign: "right", marginTop: "0.25rem" } }, ".form-counter-error": { "@layer components": { color: "var(--color-error)" } }, ".label": { "@layer components": { display: "flex", justifyContent: "space-between", alignItems: "center", padding: "0.25rem 0" } }, ".label-text": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", paddingBottom: "0.25rem" } }, ".label-text-alt": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, '.label-text.required::after, \n .form-label[aria-required="true"]::after': { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".helper-text.error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text.success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text.warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text.info": { "@layer components": { color: "var(--color-info)" } }, ".form-group-disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, ".form-group, .form-control": { "@layer components": { minInlineSize: "0" } }, ".navbar": { "@layer components": { display: "flex", alignItems: "center", width: "100%", minHeight: "4rem", padding: "0.5rem 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)" } }, ".navbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".navbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".navbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".navbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".navbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".navbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".navbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".navbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".navbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".navbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".navbar a": { "@layer components": { color: "inherit" } }, ".navbar-start": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-start", gap: "0.5rem" } }, ".navbar-center": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, gap: "0.5rem" } }, ".navbar-end": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-end", gap: "0.5rem" } }, ".menu": { "@layer components": { display: "flex", flexWrap: "wrap", listStyle: "none", margin: "0", padding: "0.5rem", gap: "0.25rem" } }, ".menu[popover]": { "@layer components": { display: "none", position: "absolute", inset: "auto", margin: "0.5rem", minWidth: "12rem", maxWidth: "calc(100vw - 1rem)", maxHeight: "calc(100dvh - 1rem)", overflow: "auto", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", positionArea: "bottom", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", opacity: 0, transform: "scale(0.95)", transition: `opacity 150ms ease-out,
150
+ var componentStyles = { ".btn": [{ "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", "--btn-text-color": "var(--color-on-surface)", display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", paddingInline: "var(--btn-p)", paddingBlock: "var(--btn-py)", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", textAlign: "center", textDecoration: "none", whiteSpace: "nowrap", verticalAlign: "middle", cursor: "pointer", userSelect: "none", border: "1px solid transparent", borderRadius: "var(--radius-sm)", transition: "all 150ms ease-in-out", backgroundColor: "var(--color-surface-container)", color: "var(--btn-text-color)" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".btn:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn:active": { "@layer components": { transform: "scale(0.98)" } }, ".btn:focus": { "@layer components": { outline: "none" } }, ".btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".btn:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, pointerEvents: "none" } }, ".btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".btn-primary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary), black 10%)", borderColor: "color-mix(in oklch, var(--color-primary), black 10%)", filter: "none" } }, ".btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".btn-secondary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary), black 10%)", borderColor: "color-mix(in oklch, var(--color-secondary), black 10%)", filter: "none" } }, ".btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".btn-tertiary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", borderColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", filter: "none" } }, ".btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".btn-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent), black 10%)", borderColor: "color-mix(in oklch, var(--color-accent), black 10%)", filter: "none" } }, ".btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".btn-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral), black 10%)", borderColor: "color-mix(in oklch, var(--color-neutral), black 10%)", filter: "none" } }, ".btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)", borderColor: "var(--color-base-100)" } }, ".btn-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-200)", filter: "none" } }, ".btn-info": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)", borderColor: "var(--color-info)" } }, ".btn-info:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-info), black 10%)", borderColor: "color-mix(in oklch, var(--color-info), black 10%)", filter: "none" } }, ".btn-success": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)", borderColor: "var(--color-success)" } }, ".btn-success:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-success), black 10%)", borderColor: "color-mix(in oklch, var(--color-success), black 10%)", filter: "none" } }, ".btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".btn-warning:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-warning), black 10%)", borderColor: "color-mix(in oklch, var(--color-warning), black 10%)", filter: "none" } }, ".btn-error": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)", borderColor: "var(--color-error)" } }, ".btn-error:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-error), black 10%)", borderColor: "color-mix(in oklch, var(--color-error), black 10%)", filter: "none" } }, ".btn-outline, \n .btn-outlined": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".btn-outline:hover, \n .btn-outlined:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-outline.btn-primary, \n .btn-outlined.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)", borderColor: "currentColor" } }, ".btn-outline.btn-primary:hover, \n .btn-outlined.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)" } }, ".btn-outline.btn-secondary, \n .btn-outlined.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)", borderColor: "currentColor" } }, ".btn-outline.btn-secondary:hover, \n .btn-outlined.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)" } }, ".btn-outline.btn-tertiary, \n .btn-outlined.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)", borderColor: "currentColor" } }, ".btn-outline.btn-tertiary:hover, \n .btn-outlined.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)" } }, ".btn-outline.btn-accent, \n .btn-outlined.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)", borderColor: "currentColor" } }, ".btn-outline.btn-accent:hover, \n .btn-outlined.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)" } }, ".btn-outline.btn-neutral, \n .btn-outlined.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)", borderColor: "currentColor" } }, ".btn-outline.btn-neutral:hover, \n .btn-outlined.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)" } }, ".btn-outline.btn-base, \n .btn-outlined.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", borderColor: "currentColor" } }, ".btn-outline.btn-base:hover, \n .btn-outlined.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)" } }, ".btn-outline.btn-info, \n .btn-outlined.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)", borderColor: "currentColor" } }, ".btn-outline.btn-info:hover, \n .btn-outlined.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)" } }, ".btn-outline.btn-success, \n .btn-outlined.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)", borderColor: "currentColor" } }, ".btn-outline.btn-success:hover, \n .btn-outlined.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)" } }, ".btn-outline.btn-warning, \n .btn-outlined.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)", borderColor: "currentColor" } }, ".btn-outline.btn-warning:hover, \n .btn-outlined.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)" } }, ".btn-outline.btn-error, \n .btn-outlined.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)", borderColor: "currentColor" } }, ".btn-outline.btn-error:hover, \n .btn-outlined.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)" } }, ".btn-ghost": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-ghost:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-ghost.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-ghost.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-ghost.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-ghost.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-ghost.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-ghost.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-ghost.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-ghost.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-ghost.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-ghost.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-ghost.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-ghost.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-ghost.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-ghost.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-ghost.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-ghost.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-ghost.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-ghost.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-ghost.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-ghost.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-text": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-text:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-text.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-text.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-text.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-text.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-text.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-text.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-text.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-text.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-text.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-text.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-text.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-text.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-text.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-text.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-text.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-text.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-text.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-text.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-text.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-text.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-tonal": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "transparent" } }, ".btn-tonal:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn-tonal.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-tonal.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-tonal.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-tonal.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-tonal.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-tonal.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-tonal.btn-info": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-tonal.btn-success": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-tonal.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-tonal.btn-error": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-xs": { "@layer components": { "--btn-p": "0.5rem", "--btn-py": "0.25rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)" } }, ".btn-sm": { "@layer components": { "--btn-p": "0.75rem", "--btn-py": "0.375rem", fontSize: "0.8125rem", lineHeight: "1.125rem", borderRadius: "var(--radius-xs)" } }, ".btn-md": { "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-sm)" } }, ".btn-lg": { "@layer components": { "--btn-p": "1.75rem", "--btn-py": "0.875rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "var(--radius-sm)" } }, ".btn-block": { "@layer components": { display: "flex", width: "100%" } }, ".btn-group": { "@layer components": { display: "inline-flex" } }, ".btn-group .btn": { "@layer components": { borderRadius: "0" } }, ".btn-group .btn:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".btn-group .btn:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".btn-group .btn:not(:first-child)": { "@layer components": { marginInlineStart: "-1px" } }, ".btn-loading": { "@layer components": { pointerEvents: "none", position: "relative", color: "transparent !important" } }, ".btn-loading::after": [{ "@layer components": { content: "''", position: "absolute", width: "1rem", height: "1rem", border: "2px solid var(--btn-text-color)", borderRightColor: "transparent", borderRadius: "var(--radius-full)", animation: "btn-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes btn-spin": { to: { transform: "rotate(360deg)" } }, ".btn-icon": { "@layer components": { padding: "0.75rem", width: "2.5rem", height: "2.5rem", borderRadius: "var(--radius-full)" } }, ".btn-icon-sm": { "@layer components": { padding: "0.5rem", width: "2rem", height: "2rem" } }, ".btn-icon-lg": { "@layer components": { padding: "1rem", width: "3rem", height: "3rem" } }, ".btn-circle": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".btn-square": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", aspectRatio: "1" } }, ".fab": [{ "@layer components": { "--fab-offset-block": "1rem", "--fab-offset-inline": "1rem", "--fab-gap": "0.75rem", "--fab-size": "3.5rem", position: "fixed", insetBlockEnd: "calc(var(--fab-offset-block) + env(safe-area-inset-bottom, 0px))", insetInlineEnd: "calc(var(--fab-offset-inline) + env(safe-area-inset-right, 0px))", zIndex: 40, display: "inline-flex", flexDirection: "column-reverse", alignItems: "flex-end", gap: "var(--fab-gap)", maxInlineSize: "calc(100dvw - 2 * var(--fab-offset-inline))" } }, { "@layer components": { "@media (max-width: 30rem)": { "--fab-offset-block": "0.75rem", "--fab-offset-inline": "0.75rem" } } }], ".fab-start": { "@layer components": { insetInlineStart: "calc(var(--fab-offset-inline) + env(safe-area-inset-left, 0px))", insetInlineEnd: "auto", alignItems: "flex-start" } }, ".fab-contained": { "@layer components": { position: "absolute" } }, ".fab-speed-dial": { "@layer components": { flexDirection: "column-reverse" } }, ".fab-trigger": { "@layer components": { minInlineSize: "var(--fab-size)", minBlockSize: "var(--fab-size)", padding: "0.875rem", borderRadius: "var(--radius-lg)", boxShadow: "var(--shadow-lg)" } }, ".fab-trigger:not(.fab-extended)": { "@layer components": { inlineSize: "var(--fab-size)", blockSize: "var(--fab-size)" } }, ".fab-extended": { "@layer components": { inlineSize: "auto", maxInlineSize: "100%", minBlockSize: "var(--fab-size)", paddingInline: "1.25rem", borderRadius: "var(--radius-lg)" } }, ".fab-actions": { "@layer components": { alignItems: "flex-end", flexDirection: "column-reverse", gap: "var(--fab-gap)", maxInlineSize: "min(22rem, calc(100dvw - 2rem))" } }, ".fab-start .fab-actions": { "@layer components": { alignItems: "flex-start" } }, ".fab-controlled > .fab-actions:not([popover])": { "@layer components": { display: "none" } }, ".fab-controlled.fab-open > .fab-actions:not([popover])": { "@layer components": { display: "flex" } }, ".fab-actions[popover]": [{ "@layer components": { display: "none", position: "fixed", insetBlockStart: "auto", insetBlockEnd: `calc(
151
+ var(--fab-offset-block, 1rem) + env(safe-area-inset-bottom, 0px) +
152
+ var(--fab-size, 3.5rem) + var(--fab-gap, 0.75rem)
153
+ )`, insetInlineStart: "auto", insetInlineEnd: "calc(var(--fab-offset-inline, 1rem) + env(safe-area-inset-right, 0px))", margin: "0", padding: "0", border: "0", overflow: "visible", color: "inherit", background: "transparent", opacity: 0, visibility: "hidden", pointerEvents: "none", transform: "translateY(0.5rem)", transition: `opacity 150ms ease-out,
151
154
  transform 150ms ease-out,
152
155
  overlay 150ms ease-out allow-discrete,
153
- display 150ms ease-out allow-discrete` } }, ".menu[popover]:popover-open": [{ "@layer components": { display: "flex", opacity: 1, transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".menu[popover]::backdrop": { "@layer components": { backgroundColor: "transparent" } }, ".menu-top[popover]": { "@layer components": { positionArea: "top" } }, ".menu-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".menu-left[popover]": { "@layer components": { positionArea: "left" } }, ".menu-right[popover]": { "@layer components": { positionArea: "right" } }, ".menu li": { "@layer components": { display: "flex", flexShrink: 0 } }, ".menu li > a, \n .menu li > button, \n .menu-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", textDecoration: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", whiteSpace: "nowrap" } }, ".menu li > a:hover, \n .menu li > button:hover, \n .menu-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".menu li > a:focus-visible, \n .menu li > button:focus-visible, \n .menu-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.menu li > a.active, \n .menu li > button.active, \n .menu-item.active, \n .menu li > a[aria-current="page"], \n .menu li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".menu li.disabled > a, \n .menu li.disabled > button, \n .menu-item:disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, ".menu-horizontal": { "@layer components": { flexDirection: "row" } }, ".menu-vertical": { "@layer components": { flexDirection: "column" } }, ".menu-vertical li": { "@layer components": { width: "100%" } }, ".menu-vertical li > a, \n .menu-vertical li > button, \n .menu-vertical .menu-item": { "@layer components": { width: "100%" } }, ".menu-compact li > a, \n .menu-compact li > button, \n .menu-compact .menu-item": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem" } }, ".menu-title": { "@layer components": { padding: "0.5rem 1rem", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".breadcrumbs": { "@layer components": { display: "flex", alignItems: "center", flexWrap: "wrap", gap: "0.5rem", padding: "0.5rem 0", listStyle: "none", margin: "0", fontSize: "0.875rem" } }, ".breadcrumbs li": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".breadcrumbs li::after": { "@layer components": { content: "'/'", color: "var(--color-on-surface-variant)", opacity: 0.5 } }, ".breadcrumbs li:last-child::after": { "@layer components": { display: "none" } }, ".breadcrumbs li > a": { "@layer components": { color: "var(--color-primary)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumbs li > a:hover": { "@layer components": { textDecoration: "underline" } }, ".breadcrumbs li:last-child": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".breadcrumb-item": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-item:hover": { "@layer components": { color: "var(--color-on-surface)" } }, ".breadcrumb-item-active": { "@layer components": { color: "var(--color-on-surface)", fontWeight: 500, pointerEvents: "none" } }, ".breadcrumb-link": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out", cursor: "pointer" } }, ".breadcrumb-link:hover": { "@layer components": { color: "var(--color-primary)", textDecoration: "underline" } }, ".breadcrumb-link:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", borderRadius: "var(--radius-xs)" } }, ".breadcrumb-separator": { "@layer components": { display: "inline-flex", alignItems: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem", userSelect: "none", opacity: 0.6 } }, ".breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-slash .breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-chevron .breadcrumb-separator::before": { "@layer components": { content: '"›"', fontSize: "1.125rem" } }, ".breadcrumbs-dot .breadcrumb-separator::before": { "@layer components": { content: '"•"' } }, ".breadcrumbs-arrow .breadcrumb-separator::before": { "@layer components": { content: '"→"' } }, ".breadcrumbs-pipe .breadcrumb-separator::before": { "@layer components": { content: '"|"' } }, ".breadcrumb-icon": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", flexShrink: 0 } }, ".breadcrumb-icon svg": { "@layer components": { width: "100%", height: "100%" } }, ".breadcrumb-home": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-home:hover": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumb-home-icon": { "@layer components": { width: "1.125rem", height: "1.125rem" } }, ".breadcrumb-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.25rem 0.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".breadcrumb-ellipsis::before": { "@layer components": { content: '"..."' } }, ".breadcrumb-ellipsis:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 8%, transparent)" } }, ".breadcrumbs-primary .breadcrumb-link:hover, \n .breadcrumbs-primary .breadcrumb-item-active": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumbs-secondary .breadcrumb-link:hover, \n .breadcrumbs-secondary .breadcrumb-item-active": { "@layer components": { color: "var(--color-secondary)" } }, ".breadcrumbs-tertiary .breadcrumb-link:hover, \n .breadcrumbs-tertiary .breadcrumb-item-active": { "@layer components": { color: "var(--color-tertiary)" } }, ".breadcrumbs-sm": { "@layer components": { fontSize: "0.75rem", gap: "0.375rem" } }, ".breadcrumbs-sm .breadcrumb-icon, \n .breadcrumbs-sm .breadcrumb-home-icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".breadcrumbs-lg": { "@layer components": { fontSize: "1rem", gap: "0.625rem" } }, ".breadcrumbs-lg .breadcrumb-icon, \n .breadcrumbs-lg .breadcrumb-home-icon": { "@layer components": { width: "1.25rem", height: "1.25rem" } }, ".breadcrumbs-contained": { "@layer components": { padding: "0.75rem 1rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)" } }, ".breadcrumbs-nowrap": { "@layer components": { flexWrap: "nowrap", overflowX: "auto" } }, ".breadcrumb-item-disabled": { "@layer components": { opacity: 1, pointerEvents: "none", cursor: "not-allowed" } }, ".tabs": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", borderBottom: "1px solid var(--color-outline)" } }, ".tab": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.75rem 1.25rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textDecoration: "none", backgroundColor: "transparent", border: "none", borderBottom: "2px solid transparent", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative", marginBottom: "-1px" } }, ".tab:hover": { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)" } }, ".tab:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tab.tab-active, \n .tab[aria-selected="true"]': { "@layer components": { color: "var(--color-primary)", borderBottomColor: "var(--color-primary)" } }, ".tab:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".tabs-boxed": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)", padding: "0.25rem", border: "none" } }, ".tabs-boxed .tab": { "@layer components": { borderRadius: "var(--radius-xs)", borderBottom: "none", marginBottom: "0" } }, '.tabs-boxed .tab.tab-active, \n .tabs-boxed .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-xs)" } }, ".tabs-lifted": { "@layer components": { border: "none" } }, ".tabs-lifted .tab": { "@layer components": { border: "1px solid transparent", borderBottom: "none", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0", marginBottom: "-1px" } }, '.tabs-lifted .tab.tab-active, \n .tabs-lifted .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "var(--color-outline)", borderBottomColor: "var(--color-surface)" } }, ".tab-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem" } }, ".tab-sm": { "@layer components": { padding: "0.5rem 0.875rem", fontSize: "0.8125rem" } }, ".tab-lg": { "@layer components": { padding: "1rem 1.5rem", fontSize: "1rem" } }, ".dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".dropdown-content": { "@layer components": { position: "absolute", zIndex: 50, minWidth: "12rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-lg)", opacity: 0, visibility: "hidden", transform: "translateY(-0.5rem)", transition: "all 150ms ease-in-out" } }, ".dropdown:hover .dropdown-content, \n .dropdown:focus-within .dropdown-content, \n .dropdown.dropdown-open .dropdown-content": { "@layer components": { opacity: 1, visibility: "visible", transform: "translateY(0)" } }, ".dropdown-end .dropdown-content": { "@layer components": { right: "0" } }, ".dropdown-top .dropdown-content": { "@layer components": { bottom: "100%", top: "auto", marginBottom: "0.25rem" } }, ".dropdown-left .dropdown-content": { "@layer components": { right: "100%", left: "auto", top: "0", marginRight: "0.25rem" } }, ".dropdown-right .dropdown-content": { "@layer components": { left: "100%", right: "auto", top: "0", marginLeft: "0.25rem" } }, ".pagination": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", listStyle: "none", margin: "0", padding: "0" } }, ".pagination-item, \n .pagination-prev, \n .pagination-next, \n .pagination li > a, \n .pagination li > button": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.25rem", minWidth: "2.5rem", height: "2.5rem", padding: "0 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 150ms ease-in-out", whiteSpace: "nowrap" } }, ".pagination-item:hover, \n .pagination-prev:hover, \n .pagination-next:hover, \n .pagination li > a:hover, \n .pagination li > button:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, '.pagination-item-active, \n .pagination-item-active-primary, \n .pagination li > a.active, \n .pagination li > button.active, \n .pagination li > a[aria-current="page"], \n .pagination li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".pagination-item-active-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)", borderColor: "var(--color-secondary)" } }, ".pagination-item-active-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)", borderColor: "var(--color-tertiary)" } }, ".pagination-item:focus-visible, \n .pagination-prev:focus-visible, \n .pagination-next:focus-visible, \n .pagination li > a:focus-visible, \n .pagination li > button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".pagination-item:disabled, \n .pagination-item-disabled, \n .pagination-prev:disabled, \n .pagination-next:disabled, \n .pagination li > a:disabled, \n .pagination li > button:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed", pointerEvents: "none" } }, ".pagination-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", minWidth: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)" } }, ".pagination-ellipsis::before": { "@layer components": { content: "'…'" } }, ".pagination-info": { "@layer components": { display: "flex", flexDirection: "row", alignItems: "center", gap: "0.5rem" } }, ".pagination-info-text": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input input": { "@layer components": { width: "3.5rem", padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".pagination-input input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)" } }, ".pagination-outlined .pagination-item, \n .pagination-outlined .pagination-prev, \n .pagination-outlined .pagination-next": { "@layer components": { border: "1px solid var(--color-outline)" } }, ".pagination-tonal .pagination-item-active, \n .pagination-tonal .pagination-item-active-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "var(--color-primary-container)" } }, ".pagination-sm .pagination-item, \n .pagination-sm .pagination-prev, \n .pagination-sm .pagination-next": { "@layer components": { minWidth: "2rem", height: "2rem", padding: "0 0.5rem", fontSize: "0.75rem" } }, ".pagination-lg .pagination-item, \n .pagination-lg .pagination-prev, \n .pagination-lg .pagination-next": { "@layer components": { minWidth: "3rem", height: "3rem", padding: "0 1rem", fontSize: "1rem" } }, ".pagination-compact": { "@layer components": { gap: "0" } }, ".pagination-compact .pagination-item, \n .pagination-compact .pagination-prev, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0" } }, ".pagination-compact .pagination-item:first-child, \n .pagination-compact .pagination-prev": { "@layer components": { borderRadius: "var(--radius-sm) 0 0 var(--radius-sm)" } }, ".pagination-compact .pagination-item:last-child, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0 var(--radius-sm) var(--radius-sm) 0" } }, ".pagination-responsive": { "@layer components": { flexWrap: "wrap", justifyContent: "center" } }, ".menu li > a, \n .menu li > button, \n .menu-item, \n .menu[popover], \n .pagination-item, \n .pagination-prev, \n .pagination-next": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".modal": [{ "@layer components": { position: "fixed", inset: "0", zIndex: 999, display: "flex", alignItems: "center", justifyContent: "center", padding: "1rem", visibility: "hidden", opacity: 0, transition: "visibility 200ms ease-out, opacity 200ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }], ".modal.modal-open, \n .modal:target": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-box": [{ "@layer components": { position: "relative", zIndex: 1, maxWidth: "32rem", maxHeight: "calc(100vh - 5rem)", padding: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-lg)", boxShadow: "var(--shadow-2xl)", overflowY: "auto", transform: "scale(0.95)", transition: "transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { maxWidth: "calc(100vw - 2rem)", margin: "1rem" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".modal.modal-open .modal-box, \n .modal:target .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-backdrop": { "@layer components": { position: "fixed", inset: "0", zIndex: -1, backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)", cursor: "pointer" } }, ".modal-backdrop::before": { "@layer components": { content: "''", position: "absolute", inset: "0" } }, ".modal-action": { "@layer components": { display: "flex", justifyContent: "flex-end", gap: "0.5rem", marginTop: "1.5rem", paddingTop: "1rem" } }, ".modal-toggle": { "@layer components": { position: "fixed", width: "0", height: "0", appearance: "none", opacity: 0 } }, ".modal-toggle:checked + .modal": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-toggle:checked + .modal .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-sm .modal-box": { "@layer components": { maxWidth: "20rem" } }, ".modal-lg .modal-box": { "@layer components": { maxWidth: "48rem" } }, ".modal-full .modal-box": { "@layer components": { maxWidth: "calc(100vw - 2rem)", maxHeight: "calc(100vh - 2rem)", width: "100%", height: "100%" } }, ".modal-top": { "@layer components": { alignItems: "flex-start", paddingTop: "2rem" } }, ".modal-bottom": { "@layer components": { alignItems: "flex-end", paddingBottom: "2rem" } }, ".modal-middle": { "@layer components": { alignItems: "center" } }, ".modal-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".modal-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".modal-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".modal-header": { "@layer components": { marginBottom: "1rem", paddingRight: "2rem" } }, ".modal-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, color: "var(--color-on-surface)", margin: "0" } }, ".modal-body": { "@layer components": { color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".modal-responsive": { "@layer components": { "@media (max-width: 640px)": { alignItems: "flex-end", padding: "0" } } }, ".modal-responsive .modal-box": { "@layer components": { "@media (max-width: 640px)": { maxWidth: "100%", maxHeight: "90vh", margin: "0", borderRadius: "var(--radius-lg) var(--radius-lg) 0 0" } } }, ".drawer-modal": { "@layer components": { alignItems: "stretch", justifyContent: "flex-end", padding: "0" } }, ".drawer-modal .modal-box": { "@layer components": { maxWidth: "20rem", maxHeight: "100vh", height: "100%", margin: "0", borderRadius: "0", transform: "translateX(100%)" } }, ".drawer-modal.modal-open .modal-box, \n .drawer-modal:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".drawer-modal-left": { "@layer components": { justifyContent: "flex-start" } }, ".drawer-modal-left .modal-box": { "@layer components": { transform: "translateX(-100%)" } }, ".drawer-modal-left.modal-open .modal-box, \n .drawer-modal-left:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".alert-dialog": { "@layer components": { textAlign: "center" } }, ".alert-dialog .modal-box": { "@layer components": { maxWidth: "24rem" } }, ".alert-dialog .modal-icon": { "@layer components": { width: "4rem", height: "4rem", margin: "0 auto 1rem", display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "var(--radius-full)", fontSize: "2rem" } }, ".alert-dialog .modal-icon.info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".alert-dialog .modal-icon.success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".alert-dialog .modal-icon.warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".alert-dialog .modal-icon.error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".alert-dialog .modal-action": { "@layer components": { justifyContent: "center" } }, ".modal-focus-trap": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, ".avatar": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", position: "relative", width: "3rem", height: "3rem", borderRadius: "var(--radius-full)", overflow: "visible", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", fontWeight: 500, flexShrink: 0 } }, ".avatar img": { "@layer components": { width: "100%", height: "100%", objectFit: "cover", borderRadius: "inherit" } }, ".avatar-placeholder": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", fontSize: "inherit", borderRadius: "inherit", overflow: "hidden", textTransform: "uppercase" } }, ".avatar-xs": { "@layer components": { width: "1.5rem", height: "1.5rem", fontSize: "0.625rem" } }, ".avatar-sm": { "@layer components": { width: "2rem", height: "2rem", fontSize: "0.75rem" } }, ".avatar-md": { "@layer components": { width: "3rem", height: "3rem", fontSize: "1rem" } }, ".avatar-lg": { "@layer components": { width: "4rem", height: "4rem", fontSize: "1.5rem" } }, ".avatar-xl": { "@layer components": { width: "6rem", height: "6rem", fontSize: "2rem" } }, ".avatar-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".avatar-square": { "@layer components": { borderRadius: "0" } }, ".avatar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".avatar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".avatar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".avatar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".avatar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".avatar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".avatar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".avatar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".avatar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".avatar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".avatar-ring": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".avatar-ring-primary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-primary)" } }, ".avatar-ring-secondary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-secondary)" } }, ".avatar-ring-tertiary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-tertiary)" } }, ".avatar-online::after, \n .avatar-offline::after, \n .avatar-status-online::after, \n .avatar-status-offline::after, \n .avatar-status-busy::after, \n .avatar-status-away::after": { "@layer components": { content: "''", position: "absolute", insetBlockEnd: "0", insetInlineEnd: "0", width: "25%", height: "25%", minWidth: "0.5rem", minHeight: "0.5rem", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".avatar-online::after, \n .avatar-status-online::after": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".avatar-offline::after, \n .avatar-status-offline::after": { "@layer components": { backgroundColor: "var(--color-outline)" } }, ".avatar-status-busy::after": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".avatar-status-away::after": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".avatar-group": { "@layer components": { display: "flex", flexDirection: "row-reverse", justifyContent: "flex-end" } }, ".avatar-group .avatar": { "@layer components": { border: "2px solid var(--color-surface)", marginInlineStart: "-0.75rem" } }, ".avatar-group .avatar:last-child": { "@layer components": { marginInlineStart: "0" } }, ".avatar-group-sm .avatar": { "@layer components": { marginInlineStart: "-0.5rem" } }, ".avatar-group-lg .avatar": { "@layer components": { marginInlineStart: "-1rem" } }, ".avatar-image": { "@layer components": { inlineSize: "100%", blockSize: "100%", borderRadius: "inherit", overflow: "hidden" } }, ".avatar-icon": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", inlineSize: "100%", blockSize: "100%" } }, ".avatar-circle": { "@layer components": { borderRadius: "var(--radius-full)" } }, ".avatar-bordered": { "@layer components": { border: "2px solid currentColor" } }, ".avatar-clickable": { "@layer components": { cursor: "pointer" } }, ".avatar-overflow": { "@layer components": { fontSize: "0.875rem" } }, ".avatar-group-dense > .avatar": { "@layer components": { marginInlineStart: "-1rem" } }, ".avatar-group-xs > .avatar": { "@layer components": { inlineSize: "1.5rem", blockSize: "1.5rem", fontSize: "0.625rem" } }, ".avatar-group-xl > .avatar": { "@layer components": { inlineSize: "6rem", blockSize: "6rem", fontSize: "2rem" } }, ".avatar-group-dense > .avatar:last-child": { "@layer components": { marginInlineStart: "0" } }, ".avatar:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".badge": { "@layer components": { boxSizing: "border-box", display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.125rem 0.5rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "normal", maxInlineSize: "100%", overflowWrap: "anywhere", minInlineSize: "0", borderRadius: "var(--radius-full)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".badge-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".badge-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".badge-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".badge-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".badge-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".badge-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".badge-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".badge-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".badge-outlined, \n .badge-outlined-secondary, \n .badge-outlined-tertiary, \n .badge-outline": { "@layer components": { backgroundColor: "transparent", border: "1px solid currentColor" } }, ".badge-outlined, \n .badge-outlined.badge-primary, \n .badge-outline.badge-primary": { "@layer components": { color: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".badge-outlined.badge-secondary, \n .badge-outlined-secondary, \n .badge-outline.badge-secondary": { "@layer components": { color: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".badge-outlined.badge-tertiary, \n .badge-outlined-tertiary, \n .badge-outline.badge-tertiary": { "@layer components": { color: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".badge-outlined.badge-accent, \n .badge-outline.badge-accent": { "@layer components": { color: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".badge-outlined.badge-neutral, \n .badge-outline.badge-neutral": { "@layer components": { color: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".badge-outlined.badge-base, \n .badge-outline.badge-base": { "@layer components": { color: "var(--color-base-content)", borderColor: "var(--color-base-content)" } }, ".badge-outlined.badge-info, \n .badge-outline.badge-info": { "@layer components": { color: "var(--color-info)", borderColor: "var(--color-info)" } }, ".badge-outlined.badge-success, \n .badge-outline.badge-success": { "@layer components": { color: "var(--color-success)", borderColor: "var(--color-success)" } }, ".badge-outlined.badge-warning, \n .badge-outline.badge-warning": { "@layer components": { color: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".badge-outlined.badge-error, \n .badge-outline.badge-error": { "@layer components": { color: "var(--color-error)", borderColor: "var(--color-error)" } }, ".badge-tonal, \n .badge-soft": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-primary, \n .badge-soft.badge-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-secondary, \n .badge-tonal-secondary, \n .badge-soft.badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".badge-tonal.badge-tertiary, \n .badge-tonal-tertiary, \n .badge-soft.badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".badge-tonal.badge-accent, \n .badge-soft.badge-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-neutral, \n .badge-soft.badge-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-base, \n .badge-soft.badge-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".badge-tonal.badge-info, \n .badge-soft.badge-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".badge-tonal.badge-success, \n .badge-soft.badge-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".badge-tonal.badge-warning, \n .badge-soft.badge-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".badge-tonal.badge-error, \n .badge-soft.badge-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".badge-sm": { "@layer components": { padding: "0 0.375rem", fontSize: "0.625rem", lineHeight: "0.875rem" } }, ".badge-lg": { "@layer components": { padding: "0.25rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".badge-indicator": { "@layer components": { position: "relative", paddingInlineStart: "1rem" } }, ".badge-indicator::before": { "@layer components": { content: "''", position: "absolute", insetInlineStart: "0.375rem", top: "50%", transform: "translateY(-50%)", width: "0.375rem", height: "0.375rem", borderRadius: "var(--radius-full)", backgroundColor: "currentColor" } }, ".badge-filled": { "@layer components": { fontWeight: 500 } }, ".badge-md": { "@layer components": { padding: "0.125rem 0.5rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".badge-notification": { "@layer components": { position: "absolute", insetBlockStart: "0", insetInlineEnd: "0", transform: "translate(50%, -50%)" } }, ".badge-notification:dir(rtl)": { "@layer components": { transform: "translate(-50%, -50%)" } }, ".badge-removable": { "@layer components": { gap: "0.25rem" } }, ".badge-removable > button": { "@layer components": { display: "inline-flex", padding: "0", border: "0", color: "inherit", background: "transparent", cursor: "pointer" } }, ".badge-removable > button:focus-visible": { "@layer components": { outline: "2px solid currentColor", outlineOffset: "2px" } }, ".badge-dot": { "@layer components": { width: "0.5rem", height: "0.5rem", padding: "0", borderRadius: "var(--radius-full)" } }, ".chat-scroll": [{ "@layer components": { "--chat-scroll-indicator-size": "0.875rem", "--chat-scroll-indicator-active-size": "1.125rem", "--chat-scroll-indicator-thickness": "0.1875rem", "--chat-scroll-indicator-gap": "0.3125rem", "--chat-scroll-indicator-hover-scale": "1.55", "--chat-scroll-indicator-neighbor-scale": "1.22", containerType: "size", containerName: "chat-scroll", display: "grid", gridTemplateColumns: "auto minmax(0, 1fr)", columnGap: "0.75rem", alignItems: "start", minHeight: "0", overflowX: "hidden", overflowY: "auto", scrollBehavior: "smooth", overscrollBehaviorY: "contain", timelineScope: `--chat-1,
156
+ display 150ms ease-out allow-discrete` } }, { "@layer components": { "@supports (position-area: top)": { inset: "auto", margin: "var(--fab-gap, 0.75rem)", positionArea: "top span-left", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none", transform: "none" } } }], ".fab-start > .fab-actions[popover]": [{ "@layer components": { insetInlineStart: "calc(var(--fab-offset-inline, 1rem) + env(safe-area-inset-left, 0px))", insetInlineEnd: "auto" } }, { "@layer components": { "@supports (position-area: top)": { inset: "auto", positionArea: "top span-right" } } }], ".fab-actions[popover]:popover-open": [{ "@layer components": { display: "flex", opacity: 1, visibility: "visible", pointerEvents: "auto", transform: "translateY(0)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "translateY(0.5rem)" } } }], ".fab-action": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "flex-end", gap: "0.5rem", maxInlineSize: "100%" } }, ".fab-start .fab-action": { "@layer components": { flexDirection: "row-reverse" } }, ".fab-label": { "@layer components": { maxInlineSize: "min(16rem, calc(100dvw - 6rem))", padding: "0.375rem 0.625rem", overflowWrap: "anywhere", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container-high)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-sm)", fontSize: "0.8125rem", fontWeight: 500, lineHeight: "1.125rem" } }, ".swap": { "@layer components": { position: "relative", display: "inline-grid", placeItems: "center", verticalAlign: "middle", cursor: "pointer", userSelect: "none" } }, ".swap-input": { "@layer components": { position: "absolute", inset: "0", zIndex: 1, width: "100%", height: "100%", margin: "0", opacity: 0, cursor: "pointer" } }, ".swap-on, \n .swap-off": { "@layer components": { gridArea: "1 / 1", display: "inline-flex", alignItems: "center", justifyContent: "center", inlineSize: "max-content", maxInlineSize: "100%", transition: "opacity 150ms ease-out, transform 150ms ease-out" } }, ".swap-on": { "@layer components": { opacity: 0, visibility: "hidden", pointerEvents: "none" } }, ".swap-off": { "@layer components": { opacity: 1, visibility: "visible", pointerEvents: "none" } }, '.swap-input:checked ~ .swap-on, \n .swap[aria-pressed="true"] > .swap-on': { "@layer components": { opacity: 1, visibility: "visible" } }, '.swap-input:checked ~ .swap-off, \n .swap[aria-pressed="true"] > .swap-off': { "@layer components": { opacity: 0, visibility: "hidden" } }, ".swap:focus-visible, \n .swap:has(.swap-input:focus-visible)": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", borderRadius: "var(--radius-sm)" } }, ".swap:disabled, \n .swap:has(.swap-input:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, ".swap-input:disabled": { "@layer components": { cursor: "not-allowed" } }, ".swap-rotate .swap-on": { "@layer components": { transform: "rotate(-90deg) scale(0.8)" } }, ".swap-rotate .swap-off": { "@layer components": { transform: "rotate(0deg) scale(1)" } }, '.swap-rotate .swap-input:checked ~ .swap-on, \n .swap-rotate[aria-pressed="true"] > .swap-on': { "@layer components": { transform: "rotate(0deg) scale(1)" } }, '.swap-rotate .swap-input:checked ~ .swap-off, \n .swap-rotate[aria-pressed="true"] > .swap-off': { "@layer components": { transform: "rotate(90deg) scale(0.8)" } }, ".swap.swap-active > .swap-on": { "@layer components": { opacity: 1, visibility: "visible", transform: "rotate(0deg) scale(1)" } }, ".swap.swap-active > .swap-off": { "@layer components": { opacity: 0, visibility: "hidden", transform: "rotate(90deg) scale(0.8)" } }, ".swap-on, \n .swap-off": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".card": [{ "@layer components": { display: "flex", flexDirection: "column", position: "relative", overflow: "hidden", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)", transition: "box-shadow 150ms ease-in-out, transform 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".card:hover": { "@layer components": { boxShadow: "var(--shadow-md)" } }, ".card figure, \n .card-image": { "@layer components": { overflow: "hidden" } }, ".card figure img, \n .card-image img": { "@layer components": { width: "100%", height: "auto", objectFit: "cover" } }, ".card-body": { "@layer components": { minInlineSize: "0", overflowWrap: "anywhere", "--card-p": "1.5rem", display: "flex", flexDirection: "column", gap: "0.5rem", padding: "var(--card-p)", flex: 1 } }, ".card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockEnd: "1px solid var(--color-outline-variant)" } }, ".card-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockStart: "1px solid var(--color-outline-variant)", marginBlockStart: "auto" } }, ".card-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", color: "var(--color-on-surface)" } }, ".card-actions": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "center", gap: "0.5rem", marginBlockStart: "auto", paddingBlockStart: "0.5rem" } }, ".card-actions.justify-end": { "@layer components": { justifyContent: "flex-end" } }, ".card-actions.justify-start": { "@layer components": { justifyContent: "flex-start" } }, ".card-actions.justify-center": { "@layer components": { justifyContent: "center" } }, ".card-bordered": { "@layer components": { border: "1px solid var(--color-outline)", boxShadow: "none" } }, ".card-outlined": { "@layer components": { border: "1px solid var(--color-outline)", boxShadow: "none" } }, ".card-outlined:hover": { "@layer components": { boxShadow: "none" } }, ".card-filled": { "@layer components": { background: "var(--color-surface-container-highest)", boxShadow: "none" } }, ".card-lowest": { "@layer components": { background: "var(--color-surface-container-lowest)", boxShadow: "none" } }, ".card-low": { "@layer components": { background: "var(--color-surface-container-low)", boxShadow: "var(--shadow-sm)" } }, ".card-default": { "@layer components": { background: "var(--color-surface-container)", boxShadow: "var(--shadow-md)" } }, ".card-high": { "@layer components": { background: "var(--color-surface-container-high)", boxShadow: "var(--shadow-lg)" } }, ".card-highest": { "@layer components": { background: "var(--color-surface-container-highest)", boxShadow: "var(--shadow-xl)" } }, ".card-subtitle": { "@layer components": { color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".card-comfortable .card-body": { "@layer components": { "--card-p": "2rem" } }, ".card-bordered:hover": { "@layer components": { boxShadow: "none", borderColor: "var(--color-outline-variant)" } }, ".card-compact .card-header, \n .card-compact .card-body, \n .card-compact .card-footer": { "@layer components": { "--card-p": "1rem" } }, ".card-compact .card-title": { "@layer components": { fontSize: "1rem" } }, ".card-side": { "@layer components": { flexDirection: "row" } }, ".card-side figure, \n .card-side .card-image": { "@layer components": { width: "40%", flexShrink: 0 } }, ".card-side figure img, \n .card-side .card-image img": { "@layer components": { height: "100%", objectFit: "cover" } }, ".card-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".card-primary .card-title": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".card-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".card-secondary .card-title": { "@layer components": { color: "var(--color-on-secondary-container)" } }, ".card-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".card-tertiary .card-title": { "@layer components": { color: "var(--color-on-tertiary-container)" } }, ".card-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".card-info .card-title": { "@layer components": { color: "var(--color-on-info-container)" } }, ".card-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".card-success .card-title": { "@layer components": { color: "var(--color-on-success-container)" } }, ".card-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".card-warning .card-title": { "@layer components": { color: "var(--color-on-warning-container)" } }, ".card-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".card-error .card-title": { "@layer components": { color: "var(--color-on-error-container)" } }, ".card-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-accent .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-neutral .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".card-base .card-title": { "@layer components": { color: "var(--color-base-content)" } }, ".card-glass": { "@layer components": { backgroundColor: "rgb(255 255 255 / 0.1)", backdropFilter: "blur(12px)", border: "1px solid rgb(255 255 255 / 0.2)" } }, ".card-elevated": { "@layer components": { boxShadow: "var(--shadow-lg)" } }, ".card-elevated:hover": { "@layer components": { boxShadow: "var(--shadow-xl)", transform: "translateY(-2px)" } }, ".card-interactive": { "@layer components": { cursor: "pointer" } }, ".card-interactive:active": { "@layer components": { transform: "scale(0.99)" } }, ".card-interactive:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".card-full-image": { "@layer components": { position: "relative" } }, ".card-full-image figure, \n .card-full-image .card-image": { "@layer components": { position: "absolute", inset: "0", zIndex: 0 } }, ".card-full-image .card-body": { "@layer components": { position: "relative", zIndex: 1, background: "linear-gradient(to top, color-mix(in srgb, var(--color-shadow) 70%, transparent), transparent)", color: "white", marginTop: "auto", minHeight: "50%" } }, ".card-full-image .card-title": { "@layer components": { color: "white" } }, ":is(.form-group-info, .form-control.info)": { "@layer components": { "--dm-validation-color": "var(--color-info)" } }, ":is(.form-group-warning, .form-control.warning)": { "@layer components": { "--dm-validation-color": "var(--color-warning)" } }, ":is(.form-group-success, .form-control.success)": { "@layer components": { "--dm-validation-color": "var(--color-success)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is(.validate :valid, .validate:valid, .validator.validator-success:user-valid):not([aria-invalid="true"]):not(:where(.form-group-error *, .form-control.error *)):not(:disabled)': { "@layer components": { "--dm-validation-color": "var(--color-success)", "--dm-validation-content": "var(--color-success-content)" } }, ":is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is(.validate :invalid, .validate:invalid, .validator:user-invalid):not(:disabled)": { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ":is(.form-group-error, .form-control.error)": { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .form-group-error *, .form-control.error *):not(:disabled):is(:focus, :not(:focus))': { "@layer components": { "--dm-validation-color": "var(--color-error)", "--dm-validation-content": "var(--color-error-content)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .validator:user-invalid, .validator.validator-success:user-valid, .validate :invalid, .validate :valid, .validate:invalid, .validate:valid, .form-group-error *, .form-group-success *, .form-group-warning *, .form-group-info *, .form-control.error *, .form-control.success *, .form-control.warning *, .form-control.info *):not(:disabled)': { "@layer components": { color: "var(--dm-validation-color)", borderColor: "var(--dm-validation-color)", "--checkbox-color": "var(--dm-validation-color)", "--radio-color": "var(--dm-validation-color)", "--switch-color": "var(--dm-validation-color)", "--switch-content-color": "var(--dm-validation-content, var(--color-primary-content))", "--toggle-color": "var(--dm-validation-color)" } }, ':is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):is([aria-invalid="true"], .validator:user-invalid, .validator.validator-success:user-valid, .validate :invalid, .validate :valid, .validate:invalid, .validate:valid, .form-group-error *, .form-group-success *, .form-group-warning *, .form-group-info *, .form-control.error *, .form-control.success *, .form-control.warning *, .form-control.info *):not(:disabled):focus': { "@layer components": { borderColor: "var(--dm-validation-color)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--dm-validation-color) 20%, transparent)" } }, ":is(.form-group-error, .form-control.error) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-error)" } }, ":is(.form-group-success, .form-control.success) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-success)" } }, ":is(.form-group-warning, .form-control.warning) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-warning)" } }, ":is(.form-group-info, .form-control.info) :is(.form-label, .label-text)": { "@layer components": { color: "var(--color-info)" } }, ".validator-hint": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".validator-error": { "@layer components": { display: "none", fontSize: "0.75rem", color: "var(--color-error)" } }, ".otp-code ~ .validator-error": { "@layer components": { display: "block", visibility: "hidden" } }, ':is(.form-group, .form-control):has(:is([aria-invalid="true"], .validator:user-invalid, .validate :invalid, .validate:invalid):not(:disabled)) > .validator-error, \n :is(.form-group-error, .form-control.error) > .validator-error': { "@layer components": { display: "block", visibility: "visible" } }, ":is(input, select, textarea):is(.input, .select, .textarea, .checkbox, .radio, .switch, .toggle, .file-input, .otp-input-field, .otp-code, .datepicker-input):focus-visible": { "@layer components": { "@media (forced-colors: active)": { outline: "2px solid Highlight", outlineOffset: "2px" } } }, "input:is(.checkbox, .radio, .switch, .toggle)": { "@layer components": { "@media (forced-colors: active)": { appearance: "auto" } } }, "input:is(.checkbox, .radio, .switch, .toggle)::before, \n input:is(.checkbox, .radio, .switch, .toggle)::after": { "@layer components": { "@media (forced-colors: active)": { content: "none" } } }, ".file-input": { "@layer components": { display: "block", boxSizing: "border-box", width: "100%", minWidth: "0", padding: "0", font: "inherit", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer" } }, ".file-input::file-selector-button": { "@layer components": { padding: "0.75rem 1rem", marginInlineEnd: "0.75rem", font: "inherit", color: "inherit", backgroundColor: "var(--color-surface-container)", border: "none", borderInlineEnd: "1px solid currentColor", cursor: "inherit" } }, ".file-input:hover:not(:disabled)::file-selector-button": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".file-input:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".file-input:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".file-input-xs::file-selector-button": { "@layer components": { padding: "0.375rem 0.625rem" } }, ".file-input-sm::file-selector-button": { "@layer components": { padding: "0.5rem 0.75rem" } }, ".file-input-lg::file-selector-button": { "@layer components": { padding: "1rem 1.25rem" } }, ".file-input-primary": { "@layer components": { color: "var(--color-primary)" } }, ".file-input-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".file-input-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".file-input-info": { "@layer components": { color: "var(--color-info)" } }, ".file-input-success": { "@layer components": { color: "var(--color-success)" } }, ".file-input-warning": { "@layer components": { color: "var(--color-warning)" } }, ".file-input-error": { "@layer components": { color: "var(--color-error)" } }, ".file-input-ghost": { "@layer components": { borderColor: "transparent" } }, ".input": { "@layer components": { boxSizing: "border-box", minWidth: "0", display: "flex", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".input:focus": { "@layer components": { outline: "none" } }, ".input:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", outline: "none" } }, ".input:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".input-outlined": { "@layer components": { backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".input-bordered": { "@layer components": { borderColor: "var(--color-outline)", backgroundColor: "var(--color-surface)" } }, ".input-bordered:hover:not(:disabled):not(:focus)": { "@layer components": { borderColor: "var(--color-outline-variant)" } }, ".input-primary": { "@layer components": { color: "var(--color-primary)" } }, ".input-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".input-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".input-info": { "@layer components": { color: "var(--color-info)" } }, ".input-success": { "@layer components": { color: "var(--color-success)" } }, ".input-warning": { "@layer components": { color: "var(--color-warning)" } }, ".input-error": { "@layer components": { color: "var(--color-error)" } }, ".input-accent": { "@layer components": { color: "var(--color-accent)" } }, ".input-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".input-base": { "@layer components": { color: "var(--color-base-content)" } }, ".input-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", height: "1.75rem" } }, ".input-sm": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", height: "2.25rem" } }, ".input-lg": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", height: "3.5rem" } }, ".input-md": { "@layer components": { height: "3rem" } }, ".input-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".input-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".input-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".input-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".input-filled.input-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".input-filled.input-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".input-filled.input-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".input-filled.input-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".input-filled.input-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".input-filled.input-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".input-filled.input-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".input-filled.input-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".input-filled.input-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".input-filled.input-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".input-group": { "@layer components": { display: "flex", alignItems: "stretch" } }, ".input-group > .input": { "@layer components": { flex: 1, borderRadius: "0" } }, ".input-group > .input:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".input-group > .input:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".input-group-text": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", padding: "0 1rem", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", border: "1px solid var(--color-outline)" } }, ".input-group-text:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)", borderRight: "none" } }, ".input-group-text:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)", borderLeft: "none" } }, ".input, \n .input-filled, \n .file-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.checkbox)": { "@layer components": { boxSizing: "border-box" } }, ".checkbox": { "@layer components": { "--checkbox-size": "1.25rem", "--checkbox-color": "var(--color-primary)", "--checkbox-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--checkbox-size)", height: "var(--checkbox-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--checkbox-border-color)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }, ".checkbox::before": { "@layer components": { content: '""', width: "0.65em", height: "0.35em", transform: "scale(0) rotate(-45deg)", transformOrigin: "center", borderBottom: "2px solid var(--dm-validation-content, var(--color-primary-content))", borderLeft: "2px solid var(--dm-validation-content, var(--color-primary-content))", transition: "transform 150ms ease-in-out" } }, ".checkbox:checked": { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }, ".checkbox:checked::before": { "@layer components": { transform: "scale(1) rotate(-45deg)" } }, ".checkbox:indeterminate": { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }, ".checkbox:indeterminate::before": { "@layer components": { width: "0.5em", height: "0", borderBottom: "2px solid var(--dm-validation-content, var(--color-primary-content))", borderLeft: "0", transform: "scale(1) rotate(0deg)" } }, ".checkbox:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".checkbox:checked:hover:not(:disabled), \n .checkbox:indeterminate:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--checkbox-color), black 10%)", borderColor: "color-mix(in oklch, var(--checkbox-color), black 10%)" } }, ".checkbox:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--checkbox-color) 20%, transparent)" } }, ".checkbox:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".checkbox-xs": { "@layer components": { "--checkbox-size": "0.875rem" } }, ".checkbox-sm": { "@layer components": { "--checkbox-size": "1rem" } }, ".checkbox-md": { "@layer components": { "--checkbox-size": "1.25rem" } }, ".checkbox-lg": { "@layer components": { "--checkbox-size": "1.5rem" } }, ".checkbox-xl": { "@layer components": { "--checkbox-size": "1.75rem" } }, ".checkbox-primary": { "@layer components": { "--checkbox-color": "var(--color-primary)" } }, ".checkbox-primary:checked::before, \n .checkbox-primary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-primary-content))" } }, ".checkbox-secondary": { "@layer components": { "--checkbox-color": "var(--color-secondary)" } }, ".checkbox-secondary:checked::before, \n .checkbox-secondary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-secondary-content))" } }, ".checkbox-tertiary": { "@layer components": { "--checkbox-color": "var(--color-tertiary)" } }, ".checkbox-tertiary:checked::before, \n .checkbox-tertiary:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-tertiary-content))" } }, ".checkbox-success": { "@layer components": { "--checkbox-color": "var(--color-success)" } }, ".checkbox-success:checked::before, \n .checkbox-success:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-success-content))" } }, ".checkbox-warning": { "@layer components": { "--checkbox-color": "var(--color-warning)" } }, ".checkbox-warning:checked::before, \n .checkbox-warning:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-warning-content))" } }, ".checkbox-error": { "@layer components": { "--checkbox-color": "var(--color-error)" } }, ".checkbox-error:checked::before, \n .checkbox-error:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-error-content))" } }, ".checkbox-info": { "@layer components": { "--checkbox-color": "var(--color-info)" } }, ".checkbox-info:checked::before, \n .checkbox-info:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-info-content))" } }, ".checkbox-accent": { "@layer components": { "--checkbox-color": "var(--color-accent)" } }, ".checkbox-accent:checked::before, \n .checkbox-accent:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-accent-content))" } }, ".checkbox-neutral": { "@layer components": { "--checkbox-color": "var(--color-neutral)" } }, ".checkbox-neutral:checked::before, \n .checkbox-neutral:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-neutral-content))" } }, ".checkbox-base": { "@layer components": { "--checkbox-color": "var(--color-base-100)" } }, ".checkbox-base:checked::before, \n .checkbox-base:indeterminate::before": { "@layer components": { borderColor: "var(--dm-validation-content, var(--color-base-content))" } }, ".checkbox-ghost": { "@layer components": { "--checkbox-border-color": "transparent" } }, ".checkbox-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".checkbox-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".checkbox-label:has(.checkbox:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".checkbox-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".checkbox-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".checkbox-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".checkbox, \n .checkbox::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.radio)": { "@layer components": { boxSizing: "border-box" } }, ".radio": { "@layer components": { "--radio-size": "1.25rem", "--radio-color": "var(--color-primary)", "--radio-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--radio-size)", height: "var(--radio-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--radio-border-color)", borderRadius: "var(--radius-full)", transition: "border-color 150ms ease-in-out" } }, ".radio::before": { "@layer components": { content: '""', width: "0.5em", height: "0.5em", borderRadius: "var(--radius-full)", backgroundColor: "var(--radio-color)", transform: "scale(0)", transition: "transform 150ms ease-in-out" } }, ".radio:checked": { "@layer components": { borderColor: "var(--radio-color)" } }, ".radio:checked::before": { "@layer components": { transform: "scale(1)" } }, ".radio:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".radio:checked:hover:not(:disabled)": { "@layer components": { borderColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio:checked:hover:not(:disabled)::before": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--radio-color) 20%, transparent)" } }, ".radio:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".radio-xs": { "@layer components": { "--radio-size": "0.875rem" } }, ".radio-sm": { "@layer components": { "--radio-size": "1rem" } }, ".radio-md": { "@layer components": { "--radio-size": "1.25rem" } }, ".radio-lg": { "@layer components": { "--radio-size": "1.5rem" } }, ".radio-xl": { "@layer components": { "--radio-size": "1.75rem" } }, ".radio-primary": { "@layer components": { "--radio-color": "var(--color-primary)" } }, ".radio-secondary": { "@layer components": { "--radio-color": "var(--color-secondary)" } }, ".radio-tertiary": { "@layer components": { "--radio-color": "var(--color-tertiary)" } }, ".radio-success": { "@layer components": { "--radio-color": "var(--color-success)" } }, ".radio-warning": { "@layer components": { "--radio-color": "var(--color-warning)" } }, ".radio-error": { "@layer components": { "--radio-color": "var(--color-error)" } }, ".radio-info": { "@layer components": { "--radio-color": "var(--color-info)" } }, ".radio-accent": { "@layer components": { "--radio-color": "var(--color-accent)" } }, ".radio-neutral": { "@layer components": { "--radio-color": "var(--color-neutral)" } }, ".radio-base": { "@layer components": { "--radio-color": "var(--color-base-content)" } }, ".radio-ghost": { "@layer components": { "--radio-border-color": "transparent" } }, ".radio-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".radio-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".radio-label:has(.radio:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".radio-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".radio-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".radio-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".radio, \n .radio::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".toggle": { "@layer components": { "--toggle-color": "var(--color-primary)", boxSizing: "border-box", color: "var(--color-on-surface)", border: "1px solid currentColor", appearance: "none", width: "3rem", height: "1.5rem", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface-container-highest)", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative" } }, ".toggle::after": { "@layer components": { content: "''", position: "absolute", insetInlineStart: "0.25rem", top: "50%", transform: "translateY(-50%)", width: "1rem", height: "1rem", backgroundColor: "var(--color-on-surface-variant)", borderRadius: "var(--radius-full)", transition: "all 150ms ease-in-out" } }, ".toggle:checked": { "@layer components": { backgroundColor: "var(--toggle-color)" } }, ".toggle:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1.25rem)", backgroundColor: "var(--dm-validation-content, var(--color-primary-content))" } }, ".toggle:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, ".toggle-xs": { "@layer components": { width: "2rem", height: "1rem" } }, ".toggle-xs::after": { "@layer components": { width: "0.625rem", height: "0.625rem", insetInlineStart: "0.1875rem" } }, ".toggle-xs:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 0.8125rem)" } }, ".toggle-sm": { "@layer components": { width: "2.5rem", height: "1.25rem" } }, ".toggle-sm::after": { "@layer components": { width: "0.75rem", height: "0.75rem" } }, ".toggle-lg": { "@layer components": { width: "4rem", height: "2rem" } }, ".toggle-lg::after": { "@layer components": { width: "1.5rem", height: "1.5rem" } }, ".toggle-sm:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1rem)" } }, ".toggle-lg:checked::after": { "@layer components": { insetInlineStart: "calc(100% - 1.75rem)" } }, ".toggle-primary": { "@layer components": { "--toggle-color": "var(--color-primary)" } }, ".toggle-secondary": { "@layer components": { "--toggle-color": "var(--color-secondary)" } }, ".toggle-tertiary": { "@layer components": { "--toggle-color": "var(--color-tertiary)" } }, ".toggle-info": { "@layer components": { "--toggle-color": "var(--color-info)" } }, ".toggle-success": { "@layer components": { "--toggle-color": "var(--color-success)" } }, ".toggle-warning": { "@layer components": { "--toggle-color": "var(--color-warning)" } }, ".toggle-error": { "@layer components": { "--toggle-color": "var(--color-error)" } }, ".toggle-ghost": { "@layer components": { borderColor: "transparent" } }, ".toggle, .toggle::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ":where(.select)": { "@layer components": { boxSizing: "border-box" } }, ".select": [{ "@layer components": { display: "block", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", cursor: "pointer", appearance: "none", backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: "right 0.75rem center", backgroundRepeat: "no-repeat", backgroundSize: "1.25rem 1.25rem", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".select:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".select:focus": { "@layer components": { outline: "none" } }, ".select:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".select:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".select-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".select-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".select-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".select-filled.select-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".select-filled.select-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".select-filled.select-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".select-filled.select-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".select-filled.select-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".select-filled.select-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".select-filled.select-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".select-filled.select-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".select-filled.select-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".select-filled.select-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".select-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".select-primary": { "@layer components": { color: "var(--color-primary)" } }, ".select-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".select-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".select-info": { "@layer components": { color: "var(--color-info)" } }, ".select-success": { "@layer components": { color: "var(--color-success)" } }, ".select-warning": { "@layer components": { color: "var(--color-warning)" } }, ".select-error": { "@layer components": { color: "var(--color-error)" } }, ".select-accent": { "@layer components": { color: "var(--color-accent)" } }, ".select-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".select-base": { "@layer components": { color: "var(--color-base-content)" } }, ".select-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".select-md": { "@layer components": { fontSize: "1rem" } }, ".select:dir(rtl)": { "@layer components": { paddingInline: "1rem 2.5rem", backgroundPosition: "left 0.75rem center" } }, ".select-xs": { "@layer components": { padding: "0.375rem 2rem 0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", backgroundSize: "1rem 1rem" } }, ".select-sm": { "@layer components": { padding: "0.5rem 2.25rem 0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", backgroundSize: "1.125rem 1.125rem" } }, ".select-lg": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", backgroundSize: "1.5rem 1.5rem", backgroundPosition: "right 1rem center" } }, ".select-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".select-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".select-helper": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".select-container-error .select-helper": { "@layer components": { color: "var(--color-error)" } }, ".select-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem" } }, ".select-multiple": { "@layer components": { padding: "0.5rem", height: "auto", minHeight: "6rem", backgroundImage: "none" } }, ".select-multiple option": { "@layer components": { padding: "0.5rem 0.75rem", borderRadius: "var(--radius-xs)" } }, ".select-multiple option:checked": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".select-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".select-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".select-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ":where(.textarea)": { "@layer components": { boxSizing: "border-box" } }, ".textarea-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".textarea-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".textarea-label-floating": { "@layer components": { position: "absolute", top: "0.75rem", left: "1rem", fontSize: "1rem", fontWeight: 400, color: "var(--color-on-surface-variant)", pointerEvents: "none", transition: "all 150ms ease-in-out", transformOrigin: "left top", zIndex: 1 } }, ".textarea:focus ~ .textarea-label-floating, \n .textarea:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "-0.5rem", left: "0.75rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "var(--color-surface)", padding: "0 0.25rem" } }, ".textarea-filled ~ .textarea-label-floating": { "@layer components": { backgroundColor: "transparent" } }, ".textarea-filled:focus ~ .textarea-label-floating, \n .textarea-filled:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "0.25rem", left: "0.75rem", backgroundColor: "transparent" } }, ".textarea-helper": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, ".textarea": { "@layer components": { display: "block", width: "100%", minHeight: "6rem", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", fontFamily: "inherit", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", resize: "vertical", fieldSizing: "content", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".textarea::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".textarea:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".textarea:focus": { "@layer components": { outline: "none" } }, ".textarea:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".textarea:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)", resize: "none" } }, ".textarea[readonly]": { "@layer components": { backgroundColor: "var(--color-surface-container)", cursor: "default" } }, ".textarea-full": { "@layer components": { width: "100%" } }, ".textarea-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".textarea-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".textarea-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".textarea-filled.textarea-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".textarea-filled.textarea-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".textarea-filled.textarea-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".textarea-filled.textarea-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".textarea-filled.textarea-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".textarea-filled.textarea-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".textarea-filled.textarea-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".textarea-filled.textarea-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".textarea-filled.textarea-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".textarea-filled.textarea-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".textarea-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".textarea-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".textarea-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".textarea-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".textarea-primary": { "@layer components": { color: "var(--color-primary)" } }, ".textarea-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".textarea-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".textarea-info": { "@layer components": { color: "var(--color-info)" } }, ".textarea-success": { "@layer components": { color: "var(--color-success)" } }, ".textarea-warning": { "@layer components": { color: "var(--color-warning)" } }, ".textarea-error": { "@layer components": { color: "var(--color-error)" } }, ".textarea-accent": { "@layer components": { color: "var(--color-accent)" } }, ".textarea-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".textarea-base": { "@layer components": { color: "var(--color-base-content)" } }, ".textarea-xs": { "@layer components": { minHeight: "3rem", padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".textarea-md": { "@layer components": { minHeight: "6rem" } }, ".textarea-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".textarea-sm": { "@layer components": { minHeight: "4rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)" } }, ".textarea-lg": { "@layer components": { minHeight: "8rem", padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)" } }, ".textarea-resize-none": { "@layer components": { resize: "none" } }, ".textarea-resize-vertical": { "@layer components": { resize: "vertical" } }, ".textarea-resize-horizontal": { "@layer components": { resize: "horizontal" } }, ".textarea-resize-both": { "@layer components": { resize: "both" } }, ".textarea-auto-resize, \n .textarea-autosize": { "@layer components": { resize: "none", overflow: "hidden", minHeight: "3rem", fieldSizing: "content" } }, ".textarea-counter": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", textAlign: "right" } }, ".textarea-counter-error, \n .textarea-counter-exceeded": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-helper": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-success .textarea-label": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-helper": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea, \n .textarea-label-floating": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".range": [{ "@layer components": { "--range-thumb-size": "1.25rem", appearance: "none", display: "block", boxSizing: "border-box", width: "100%", minWidth: "0", height: "var(--range-thumb-size)", margin: "0", color: "var(--color-on-surface)", accentColor: "currentColor", background: "transparent", cursor: "pointer" } }, { "@layer components": { "@media (forced-colors: active)": { appearance: "auto" } } }], ".range::-webkit-slider-runnable-track": { "@layer components": { height: "0.5rem", background: "var(--color-surface-container-highest)", borderRadius: "var(--radius-xs)" } }, ".range::-moz-range-track": { "@layer components": { height: "0.5rem", background: "var(--color-surface-container-highest)", borderRadius: "var(--radius-xs)" } }, ".range::-webkit-slider-thumb": { "@layer components": { appearance: "none", width: "var(--range-thumb-size)", height: "var(--range-thumb-size)", marginTop: "calc((0.5rem - var(--range-thumb-size)) / 2)", background: "currentColor", border: "1px solid currentColor", borderRadius: "var(--radius-full)" } }, ".range::-moz-range-thumb": { "@layer components": { width: "var(--range-thumb-size)", height: "var(--range-thumb-size)", background: "currentColor", border: "1px solid currentColor", borderRadius: "var(--radius-full)" } }, ".range:focus-visible": [{ "@layer components": { outline: "2px solid currentColor", outlineOffset: "3px" } }, { "@layer components": { "@media (forced-colors: active)": { outlineColor: "Highlight" } } }], ".range:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".range-xs": { "@layer components": { "--range-thumb-size": "0.875rem" } }, ".range-sm": { "@layer components": { "--range-thumb-size": "1rem" } }, ".range-lg": { "@layer components": { "--range-thumb-size": "1.5rem" } }, ".range-primary": { "@layer components": { color: "var(--color-primary)" } }, ".range-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".range-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".range-info": { "@layer components": { color: "var(--color-info)" } }, ".range-success": { "@layer components": { color: "var(--color-success)" } }, ".range-warning": { "@layer components": { color: "var(--color-warning)" } }, ".range-error": { "@layer components": { color: "var(--color-error)" } }, ".form-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".form-group-horizontal": [{ "@layer components": { flexDirection: "row", alignItems: "flex-start", gap: "1rem" } }, { "@layer components": { "@media (max-width: 640px)": { flexDirection: "column" } } }], ".form-group-horizontal .form-label": { "@layer components": { minWidth: "8rem", paddingTop: "0.75rem" } }, ".form-group-horizontal .form-control": { "@layer components": { flex: 1 } }, ".form-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".form-label-required::after": { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".form-label-optional::after": { "@layer components": { content: "' (optional)'", fontSize: "0.75rem", fontWeight: 400, color: "var(--color-on-surface-variant)" } }, ".form-label-sm": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem" } }, ".form-label-lg": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".form-control": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%", marginBottom: "1rem", color: "var(--color-on-surface)" } }, ".helper-text": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, ".helper-text-error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text-success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text-warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text-info": { "@layer components": { color: "var(--color-info)" } }, ".helper-text-icon": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem" } }, ".helper-text-icon svg, \n .helper-text-icon .icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".form-hint": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginBottom: "0.25rem" } }, ".fieldset": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem", padding: "1rem", margin: "0", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", backgroundColor: "transparent", minInlineSize: "0" } }, ".fieldset-legend": { "@layer components": { padding: "0 0.5rem", fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".fieldset-filled": { "@layer components": { backgroundColor: "var(--color-surface-container-lowest)", borderColor: "transparent" } }, ".fieldset-borderless": { "@layer components": { border: "none", padding: "0" } }, ".fieldset-card": { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "transparent", boxShadow: "var(--shadow-xs)", padding: "1.5rem" } }, ".form-row": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "1rem" } }, ".form-row > .form-group": [{ "@layer components": { flex: 1, minWidth: "200px" } }, { "@layer components": { "@media (max-width: 640px)": { minWidth: "0", flexBasis: "100%" } } }], ".form-grid": { "@layer components": { display: "grid", gap: "1rem" } }, ".form-grid-2": { "@layer components": { gridTemplateColumns: "repeat(2, 1fr)" } }, ".form-grid-3": { "@layer components": { gridTemplateColumns: "repeat(3, 1fr)" } }, ".form-grid-4": { "@layer components": { gridTemplateColumns: "repeat(4, 1fr)" } }, ".form-grid-2, \n .form-grid-3, \n .form-grid-4": { "@layer components": { "@media (max-width: 640px)": { gridTemplateColumns: "1fr" } } }, ".form-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", marginTop: "1rem" } }, ".form-actions-right": { "@layer components": { justifyContent: "flex-end" } }, ".form-actions-center": { "@layer components": { justifyContent: "center" } }, ".form-actions-between": { "@layer components": { justifyContent: "space-between" } }, ".form-divider": { "@layer components": { height: "1px", backgroundColor: "var(--color-outline-variant)", margin: "1rem 0" } }, ".form-divider-text": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", color: "var(--color-on-surface-variant)", fontSize: "0.75rem", textTransform: "uppercase" } }, ".form-divider-text::before, \n .form-divider-text::after": { "@layer components": { content: "''", flex: 1, height: "1px", backgroundColor: "var(--color-outline-variant)" } }, ".form-section": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem" } }, ".form-section-title": { "@layer components": { fontSize: "1rem", fontWeight: 600, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".form-section-description": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)", marginBottom: "1rem" } }, ".form-inline": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "flex-end", gap: "0.75rem" } }, ".form-inline .form-group": { "@layer components": { flex: "none", width: "auto" } }, ".form-counter": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", textAlign: "right", marginTop: "0.25rem" } }, ".form-counter-error": { "@layer components": { color: "var(--color-error)" } }, ".label": { "@layer components": { display: "flex", justifyContent: "space-between", alignItems: "center", padding: "0.25rem 0" } }, ".label-text": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", paddingBottom: "0.25rem" } }, ".label-text-alt": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, '.label-text.required::after, \n .form-label[aria-required="true"]::after': { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".helper-text.error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text.success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text.warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text.info": { "@layer components": { color: "var(--color-info)" } }, ".form-group-disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, ".form-group, .form-control": { "@layer components": { minInlineSize: "0" } }, ".dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".dropdown > .dropdown-content[popover]": [{ "@layer components": { display: "none", position: "fixed", insetBlockStart: "auto", insetBlockEnd: "max(0.5rem, env(safe-area-inset-bottom, 0px))", insetInlineStart: "auto", insetInlineEnd: `max(
157
+ 0.5rem,
158
+ env(safe-area-inset-left, 0px),
159
+ env(safe-area-inset-right, 0px)
160
+ )`, zIndex: 50, minInlineSize: "12rem", maxInlineSize: "min(24rem, calc(100dvw - 1rem))", maxBlockSize: "calc(100dvh - 1rem)", margin: "0", padding: "0.5rem", overflow: "auto", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-lg)", opacity: 0, visibility: "hidden", pointerEvents: "none", transform: "translateY(-0.5rem)", transition: `opacity 150ms ease-out,
161
+ transform 150ms ease-out,
162
+ overlay 150ms ease-out allow-discrete,
163
+ display 150ms ease-out allow-discrete` } }, { "@layer components": { "@supports (position-area: block-end)": { inset: "auto", margin: "0.25rem", positionArea: "block-end span-inline-end", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".dropdown > .dropdown-content[popover]:popover-open": [{ "@layer components": { display: "block", opacity: 1, visibility: "visible", pointerEvents: "auto", transform: "translateY(0)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "translateY(-0.5rem)" } } }], ".dropdown.dropdown-block-start > .dropdown-content[popover]": { "@layer components": { "@supports (position-area: block-end)": { positionArea: "block-start span-inline-end" } } }, ".dropdown.dropdown-block-end > .dropdown-content[popover]": { "@layer components": { "@supports (position-area: block-end)": { positionArea: "block-end span-inline-end" } } }, ".dropdown.dropdown-inline-start > .dropdown-content[popover]": { "@layer components": { "@supports (position-area: block-end)": { positionArea: "inline-start span-block-end" } } }, ".dropdown.dropdown-inline-end > .dropdown-content[popover]": { "@layer components": { "@supports (position-area: block-end)": { positionArea: "inline-end span-block-end" } } }, ".navbar": { "@layer components": { display: "flex", alignItems: "center", width: "100%", minHeight: "4rem", padding: "0.5rem 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)" } }, ".navbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".navbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".navbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".navbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".navbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".navbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".navbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".navbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".navbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".navbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".navbar a": { "@layer components": { color: "inherit" } }, ".navbar-start": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-start", gap: "0.5rem" } }, ".navbar-center": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, gap: "0.5rem" } }, ".navbar-end": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-end", gap: "0.5rem" } }, ".menu": { "@layer components": { display: "flex", flexWrap: "wrap", listStyle: "none", margin: "0", padding: "0.5rem", gap: "0.25rem" } }, ".menu[popover]": { "@layer components": { display: "none", position: "absolute", inset: "auto", margin: "0.5rem", minWidth: "12rem", maxWidth: "calc(100vw - 1rem)", maxHeight: "calc(100dvh - 1rem)", overflow: "auto", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", positionArea: "bottom", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", opacity: 0, transform: "scale(0.95)", transition: `opacity 150ms ease-out,
164
+ transform 150ms ease-out,
165
+ overlay 150ms ease-out allow-discrete,
166
+ display 150ms ease-out allow-discrete` } }, ".menu[popover]:popover-open": [{ "@layer components": { display: "flex", opacity: 1, transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".menu[popover]::backdrop": { "@layer components": { backgroundColor: "transparent" } }, ".menu-top[popover]": { "@layer components": { positionArea: "top" } }, ".menu-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".menu-left[popover]": { "@layer components": { positionArea: "left" } }, ".menu-right[popover]": { "@layer components": { positionArea: "right" } }, ".menu li": { "@layer components": { display: "flex", flexShrink: 0 } }, ".menu li > a, \n .menu li > button, \n .menu-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", textDecoration: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", whiteSpace: "nowrap" } }, ".menu li > a:hover, \n .menu li > button:hover, \n .menu-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".menu li > a:focus-visible, \n .menu li > button:focus-visible, \n .menu-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.menu li > a.active, \n .menu li > button.active, \n .menu-item.active, \n .menu li > a[aria-current="page"], \n .menu li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".menu li.disabled > a, \n .menu li.disabled > button, \n .menu-item:disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, ".menu-horizontal": { "@layer components": { flexDirection: "row" } }, ".menu-vertical": { "@layer components": { flexDirection: "column" } }, ".menu-vertical li": { "@layer components": { width: "100%" } }, ".menu-vertical li > a, \n .menu-vertical li > button, \n .menu-vertical .menu-item": { "@layer components": { width: "100%" } }, ".menu-compact li > a, \n .menu-compact li > button, \n .menu-compact .menu-item": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem" } }, ".menu-title": { "@layer components": { padding: "0.5rem 1rem", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".breadcrumbs": { "@layer components": { display: "flex", alignItems: "center", flexWrap: "wrap", gap: "0.5rem", padding: "0.5rem 0", listStyle: "none", margin: "0", fontSize: "0.875rem" } }, ".breadcrumbs li": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".breadcrumbs li::after": { "@layer components": { content: "'/'", color: "var(--color-on-surface-variant)", opacity: 0.5 } }, ".breadcrumbs li:last-child::after": { "@layer components": { display: "none" } }, ".breadcrumbs li > a": { "@layer components": { color: "var(--color-primary)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumbs li > a:hover": { "@layer components": { textDecoration: "underline" } }, ".breadcrumbs li:last-child": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".breadcrumb-item": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-item:hover": { "@layer components": { color: "var(--color-on-surface)" } }, ".breadcrumb-item-active": { "@layer components": { color: "var(--color-on-surface)", fontWeight: 500, pointerEvents: "none" } }, ".breadcrumb-link": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out", cursor: "pointer" } }, ".breadcrumb-link:hover": { "@layer components": { color: "var(--color-primary)", textDecoration: "underline" } }, ".breadcrumb-link:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", borderRadius: "var(--radius-xs)" } }, ".breadcrumb-separator": { "@layer components": { display: "inline-flex", alignItems: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem", userSelect: "none", opacity: 0.6 } }, ".breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-slash .breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-chevron .breadcrumb-separator::before": { "@layer components": { content: '"›"', fontSize: "1.125rem" } }, ".breadcrumbs-dot .breadcrumb-separator::before": { "@layer components": { content: '"•"' } }, ".breadcrumbs-arrow .breadcrumb-separator::before": { "@layer components": { content: '"→"' } }, ".breadcrumbs-pipe .breadcrumb-separator::before": { "@layer components": { content: '"|"' } }, ".breadcrumb-icon": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", flexShrink: 0 } }, ".breadcrumb-icon svg": { "@layer components": { width: "100%", height: "100%" } }, ".breadcrumb-home": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-home:hover": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumb-home-icon": { "@layer components": { width: "1.125rem", height: "1.125rem" } }, ".breadcrumb-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.25rem 0.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".breadcrumb-ellipsis::before": { "@layer components": { content: '"..."' } }, ".breadcrumb-ellipsis:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 8%, transparent)" } }, ".breadcrumbs-primary .breadcrumb-link:hover, \n .breadcrumbs-primary .breadcrumb-item-active": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumbs-secondary .breadcrumb-link:hover, \n .breadcrumbs-secondary .breadcrumb-item-active": { "@layer components": { color: "var(--color-secondary)" } }, ".breadcrumbs-tertiary .breadcrumb-link:hover, \n .breadcrumbs-tertiary .breadcrumb-item-active": { "@layer components": { color: "var(--color-tertiary)" } }, ".breadcrumbs-sm": { "@layer components": { fontSize: "0.75rem", gap: "0.375rem" } }, ".breadcrumbs-sm .breadcrumb-icon, \n .breadcrumbs-sm .breadcrumb-home-icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".breadcrumbs-lg": { "@layer components": { fontSize: "1rem", gap: "0.625rem" } }, ".breadcrumbs-lg .breadcrumb-icon, \n .breadcrumbs-lg .breadcrumb-home-icon": { "@layer components": { width: "1.25rem", height: "1.25rem" } }, ".breadcrumbs-contained": { "@layer components": { padding: "0.75rem 1rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)" } }, ".breadcrumbs-nowrap": { "@layer components": { flexWrap: "nowrap", overflowX: "auto" } }, ".breadcrumb-item-disabled": { "@layer components": { opacity: 1, pointerEvents: "none", cursor: "not-allowed" } }, ".tabs": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", borderBottom: "1px solid var(--color-outline)" } }, ".tab": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.75rem 1.25rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textDecoration: "none", backgroundColor: "transparent", border: "none", borderBottom: "2px solid transparent", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative", marginBottom: "-1px" } }, ".tab:hover": { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)" } }, ".tab:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tab.tab-active, \n .tab[aria-selected="true"]': { "@layer components": { color: "var(--color-primary)", borderBottomColor: "var(--color-primary)" } }, ".tab:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".tabs-boxed": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)", padding: "0.25rem", border: "none" } }, ".tabs-boxed .tab": { "@layer components": { borderRadius: "var(--radius-xs)", borderBottom: "none", marginBottom: "0" } }, '.tabs-boxed .tab.tab-active, \n .tabs-boxed .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-xs)" } }, ".tabs-lifted": { "@layer components": { border: "none" } }, ".tabs-lifted .tab": { "@layer components": { border: "1px solid transparent", borderBottom: "none", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0", marginBottom: "-1px" } }, '.tabs-lifted .tab.tab-active, \n .tabs-lifted .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "var(--color-outline)", borderBottomColor: "var(--color-surface)" } }, ".tab-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem" } }, ".tab-sm": { "@layer components": { padding: "0.5rem 0.875rem", fontSize: "0.8125rem" } }, ".tab-lg": { "@layer components": { padding: "1rem 1.5rem", fontSize: "1rem" } }, ".pagination": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", listStyle: "none", margin: "0", padding: "0" } }, ".pagination-item, \n .pagination-prev, \n .pagination-next, \n .pagination li > a, \n .pagination li > button": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.25rem", minWidth: "2.5rem", height: "2.5rem", padding: "0 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 150ms ease-in-out", whiteSpace: "nowrap" } }, ".pagination-item:hover, \n .pagination-prev:hover, \n .pagination-next:hover, \n .pagination li > a:hover, \n .pagination li > button:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, '.pagination-item-active, \n .pagination-item-active-primary, \n .pagination li > a.active, \n .pagination li > button.active, \n .pagination li > a[aria-current="page"], \n .pagination li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".pagination-item-active-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)", borderColor: "var(--color-secondary)" } }, ".pagination-item-active-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)", borderColor: "var(--color-tertiary)" } }, ".pagination-item:focus-visible, \n .pagination-prev:focus-visible, \n .pagination-next:focus-visible, \n .pagination li > a:focus-visible, \n .pagination li > button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".pagination-item:disabled, \n .pagination-item-disabled, \n .pagination-prev:disabled, \n .pagination-next:disabled, \n .pagination li > a:disabled, \n .pagination li > button:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed", pointerEvents: "none" } }, ".pagination-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", minWidth: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)" } }, ".pagination-ellipsis::before": { "@layer components": { content: "'…'" } }, ".pagination-info": { "@layer components": { display: "flex", flexDirection: "row", alignItems: "center", gap: "0.5rem" } }, ".pagination-info-text": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input input": { "@layer components": { width: "3.5rem", padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".pagination-input input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)" } }, ".pagination-outlined .pagination-item, \n .pagination-outlined .pagination-prev, \n .pagination-outlined .pagination-next": { "@layer components": { border: "1px solid var(--color-outline)" } }, ".pagination-tonal .pagination-item-active, \n .pagination-tonal .pagination-item-active-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "var(--color-primary-container)" } }, ".pagination-sm .pagination-item, \n .pagination-sm .pagination-prev, \n .pagination-sm .pagination-next": { "@layer components": { minWidth: "2rem", height: "2rem", padding: "0 0.5rem", fontSize: "0.75rem" } }, ".pagination-lg .pagination-item, \n .pagination-lg .pagination-prev, \n .pagination-lg .pagination-next": { "@layer components": { minWidth: "3rem", height: "3rem", padding: "0 1rem", fontSize: "1rem" } }, ".pagination-compact": { "@layer components": { gap: "0" } }, ".pagination-compact .pagination-item, \n .pagination-compact .pagination-prev, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0" } }, ".pagination-compact .pagination-item:first-child, \n .pagination-compact .pagination-prev": { "@layer components": { borderRadius: "var(--radius-sm) 0 0 var(--radius-sm)" } }, ".pagination-compact .pagination-item:last-child, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0 var(--radius-sm) var(--radius-sm) 0" } }, ".pagination-responsive": { "@layer components": { flexWrap: "wrap", justifyContent: "center" } }, ".menu li > a, \n .menu li > button, \n .menu-item, \n .menu[popover], \n .pagination-item, \n .pagination-prev, \n .pagination-next": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".modal": [{ "@layer components": { position: "fixed", inset: "0", zIndex: 999, display: "flex", alignItems: "center", justifyContent: "center", padding: "1rem", visibility: "hidden", opacity: 0, transition: "visibility 200ms ease-out, opacity 200ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }], ".modal.modal-open, \n .modal:target": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-box": [{ "@layer components": { position: "relative", zIndex: 1, maxWidth: "32rem", maxHeight: "calc(100dvh - 5rem)", padding: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-lg)", boxShadow: "var(--shadow-2xl)", overflowY: "auto", transform: "scale(0.95)", transition: "transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { maxWidth: "calc(100vw - 2rem)", margin: "1rem" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".modal.modal-open .modal-box, \n .modal:target .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-backdrop": { "@layer components": { position: "fixed", inset: "0", zIndex: -1, backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)", cursor: "pointer" } }, ".modal-backdrop::before": { "@layer components": { content: "''", position: "absolute", inset: "0" } }, ".modal-action, \n .modal-footer": { "@layer components": { display: "flex", flexWrap: "wrap", justifyContent: "flex-end", gap: "0.5rem", marginTop: "1.5rem", paddingTop: "1rem" } }, ".modal-toggle": { "@layer components": { position: "fixed", width: "0", height: "0", appearance: "none", opacity: 0 } }, ".modal-toggle:checked + .modal": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-toggle:checked + .modal .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-sm .modal-box": { "@layer components": { maxWidth: "20rem" } }, ".modal-md .modal-box": { "@layer components": { maxWidth: "32rem" } }, ".modal-lg .modal-box": { "@layer components": { maxWidth: "48rem" } }, ".modal-xl .modal-box": { "@layer components": { maxWidth: "64rem" } }, ".modal-full .modal-box": { "@layer components": { maxWidth: "calc(100vw - 2rem)", maxHeight: "calc(100vh - 2rem)", width: "100%", height: "100%" } }, ".modal-top": { "@layer components": { alignItems: "flex-start", paddingTop: "2rem" } }, ".modal-bottom": { "@layer components": { alignItems: "flex-end", paddingBottom: "2rem" } }, ".modal-middle": { "@layer components": { alignItems: "center" } }, ".modal-slide-up .modal-box": { "@layer components": { transform: "translateY(6rem) scale(0.95)" } }, ".modal-slide-down .modal-box": { "@layer components": { transform: "translateY(-6rem) scale(0.95)" } }, ".modal-zoom .modal-box": { "@layer components": { transform: "scale(0.75)" } }, ":is(.modal-slide-up, .modal-slide-down, .modal-zoom).modal-open .modal-box, \n :is(.modal-slide-up, .modal-slide-down, .modal-zoom):target .modal-box": { "@layer components": { transform: "translateY(0) scale(1)" } }, ".modal-backdrop-light": { "@layer components": { backgroundColor: "color-mix(in srgb, white 80%, transparent)" } }, ".modal-backdrop-blur": { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 30%, transparent)", backdropFilter: "blur(8px)" } }, ".modal-no-backdrop": { "@layer components": { backgroundColor: "transparent" } }, ".modal-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".modal-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".modal-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".modal-header": { "@layer components": { marginBottom: "1rem", paddingRight: "2rem" } }, ".modal-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, color: "var(--color-on-surface)", margin: "0" } }, ".modal-body": { "@layer components": { color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".modal-scrollable .modal-body": { "@layer components": { maxHeight: "60vh", overflowY: "auto" } }, ".modal-no-padding .modal-body": { "@layer components": { padding: "0" } }, ".modal-centered .modal-body": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", textAlign: "center" } }, ".modal-responsive": { "@layer components": { "@media (max-width: 640px)": { alignItems: "flex-end", padding: "0" } } }, ".modal-responsive .modal-box": { "@layer components": { "@media (max-width: 640px)": { maxWidth: "100%", maxHeight: "90dvh", margin: "0", borderRadius: "var(--radius-lg) var(--radius-lg) 0 0" } } }, ".drawer-modal": { "@layer components": { alignItems: "stretch", justifyContent: "flex-end", padding: "0" } }, ".drawer-modal .modal-box": { "@layer components": { maxWidth: "20rem", maxHeight: "100dvh", height: "100%", margin: "0", borderRadius: "0", transform: "translateX(100%)" } }, ".drawer-modal.modal-open .modal-box, \n .drawer-modal:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".drawer-modal-left": { "@layer components": { justifyContent: "flex-start" } }, ".drawer-modal-left .modal-box": { "@layer components": { transform: "translateX(-100%)" } }, ".drawer-modal-left.modal-open .modal-box, \n .drawer-modal-left:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".alert-dialog": { "@layer components": { textAlign: "center" } }, ".alert-dialog .modal-box": { "@layer components": { maxWidth: "24rem" } }, ".alert-dialog .modal-icon": { "@layer components": { width: "4rem", height: "4rem", margin: "0 auto 1rem", display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "var(--radius-full)", fontSize: "2rem" } }, ".alert-dialog .modal-icon.info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".alert-dialog .modal-icon.success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".alert-dialog .modal-icon.warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".alert-dialog .modal-icon.error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".alert-dialog .modal-action": { "@layer components": { justifyContent: "center" } }, ".modal-focus-trap": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, "body.modal-open": { "@layer components": { overflow: "hidden" } }, ".avatar": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", position: "relative", width: "3rem", height: "3rem", borderRadius: "var(--radius-full)", overflow: "visible", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", fontWeight: 500, flexShrink: 0 } }, ".avatar img": { "@layer components": { width: "100%", height: "100%", objectFit: "cover", borderRadius: "inherit" } }, ".avatar-placeholder": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", fontSize: "inherit", borderRadius: "inherit", overflow: "hidden", textTransform: "uppercase" } }, ".avatar-xs": { "@layer components": { width: "1.5rem", height: "1.5rem", fontSize: "0.625rem" } }, ".avatar-sm": { "@layer components": { width: "2rem", height: "2rem", fontSize: "0.75rem" } }, ".avatar-md": { "@layer components": { width: "3rem", height: "3rem", fontSize: "1rem" } }, ".avatar-lg": { "@layer components": { width: "4rem", height: "4rem", fontSize: "1.5rem" } }, ".avatar-xl": { "@layer components": { width: "6rem", height: "6rem", fontSize: "2rem" } }, ".avatar-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".avatar-square": { "@layer components": { borderRadius: "0" } }, ".avatar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".avatar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".avatar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".avatar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".avatar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".avatar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".avatar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".avatar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".avatar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".avatar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".avatar-ring": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".avatar-ring-primary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-primary)" } }, ".avatar-ring-secondary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-secondary)" } }, ".avatar-ring-tertiary": { "@layer components": { boxShadow: "0 0 0 3px var(--color-tertiary)" } }, ".avatar-online::after, \n .avatar-offline::after, \n .avatar-status-online::after, \n .avatar-status-offline::after, \n .avatar-status-busy::after, \n .avatar-status-away::after": { "@layer components": { content: "''", position: "absolute", insetBlockEnd: "0", insetInlineEnd: "0", width: "25%", height: "25%", minWidth: "0.5rem", minHeight: "0.5rem", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".avatar-online::after, \n .avatar-status-online::after": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".avatar-offline::after, \n .avatar-status-offline::after": { "@layer components": { backgroundColor: "var(--color-outline)" } }, ".avatar-status-busy::after": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".avatar-status-away::after": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".avatar-group": { "@layer components": { display: "flex", flexDirection: "row-reverse", justifyContent: "flex-end" } }, ".avatar-group .avatar": { "@layer components": { border: "2px solid var(--color-surface)", marginInlineStart: "-0.75rem" } }, ".avatar-group .avatar:last-child": { "@layer components": { marginInlineStart: "0" } }, ".avatar-group-sm .avatar": { "@layer components": { marginInlineStart: "-0.5rem" } }, ".avatar-group-lg .avatar": { "@layer components": { marginInlineStart: "-1rem" } }, ".avatar-image": { "@layer components": { inlineSize: "100%", blockSize: "100%", borderRadius: "inherit", overflow: "hidden" } }, ".avatar-icon": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", inlineSize: "100%", blockSize: "100%" } }, ".avatar-circle": { "@layer components": { borderRadius: "var(--radius-full)" } }, ".avatar-bordered": { "@layer components": { border: "2px solid currentColor" } }, ".avatar-clickable": { "@layer components": { cursor: "pointer" } }, ".avatar-overflow": { "@layer components": { fontSize: "0.875rem" } }, ".avatar-group-dense > .avatar": { "@layer components": { marginInlineStart: "-1rem" } }, ".avatar-group-xs > .avatar": { "@layer components": { inlineSize: "1.5rem", blockSize: "1.5rem", fontSize: "0.625rem" } }, ".avatar-group-xl > .avatar": { "@layer components": { inlineSize: "6rem", blockSize: "6rem", fontSize: "2rem" } }, ".avatar-group-dense > .avatar:last-child": { "@layer components": { marginInlineStart: "0" } }, ".avatar:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".badge": { "@layer components": { boxSizing: "border-box", display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.125rem 0.5rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "normal", maxInlineSize: "100%", overflowWrap: "anywhere", minInlineSize: "0", borderRadius: "var(--radius-full)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".badge-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".badge-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".badge-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".badge-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".badge-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".badge-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".badge-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".badge-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".badge-outlined, \n .badge-outlined-secondary, \n .badge-outlined-tertiary, \n .badge-outline": { "@layer components": { backgroundColor: "transparent", border: "1px solid currentColor" } }, ".badge-outlined, \n .badge-outlined.badge-primary, \n .badge-outline.badge-primary": { "@layer components": { color: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".badge-outlined.badge-secondary, \n .badge-outlined-secondary, \n .badge-outline.badge-secondary": { "@layer components": { color: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".badge-outlined.badge-tertiary, \n .badge-outlined-tertiary, \n .badge-outline.badge-tertiary": { "@layer components": { color: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".badge-outlined.badge-accent, \n .badge-outline.badge-accent": { "@layer components": { color: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".badge-outlined.badge-neutral, \n .badge-outline.badge-neutral": { "@layer components": { color: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".badge-outlined.badge-base, \n .badge-outline.badge-base": { "@layer components": { color: "var(--color-base-content)", borderColor: "var(--color-base-content)" } }, ".badge-outlined.badge-info, \n .badge-outline.badge-info": { "@layer components": { color: "var(--color-info)", borderColor: "var(--color-info)" } }, ".badge-outlined.badge-success, \n .badge-outline.badge-success": { "@layer components": { color: "var(--color-success)", borderColor: "var(--color-success)" } }, ".badge-outlined.badge-warning, \n .badge-outline.badge-warning": { "@layer components": { color: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".badge-outlined.badge-error, \n .badge-outline.badge-error": { "@layer components": { color: "var(--color-error)", borderColor: "var(--color-error)" } }, ".badge-tonal, \n .badge-soft": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-primary, \n .badge-soft.badge-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-secondary, \n .badge-tonal-secondary, \n .badge-soft.badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".badge-tonal.badge-tertiary, \n .badge-tonal-tertiary, \n .badge-soft.badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".badge-tonal.badge-accent, \n .badge-soft.badge-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-neutral, \n .badge-soft.badge-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-base, \n .badge-soft.badge-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".badge-tonal.badge-info, \n .badge-soft.badge-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".badge-tonal.badge-success, \n .badge-soft.badge-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".badge-tonal.badge-warning, \n .badge-soft.badge-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".badge-tonal.badge-error, \n .badge-soft.badge-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".badge-sm": { "@layer components": { padding: "0 0.375rem", fontSize: "0.625rem", lineHeight: "0.875rem" } }, ".badge-lg": { "@layer components": { padding: "0.25rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".badge-indicator": { "@layer components": { position: "relative", paddingInlineStart: "1rem" } }, ".badge-indicator::before": { "@layer components": { content: "''", position: "absolute", insetInlineStart: "0.375rem", top: "50%", transform: "translateY(-50%)", width: "0.375rem", height: "0.375rem", borderRadius: "var(--radius-full)", backgroundColor: "currentColor" } }, ".badge-filled": { "@layer components": { fontWeight: 500 } }, ".badge-md": { "@layer components": { padding: "0.125rem 0.5rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".badge-notification": { "@layer components": { position: "absolute", insetBlockStart: "0", insetInlineEnd: "0", transform: "translate(50%, -50%)" } }, ".badge-notification:dir(rtl)": { "@layer components": { transform: "translate(-50%, -50%)" } }, ".badge-removable": { "@layer components": { gap: "0.25rem" } }, ".badge-removable > button": { "@layer components": { display: "inline-flex", padding: "0", border: "0", color: "inherit", background: "transparent", cursor: "pointer" } }, ".badge-removable > button:focus-visible": { "@layer components": { outline: "2px solid currentColor", outlineOffset: "2px" } }, ".badge-dot": { "@layer components": { width: "0.5rem", height: "0.5rem", padding: "0", borderRadius: "var(--radius-full)" } }, ".chat-scroll": [{ "@layer components": { "--chat-scroll-indicator-size": "0.875rem", "--chat-scroll-indicator-active-size": "1.125rem", "--chat-scroll-indicator-thickness": "0.1875rem", "--chat-scroll-indicator-gap": "0.3125rem", "--chat-scroll-indicator-hover-scale": "1.55", "--chat-scroll-indicator-neighbor-scale": "1.22", containerType: "size", containerName: "chat-scroll", display: "grid", gridTemplateColumns: "auto minmax(0, 1fr)", columnGap: "0.75rem", alignItems: "start", minHeight: "0", overflowX: "hidden", overflowY: "auto", scrollBehavior: "smooth", overscrollBehaviorY: "contain", timelineScope: `--chat-1,
154
167
  --chat-2,
155
168
  --chat-3,
156
169
  --chat-4,
@@ -182,7 +195,10 @@ var componentStyles = { ".btn": [{ "@layer components": { "--btn-p": "1.25rem",
182
195
  grid-template-columns 200ms ease-in-out !important` } }, ".switch::before": { "@layer components": { content: '""', gridColumn: "2", width: "var(--switch-thumb-size)", height: "var(--switch-thumb-size)", backgroundColor: "var(--switch-thumb-color)", borderRadius: "var(--radius-full)", transition: `background-color 200ms ease-in-out,
183
196
  width 200ms ease-in-out,
184
197
  margin 200ms ease-in-out !important` } }, ".switch:checked": { "@layer components": { gridTemplateColumns: "1fr 1fr 0fr", backgroundColor: "var(--switch-color)", borderColor: "var(--switch-color)" } }, ".switch:checked::before": { "@layer components": { backgroundColor: "var(--switch-content-color)" } }, ".switch:hover:not(:disabled):not(:checked)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".switch:hover:not(:disabled):not(:checked)::before": { "@layer components": { backgroundColor: "var(--color-on-surface-variant)" } }, ".switch:checked:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--switch-color), black 10%)", borderColor: "color-mix(in oklch, var(--switch-color), black 10%)" } }, ".switch:checked:hover:not(:disabled)::before": { "@layer components": { backgroundColor: "var(--switch-container-color)" } }, ".switch:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--switch-color) 20%, transparent)" } }, ".switch:active:not(:disabled)::before": { "@layer components": { width: "calc(var(--switch-thumb-size) + 0.25rem)" } }, ".switch:checked:active:not(:disabled)::before": { "@layer components": { marginLeft: "-0.25rem" } }, ".switch:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".switch:disabled:not(:checked)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-container-highest) 12%, transparent)", borderColor: "color-mix(in oklch, var(--color-on-surface) 12%, transparent)" } }, ".switch:disabled:not(:checked)::before": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 38%, transparent)" } }, ".switch:disabled:checked": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 12%, transparent)", borderColor: "transparent" } }, ".switch:disabled:checked::before": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".switch-xs": { "@layer components": { "--switch-width": "2rem", "--switch-height": "1.25rem", "--switch-thumb-size": "0.5rem" } }, ".switch-sm": { "@layer components": { "--switch-width": "2.5rem", "--switch-height": "1.5rem", "--switch-thumb-size": "0.75rem" } }, ".switch-md": { "@layer components": { "--switch-width": "3.25rem", "--switch-height": "2rem", "--switch-thumb-size": "1rem" } }, ".switch-lg": { "@layer components": { "--switch-width": "4rem", "--switch-height": "2.5rem", "--switch-thumb-size": "1.25rem" } }, ".switch-xl": { "@layer components": { "--switch-width": "4.75rem", "--switch-height": "3rem", "--switch-thumb-size": "1.5rem" } }, ".switch-primary": { "@layer components": { "--switch-color": "var(--color-primary)", "--switch-content-color": "var(--color-primary-content)", "--switch-container-color": "var(--color-primary-container)" } }, ".switch-secondary": { "@layer components": { "--switch-color": "var(--color-secondary)", "--switch-content-color": "var(--color-secondary-content)", "--switch-container-color": "var(--color-secondary-container)" } }, ".switch-tertiary": { "@layer components": { "--switch-color": "var(--color-tertiary)", "--switch-content-color": "var(--color-tertiary-content)", "--switch-container-color": "var(--color-tertiary-container)" } }, ".switch-success": { "@layer components": { "--switch-color": "var(--color-success)", "--switch-content-color": "var(--color-success-content)", "--switch-container-color": "var(--color-success-container)" } }, ".switch-warning": { "@layer components": { "--switch-color": "var(--color-warning)", "--switch-content-color": "var(--color-warning-content)", "--switch-container-color": "var(--color-warning-container)" } }, ".switch-error": { "@layer components": { "--switch-color": "var(--color-error)", "--switch-content-color": "var(--color-error-content)", "--switch-container-color": "var(--color-error-container)" } }, ".switch-info": { "@layer components": { "--switch-color": "var(--color-info)", "--switch-content-color": "var(--color-info-content)", "--switch-container-color": "var(--color-info-container)" } }, ".switch-accent": { "@layer components": { "--switch-color": "var(--color-accent)", "--switch-content-color": "var(--color-accent-content)", "--switch-container-color": "color-mix(in oklch, var(--color-accent) 20%, var(--color-surface))" } }, ".switch-neutral": { "@layer components": { "--switch-color": "var(--color-neutral)", "--switch-content-color": "var(--color-neutral-content)", "--switch-container-color": "color-mix(in oklch, var(--color-neutral) 20%, var(--color-surface))" } }, ".switch-base": { "@layer components": { "--switch-color": "var(--color-base-100)", "--switch-content-color": "var(--color-base-content)", "--switch-container-color": "color-mix(in oklch, var(--color-base-100) 20%, var(--color-surface))" } }, ".switch-ghost": { "@layer components": { "--switch-border-color": "transparent", "--switch-track-color": "transparent" } }, ".switch-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.75rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".switch-label:has(.switch:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".switch-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".switch-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".switch, \n .switch::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none !important" } } }, ".theme-controller-item": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, ".theme-controller-label": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", borderRadius: "calc(var(--radius-box, 1.5rem) - 0.25rem)", cursor: "pointer", transition: `background-color 150ms ease-in-out, color 150ms ease-in-out,
185
- box-shadow 150ms ease-in-out`, userSelect: "none", whiteSpace: "nowrap" } }, ".theme-controller-label:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-item:focus-visible + .theme-controller-label": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-item:checked + .theme-controller-label": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", boxShadow: "var(--shadow-xs)" } }, ".theme-controller-item:checked + .theme-controller-label:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".theme-controller": { "@layer components": { display: "inline-flex", alignItems: "stretch", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-box, 1.5rem)", padding: "0.25rem", gap: "0.125rem" } }, ".theme-controller-sm": { "@layer components": { padding: "0.125rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75)" } }, ".theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75 - 0.125rem)" } }, ".theme-controller-lg": { "@layer components": { padding: "0.375rem", gap: "0.25rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25)" } }, ".theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25 - 0.375rem)" } }, ".theme-controller-icon .theme-controller-label": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-icon.theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-icon.theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".theme-controller-trigger": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", cursor: "pointer", userSelect: "none", transition: "background-color 150ms ease-in-out", listStyle: "none" } }, ".theme-controller-trigger::-webkit-details-marker": { "@layer components": { display: "none" } }, ".theme-controller-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-trigger::after": { "@layer components": { content: "''", display: "inline-block", width: "0.5rem", height: "0.5rem", borderRight: "2px solid currentColor", borderBottom: "2px solid currentColor", transform: "rotate(45deg)", marginTop: "-0.125rem", transition: "transform 150ms ease-in-out" } }, ".theme-controller-dropdown[open] .theme-controller-trigger::after": { "@layer components": { transform: "rotate(-135deg)", marginTop: "0.125rem" } }, ".theme-controller-menu": { "@layer components": { position: "absolute", top: "calc(100% + 0.25rem)", left: "0", zIndex: 50, minWidth: "100%", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", padding: "0.25rem", boxShadow: "var(--shadow-md)", display: "flex", flexDirection: "column", gap: "0.125rem" } }, ".theme-controller-menu .theme-controller-label": { "@layer components": { width: "100%", justifyContent: "flex-start", borderRadius: "calc(var(--radius-field, 0.5rem) - 0.25rem)" } }, ".theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu": { "@layer components": { padding: "0.125rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger::after": { "@layer components": { display: "none" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown-end .theme-controller-menu": { "@layer components": { left: "auto", right: "0" } }, ".theme-controller-label, \n .theme-controller-trigger, \n .theme-controller-trigger::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".toggle-btn": [{ "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.625rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 0.2s cubic-bezier(0.4, 0, 0.2, 1)", userSelect: "none" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".toggle-btn:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 50%, transparent)" } }, ':is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, ':is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]):hover:not(:disabled), \n .toggle-btn.active:not([aria-pressed]):hover:not(:disabled)': { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container) 90%, transparent)" } }, '.toggle-btn-primary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-primary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, '.toggle-btn-secondary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-secondary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)", borderColor: "var(--color-secondary)" } }, '.toggle-btn-tertiary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-tertiary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)", borderColor: "var(--color-tertiary)" } }, '.toggle-btn-info:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-info.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)", borderColor: "var(--color-info)" } }, '.toggle-btn-success:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-success.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)", borderColor: "var(--color-success)" } }, '.toggle-btn-warning:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-warning.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)", borderColor: "var(--color-warning)" } }, '.toggle-btn-error:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-error.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)", borderColor: "var(--color-error)" } }, '.toggle-btn-accent:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-accent.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", borderColor: "var(--color-accent)" } }, '.toggle-btn-neutral:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-neutral.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", borderColor: "var(--color-neutral)" } }, '.toggle-btn-base:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-base.active:not([aria-pressed])': { "@layer components": { color: "var(--color-base-content)", backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-content)" } }, ".toggle-btn-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toggle-btn-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".toggle-btn-ghost.toggle-btn-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toggle-btn-ghost.toggle-btn-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toggle-btn-ghost.toggle-btn-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toggle-btn-ghost.toggle-btn-info": { "@layer components": { color: "var(--color-info)" } }, ".toggle-btn-ghost.toggle-btn-success": { "@layer components": { color: "var(--color-success)" } }, ".toggle-btn-ghost.toggle-btn-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toggle-btn-ghost.toggle-btn-error": { "@layer components": { color: "var(--color-error)" } }, ".toggle-btn-ghost.toggle-btn-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toggle-btn-ghost.toggle-btn-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toggle-btn-ghost.toggle-btn-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toggle-btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle-btn:disabled, \n .toggle-btn-disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed", pointerEvents: "none" } }, ".toggle-btn-sm": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem", gap: "0.375rem" } }, ".toggle-btn-lg": { "@layer components": { padding: "0.75rem 1.25rem", fontSize: "1rem", gap: "0.625rem" } }, ".toggle-group": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", padding: "0.25rem", backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 30%, transparent)" } }, ".toggle-group .toggle-btn": { "@layer components": { border: "none", borderRadius: "var(--radius-xs)", margin: "0" } }, ".toggle-group .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0.125rem" } }, ".toggle-group-vertical": { "@layer components": { flexDirection: "column" } }, ".toggle-group-vertical .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0", marginBottom: "0.125rem" } }, ".toggle-group-exclusive .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-btn-icon-only": { "@layer components": { padding: "0.625rem", aspectRatio: "1" } }, ".toggle-btn-icon-only.toggle-btn-sm": { "@layer components": { padding: "0.5rem" } }, ".toggle-btn-icon-only.toggle-btn-lg": { "@layer components": { padding: "0.875rem" } }, ".toggle-icon": { "@layer components": { width: "1.125rem", height: "1.125rem", flexShrink: 0 } }, ".toggle-segmented": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", padding: "0.25rem" } }, ".toggle-segmented .toggle-btn": { "@layer components": { border: "none", backgroundColor: "transparent", borderRadius: "var(--radius-xs)" } }, '.toggle-segmented .toggle-btn:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-segmented .toggle-btn.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-surface-variant)", borderColor: "transparent", boxShadow: "var(--shadow-sm)" } }, ".toggle-chip": { "@layer components": { borderRadius: "var(--radius-lg)", padding: "0.5rem 1rem" } }, '.toggle-chip:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-chip.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary-container)" } }, ".toggle-outlined": { "@layer components": { backgroundColor: "transparent" } }, '.toggle-outlined:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-outlined.active:not([aria-pressed])': { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".toggle-filled": { "@layer components": { backgroundColor: "var(--color-surface-variant)", border: "none" } }, '.toggle-filled:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-filled.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".toggle-badge": { "@layer components": { position: "relative" } }, ".toggle-badge::after": { "@layer components": { content: '""', position: "absolute", top: "0.25rem", right: "0.25rem", width: "0.5rem", height: "0.5rem", backgroundColor: "var(--color-error)", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".toggle-full": { "@layer components": { width: "100%" } }, ".toggle-group-full": { "@layer components": { width: "100%" } }, ".toggle-group-full .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-loading": { "@layer components": { position: "relative", pointerEvents: "none" } }, ".toggle-loading::after": [{ "@layer components": { content: '""', position: "absolute", top: "50%", left: "50%", width: "1rem", height: "1rem", marginTop: "-0.5rem", marginLeft: "-0.5rem", border: "2px solid currentColor", borderTopColor: "transparent", borderRadius: "var(--radius-full)", animation: "toggle-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toggle-spin": { "0%": { transform: "rotate(0deg)" }, "100%": { transform: "rotate(360deg)" } }, ".time-input": { "@layer components": { position: "relative", display: "inline-flex", alignItems: "center", width: "100%" } }, ".time-input-field": { "@layer components": { display: "flex", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".time-input-field:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-input-field:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".time-input-icon": { "@layer components": { position: "absolute", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", pointerEvents: "none" } }, ".time-input-segments": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.125rem", padding: "0.75rem 1rem", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)" } }, ".time-input-segment": { "@layer components": { width: "2rem", padding: "0.25rem", fontSize: "1rem", fontWeight: 500, textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", outline: "none", transition: "background-color 150ms ease-in-out" } }, ".time-input-segment:focus": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-separator": { "@layer components": { fontSize: "1rem", fontWeight: 500, color: "var(--color-on-surface-variant)" } }, ".time-input-period": { "@layer components": { display: "inline-flex", marginLeft: "0.5rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-xs)", padding: "0.125rem" } }, ".time-input-period-btn": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".time-input-period-btn:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".time-input-period-btn-active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".time-input-sm .time-input-field": { "@layer components": { padding: "0.5rem 2rem 0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".time-input-sm .time-input-segment": { "@layer components": { width: "1.75rem", fontSize: "0.875rem" } }, ".time-input-lg .time-input-field": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".time-input-lg .time-input-segment": { "@layer components": { width: "2.5rem", fontSize: "1.125rem" } }, ".time-input-filled .time-input-field, \n .time-input-filled .time-input-segments": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".time-input-filled .time-input-field:focus, \n .time-input-filled .time-input-segments:focus-within": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".time-input-primary .time-input-field, \n .time-input-primary .time-input-segments": { "@layer components": { color: "var(--color-primary)" } }, ".time-input-primary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".time-input-secondary .time-input-field, \n .time-input-secondary .time-input-segments": { "@layer components": { color: "var(--color-secondary)" } }, ".time-input-secondary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".time-input-tertiary .time-input-field, \n .time-input-tertiary .time-input-segments": { "@layer components": { color: "var(--color-tertiary)" } }, ".time-input-tertiary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".time-input-info .time-input-field, \n .time-input-info .time-input-segments": { "@layer components": { color: "var(--color-info)" } }, ".time-input-info .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".time-input-success .time-input-field, \n .time-input-success .time-input-segments": { "@layer components": { color: "var(--color-success)" } }, ".time-input-success .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".time-input-warning .time-input-field, \n .time-input-warning .time-input-segments": { "@layer components": { color: "var(--color-warning)" } }, ".time-input-warning .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".time-input-error .time-input-field, \n .time-input-error .time-input-segments": { "@layer components": { color: "var(--color-error)" } }, ".time-input-error .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".time-input-accent .time-input-field, \n .time-input-accent .time-input-segments": { "@layer components": { color: "var(--color-accent)" } }, ".time-input-accent .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".time-input-neutral .time-input-field, \n .time-input-neutral .time-input-segments": { "@layer components": { color: "var(--color-neutral)" } }, ".time-input-neutral .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".time-input-base .time-input-field, \n .time-input-base .time-input-segments": { "@layer components": { color: "var(--color-base-content)" } }, ".time-input-base .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".time-input-ghost .time-input-field, \n .time-input-ghost .time-input-segments": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".time-input-ghost .time-input-field:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-picker-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", zIndex: 50, display: "none", minWidth: "12rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)" } }, ".time-picker-dropdown-open": { "@layer components": { display: "block" } }, ".time-picker-columns": { "@layer components": { display: "flex", gap: "0.5rem", maxHeight: "12rem" } }, ".time-picker-column": { "@layer components": { flex: 1, display: "flex", flexDirection: "column", gap: "0.125rem", overflowY: "auto" } }, ".time-picker-option": { "@layer components": { padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".time-picker-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-picker-option-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-field, \n .time-input-segment, \n .time-input-period-btn, \n .time-picker-option": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".tree-select": [{ "@layer components": { position: "relative", display: "inline-flex", flexDirection: "column", width: "100%" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { anchorName: "--tree-select" } } }], ".tree-select-trigger": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".tree-select-trigger:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-trigger:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tree-select-trigger:disabled, \n .tree-select-trigger[aria-disabled="true"]': { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, "div.tree-select-trigger": { "@layer components": { userSelect: "none" } }, "div.tree-select-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-value": { "@layer components": { flex: 1, display: "flex", alignItems: "center", gap: "0.5rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--color-on-surface-variant)" } }, ".tree-select-value-selected": { "@layer components": { color: "var(--color-on-surface)" } }, ".tree-select-path": { "@layer components": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-open .tree-select-arrow": { "@layer components": { transform: "rotate(180deg)" } }, ".tree-select-clear": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", flexShrink: 0, transition: "background-color 150ms ease-in-out" } }, ".tree-select-clear:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-clear svg": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", right: "0", zIndex: 50, display: "none", maxHeight: "20rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", overflowY: "auto" } }, ".tree-select-open .tree-select-dropdown": { "@layer components": { display: "block" } }, ".tree-select-dropdown[popover]": [{ "@layer components": { position: "absolute", inset: "unset", margin: "0", border: "1px solid var(--color-outline-variant)" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { positionAnchor: "--tree-select", top: "anchor(bottom)", left: "anchor(left)", right: "anchor(right)", positionTryFallbacks: "flip-block" } } }], ".tree-select-dropdown[popover]:popover-open": { "@layer components": { display: "block" } }, ".tree-select-search": { "@layer components": { display: "flex", padding: "0.5rem", marginBottom: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".tree-select-search-input": { "@layer components": { flex: 1, padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-xs)", outline: "none" } }, ".tree-select-search-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-options": { "@layer components": { display: "flex", flexDirection: "column" } }, ".tree-select-node": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".tree-select-node:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-node-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".tree-select-node-selected:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".tree-select-node-leaf": { "@layer components": { paddingLeft: "2rem" } }, ".tree-select-node-toggle": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-node-toggle:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-node-expanded .tree-select-node-toggle, \n .tree-select-node-expanded > .tree-select-node-toggle": { "@layer components": { transform: "rotate(90deg)" } }, ".tree-select-node-icon": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-node-label": { "@layer components": { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-node-custom-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".tree-select-children": { "@layer components": { display: "none", paddingLeft: "1.5rem" } }, ".tree-select-node-expanded + .tree-select-children": { "@layer components": { display: "block" } }, ".tree-select-checkbox": { "@layer components": { display: "flex", alignItems: "center", cursor: "pointer" } }, ".tree-select-checkbox-input": { "@layer components": { position: "absolute", width: "0", height: "0", opacity: 0 } }, ".tree-select-checkbox-box": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", backgroundColor: "transparent", border: "2px solid var(--color-on-surface-variant)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box::after": { "@layer components": { content: "''", display: "block", width: "0.375rem", height: "0.625rem", border: "2px solid var(--color-primary-content)", borderWidth: "0 2px 2px 0", transform: "rotate(45deg) translateY(-1px)" } }, ".tree-select-empty": { "@layer components": { padding: "1rem", textAlign: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".tree-select-sm .tree-select-trigger": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".tree-select-lg .tree-select-trigger": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".tree-select-outlined .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)" } }, ".tree-select-filled .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".tree-select-filled .tree-select-trigger:focus": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".tree-select-multiple .tree-select-value": { "@layer components": { flexWrap: "wrap", gap: "0.25rem" } }, ".tree-select-primary .tree-select-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".tree-select-primary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".tree-select-secondary .tree-select-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".tree-select-secondary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".tree-select-tertiary .tree-select-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".tree-select-tertiary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".tree-select-info .tree-select-trigger": { "@layer components": { color: "var(--color-info)" } }, ".tree-select-info .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".tree-select-success .tree-select-trigger": { "@layer components": { color: "var(--color-success)" } }, ".tree-select-success .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".tree-select-warning .tree-select-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".tree-select-warning .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".tree-select-error .tree-select-trigger": { "@layer components": { color: "var(--color-error)" } }, ".tree-select-error .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".tree-select-accent .tree-select-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".tree-select-accent .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".tree-select-neutral .tree-select-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".tree-select-neutral .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".tree-select-base .tree-select-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".tree-select-base .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".tree-select-ghost .tree-select-trigger": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".tree-select-ghost .tree-select-trigger:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-disabled .tree-select-trigger": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".tree-select-loading .tree-select-trigger": { "@layer components": { cursor: "wait" } }, ".tree-select-spinner": [{ "@layer components": { display: "inline-block", width: "1rem", height: "1rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "tree-select-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes tree-select-spin": { to: { transform: "rotate(360deg)" } }, ".tree-select-tags": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", flex: 1 } }, ".tree-select-tag": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", padding: "0.125rem 0.5rem", fontSize: "0.75rem", backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "var(--radius-lg)" } }, ".tree-select-tag-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "0.875rem", height: "0.875rem", padding: "0", color: "inherit", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", opacity: 0.7 } }, ".tree-select-tag-remove:hover": { "@layer components": { opacity: 1, backgroundColor: "color-mix(in oklch, currentColor 10%, transparent)" } }, ".tree-select-trigger, \n .tree-select-arrow, \n .tree-select-node-toggle, \n .tree-select-node, \n .tree-select-checkbox-box": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".alert": { "@layer components": { display: "flex", alignItems: "flex-start", gap: "0.75rem", padding: "1rem", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".alert-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".alert-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".alert-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem" } }, ".alert-description": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", opacity: 0.9 } }, ".alert-close": [{ "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "currentColor", opacity: 0.7, backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "opacity 150ms ease-in-out", flexShrink: 0, marginLeft: "auto" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".alert-close:hover": { "@layer components": { opacity: 1 } }, ".alert-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".alert-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)", borderColor: "transparent" } }, ".alert-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)", borderColor: "transparent" } }, ".alert-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)", borderColor: "transparent" } }, ".alert-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)", borderColor: "transparent" } }, ".alert-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "transparent" } }, ".alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)", borderColor: "transparent" } }, ".alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)", borderColor: "transparent" } }, ".alert-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)", borderColor: "transparent" } }, ".alert-filled.alert-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".alert-filled.alert-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".alert-filled.alert-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".alert-filled.alert-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".alert-filled.alert-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".alert-filled.alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".alert-filled.alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".alert-filled.alert-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".alert-filled.alert-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".alert-filled.alert-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".alert-outlined": { "@layer components": { backgroundColor: "transparent" } }, ".alert-outlined.alert-info": { "@layer components": { borderColor: "var(--color-info)", color: "var(--color-info)" } }, ".alert-outlined.alert-success": { "@layer components": { borderColor: "var(--color-success)", color: "var(--color-success)" } }, ".alert-outlined.alert-warning": { "@layer components": { borderColor: "var(--color-warning)", color: "var(--color-warning)" } }, ".alert-outlined.alert-error": { "@layer components": { borderColor: "var(--color-error)", color: "var(--color-error)" } }, ".alert-outlined.alert-primary": { "@layer components": { borderColor: "var(--color-primary)", color: "var(--color-primary)" } }, ".alert-outlined.alert-secondary": { "@layer components": { borderColor: "var(--color-secondary)", color: "var(--color-secondary)" } }, ".alert-outlined.alert-tertiary": { "@layer components": { borderColor: "var(--color-tertiary)", color: "var(--color-tertiary)" } }, ".alert-outlined.alert-accent": { "@layer components": { borderColor: "var(--color-accent)", color: "var(--color-accent)" } }, ".alert-outlined.alert-neutral": { "@layer components": { borderColor: "var(--color-neutral)", color: "var(--color-neutral)" } }, ".alert-outlined.alert-base": { "@layer components": { borderColor: "var(--color-base-content)", color: "var(--color-base-content)" } }, ".alert-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".alert-ghost.alert-primary": { "@layer components": { color: "var(--color-primary)" } }, ".alert-ghost.alert-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".alert-ghost.alert-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".alert-ghost.alert-info": { "@layer components": { color: "var(--color-info)" } }, ".alert-ghost.alert-success": { "@layer components": { color: "var(--color-success)" } }, ".alert-ghost.alert-warning": { "@layer components": { color: "var(--color-warning)" } }, ".alert-ghost.alert-error": { "@layer components": { color: "var(--color-error)" } }, ".alert-ghost.alert-accent": { "@layer components": { color: "var(--color-accent)" } }, ".alert-ghost.alert-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".alert-ghost.alert-base": { "@layer components": { color: "var(--color-base-content)" } }, ".alert-dismissible": { "@layer components": { paddingRight: "2.5rem", position: "relative" } }, ".alert-dismissible .alert-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem" } }, ".alert-compact": { "@layer components": { padding: "0.625rem 0.875rem", gap: "0.5rem" } }, ".alert-compact .alert-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1rem" } }, ".alert-compact .alert-title, \n .alert-compact .alert-description": { "@layer components": { fontSize: "0.8125rem" } }, ".alert-actions": { "@layer components": { display: "flex", gap: "0.5rem", marginTop: "0.5rem" } }, ".alert-filled .alert-actions .btn-text": { "@layer components": { color: "inherit" } }, ".alert-filled .alert-actions .btn-text:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, currentColor 12%, transparent)" } }, ".alert-banner": { "@layer components": { borderRadius: "0", borderLeft: "none", borderRight: "none" } }, "dialog.dialog": { "@layer components": { position: "fixed", margin: "auto", padding: "0", border: "none", width: "100%", maxWidth: "28rem", maxHeight: "calc(100vh - 4rem)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-2xl)", boxShadow: "var(--shadow-2xl)", overflow: "hidden" } }, "dialog.dialog::backdrop": { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)" } }, ".dialog-box": [{ "@layer components": { display: "flex", flexDirection: "column", maxHeight: "calc(100vh - 4rem)", overflow: "hidden" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".dialog-header": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", padding: "1.5rem 1.5rem 0" } }, ".dialog-title": { "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", margin: "0", color: "var(--color-on-surface)" } }, ".dialog-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0 } }, ".dialog-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".dialog-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".dialog-body": { "@layer components": { padding: "1rem 1.5rem", overflowY: "auto", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".dialog-footer": { "@layer components": { display: "flex", justifyContent: "flex-end", gap: "0.5rem", padding: "1rem 1.5rem 1.5rem" } }, ".dialog-footer-start": { "@layer components": { justifyContent: "flex-start" } }, ".dialog-footer-center": { "@layer components": { justifyContent: "center" } }, ".dialog-footer-between": { "@layer components": { justifyContent: "space-between" } }, "dialog.dialog.dialog-sm": { "@layer components": { maxWidth: "20rem" } }, "dialog.dialog.dialog-lg": { "@layer components": { maxWidth: "40rem" } }, "dialog.dialog.dialog-xl": { "@layer components": { maxWidth: "56rem" } }, "dialog.dialog.dialog-fullscreen": { "@layer components": { maxWidth: "100%", maxHeight: "100%", width: "100%", height: "100%", borderRadius: "0", margin: "0" } }, "dialog.dialog.dialog-fullscreen .dialog-box": { "@layer components": { maxHeight: "100%" } }, "dialog.dialog.dialog-top": { "@layer components": { marginTop: "2rem", marginBottom: "auto" } }, "dialog.dialog.dialog-bottom": { "@layer components": { marginTop: "auto", marginBottom: "2rem" } }, ".dialog-scrollable .dialog-body": { "@layer components": { maxHeight: "50vh", overflowY: "auto" } }, ".dialog-divider .dialog-header": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", paddingBottom: "1rem" } }, ".dialog-divider .dialog-footer": { "@layer components": { borderTop: "1px solid var(--color-outline-variant)", paddingTop: "1rem" } }, ".dialog": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }, ".progress": { "@layer components": { position: "relative", width: "100%", height: "0.5rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)", overflow: "hidden" } }, ".progress-bar": { "@layer components": { position: "absolute", top: "0", left: "0", height: "100%", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, ".progress-primary .progress-bar": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".progress-secondary .progress-bar": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".progress-tertiary .progress-bar": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".progress-info .progress-bar": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".progress-success .progress-bar": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".progress-warning .progress-bar": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".progress-error .progress-bar": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".progress-accent .progress-bar": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".progress-neutral .progress-bar": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".progress-base .progress-bar": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, ".progress-xs": { "@layer components": { height: "0.25rem" } }, ".progress-sm": { "@layer components": { height: "0.375rem" } }, ".progress-lg": { "@layer components": { height: "0.75rem" } }, ".progress-xl": { "@layer components": { height: "1rem" } }, ".progress-indeterminate .progress-bar": { "@layer components": { width: "30%", animation: "progress-indeterminate 1.5s infinite ease-in-out" } }, "@keyframes progress-indeterminate": { "0%": { left: "-30%" }, "100%": { left: "100%" } }, ".progress-labeled": { "@layer components": { position: "relative" } }, ".progress-label": { "@layer components": { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)", fontSize: "0.625rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-striped .progress-bar": { "@layer components": { backgroundImage: `linear-gradient(
198
+ box-shadow 150ms ease-in-out`, userSelect: "none", whiteSpace: "nowrap" } }, ".theme-controller-label:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-item:focus-visible + .theme-controller-label": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-item:checked + .theme-controller-label": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", boxShadow: "var(--shadow-xs)" } }, ".theme-controller-item:checked + .theme-controller-label:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".theme-controller": { "@layer components": { display: "inline-flex", alignItems: "stretch", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-box, 1.5rem)", padding: "0.25rem", gap: "0.125rem" } }, ".theme-controller-sm": { "@layer components": { padding: "0.125rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75)" } }, ".theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75 - 0.125rem)" } }, ".theme-controller-lg": { "@layer components": { padding: "0.375rem", gap: "0.25rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25)" } }, ".theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25 - 0.375rem)" } }, ".theme-controller-icon .theme-controller-label": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-icon.theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-icon.theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".theme-controller-trigger": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", cursor: "pointer", userSelect: "none", transition: "background-color 150ms ease-in-out", listStyle: "none" } }, ".theme-controller-trigger::-webkit-details-marker": { "@layer components": { display: "none" } }, ".theme-controller-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-trigger::after": { "@layer components": { content: "''", display: "inline-block", width: "0.5rem", height: "0.5rem", borderRight: "2px solid currentColor", borderBottom: "2px solid currentColor", transform: "rotate(45deg)", marginTop: "-0.125rem", transition: "transform 150ms ease-in-out" } }, ".theme-controller-dropdown[open] .theme-controller-trigger::after": { "@layer components": { transform: "rotate(-135deg)", marginTop: "0.125rem" } }, ".theme-controller-menu": { "@layer components": { position: "absolute", top: "calc(100% + 0.25rem)", left: "0", zIndex: 50, minWidth: "100%", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", padding: "0.25rem", boxShadow: "var(--shadow-md)", display: "flex", flexDirection: "column", gap: "0.125rem" } }, ".theme-controller-menu .theme-controller-label": { "@layer components": { width: "100%", justifyContent: "flex-start", borderRadius: "calc(var(--radius-field, 0.5rem) - 0.25rem)" } }, ".theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu": { "@layer components": { padding: "0.125rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger::after": { "@layer components": { display: "none" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown-end .theme-controller-menu": { "@layer components": { left: "auto", right: "0" } }, ".theme-controller-label, \n .theme-controller-trigger, \n .theme-controller-trigger::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".toggle-btn": [{ "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.625rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 0.2s cubic-bezier(0.4, 0, 0.2, 1)", userSelect: "none" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".toggle-btn:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 50%, transparent)" } }, ':is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, ':is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]):hover:not(:disabled), \n .toggle-btn.active:not([aria-pressed]):hover:not(:disabled)': { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container) 90%, transparent)" } }, '.toggle-btn-primary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-primary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, '.toggle-btn-secondary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-secondary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)", borderColor: "var(--color-secondary)" } }, '.toggle-btn-tertiary:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-tertiary.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)", borderColor: "var(--color-tertiary)" } }, '.toggle-btn-info:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-info.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)", borderColor: "var(--color-info)" } }, '.toggle-btn-success:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-success.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)", borderColor: "var(--color-success)" } }, '.toggle-btn-warning:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-warning.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)", borderColor: "var(--color-warning)" } }, '.toggle-btn-error:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-error.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)", borderColor: "var(--color-error)" } }, '.toggle-btn-accent:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-accent.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", borderColor: "var(--color-accent)" } }, '.toggle-btn-neutral:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-neutral.active:not([aria-pressed])': { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", borderColor: "var(--color-neutral)" } }, '.toggle-btn-base:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-btn-base.active:not([aria-pressed])': { "@layer components": { color: "var(--color-base-content)", backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-content)" } }, ".toggle-btn-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toggle-btn-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".toggle-btn-ghost.toggle-btn-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toggle-btn-ghost.toggle-btn-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toggle-btn-ghost.toggle-btn-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toggle-btn-ghost.toggle-btn-info": { "@layer components": { color: "var(--color-info)" } }, ".toggle-btn-ghost.toggle-btn-success": { "@layer components": { color: "var(--color-success)" } }, ".toggle-btn-ghost.toggle-btn-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toggle-btn-ghost.toggle-btn-error": { "@layer components": { color: "var(--color-error)" } }, ".toggle-btn-ghost.toggle-btn-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toggle-btn-ghost.toggle-btn-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toggle-btn-ghost.toggle-btn-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toggle-btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle-btn:disabled, \n .toggle-btn-disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed", pointerEvents: "none" } }, ".toggle-btn-sm": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem", gap: "0.375rem" } }, ".toggle-btn-lg": { "@layer components": { padding: "0.75rem 1.25rem", fontSize: "1rem", gap: "0.625rem" } }, ".toggle-group": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", padding: "0.25rem", backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 30%, transparent)" } }, ".toggle-group .toggle-btn": { "@layer components": { border: "none", borderRadius: "var(--radius-xs)", margin: "0" } }, ".toggle-group .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0.125rem" } }, ".toggle-group-vertical": { "@layer components": { flexDirection: "column" } }, ".toggle-group-vertical .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0", marginBottom: "0.125rem" } }, ".toggle-group-exclusive .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-btn-icon-only": { "@layer components": { padding: "0.625rem", aspectRatio: "1" } }, ".toggle-btn-icon-only.toggle-btn-sm": { "@layer components": { padding: "0.5rem" } }, ".toggle-btn-icon-only.toggle-btn-lg": { "@layer components": { padding: "0.875rem" } }, ".toggle-icon": { "@layer components": { width: "1.125rem", height: "1.125rem", flexShrink: 0 } }, ".toggle-segmented": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", padding: "0.25rem" } }, ".toggle-segmented .toggle-btn": { "@layer components": { border: "none", backgroundColor: "transparent", borderRadius: "var(--radius-xs)" } }, '.toggle-segmented .toggle-btn:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-segmented .toggle-btn.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-surface-variant)", borderColor: "transparent", boxShadow: "var(--shadow-sm)" } }, ".toggle-chip": { "@layer components": { borderRadius: "var(--radius-lg)", padding: "0.5rem 1rem" } }, '.toggle-chip:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-chip.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary-container)" } }, ".toggle-outlined": { "@layer components": { backgroundColor: "transparent" } }, '.toggle-outlined:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-outlined.active:not([aria-pressed])': { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".toggle-filled": { "@layer components": { backgroundColor: "var(--color-surface-variant)", border: "none" } }, '.toggle-filled:is(.toggle-btn-active:not([aria-pressed]), .toggle-btn[aria-pressed="true"]), \n .toggle-filled.active:not([aria-pressed])': { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".toggle-badge": { "@layer components": { position: "relative" } }, ".toggle-badge::after": { "@layer components": { content: '""', position: "absolute", top: "0.25rem", right: "0.25rem", width: "0.5rem", height: "0.5rem", backgroundColor: "var(--color-error)", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".toggle-full": { "@layer components": { width: "100%" } }, ".toggle-group-full": { "@layer components": { width: "100%" } }, ".toggle-group-full .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-loading": { "@layer components": { position: "relative", pointerEvents: "none" } }, ".toggle-loading::after": [{ "@layer components": { content: '""', position: "absolute", top: "50%", left: "50%", width: "1rem", height: "1rem", marginTop: "-0.5rem", marginLeft: "-0.5rem", border: "2px solid currentColor", borderTopColor: "transparent", borderRadius: "var(--radius-full)", animation: "toggle-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toggle-spin": { "0%": { transform: "rotate(0deg)" }, "100%": { transform: "rotate(360deg)" } }, ".time-input": { "@layer components": { position: "relative", display: "inline-flex", alignItems: "center", width: "100%" } }, ".time-input-field": { "@layer components": { display: "flex", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".time-input-field:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-input-field:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".time-input-icon": { "@layer components": { position: "absolute", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", pointerEvents: "none" } }, ".time-input-segments": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.125rem", padding: "0.75rem 1rem", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)" } }, ".time-input-segment": { "@layer components": { width: "2rem", padding: "0.25rem", fontSize: "1rem", fontWeight: 500, textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", outline: "none", transition: "background-color 150ms ease-in-out" } }, ".time-input-segment:focus": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-separator": { "@layer components": { fontSize: "1rem", fontWeight: 500, color: "var(--color-on-surface-variant)" } }, ".time-input-period": { "@layer components": { display: "inline-flex", marginLeft: "0.5rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-xs)", padding: "0.125rem" } }, ".time-input-period-btn": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".time-input-period-btn:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".time-input-period-btn-active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".time-input-sm .time-input-field": { "@layer components": { padding: "0.5rem 2rem 0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".time-input-sm .time-input-segment": { "@layer components": { width: "1.75rem", fontSize: "0.875rem" } }, ".time-input-lg .time-input-field": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".time-input-lg .time-input-segment": { "@layer components": { width: "2.5rem", fontSize: "1.125rem" } }, ".time-input-filled .time-input-field, \n .time-input-filled .time-input-segments": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".time-input-filled .time-input-field:focus, \n .time-input-filled .time-input-segments:focus-within": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".time-input-primary .time-input-field, \n .time-input-primary .time-input-segments": { "@layer components": { color: "var(--color-primary)" } }, ".time-input-primary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".time-input-secondary .time-input-field, \n .time-input-secondary .time-input-segments": { "@layer components": { color: "var(--color-secondary)" } }, ".time-input-secondary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".time-input-tertiary .time-input-field, \n .time-input-tertiary .time-input-segments": { "@layer components": { color: "var(--color-tertiary)" } }, ".time-input-tertiary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".time-input-info .time-input-field, \n .time-input-info .time-input-segments": { "@layer components": { color: "var(--color-info)" } }, ".time-input-info .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".time-input-success .time-input-field, \n .time-input-success .time-input-segments": { "@layer components": { color: "var(--color-success)" } }, ".time-input-success .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".time-input-warning .time-input-field, \n .time-input-warning .time-input-segments": { "@layer components": { color: "var(--color-warning)" } }, ".time-input-warning .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".time-input-error .time-input-field, \n .time-input-error .time-input-segments": { "@layer components": { color: "var(--color-error)" } }, ".time-input-error .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".time-input-accent .time-input-field, \n .time-input-accent .time-input-segments": { "@layer components": { color: "var(--color-accent)" } }, ".time-input-accent .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".time-input-neutral .time-input-field, \n .time-input-neutral .time-input-segments": { "@layer components": { color: "var(--color-neutral)" } }, ".time-input-neutral .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".time-input-base .time-input-field, \n .time-input-base .time-input-segments": { "@layer components": { color: "var(--color-base-content)" } }, ".time-input-base .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".time-input-ghost .time-input-field, \n .time-input-ghost .time-input-segments": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".time-input-ghost .time-input-field:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-picker-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", zIndex: 50, display: "none", minWidth: "12rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)" } }, ".time-picker-dropdown-open": { "@layer components": { display: "block" } }, ".time-picker-columns": { "@layer components": { display: "flex", gap: "0.5rem", maxHeight: "12rem" } }, ".time-picker-column": { "@layer components": { flex: 1, display: "flex", flexDirection: "column", gap: "0.125rem", overflowY: "auto" } }, ".time-picker-option": { "@layer components": { padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".time-picker-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-picker-option-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-field, \n .time-input-segment, \n .time-input-period-btn, \n .time-picker-option": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".tree-select": [{ "@layer components": { position: "relative", display: "inline-flex", flexDirection: "column", width: "100%" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { anchorName: "--tree-select" } } }], ".tree-select-trigger": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".tree-select-trigger:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-trigger:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tree-select-trigger:disabled, \n .tree-select-trigger[aria-disabled="true"]': { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, "div.tree-select-trigger": { "@layer components": { userSelect: "none" } }, "div.tree-select-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-value": { "@layer components": { flex: 1, display: "flex", alignItems: "center", gap: "0.5rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--color-on-surface-variant)" } }, ".tree-select-value-selected": { "@layer components": { color: "var(--color-on-surface)" } }, ".tree-select-path": { "@layer components": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-open .tree-select-arrow": { "@layer components": { transform: "rotate(180deg)" } }, ".tree-select-clear": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", flexShrink: 0, transition: "background-color 150ms ease-in-out" } }, ".tree-select-clear:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-clear svg": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", right: "0", zIndex: 50, display: "none", maxHeight: "20rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", overflowY: "auto" } }, ".tree-select-open .tree-select-dropdown": { "@layer components": { display: "block" } }, ".tree-select-dropdown[popover]": [{ "@layer components": { position: "absolute", inset: "unset", margin: "0", border: "1px solid var(--color-outline-variant)" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { positionAnchor: "--tree-select", top: "anchor(bottom)", left: "anchor(left)", right: "anchor(right)", positionTryFallbacks: "flip-block" } } }], ".tree-select-dropdown[popover]:popover-open": { "@layer components": { display: "block" } }, ".tree-select-search": { "@layer components": { display: "flex", padding: "0.5rem", marginBottom: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".tree-select-search-input": { "@layer components": { flex: 1, padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-xs)", outline: "none" } }, ".tree-select-search-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-options": { "@layer components": { display: "flex", flexDirection: "column" } }, ".tree-select-node": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".tree-select-node:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-node-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".tree-select-node-selected:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".tree-select-node-leaf": { "@layer components": { paddingLeft: "2rem" } }, ".tree-select-node-toggle": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-node-toggle:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-node-expanded .tree-select-node-toggle, \n .tree-select-node-expanded > .tree-select-node-toggle": { "@layer components": { transform: "rotate(90deg)" } }, ".tree-select-node-icon": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-node-label": { "@layer components": { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-node-custom-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".tree-select-children": { "@layer components": { display: "none", paddingLeft: "1.5rem" } }, ".tree-select-node-expanded + .tree-select-children": { "@layer components": { display: "block" } }, ".tree-select-checkbox": { "@layer components": { display: "flex", alignItems: "center", cursor: "pointer" } }, ".tree-select-checkbox-input": { "@layer components": { position: "absolute", width: "0", height: "0", opacity: 0 } }, ".tree-select-checkbox-box": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", backgroundColor: "transparent", border: "2px solid var(--color-on-surface-variant)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box::after": { "@layer components": { content: "''", display: "block", width: "0.375rem", height: "0.625rem", border: "2px solid var(--color-primary-content)", borderWidth: "0 2px 2px 0", transform: "rotate(45deg) translateY(-1px)" } }, ".tree-select-empty": { "@layer components": { padding: "1rem", textAlign: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".tree-select-sm .tree-select-trigger": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".tree-select-lg .tree-select-trigger": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".tree-select-outlined .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)" } }, ".tree-select-filled .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".tree-select-filled .tree-select-trigger:focus": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".tree-select-multiple .tree-select-value": { "@layer components": { flexWrap: "wrap", gap: "0.25rem" } }, ".tree-select-primary .tree-select-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".tree-select-primary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".tree-select-secondary .tree-select-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".tree-select-secondary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".tree-select-tertiary .tree-select-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".tree-select-tertiary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".tree-select-info .tree-select-trigger": { "@layer components": { color: "var(--color-info)" } }, ".tree-select-info .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".tree-select-success .tree-select-trigger": { "@layer components": { color: "var(--color-success)" } }, ".tree-select-success .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".tree-select-warning .tree-select-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".tree-select-warning .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".tree-select-error .tree-select-trigger": { "@layer components": { color: "var(--color-error)" } }, ".tree-select-error .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".tree-select-accent .tree-select-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".tree-select-accent .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".tree-select-neutral .tree-select-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".tree-select-neutral .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".tree-select-base .tree-select-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".tree-select-base .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".tree-select-ghost .tree-select-trigger": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".tree-select-ghost .tree-select-trigger:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-disabled .tree-select-trigger": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".tree-select-loading .tree-select-trigger": { "@layer components": { cursor: "wait" } }, ".tree-select-spinner": [{ "@layer components": { display: "inline-block", width: "1rem", height: "1rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "tree-select-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes tree-select-spin": { to: { transform: "rotate(360deg)" } }, ".tree-select-tags": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", flex: 1 } }, ".tree-select-tag": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", padding: "0.125rem 0.5rem", fontSize: "0.75rem", backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "var(--radius-lg)" } }, ".tree-select-tag-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "0.875rem", height: "0.875rem", padding: "0", color: "inherit", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", opacity: 0.7 } }, ".tree-select-tag-remove:hover": { "@layer components": { opacity: 1, backgroundColor: "color-mix(in oklch, currentColor 10%, transparent)" } }, ".tree-select-trigger, \n .tree-select-arrow, \n .tree-select-node-toggle, \n .tree-select-node, \n .tree-select-checkbox-box": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".alert": { "@layer components": { display: "grid", gridTemplateColumns: "auto minmax(0, 1fr) auto auto", gridTemplateAreas: '"icon content actions close"', alignItems: "center", gap: "0.75rem", padding: "1rem", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".alert-icon": { "@layer components": { gridArea: "icon", display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0, alignSelf: "start" } }, ".alert-content": { "@layer components": { gridArea: "content", display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".alert-content > p": { "@layer components": { margin: "0" } }, ".alert > p": { "@layer components": { margin: "0" } }, ".alert-horizontal": { "@layer components": { display: "grid" } }, ".alert-actions-end": { "@layer components": { gridTemplateAreas: '"icon content actions close"' } }, ".alert-actions-bottom": { "@layer components": { gridTemplateColumns: "auto minmax(0, 1fr) auto", gridTemplateAreas: `"icon content close"
199
+ ". actions ."` } }, ".alert-actions-bottom .alert-actions": { "@layer components": { justifySelf: "start", marginTop: "0.5rem" } }, ".alert-vertical": { "@layer components": { display: "flex", flexDirection: "column" } }, ".alert-title": { "@layer components": { margin: "0", fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem" } }, ".alert-description": { "@layer components": { margin: "0", fontSize: "0.875rem", lineHeight: "1.25rem", opacity: 0.9 } }, ".alert-close": [{ "@layer components": { gridArea: "close", display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "currentColor", opacity: 0.7, backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "opacity 150ms ease-in-out", flexShrink: 0, marginLeft: "auto" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".alert-close:hover": { "@layer components": { opacity: 1 } }, ".alert-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".alert-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)", borderColor: "transparent" } }, ".alert-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)", borderColor: "transparent" } }, ".alert-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)", borderColor: "transparent" } }, ".alert-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)", borderColor: "transparent" } }, ".alert-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "transparent" } }, ".alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)", borderColor: "transparent" } }, ".alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)", borderColor: "transparent" } }, ".alert-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)", borderColor: "transparent" } }, ".alert-filled.alert-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".alert-filled.alert-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".alert-filled.alert-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".alert-filled.alert-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".alert-filled.alert-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".alert-filled.alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".alert-filled.alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".alert-filled.alert-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".alert-filled.alert-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".alert-filled.alert-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".alert-outlined": { "@layer components": { backgroundColor: "transparent" } }, ".alert-outlined.alert-info": { "@layer components": { borderColor: "var(--color-info)", color: "var(--color-info)" } }, ".alert-outlined.alert-success": { "@layer components": { borderColor: "var(--color-success)", color: "var(--color-success)" } }, ".alert-outlined.alert-warning": { "@layer components": { borderColor: "var(--color-warning)", color: "var(--color-warning)" } }, ".alert-outlined.alert-error": { "@layer components": { borderColor: "var(--color-error)", color: "var(--color-error)" } }, ".alert-outlined.alert-primary": { "@layer components": { borderColor: "var(--color-primary)", color: "var(--color-primary)" } }, ".alert-outlined.alert-secondary": { "@layer components": { borderColor: "var(--color-secondary)", color: "var(--color-secondary)" } }, ".alert-outlined.alert-tertiary": { "@layer components": { borderColor: "var(--color-tertiary)", color: "var(--color-tertiary)" } }, ".alert-outlined.alert-accent": { "@layer components": { borderColor: "var(--color-accent)", color: "var(--color-accent)" } }, ".alert-outlined.alert-neutral": { "@layer components": { borderColor: "var(--color-neutral)", color: "var(--color-neutral)" } }, ".alert-outlined.alert-base": { "@layer components": { borderColor: "var(--color-base-content)", color: "var(--color-base-content)" } }, ".alert-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".alert-ghost.alert-primary": { "@layer components": { color: "var(--color-primary)" } }, ".alert-ghost.alert-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".alert-ghost.alert-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".alert-ghost.alert-info": { "@layer components": { color: "var(--color-info)" } }, ".alert-ghost.alert-success": { "@layer components": { color: "var(--color-success)" } }, ".alert-ghost.alert-warning": { "@layer components": { color: "var(--color-warning)" } }, ".alert-ghost.alert-error": { "@layer components": { color: "var(--color-error)" } }, ".alert-ghost.alert-accent": { "@layer components": { color: "var(--color-accent)" } }, ".alert-ghost.alert-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".alert-ghost.alert-base": { "@layer components": { color: "var(--color-base-content)" } }, ".alert-dismissible": { "@layer components": { paddingRight: "2.5rem", paddingInlineEnd: "2.5rem", position: "relative" } }, ".alert-dismissible .alert-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem", insetInlineEnd: "0.75rem" } }, ".alert-compact": { "@layer components": { padding: "0.625rem 0.875rem", gap: "0.5rem" } }, ".alert-compact .alert-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1rem" } }, ".alert-compact .alert-title, \n .alert-compact .alert-description": { "@layer components": { fontSize: "0.8125rem" } }, ".alert-comfortable": { "@layer components": { padding: "1.25rem", gap: "1rem" } }, ".alert-actions": { "@layer components": { gridArea: "actions", display: "flex", gap: "0.5rem", marginTop: "0", flexWrap: "wrap", alignSelf: "center", justifySelf: "end" } }, ".alert-vertical .alert-actions": { "@layer components": { alignSelf: "stretch", width: "100%" } }, ".alert-filled .alert-actions .btn-text": { "@layer components": { color: "inherit" } }, ".alert-filled .alert-actions .btn-text:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, currentColor 12%, transparent)" } }, ".alert-banner": { "@layer components": { borderRadius: "0", borderLeft: "none", borderRight: "none" } }, ".alert:not(.alert-vertical) .alert-content, \n .alert-horizontal .alert-content": { "@layer components": { "@media (max-width: 32rem)": { flexBasis: "min(100%, 18rem)" } } }, ".alert:not(.alert-vertical), \n .alert-horizontal": { "@layer components": { "@media (max-width: 32rem)": { gridTemplateColumns: "auto minmax(0, 1fr) auto", gridTemplateAreas: `"icon content close"
200
+ ". actions actions"` } } }, ".alert:not(.alert-vertical).alert-actions-end, \n .alert-horizontal.alert-actions-end": { "@layer components": { "@media (max-width: 32rem)": { gridTemplateColumns: "auto minmax(0, 1fr) auto", gridTemplateAreas: `"icon content close"
201
+ ". actions actions"` } } }, ".alert:not(.alert-vertical) .alert-actions, \n .alert-horizontal .alert-actions": { "@layer components": { "@media (max-width: 32rem)": { justifySelf: "start", marginTop: "0.5rem" } } }, "dialog.dialog": [{ "@layer components": { position: "fixed", margin: "auto", padding: "0", border: "none", width: "calc(100% - 2rem)", maxWidth: "28rem", maxHeight: "calc(100dvh - 2rem)", boxSizing: "border-box", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-2xl)", boxShadow: "var(--shadow-2xl)", overflow: "hidden" } }, { "@layer components": { "@media (max-width: 640px)": { width: "calc(100% - 1rem)", maxHeight: "calc(100dvh - 1rem)", borderRadius: "var(--radius-lg)" } } }], "dialog.dialog::backdrop": { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)" } }, ".dialog-box": [{ "@layer components": { display: "flex", flexDirection: "column", maxHeight: "calc(100dvh - 2rem)", overflow: "hidden" } }, { "@layer components": { "@media (max-width: 640px)": { maxHeight: "calc(100dvh - 1rem)" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".dialog-header": [{ "@layer components": { display: "flex", alignItems: "center", gap: "1rem", padding: "1.5rem 1.5rem 0" } }, { "@layer components": { "@media (max-width: 640px)": { padding: "1rem 1rem 0" } } }], ".dialog-title": { "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", margin: "0", color: "var(--color-on-surface)" } }, ".dialog-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0 } }, ".dialog-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".dialog-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".dialog-body": [{ "@layer components": { padding: "1rem 1.5rem", overflowY: "auto", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, { "@layer components": { "@media (max-width: 640px)": { padding: "1rem" } } }], ".dialog-footer": [{ "@layer components": { display: "flex", flexWrap: "wrap", justifyContent: "flex-end", gap: "0.5rem", padding: "1rem 1.5rem 1.5rem" } }, { "@layer components": { "@media (max-width: 640px)": { padding: "0.75rem 1rem 1rem" } } }], ".dialog-footer-start": { "@layer components": { justifyContent: "flex-start" } }, ".dialog-footer-center": { "@layer components": { justifyContent: "center" } }, ".dialog-footer-between": { "@layer components": { justifyContent: "space-between" } }, "dialog.dialog.dialog-sm": { "@layer components": { maxWidth: "20rem" } }, "dialog.dialog.dialog-lg": { "@layer components": { maxWidth: "40rem" } }, "dialog.dialog.dialog-xl": { "@layer components": { maxWidth: "56rem" } }, "dialog.dialog.dialog-fullscreen": { "@layer components": { maxWidth: "100%", maxHeight: "100%", width: "100%", height: "100%", borderRadius: "0", margin: "0" } }, "dialog.dialog.dialog-fullscreen .dialog-box": { "@layer components": { maxHeight: "100%" } }, "dialog.dialog.dialog-top": { "@layer components": { marginTop: "2rem", marginBottom: "auto" } }, "dialog.dialog.dialog-bottom": { "@layer components": { marginTop: "auto", marginBottom: "2rem" } }, ".dialog-scrollable .dialog-body": { "@layer components": { maxHeight: "50vh", overflowY: "auto" } }, ".dialog-divider .dialog-header": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", paddingBottom: "1rem" } }, ".dialog-divider .dialog-footer": { "@layer components": { borderTop: "1px solid var(--color-outline-variant)", paddingTop: "1rem" } }, ".dialog": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }, ".loading": { "@layer components": { "--loading-size": "1.25rem", display: "inline-flex", width: "var(--loading-size)", height: "var(--loading-size)", flex: "0 0 var(--loading-size)", color: "currentColor", verticalAlign: "middle" } }, ".loading-spinner": { "@layer components": { border: "max(2px, calc(var(--loading-size) / 8)) solid color-mix(in oklch, currentColor 25%, transparent)", borderTopColor: "currentColor", borderRadius: "var(--radius-full)", animation: "loading-spin 800ms linear infinite" } }, ".loading-dots, \n .loading-bars": { "@layer components": { alignItems: "center", justifyContent: "center", gap: "max(2px, calc(var(--loading-size) / 8))" } }, ".loading-dots::before, \n .loading-dots::after, \n .loading-bars::before, \n .loading-bars::after": { "@layer components": { content: '""', display: "block", background: "currentColor" } }, ".loading-dots::before, \n .loading-dots::after": { "@layer components": { width: "25%", height: "25%", borderRadius: "var(--radius-full)", boxShadow: "calc(var(--loading-size) / 3) 0 currentColor", animation: "loading-dots 900ms ease-in-out infinite" } }, ".loading-dots::after": { "@layer components": { display: "none" } }, ".loading-bars": { "@layer components": { paddingInline: "10%" } }, ".loading-bars::before, \n .loading-bars::after": { "@layer components": { width: "18%", height: "65%", borderRadius: "var(--radius-xs)", boxShadow: "calc(var(--loading-size) / 3) 0 currentColor, calc(var(--loading-size) * 2 / 3) 0 currentColor", animation: "loading-bars 900ms ease-in-out infinite" } }, ".loading-bars::after": { "@layer components": { display: "none" } }, ".loading-xs": { "@layer components": { "--loading-size": "0.75rem" } }, ".loading-sm": { "@layer components": { "--loading-size": "1rem" } }, ".loading-md": { "@layer components": { "--loading-size": "1.25rem" } }, ".loading-lg": { "@layer components": { "--loading-size": "1.75rem" } }, ".loading-xl": { "@layer components": { "--loading-size": "2.5rem" } }, ".loading-primary": { "@layer components": { color: "var(--color-primary)" } }, ".loading-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".loading-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".loading-info": { "@layer components": { color: "var(--color-info)" } }, ".loading-success": { "@layer components": { color: "var(--color-success)" } }, ".loading-warning": { "@layer components": { color: "var(--color-warning)" } }, ".loading-error": { "@layer components": { color: "var(--color-error)" } }, "@keyframes loading-spin": { to: { transform: "rotate(360deg)" } }, "@keyframes loading-dots": { "0%, 100%": { opacity: 0.35, transform: "scale(0.75)" }, "50%": { opacity: 1, transform: "scale(1)" } }, "@keyframes loading-bars": { "0%, 100%": { opacity: 0.35, transform: "scaleY(0.65)" }, "50%": { opacity: 1, transform: "scaleY(1)" } }, ".loading-spinner, \n .loading-dots::before, \n .loading-bars::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }, ".progress": { "@layer components": { position: "relative", width: "100%", height: "0.5rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)", overflow: "hidden" } }, "progress.progress": { "@layer components": { appearance: "none", border: "0", display: "block" } }, "progress.progress::-webkit-progress-bar": { "@layer components": { background: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)" } }, "progress.progress::-webkit-progress-value": { "@layer components": { background: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, "progress.progress::-moz-progress-bar": { "@layer components": { background: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, "progress.progress:indeterminate::-webkit-progress-value, \n progress.progress:indeterminate::-moz-progress-bar": { "@layer components": { width: "30%", animation: "progress-indeterminate 1.5s infinite ease-in-out" } }, ".progress-bar": { "@layer components": { position: "absolute", top: "0", left: "0", height: "100%", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, ".progress-primary .progress-bar": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".progress-secondary .progress-bar": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".progress-tertiary .progress-bar": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".progress-info .progress-bar": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".progress-success .progress-bar": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".progress-warning .progress-bar": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".progress-error .progress-bar": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".progress-accent .progress-bar": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".progress-neutral .progress-bar": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".progress-base .progress-bar": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, "progress.progress-primary::-webkit-progress-value, \n progress.progress-primary::-moz-progress-bar": { "@layer components": { background: "var(--color-primary)" } }, "progress.progress-secondary::-webkit-progress-value, \n progress.progress-secondary::-moz-progress-bar": { "@layer components": { background: "var(--color-secondary)" } }, "progress.progress-tertiary::-webkit-progress-value, \n progress.progress-tertiary::-moz-progress-bar": { "@layer components": { background: "var(--color-tertiary)" } }, "progress.progress-info::-webkit-progress-value, \n progress.progress-info::-moz-progress-bar": { "@layer components": { background: "var(--color-info)" } }, "progress.progress-success::-webkit-progress-value, \n progress.progress-success::-moz-progress-bar": { "@layer components": { background: "var(--color-success)" } }, "progress.progress-warning::-webkit-progress-value, \n progress.progress-warning::-moz-progress-bar": { "@layer components": { background: "var(--color-warning)" } }, "progress.progress-error::-webkit-progress-value, \n progress.progress-error::-moz-progress-bar": { "@layer components": { background: "var(--color-error)" } }, ".progress-xs": { "@layer components": { height: "0.25rem" } }, ".progress-sm": { "@layer components": { height: "0.375rem" } }, ".progress-lg": { "@layer components": { height: "0.75rem" } }, ".progress-xl": { "@layer components": { height: "1rem" } }, ".progress-indeterminate .progress-bar": { "@layer components": { width: "30%", animation: "progress-indeterminate 1.5s infinite ease-in-out" } }, "@keyframes progress-indeterminate": { "0%": { left: "-30%" }, "100%": { left: "100%" } }, ".progress-labeled": { "@layer components": { position: "relative" } }, ".progress-label": { "@layer components": { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)", fontSize: "0.625rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-striped .progress-bar": { "@layer components": { backgroundImage: `linear-gradient(
186
202
  45deg,
187
203
  rgba(255, 255, 255, 0.15) 25%,
188
204
  transparent 25%,
@@ -191,15 +207,15 @@ var componentStyles = { ".btn": [{ "@layer components": { "--btn-p": "1.25rem",
191
207
  rgba(255, 255, 255, 0.15) 75%,
192
208
  transparent 75%,
193
209
  transparent
194
- )`, backgroundSize: "1rem 1rem" } }, ".progress-striped.progress-animated .progress-bar": { "@layer components": { animation: "progress-striped 1s linear infinite" } }, "@keyframes progress-striped": { from: { backgroundPosition: "1rem 0" }, to: { backgroundPosition: "0 0" } }, ".progress-circular": { "@layer components": { position: "relative", width: "3rem", height: "3rem", display: "inline-flex", alignItems: "center", justifyContent: "center" } }, ".progress-circular svg": { "@layer components": { width: "100%", height: "100%", transform: "rotate(-90deg)" } }, ".progress-circular-track": { "@layer components": { fill: "none", stroke: "var(--color-surface-container-highest)", strokeWidth: 4 } }, ".progress-circular-bar": { "@layer components": { fill: "none", stroke: "var(--color-primary)", strokeWidth: 4, strokeLinecap: "round", transition: "stroke-dashoffset 300ms ease-in-out" } }, ".progress-circular-label": { "@layer components": { position: "absolute", fontSize: "0.75rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-circular-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".progress-circular-sm .progress-circular-label": { "@layer components": { fontSize: "0.5rem" } }, ".progress-circular-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".progress-circular-lg .progress-circular-label": { "@layer components": { fontSize: "1rem" } }, ".progress-circular-xl": { "@layer components": { width: "6rem", height: "6rem" } }, ".progress-circular-xl .progress-circular-label": { "@layer components": { fontSize: "1.25rem" } }, ".progress-circular-indeterminate svg": { "@layer components": { animation: "progress-circular-rotate 2s linear infinite" } }, ".progress-circular-indeterminate .progress-circular-bar": { "@layer components": { strokeDasharray: "80, 200", strokeDashoffset: 0, animation: "progress-circular-dash 1.5s ease-in-out infinite" } }, "@keyframes progress-circular-rotate": { "100%": { transform: "rotate(270deg)" } }, "@keyframes progress-circular-dash": { "0%": { strokeDasharray: "1, 200", strokeDashoffset: 0 }, "50%": { strokeDasharray: "100, 200", strokeDashoffset: -15 }, "100%": { strokeDasharray: "100, 200", strokeDashoffset: -125 } }, ".progress-indeterminate .progress-bar, \n .progress-striped.progress-animated .progress-bar, \n .progress-circular-indeterminate svg, \n .progress-circular-indeterminate .progress-circular-bar": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }, ".skeleton": [{ "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderRadius: "var(--radius-xs)", animation: "skeleton-pulse 2s ease-in-out infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], ".skeleton-text": { "@layer components": { height: "1rem", width: "100%", borderRadius: "var(--radius-xs)" } }, ".skeleton-circle": { "@layer components": { borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".skeleton-rect": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-xs": { "@layer components": { height: "0.5rem" } }, ".skeleton-sm": { "@layer components": { height: "0.75rem" } }, ".skeleton-md": { "@layer components": { height: "1rem" } }, ".skeleton-lg": { "@layer components": { height: "1.5rem" } }, ".skeleton-xl": { "@layer components": { height: "2rem" } }, ".skeleton-avatar": { "@layer components": { width: "3rem", height: "3rem", borderRadius: "var(--radius-full)" } }, ".skeleton-avatar-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".skeleton-avatar-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".skeleton-button": { "@layer components": { height: "2.5rem", width: "6rem", borderRadius: "var(--radius-sm)" } }, ".skeleton-image": { "@layer components": { aspectRatio: "16 / 9", width: "100%", borderRadius: "var(--radius-sm)" } }, ".skeleton-card": { "@layer components": { width: "100%", borderRadius: "var(--radius-lg)", padding: "1rem" } }, ".skeleton-line": { "@layer components": { height: "0.875rem", width: "100%", marginBottom: "0.5rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-line:last-child": { "@layer components": { width: "75%", marginBottom: "0" } }, ".skeleton-line-short": { "@layer components": { width: "40%" } }, ".skeleton-line-medium": { "@layer components": { width: "70%" } }, "@keyframes skeleton-pulse": { "0%, 100%": { opacity: 1 }, "50%": { opacity: 0.4 } }, ".skeleton-wave": { "@layer components": { position: "relative", overflow: "hidden", animation: "none" } }, ".skeleton-wave::after": [{ "@layer components": { content: "''", position: "absolute", inset: "0", transform: "translateX(-100%)", background: `linear-gradient(
210
+ )`, backgroundSize: "1rem 1rem" } }, ".progress-striped.progress-animated .progress-bar": { "@layer components": { animation: "progress-striped 1s linear infinite" } }, "@keyframes progress-striped": { from: { backgroundPosition: "1rem 0" }, to: { backgroundPosition: "0 0" } }, ".progress-buffer": { "@layer components": { position: "relative" } }, ".progress-buffer-bar": { "@layer components": { position: "absolute", insetBlock: "0", insetInlineStart: "0", width: "0", background: "color-mix(in oklch, var(--color-primary) 30%, transparent)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, ".progress-buffer .progress-bar": { "@layer components": { zIndex: 1 } }, ".progress-circular": { "@layer components": { position: "relative", width: "3rem", height: "3rem", display: "inline-flex", alignItems: "center", justifyContent: "center" } }, ".progress-circular svg": { "@layer components": { width: "100%", height: "100%", transform: "rotate(-90deg)" } }, ".progress-circular-track": { "@layer components": { fill: "none", stroke: "var(--color-surface-container-highest)", strokeWidth: 4 } }, ".progress-circular-bar": { "@layer components": { fill: "none", stroke: "var(--color-primary)", strokeWidth: 4, strokeLinecap: "round", transition: "stroke-dashoffset 300ms ease-in-out" } }, ".progress-circular-label": { "@layer components": { position: "absolute", fontSize: "0.75rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-circular-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".progress-circular-sm .progress-circular-label": { "@layer components": { fontSize: "0.5rem" } }, ".progress-circular-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".progress-circular-lg .progress-circular-label": { "@layer components": { fontSize: "1rem" } }, ".progress-circular-xl": { "@layer components": { width: "6rem", height: "6rem" } }, ".progress-circular-xl .progress-circular-label": { "@layer components": { fontSize: "1.25rem" } }, ".progress-circular-indeterminate svg": { "@layer components": { animation: "progress-circular-rotate 2s linear infinite" } }, ".progress-circular-indeterminate .progress-circular-bar": { "@layer components": { strokeDasharray: "80, 200", strokeDashoffset: 0, animation: "progress-circular-dash 1.5s ease-in-out infinite" } }, "@keyframes progress-circular-rotate": { "100%": { transform: "rotate(270deg)" } }, "@keyframes progress-circular-dash": { "0%": { strokeDasharray: "1, 200", strokeDashoffset: 0 }, "50%": { strokeDasharray: "100, 200", strokeDashoffset: -15 }, "100%": { strokeDasharray: "100, 200", strokeDashoffset: -125 } }, ".progress-bar, \n progress.progress::-webkit-progress-value, \n progress.progress::-moz-progress-bar, \n .progress-circular-bar, \n .progress-buffer-bar": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".progress-indeterminate .progress-bar, \n progress.progress:indeterminate::-webkit-progress-value, \n progress.progress:indeterminate::-moz-progress-bar, \n .progress-striped.progress-animated .progress-bar, \n .progress-circular-indeterminate svg, \n .progress-circular-indeterminate .progress-circular-bar": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }, ".radial-progress": [{ "@layer components": { "--radial-progress-value": "0", "--radial-progress-size": "3rem", "--radial-progress-thickness": "0.375rem", "--radial-progress-track": "var(--color-surface-container-highest)", position: "relative", display: "inline-grid", width: "var(--radial-progress-size)", height: "var(--radial-progress-size)", placeItems: "center", color: "var(--color-primary)", borderRadius: "var(--radius-full)", background: "conic-gradient(currentColor calc(clamp(0, var(--radial-progress-value), 100) * 1%), var(--radial-progress-track) 0)", isolation: "isolate" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".radial-progress::before": { "@layer components": { content: '""', position: "absolute", inset: "var(--radial-progress-thickness)", zIndex: 0, borderRadius: "inherit", background: "var(--color-surface)" } }, ".radial-progress-primary": { "@layer components": { color: "var(--color-primary)" } }, ".radial-progress-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".radial-progress-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".radial-progress-info": { "@layer components": { color: "var(--color-info)" } }, ".radial-progress-success": { "@layer components": { color: "var(--color-success)" } }, ".radial-progress-warning": { "@layer components": { color: "var(--color-warning)" } }, ".radial-progress-error": { "@layer components": { color: "var(--color-error)" } }, ".radial-progress-sm": { "@layer components": { "--radial-progress-size": "2rem", "--radial-progress-thickness": "0.25rem" } }, ".radial-progress-lg": { "@layer components": { "--radial-progress-size": "4rem", "--radial-progress-thickness": "0.5rem" } }, ".radial-progress-xl": { "@layer components": { "--radial-progress-size": "6rem", "--radial-progress-thickness": "0.625rem" } }, ".skeleton": [{ "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderRadius: "var(--radius-xs)", animation: "skeleton-pulse 2s ease-in-out infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], ".skeleton-text": { "@layer components": { height: "1rem", width: "100%", borderRadius: "var(--radius-xs)" } }, ".skeleton-circle": { "@layer components": { borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".skeleton-rect": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-static": { "@layer components": { animation: "none" } }, ".skeleton-xs": { "@layer components": { height: "0.5rem" } }, ".skeleton-sm": { "@layer components": { height: "0.75rem" } }, ".skeleton-md": { "@layer components": { height: "1rem" } }, ".skeleton-lg": { "@layer components": { height: "1.5rem" } }, ".skeleton-xl": { "@layer components": { height: "2rem" } }, ".skeleton-avatar": { "@layer components": { width: "3rem", height: "3rem", borderRadius: "var(--radius-full)" } }, ".skeleton-avatar-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".skeleton-avatar-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".skeleton-button": { "@layer components": { height: "2.5rem", width: "6rem", borderRadius: "var(--radius-sm)" } }, ".skeleton-image": { "@layer components": { aspectRatio: "16 / 9", width: "100%", borderRadius: "var(--radius-sm)" } }, ".skeleton-card": { "@layer components": { width: "100%", borderRadius: "var(--radius-lg)", padding: "1rem" } }, ".skeleton-line": { "@layer components": { height: "0.875rem", width: "100%", marginBottom: "0.5rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-line:last-child": { "@layer components": { width: "75%", marginBottom: "0" } }, ".skeleton-line-short": { "@layer components": { width: "40%" } }, ".skeleton-line-medium": { "@layer components": { width: "70%" } }, "@keyframes skeleton-pulse": { "0%, 100%": { opacity: 1 }, "50%": { opacity: 0.4 } }, ".skeleton-wave": { "@layer components": { position: "relative", overflow: "hidden", animation: "none" } }, ".skeleton-wave::after": [{ "@layer components": { content: "''", position: "absolute", inset: "0", transform: "translateX(-100%)", background: `linear-gradient(
195
211
  90deg,
196
212
  transparent,
197
- rgba(255, 255, 255, 0.3),
213
+ color-mix(in oklch, var(--color-surface-bright) 35%, transparent),
198
214
  transparent
199
- )`, animation: "skeleton-wave 1.5s infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes skeleton-wave": { "100%": { transform: "translateX(100%)" } }, ".skeleton-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem" } }, ".skeleton-card-body": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-table": { "@layer components": { width: "100%" } }, ".skeleton-table-row": { "@layer components": { display: "flex", gap: "1rem", padding: "0.75rem 0", borderBottom: "1px solid var(--color-outline-variant)" } }, ".skeleton-table-cell": { "@layer components": { flex: 1, height: "1rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-list": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-list-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.5rem 0" } }, ".snackbar-container": [{ "@layer components": { position: "fixed", zIndex: 1100, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, { "@layer components": { "@media (max-width: 640px)": { left: "0", right: "0", transform: "none" } } }], ".snackbar-container-bottom": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end" } }, ".snackbar-container-top": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end" } }, ".snackbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", minWidth: "20rem", maxWidth: "40rem", padding: "0.875rem 1rem", backgroundColor: "var(--color-surface-container-highest)", color: "var(--color-on-surface)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", pointerEvents: "auto", opacity: 0, transform: "translateY(100%)", transition: "opacity 200ms ease-out, transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { minWidth: "calc(100vw - 2rem)", maxWidth: "calc(100vw - 2rem)" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms, transform 0ms" } } }], ".snackbar-container-top .snackbar, \n .snackbar-container-top-left .snackbar, \n .snackbar-container-top-right .snackbar": { "@layer components": { transform: "translateY(-100%)" } }, ".snackbar.snackbar-open, \n .snackbar.snackbar-show, \n .snackbar.show": { "@layer components": { opacity: 1, transform: "translateY(0)" } }, ".snackbar.snackbar-bottom": { "@layer components": { position: "fixed", bottom: "1rem", left: "50%", transform: "translateX(-50%) translateY(100%)", zIndex: 1100 } }, ".snackbar.snackbar-bottom.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-bottom-left": { "@layer components": { position: "fixed", bottom: "1rem", left: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-bottom-right": { "@layer components": { position: "fixed", bottom: "1rem", right: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-top": { "@layer components": { position: "fixed", top: "1rem", left: "50%", transform: "translateX(-50%) translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-top-left": { "@layer components": { position: "fixed", top: "1rem", left: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-left.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-top-right": { "@layer components": { position: "fixed", top: "1rem", right: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-bottom-left.snackbar-show, \n .snackbar.snackbar-bottom-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar-message": { "@layer components": { flex: 1, fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".snackbar-action": { "@layer components": { display: "inline-flex", alignItems: "center", padding: "0.375rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out", whiteSpace: "nowrap", flexShrink: 0 } }, ".snackbar-action:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".snackbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".snackbar-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".snackbar-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".snackbar-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".snackbar-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".snackbar-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".snackbar-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".snackbar-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".snackbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".snackbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".snackbar-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".snackbar-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".snackbar-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".snackbar-dark": { "@layer components": { backgroundColor: "var(--color-on-surface)", color: "var(--color-surface)" } }, ".snackbar-dark .snackbar-action": { "@layer components": { color: "var(--color-primary-container)" } }, ".snackbar-dark .snackbar-close": { "@layer components": { color: "var(--color-surface)" } }, ".snackbar-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, fontSize: "1.25rem" } }, ".snackbar-multiline": { "@layer components": { flexWrap: "wrap", minHeight: "4rem" } }, ".snackbar-multiline .snackbar-message": { "@layer components": { width: "100%", marginBottom: "0.5rem" } }, ".snackbar-multiline .snackbar-action": { "@layer components": { marginLeft: "auto" } }, ".snackbar-container-bottom, \n .snackbar-container-top": { "@layer components": { "@media (max-width: 640px)": { alignItems: "stretch" } } }, ".toast-container": { "@layer components": { position: "fixed", zIndex: 1200, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, ".toast-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end" } }, ".toast-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start" } }, ".toast-container-top-center": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".toast-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end" } }, ".toast-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start" } }, ".toast-container-bottom-center": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".toast": [{ "@layer components": { display: "flex", alignItems: "flex-start", gap: "0.75rem", width: "22rem", maxWidth: "calc(100vw - 2rem)", padding: "1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", pointerEvents: "auto", opacity: 0, transform: "translateX(100%)", transition: "opacity 300ms ease-out, transform 300ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms", transform: "none" } } }], ".toast-container-top-left .toast, \n .toast-container-bottom-left .toast": { "@layer components": { transform: "translateX(-100%)" } }, ".toast-container-top-center .toast, \n .toast-container-bottom-center .toast": { "@layer components": { transform: "translateY(-20px)" } }, ".toast.toast-open, \n .toast.show, \n .toast-show": { "@layer components": { opacity: 1, transform: "translateX(0) translateY(0)" } }, ".toast-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".toast-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".toast-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".toast-message": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".toast-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0, marginLeft: "auto" } }, ".toast-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".toast-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toast-actions": { "@layer components": { display: "flex", gap: "0.5rem", marginTop: "0.5rem" } }, ".toast-info": { "@layer components": { borderColor: "var(--color-info)" } }, ".toast-info .toast-icon": { "@layer components": { color: "var(--color-info)" } }, ".toast-success": { "@layer components": { borderColor: "var(--color-success)" } }, ".toast-success .toast-icon": { "@layer components": { color: "var(--color-success)" } }, ".toast-warning": { "@layer components": { borderColor: "var(--color-warning)" } }, ".toast-warning .toast-icon": { "@layer components": { color: "var(--color-warning)" } }, ".toast-error": { "@layer components": { borderColor: "var(--color-error)" } }, ".toast-error .toast-icon": { "@layer components": { color: "var(--color-error)" } }, ".toast-primary": { "@layer components": { borderColor: "var(--color-primary)" } }, ".toast-primary .toast-icon": { "@layer components": { color: "var(--color-primary)" } }, ".toast-secondary": { "@layer components": { borderColor: "var(--color-secondary)" } }, ".toast-secondary .toast-icon": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-tertiary": { "@layer components": { borderColor: "var(--color-tertiary)" } }, ".toast-tertiary .toast-icon": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-accent": { "@layer components": { borderColor: "var(--color-accent)" } }, ".toast-accent .toast-icon": { "@layer components": { color: "var(--color-accent)" } }, ".toast-neutral": { "@layer components": { borderColor: "var(--color-neutral)" } }, ".toast-neutral .toast-icon": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-base": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".toast-base .toast-icon": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-filled.toast-info": { "@layer components": { backgroundColor: "var(--color-info-container)", borderColor: "transparent", color: "var(--color-on-info-container)" } }, ".toast-filled.toast-success": { "@layer components": { backgroundColor: "var(--color-success-container)", borderColor: "transparent", color: "var(--color-on-success-container)" } }, ".toast-filled.toast-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", borderColor: "transparent", color: "var(--color-on-warning-container)" } }, ".toast-filled.toast-error": { "@layer components": { backgroundColor: "var(--color-error-container)", borderColor: "transparent", color: "var(--color-on-error-container)" } }, ".toast-filled.toast-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "transparent", color: "var(--color-on-primary-container)" } }, ".toast-filled.toast-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", borderColor: "transparent", color: "var(--color-on-secondary-container)" } }, ".toast-filled.toast-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", borderColor: "transparent", color: "var(--color-on-tertiary-container)" } }, ".toast-filled.toast-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", borderColor: "transparent", color: "var(--color-on-surface)" } }, ".toast-filled.toast-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", borderColor: "transparent", color: "var(--color-on-surface)" } }, ".toast-filled.toast-base": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "transparent", color: "var(--color-base-content)" } }, ".toast-filled .toast-title, \n .toast-filled .toast-message": { "@layer components": { color: "inherit" } }, ".toast-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toast-ghost.toast-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toast-ghost.toast-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-ghost.toast-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-ghost.toast-info": { "@layer components": { color: "var(--color-info)" } }, ".toast-ghost.toast-success": { "@layer components": { color: "var(--color-success)" } }, ".toast-ghost.toast-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toast-ghost.toast-error": { "@layer components": { color: "var(--color-error)" } }, ".toast-ghost.toast-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toast-ghost.toast-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-ghost.toast-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-ghost .toast-title, \n .toast-ghost .toast-message": { "@layer components": { color: "inherit" } }, ".toast-progress": [{ "@layer components": { position: "absolute", bottom: "0", left: "0", height: "3px", backgroundColor: "currentColor", borderRadius: "0 0 var(--radius-md) var(--radius-md)", animation: "toast-progress linear forwards" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toast-progress": { from: { width: "100%" }, to: { width: "0%" } }, ".tooltip[popover]": [{ "@layer components": { "--tooltip-bg": "var(--color-on-surface)", "--tooltip-fg": "var(--color-surface)", position: "absolute", inset: "auto", zIndex: 1000, margin: "0.5rem", padding: "0.375rem 0.75rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "nowrap", backgroundColor: "var(--tooltip-bg)", color: "var(--tooltip-fg)", border: "none", borderRadius: "var(--radius-xs)", boxShadow: "var(--shadow-md)", pointerEvents: "none", opacity: 0, transform: "scale(0.95)", overflow: "visible", positionArea: "top", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", transition: `opacity 150ms ease-out,
215
+ )`, animation: "skeleton-wave 1.5s infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none", transform: "translateX(0)", opacity: 0.35 } } }], "@keyframes skeleton-wave": { "100%": { transform: "translateX(100%)" } }, ".skeleton-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem" } }, ".skeleton-card-body": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-table": { "@layer components": { width: "100%" } }, ".skeleton-table-row": { "@layer components": { display: "flex", gap: "1rem", padding: "0.75rem 0", borderBottom: "1px solid var(--color-outline-variant)" } }, ".skeleton-table-cell": { "@layer components": { flex: 1, height: "1rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-list": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-list-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.5rem 0" } }, ".skeleton-static::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none", transform: "translateX(0)", opacity: 0.35 } } }, ".snackbar-container": [{ "@layer components": { position: "fixed", zIndex: 1100, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, { "@layer components": { "@media (max-width: 640px)": { left: "0", right: "0", transform: "none" } } }], ".snackbar-container-bottom": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end" } }, ".snackbar-container-top": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end" } }, ".snackbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", minWidth: "20rem", maxWidth: "40rem", padding: "0.875rem 1rem", backgroundColor: "var(--color-surface-container-highest)", color: "var(--color-on-surface)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", pointerEvents: "auto", opacity: 0, transform: "translateY(100%)", transition: "opacity 200ms ease-out, transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { minWidth: "calc(100vw - 2rem)", maxWidth: "calc(100vw - 2rem)" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms, transform 0ms" } } }], ".snackbar-container-top .snackbar, \n .snackbar-container-top-left .snackbar, \n .snackbar-container-top-right .snackbar": { "@layer components": { transform: "translateY(-100%)" } }, ".snackbar.snackbar-open, \n .snackbar.snackbar-show, \n .snackbar.show": { "@layer components": { opacity: 1, transform: "translateY(0)" } }, ".snackbar.snackbar-bottom": { "@layer components": { position: "fixed", bottom: "1rem", left: "50%", transform: "translateX(-50%) translateY(100%)", zIndex: 1100 } }, ".snackbar.snackbar-bottom.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-bottom-left": { "@layer components": { position: "fixed", bottom: "1rem", left: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-bottom-right": { "@layer components": { position: "fixed", bottom: "1rem", right: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-top": { "@layer components": { position: "fixed", top: "1rem", left: "50%", transform: "translateX(-50%) translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-top-left": { "@layer components": { position: "fixed", top: "1rem", left: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-left.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-top-right": { "@layer components": { position: "fixed", top: "1rem", right: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-bottom-left.snackbar-show, \n .snackbar.snackbar-bottom-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar-message": { "@layer components": { flex: 1, fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".snackbar-action": { "@layer components": { display: "inline-flex", alignItems: "center", padding: "0.375rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out", whiteSpace: "nowrap", flexShrink: 0 } }, ".snackbar-action:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".snackbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".snackbar-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".snackbar-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".snackbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".snackbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".snackbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".snackbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".snackbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".snackbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".snackbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".snackbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".snackbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".snackbar-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ":is(\n .snackbar-info,\n .snackbar-success,\n .snackbar-warning,\n .snackbar-error,\n .snackbar-primary,\n .snackbar-secondary,\n .snackbar-tertiary,\n .snackbar-accent,\n .snackbar-neutral,\n .snackbar-base\n ) :is(.snackbar-action, .snackbar-close)": { "@layer components": { color: "inherit" } }, ":is(\n .snackbar-info,\n .snackbar-success,\n .snackbar-warning,\n .snackbar-error,\n .snackbar-primary,\n .snackbar-secondary,\n .snackbar-tertiary,\n .snackbar-accent,\n .snackbar-neutral,\n .snackbar-base\n ) :is(.snackbar-action, .snackbar-close):hover": { "@layer components": { backgroundColor: "color-mix(in oklch, currentColor 12%, transparent)" } }, ".snackbar-dark": { "@layer components": { backgroundColor: "var(--color-on-surface)", color: "var(--color-surface)" } }, ".snackbar-dark .snackbar-action": { "@layer components": { color: "var(--color-primary-container)" } }, ".snackbar-dark .snackbar-close": { "@layer components": { color: "var(--color-surface)" } }, ".snackbar-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, fontSize: "1.25rem" } }, ".snackbar-multiline": { "@layer components": { flexWrap: "wrap", minHeight: "4rem" } }, ".snackbar-multiline .snackbar-message": { "@layer components": { width: "100%", marginBottom: "0.5rem" } }, ".snackbar-multiline .snackbar-action": { "@layer components": { marginLeft: "auto" } }, ".snackbar-container-bottom, \n .snackbar-container-top": { "@layer components": { "@media (max-width: 640px)": { alignItems: "stretch" } } }, ".toast-container": [{ "@layer components": { position: "fixed", zIndex: 1200, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { scrollBehavior: "auto" } } }], ":where(.toast-container[popover])": { "@layer components": { inset: "auto", width: "auto", height: "auto", margin: "0", overflow: "visible", color: "inherit", background: "transparent", border: "0" } }, ".toast-container[popover]:not(:popover-open)": { "@layer components": { display: "none" } }, ".toast-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end", paddingTop: "max(1rem, env(safe-area-inset-top))" } }, ".toast-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start", paddingTop: "max(1rem, env(safe-area-inset-top))" } }, ".toast-container-top-center": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center", paddingTop: "max(1rem, env(safe-area-inset-top))" } }, ".toast-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end", paddingBottom: "max(1rem, env(safe-area-inset-bottom))" } }, ".toast-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start", paddingBottom: "max(1rem, env(safe-area-inset-bottom))" } }, ".toast-container-bottom-center": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center", paddingBottom: "max(1rem, env(safe-area-inset-bottom))" } }, ".toast-container-top-start": { "@layer components": { top: "0", insetInlineStart: "0", alignItems: "flex-start" } }, ".toast-container-top-end": { "@layer components": { top: "0", insetInlineEnd: "0", alignItems: "flex-end" } }, ".toast-container-bottom-start": { "@layer components": { bottom: "0", insetInlineStart: "0", alignItems: "flex-start" } }, ".toast-container-bottom-end": { "@layer components": { bottom: "0", insetInlineEnd: "0", alignItems: "flex-end" } }, ".toast": [{ "@layer components": { "--_toast-accent-color": "var(--color-primary)", position: "relative", display: "flex", alignItems: "flex-start", gap: "0.75rem", width: "22rem", maxWidth: "calc(100vw - 2rem)", padding: "1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", pointerEvents: "auto", opacity: 0, transform: "translateX(100%)", transition: "opacity 300ms ease-out, transform 300ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms", transform: "none" } } }, { "@layer components": { "@media (max-width: 40rem)": { width: "100%", maxWidth: "100%" } } }], ".toast-container-top-left .toast, \n .toast-container-bottom-left .toast": { "@layer components": { transform: "translateX(-100%)" } }, ".toast-container-top-center .toast, \n .toast-container-bottom-center .toast": { "@layer components": { transform: "translateY(-20px)" } }, ".toast.toast-open, \n .toast.show, \n .toast.toast-show": { "@layer components": { opacity: 1, transform: "translateX(0) translateY(0)", visibility: "visible", pointerEvents: "auto" } }, '.toast:not(.toast-open):not(.show):not(.toast-show), \n .toast[hidden], \n .toast[inert], \n .toast[aria-hidden="true"]': { "@layer components": { pointerEvents: "none", visibility: "hidden" } }, ".toast-container[popover]:popover-open .toast": { "@layer components": { opacity: 1, transform: "translateX(0) translateY(0)", visibility: "visible", pointerEvents: "auto" } }, ".toast-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".toast-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".toast-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".toast-message": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".toast-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0, marginInlineStart: "auto" } }, ".toast-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".toast-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toast-actions": { "@layer components": { display: "flex", gap: "0.5rem", marginTop: "0.5rem", flexWrap: "wrap" } }, ".toast-action": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", width: "fit-content", minHeight: "2rem", padding: "0.375rem 0.75rem", color: "var(--color-primary)", fontSize: "0.875rem", fontWeight: 500, backgroundColor: "transparent", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer" } }, ".toast-action:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, currentColor 10%, transparent)" } }, ".toast-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toast-accent": { "@layer components": { "--_toast-accent-color": "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".toast-accent .toast-icon": { "@layer components": { color: "var(--color-accent)" } }, ".toast-info": { "@layer components": { "--_toast-accent-color": "var(--color-info)", borderColor: "var(--color-info)" } }, ".toast-info .toast-icon": { "@layer components": { color: "var(--color-info)" } }, ".toast-success": { "@layer components": { "--_toast-accent-color": "var(--color-success)", borderColor: "var(--color-success)" } }, ".toast-success .toast-icon": { "@layer components": { color: "var(--color-success)" } }, ".toast-warning": { "@layer components": { "--_toast-accent-color": "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".toast-warning .toast-icon": { "@layer components": { color: "var(--color-warning)" } }, ".toast-error": { "@layer components": { "--_toast-accent-color": "var(--color-error)", borderColor: "var(--color-error)" } }, ".toast-error .toast-icon": { "@layer components": { color: "var(--color-error)" } }, ".toast-primary": { "@layer components": { "--_toast-accent-color": "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".toast-primary .toast-icon": { "@layer components": { color: "var(--color-primary)" } }, ".toast-secondary": { "@layer components": { "--_toast-accent-color": "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".toast-secondary .toast-icon": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-tertiary": { "@layer components": { "--_toast-accent-color": "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".toast-tertiary .toast-icon": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-neutral": { "@layer components": { "--_toast-accent-color": "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".toast-neutral .toast-icon": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-base": { "@layer components": { "--_toast-accent-color": "var(--color-base-content)", borderColor: "var(--color-base-content)" } }, ".toast-base .toast-icon": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-filled.toast-accent": { "@layer components": { backgroundColor: "var(--color-accent)", borderColor: "transparent", color: "var(--color-accent-content)" } }, ".toast-filled.toast-info": { "@layer components": { backgroundColor: "var(--color-info)", borderColor: "transparent", color: "var(--color-info-content)" } }, ".toast-filled.toast-success": { "@layer components": { backgroundColor: "var(--color-success)", borderColor: "transparent", color: "var(--color-success-content)" } }, ".toast-filled.toast-warning": { "@layer components": { backgroundColor: "var(--color-warning)", borderColor: "transparent", color: "var(--color-warning-content)" } }, ".toast-filled.toast-error": { "@layer components": { backgroundColor: "var(--color-error)", borderColor: "transparent", color: "var(--color-error-content)" } }, ".toast-filled.toast-primary": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "transparent", color: "var(--color-primary-content)" } }, ".toast-filled.toast-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", borderColor: "transparent", color: "var(--color-secondary-content)" } }, ".toast-filled.toast-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", borderColor: "transparent", color: "var(--color-tertiary-content)" } }, ".toast-filled.toast-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", borderColor: "transparent", color: "var(--color-neutral-content)" } }, ".toast-filled.toast-base": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "transparent", color: "var(--color-base-content)" } }, ".toast-filled .toast-title, \n .toast-filled .toast-message, \n .toast-filled .toast-icon, \n .toast-filled .toast-close, \n .toast-filled .toast-action": { "@layer components": { color: "inherit" } }, ".toast-filled .toast-close:hover": { "@layer components": { color: "inherit", backgroundColor: "color-mix(in oklch, currentColor 12%, transparent)" } }, ".toast-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toast-ghost.toast-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toast-ghost.toast-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toast-ghost.toast-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-ghost.toast-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-ghost.toast-info": { "@layer components": { color: "var(--color-info)" } }, ".toast-ghost.toast-success": { "@layer components": { color: "var(--color-success)" } }, ".toast-ghost.toast-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toast-ghost.toast-error": { "@layer components": { color: "var(--color-error)" } }, ".toast-ghost.toast-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-ghost.toast-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-ghost .toast-title, \n .toast-ghost .toast-message": { "@layer components": { color: "inherit" } }, ".toast-sm": { "@layer components": { width: "18rem", padding: "0.75rem" } }, ".toast-lg": { "@layer components": { width: "26rem", padding: "1.25rem" } }, ".toast-compact": { "@layer components": { padding: "0.75rem", gap: "0.5rem" } }, ".toast-compact .toast-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1rem" } }, ".toast-compact .toast-title": { "@layer components": { fontSize: "0.8125rem" } }, ".toast-compact .toast-message": { "@layer components": { fontSize: "0.8125rem" } }, ".toast-accent::before": { "@layer components": { content: '""', position: "absolute", insetBlock: "0", insetInlineStart: "0", width: "0.25rem", backgroundColor: "var(--_toast-accent-color)", borderStartStartRadius: "var(--radius-md)", borderEndStartRadius: "var(--radius-md)" } }, ".toast-container-stacked .toast:not(:first-child)": { "@layer components": { marginTop: "-0.75rem", transform: "scale(0.97)", opacity: 0.9 } }, ".toast-progress": [{ "@layer components": { position: "absolute", bottom: "0", left: "0", height: "3px", backgroundColor: "currentColor", borderRadius: "0 0 var(--radius-md) var(--radius-md)", animation: "toast-progress linear forwards" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toast-progress": { from: { width: "100%" }, to: { width: "0%" } }, ".toast-container[popover]": { "@layer components": { "@media (max-width: 40rem)": { insetInline: "0", width: "100%", transform: "none", alignItems: "stretch" } } }, ".tooltip[popover]": [{ "@layer components": { "--tooltip-bg": "var(--color-on-surface)", "--tooltip-fg": "var(--color-surface)", position: "absolute", inset: "auto", zIndex: 1000, margin: "0.5rem", padding: "0.375rem 0.75rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "nowrap", backgroundColor: "var(--tooltip-bg)", color: "var(--tooltip-fg)", border: "none", borderRadius: "var(--radius-xs)", boxShadow: "var(--shadow-md)", pointerEvents: "none", opacity: 0, transform: "scale(0.95)", overflow: "visible", positionArea: "top", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", transition: `opacity 150ms ease-out,
200
216
  transform 150ms ease-out,
201
217
  overlay 150ms ease-out allow-discrete,
202
- display 150ms ease-out allow-discrete` } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".tooltip[popover]:popover-open": [{ "@layer components": { opacity: 1, transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".tooltip-top[popover]": { "@layer components": { positionArea: "top" } }, ".tooltip-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".tooltip-left[popover]": { "@layer components": { positionArea: "left" } }, ".tooltip-right[popover]": { "@layer components": { positionArea: "right" } }, ".tooltip[popover]::before": { "@layer components": { content: "''", position: "absolute", width: "0", height: "0", border: "0.375rem solid transparent" } }, ".tooltip-top[popover]::before, \n .tooltip[popover]:not(.tooltip-bottom):not(.tooltip-left):not(.tooltip-right)::before": { "@layer components": { top: "100%", left: "50%", transform: "translateX(-50%)", borderTopColor: "var(--tooltip-bg)" } }, ".tooltip-bottom[popover]::before": { "@layer components": { bottom: "100%", top: "auto", left: "50%", transform: "translateX(-50%)", borderBottomColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-left[popover]::before": { "@layer components": { left: "100%", top: "50%", bottom: "auto", transform: "translateY(-50%)", borderLeftColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-right[popover]::before": { "@layer components": { right: "100%", left: "auto", top: "50%", bottom: "auto", transform: "translateY(-50%)", borderRightColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-light[popover]": { "@layer components": { "--tooltip-bg": "var(--color-surface)", "--tooltip-fg": "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".tooltip-primary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-primary)", "--tooltip-fg": "var(--color-primary-content)" } }, ".tooltip-secondary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-secondary)", "--tooltip-fg": "var(--color-secondary-content)" } }, ".tooltip-tertiary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-tertiary)", "--tooltip-fg": "var(--color-tertiary-content)" } }, ".tooltip-info[popover]": { "@layer components": { "--tooltip-bg": "var(--color-info)", "--tooltip-fg": "var(--color-info-content)" } }, ".tooltip-success[popover]": { "@layer components": { "--tooltip-bg": "var(--color-success)", "--tooltip-fg": "var(--color-success-content)" } }, ".tooltip-warning[popover]": { "@layer components": { "--tooltip-bg": "var(--color-warning)", "--tooltip-fg": "var(--color-warning-content)" } }, ".tooltip-error[popover]": { "@layer components": { "--tooltip-bg": "var(--color-error)", "--tooltip-fg": "var(--color-error-content)" } }, ".tooltip-accent[popover]": { "@layer components": { "--tooltip-bg": "var(--color-accent)", "--tooltip-fg": "var(--color-accent-content)" } }, ".tooltip-neutral[popover]": { "@layer components": { "--tooltip-bg": "var(--color-neutral)", "--tooltip-fg": "var(--color-neutral-content)" } }, ".tooltip-base[popover]": { "@layer components": { "--tooltip-bg": "var(--color-base-100)", "--tooltip-fg": "var(--color-base-content)" } }, ".tooltip-multiline[popover]": { "@layer components": { whiteSpace: "normal", maxWidth: "16rem", textAlign: "center" } }, ".tooltip-rich[popover]": { "@layer components": { padding: "0.75rem 1rem", maxWidth: "20rem", whiteSpace: "normal", textAlign: "left" } }, ".tooltip-rich-title": { "@layer components": { fontSize: "0.8125rem", fontWeight: 600, marginBottom: "0.25rem" } }, ".tooltip-rich-description": { "@layer components": { fontSize: "0.75rem", fontWeight: 400, opacity: 0.9 } }, ".tooltip-delay": { "@layer components": { interestDelay: "300ms" } }, ".tooltip-delay-long": { "@layer components": { interestDelay: "500ms" } }, ".tooltip-interactive[popover]": { "@layer components": { pointerEvents: "auto" } }, ".appbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", width: "100%", minHeight: "4rem", padding: "0 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)" } }, { "@layer components": { "@media (max-width: 640px)": { padding: "0 0.5rem" } } }], ".appbar-static": { "@layer components": { position: "static" } }, ".appbar-fixed": { "@layer components": { position: "fixed", top: "0", left: "0", right: "0", zIndex: 1000 } }, ".appbar-sticky": { "@layer components": { position: "sticky", top: "0", zIndex: 1000 } }, ".appbar-top": { "@layer components": { top: "0" } }, ".appbar-bottom": { "@layer components": { position: "fixed", bottom: "0", left: "0", right: "0", top: "auto", zIndex: 1000 } }, ".appbar-elevated": { "@layer components": { boxShadow: "var(--shadow-sm)" } }, ".appbar-flat": { "@layer components": { boxShadow: "none" } }, ".appbar-bordered": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", boxShadow: "none" } }, ".appbar-transparent": { "@layer components": { backgroundColor: "transparent", boxShadow: "none" } }, ".appbar-blur": { "@layer components": { backdropFilter: "blur(8px)", WebkitBackdropFilter: "blur(8px)" } }, ".appbar-nav": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-nav:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-nav:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-title": [{ "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, { "@layer components": { "@media (max-width: 640px)": { fontSize: "1rem" } } }], ".appbar-subtitle": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-title-group": { "@layer components": { flex: 1, minWidth: "0" } }, ".appbar-title-group .appbar-title": { "@layer components": { fontSize: "1rem", lineHeight: "1.25rem" } }, ".appbar-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-action": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".appbar-action:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".appbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-brand": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", flexShrink: 0 } }, ".appbar-logo": { "@layer components": { height: "2rem", width: "auto" } }, ".appbar-sm": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-sm .appbar-title": { "@layer components": { fontSize: "1rem" } }, ".appbar-lg": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-lg .appbar-title": { "@layer components": { fontSize: "1.5rem" } }, ".appbar-compact": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-compact .appbar-title, \n .appbar-compact .appbar-heading": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".appbar-compact .appbar-nav, \n .appbar-compact .appbar-action, \n .appbar-compact .appbar-back": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-comfortable": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-comfortable .appbar-title, \n .appbar-comfortable .appbar-heading": { "@layer components": { fontSize: "1.5rem", lineHeight: "2rem" } }, ".appbar-leading": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-trailing": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexGrow: 1, justifyContent: "flex-end", marginLeft: "auto" } }, ".appbar-heading": { "@layer components": { fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", margin: "0", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-back": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-back:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar .appbar-search, \n input.appbar-search": { "@layer components": { flex: 1, maxWidth: "32rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar .appbar-search:focus, \n input.appbar-search:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar .appbar-search::placeholder, \n input.appbar-search::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav, \n .appbar-primary .appbar-action, \n .appbar-primary .appbar-back": { "@layer components": { color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav:hover, \n .appbar-primary .appbar-action:hover, \n .appbar-primary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".appbar-primary .appbar-subtitle": { "@layer components": { color: "var(--color-primary-content)", opacity: 0.8 } }, ".appbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav, \n .appbar-secondary .appbar-action, \n .appbar-secondary .appbar-back": { "@layer components": { color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav:hover, \n .appbar-secondary .appbar-action:hover, \n .appbar-secondary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".appbar-secondary .appbar-subtitle": { "@layer components": { color: "var(--color-secondary-content)", opacity: 0.8 } }, ".appbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav, \n .appbar-tertiary .appbar-action, \n .appbar-tertiary .appbar-back": { "@layer components": { color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav:hover, \n .appbar-tertiary .appbar-action:hover, \n .appbar-tertiary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".appbar-tertiary .appbar-subtitle": { "@layer components": { color: "var(--color-tertiary-content)", opacity: 0.8 } }, ".appbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav, \n .appbar-accent .appbar-action, \n .appbar-accent .appbar-back": { "@layer components": { color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav:hover, \n .appbar-accent .appbar-action:hover, \n .appbar-accent .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-accent)" } }, ".appbar-accent .appbar-subtitle": { "@layer components": { color: "var(--color-accent-content)", opacity: 0.8 } }, ".appbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav, \n .appbar-neutral .appbar-action, \n .appbar-neutral .appbar-back": { "@layer components": { color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav:hover, \n .appbar-neutral .appbar-action:hover, \n .appbar-neutral .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-neutral)" } }, ".appbar-neutral .appbar-subtitle": { "@layer components": { color: "var(--color-neutral-content)", opacity: 0.8 } }, ".appbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav, \n .appbar-base .appbar-action, \n .appbar-base .appbar-back": { "@layer components": { color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav:hover, \n .appbar-base .appbar-action:hover, \n .appbar-base .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-subtitle": { "@layer components": { color: "var(--color-base-content)", opacity: 0.8 } }, ".appbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav, \n .appbar-info .appbar-action, \n .appbar-info .appbar-back": { "@layer components": { color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav:hover, \n .appbar-info .appbar-action:hover, \n .appbar-info .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".appbar-info .appbar-subtitle": { "@layer components": { color: "var(--color-info-content)", opacity: 0.8 } }, ".appbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav, \n .appbar-success .appbar-action, \n .appbar-success .appbar-back": { "@layer components": { color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav:hover, \n .appbar-success .appbar-action:hover, \n .appbar-success .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".appbar-success .appbar-subtitle": { "@layer components": { color: "var(--color-success-content)", opacity: 0.8 } }, ".appbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav, \n .appbar-warning .appbar-action, \n .appbar-warning .appbar-back": { "@layer components": { color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav:hover, \n .appbar-warning .appbar-action:hover, \n .appbar-warning .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".appbar-warning .appbar-subtitle": { "@layer components": { color: "var(--color-warning-content)", opacity: 0.8 } }, ".appbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav, \n .appbar-error .appbar-action, \n .appbar-error .appbar-back": { "@layer components": { color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav:hover, \n .appbar-error .appbar-action:hover, \n .appbar-error .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".appbar-error .appbar-subtitle": { "@layer components": { color: "var(--color-error-content)", opacity: 0.8 } }, ".appbar-surface": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".appbar-surface-container": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-surface-container-low": { "@layer components": { backgroundColor: "var(--color-surface-container-low)" } }, ".appbar-surface-container-high": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-surface-container-highest": { "@layer components": { backgroundColor: "var(--color-surface-container-highest)" } }, ".appbar-center": { "@layer components": { justifyContent: "space-between" } }, ".appbar-center .appbar-title": { "@layer components": { position: "absolute", left: "50%", transform: "translateX(-50%)", flex: "none" } }, ".appbar-dense": { "@layer components": { minHeight: "3rem", padding: "0 0.5rem" } }, ".appbar-dense .appbar-nav, \n .appbar-dense .appbar-action": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-prominent": { "@layer components": { flexDirection: "column", alignItems: "flex-start", minHeight: "8rem", padding: "1rem" } }, ".appbar-prominent .appbar-row": { "@layer components": { display: "flex", alignItems: "center", width: "100%", gap: "0.5rem" } }, ".appbar-prominent .appbar-title": { "@layer components": { fontSize: "2rem", fontWeight: 400, marginTop: "auto", paddingBottom: "0.5rem" } }, ".appbar-search": [{ "@layer components": { flex: 1, maxWidth: "32rem", margin: "0 1rem" } }, { "@layer components": { "@media (max-width: 640px)": { margin: "0 0.5rem" } } }], ".appbar-search-input": { "@layer components": { width: "100%", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar-search-input:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-search-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-nav, \n .appbar-action, \n .appbar-search-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".console-page": { "@layer components": { "--console-page-sidebar-width": "17.5rem", "--console-page-sidebar-compact-width": "5rem", containerType: "inline-size", containerName: "console-page", width: "100%", minWidth: "0", minHeight: "var(--console-page-min-height, 100dvh)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)" } }, ".console-page-frame": [{ "@layer components": { display: "grid", minHeight: "inherit", gridTemplateAreas: `"appbar"
218
+ display 150ms ease-out allow-discrete` } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".tooltip[popover]:popover-open": [{ "@layer components": { opacity: 1, transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".tooltip-top[popover]": { "@layer components": { positionArea: "top" } }, ".tooltip-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".tooltip-left[popover]": { "@layer components": { positionArea: "left" } }, ".tooltip-right[popover]": { "@layer components": { positionArea: "right" } }, ".tooltip-light[popover]": { "@layer components": { "--tooltip-bg": "var(--color-surface)", "--tooltip-fg": "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".tooltip-primary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-primary)", "--tooltip-fg": "var(--color-primary-content)" } }, ".tooltip-secondary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-secondary)", "--tooltip-fg": "var(--color-secondary-content)" } }, ".tooltip-tertiary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-tertiary)", "--tooltip-fg": "var(--color-tertiary-content)" } }, ".tooltip-info[popover]": { "@layer components": { "--tooltip-bg": "var(--color-info)", "--tooltip-fg": "var(--color-info-content)" } }, ".tooltip-success[popover]": { "@layer components": { "--tooltip-bg": "var(--color-success)", "--tooltip-fg": "var(--color-success-content)" } }, ".tooltip-warning[popover]": { "@layer components": { "--tooltip-bg": "var(--color-warning)", "--tooltip-fg": "var(--color-warning-content)" } }, ".tooltip-error[popover]": { "@layer components": { "--tooltip-bg": "var(--color-error)", "--tooltip-fg": "var(--color-error-content)" } }, ".tooltip-accent[popover]": { "@layer components": { "--tooltip-bg": "var(--color-accent)", "--tooltip-fg": "var(--color-accent-content)" } }, ".tooltip-neutral[popover]": { "@layer components": { "--tooltip-bg": "var(--color-neutral)", "--tooltip-fg": "var(--color-neutral-content)" } }, ".tooltip-base[popover]": { "@layer components": { "--tooltip-bg": "var(--color-base-100)", "--tooltip-fg": "var(--color-base-content)" } }, ".tooltip-multiline[popover]": { "@layer components": { whiteSpace: "normal", maxWidth: "16rem", textAlign: "center" } }, ".tooltip-rich[popover]": { "@layer components": { padding: "0.75rem 1rem", maxWidth: "20rem", whiteSpace: "normal", textAlign: "left" } }, ".tooltip-rich-title": { "@layer components": { fontSize: "0.8125rem", fontWeight: 600, marginBottom: "0.25rem" } }, ".tooltip-rich-description": { "@layer components": { fontSize: "0.75rem", fontWeight: 400, opacity: 0.9 } }, ".tooltip-delay": { "@layer components": { interestDelay: "300ms" } }, ".tooltip-delay-long": { "@layer components": { interestDelay: "500ms" } }, ".tooltip-interactive[popover]": { "@layer components": { pointerEvents: "auto" } }, ".appbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", width: "100%", minHeight: "4rem", padding: "0 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)" } }, { "@layer components": { "@media (max-width: 640px)": { padding: "0 0.5rem" } } }], ".appbar-static": { "@layer components": { position: "static" } }, ".appbar-fixed": { "@layer components": { position: "fixed", top: "0", left: "0", right: "0", zIndex: 1000 } }, ".appbar-sticky": { "@layer components": { position: "sticky", top: "0", zIndex: 1000 } }, ".appbar-top": { "@layer components": { top: "0" } }, ".appbar-bottom": { "@layer components": { position: "fixed", bottom: "0", left: "0", right: "0", top: "auto", zIndex: 1000 } }, ".appbar-elevated": { "@layer components": { boxShadow: "var(--shadow-sm)" } }, ".appbar-flat": { "@layer components": { boxShadow: "none" } }, ".appbar-bordered": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", boxShadow: "none" } }, ".appbar-transparent": { "@layer components": { backgroundColor: "transparent", boxShadow: "none" } }, ".appbar-blur": { "@layer components": { backdropFilter: "blur(8px)", WebkitBackdropFilter: "blur(8px)" } }, ".appbar-nav": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-nav:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-nav:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-title": [{ "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, { "@layer components": { "@media (max-width: 640px)": { fontSize: "1rem" } } }], ".appbar-subtitle": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-title-group": { "@layer components": { flex: 1, minWidth: "0" } }, ".appbar-title-group .appbar-title": { "@layer components": { fontSize: "1rem", lineHeight: "1.25rem" } }, ".appbar-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-action": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".appbar-action:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".appbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-brand": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", flexShrink: 0 } }, ".appbar-logo": { "@layer components": { height: "2rem", width: "auto" } }, ".appbar-sm": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-sm .appbar-title": { "@layer components": { fontSize: "1rem" } }, ".appbar-lg": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-lg .appbar-title": { "@layer components": { fontSize: "1.5rem" } }, ".appbar-compact": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-compact .appbar-title, \n .appbar-compact .appbar-heading": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".appbar-compact .appbar-nav, \n .appbar-compact .appbar-action, \n .appbar-compact .appbar-back": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-comfortable": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-comfortable .appbar-title, \n .appbar-comfortable .appbar-heading": { "@layer components": { fontSize: "1.5rem", lineHeight: "2rem" } }, ".appbar-leading": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-trailing": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexGrow: 1, justifyContent: "flex-end", marginLeft: "auto" } }, ".appbar-heading": { "@layer components": { fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", margin: "0", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-back": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-back:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar .appbar-search, \n input.appbar-search": { "@layer components": { flex: 1, maxWidth: "32rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar .appbar-search:focus, \n input.appbar-search:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar .appbar-search::placeholder, \n input.appbar-search::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav, \n .appbar-primary .appbar-action, \n .appbar-primary .appbar-back": { "@layer components": { color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav:hover, \n .appbar-primary .appbar-action:hover, \n .appbar-primary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".appbar-primary .appbar-subtitle": { "@layer components": { color: "var(--color-primary-content)", opacity: 0.8 } }, ".appbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav, \n .appbar-secondary .appbar-action, \n .appbar-secondary .appbar-back": { "@layer components": { color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav:hover, \n .appbar-secondary .appbar-action:hover, \n .appbar-secondary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".appbar-secondary .appbar-subtitle": { "@layer components": { color: "var(--color-secondary-content)", opacity: 0.8 } }, ".appbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav, \n .appbar-tertiary .appbar-action, \n .appbar-tertiary .appbar-back": { "@layer components": { color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav:hover, \n .appbar-tertiary .appbar-action:hover, \n .appbar-tertiary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".appbar-tertiary .appbar-subtitle": { "@layer components": { color: "var(--color-tertiary-content)", opacity: 0.8 } }, ".appbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav, \n .appbar-accent .appbar-action, \n .appbar-accent .appbar-back": { "@layer components": { color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav:hover, \n .appbar-accent .appbar-action:hover, \n .appbar-accent .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-accent)" } }, ".appbar-accent .appbar-subtitle": { "@layer components": { color: "var(--color-accent-content)", opacity: 0.8 } }, ".appbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav, \n .appbar-neutral .appbar-action, \n .appbar-neutral .appbar-back": { "@layer components": { color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav:hover, \n .appbar-neutral .appbar-action:hover, \n .appbar-neutral .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-neutral)" } }, ".appbar-neutral .appbar-subtitle": { "@layer components": { color: "var(--color-neutral-content)", opacity: 0.8 } }, ".appbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav, \n .appbar-base .appbar-action, \n .appbar-base .appbar-back": { "@layer components": { color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav:hover, \n .appbar-base .appbar-action:hover, \n .appbar-base .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-subtitle": { "@layer components": { color: "var(--color-base-content)", opacity: 0.8 } }, ".appbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav, \n .appbar-info .appbar-action, \n .appbar-info .appbar-back": { "@layer components": { color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav:hover, \n .appbar-info .appbar-action:hover, \n .appbar-info .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".appbar-info .appbar-subtitle": { "@layer components": { color: "var(--color-info-content)", opacity: 0.8 } }, ".appbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav, \n .appbar-success .appbar-action, \n .appbar-success .appbar-back": { "@layer components": { color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav:hover, \n .appbar-success .appbar-action:hover, \n .appbar-success .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".appbar-success .appbar-subtitle": { "@layer components": { color: "var(--color-success-content)", opacity: 0.8 } }, ".appbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav, \n .appbar-warning .appbar-action, \n .appbar-warning .appbar-back": { "@layer components": { color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav:hover, \n .appbar-warning .appbar-action:hover, \n .appbar-warning .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".appbar-warning .appbar-subtitle": { "@layer components": { color: "var(--color-warning-content)", opacity: 0.8 } }, ".appbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav, \n .appbar-error .appbar-action, \n .appbar-error .appbar-back": { "@layer components": { color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav:hover, \n .appbar-error .appbar-action:hover, \n .appbar-error .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".appbar-error .appbar-subtitle": { "@layer components": { color: "var(--color-error-content)", opacity: 0.8 } }, ".appbar-surface": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".appbar-surface-container": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-surface-container-low": { "@layer components": { backgroundColor: "var(--color-surface-container-low)" } }, ".appbar-surface-container-high": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-surface-container-highest": { "@layer components": { backgroundColor: "var(--color-surface-container-highest)" } }, ".appbar-center": { "@layer components": { justifyContent: "space-between" } }, ".appbar-center .appbar-title": { "@layer components": { position: "absolute", left: "50%", transform: "translateX(-50%)", flex: "none" } }, ".appbar-dense": { "@layer components": { minHeight: "3rem", padding: "0 0.5rem" } }, ".appbar-dense .appbar-nav, \n .appbar-dense .appbar-action": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-prominent": { "@layer components": { flexDirection: "column", alignItems: "flex-start", minHeight: "8rem", padding: "1rem" } }, ".appbar-prominent .appbar-row": { "@layer components": { display: "flex", alignItems: "center", width: "100%", gap: "0.5rem" } }, ".appbar-prominent .appbar-title": { "@layer components": { fontSize: "2rem", fontWeight: 400, marginTop: "auto", paddingBottom: "0.5rem" } }, ".appbar-search": [{ "@layer components": { flex: 1, maxWidth: "32rem", margin: "0 1rem" } }, { "@layer components": { "@media (max-width: 640px)": { margin: "0 0.5rem" } } }], ".appbar-search-input": { "@layer components": { width: "100%", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar-search-input:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-search-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-nav, \n .appbar-action, \n .appbar-search-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".console-page": { "@layer components": { "--console-page-sidebar-width": "17.5rem", "--console-page-sidebar-compact-width": "5rem", containerType: "inline-size", containerName: "console-page", width: "100%", minWidth: "0", minHeight: "var(--console-page-min-height, 100dvh)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)" } }, ".console-page-frame": [{ "@layer components": { display: "grid", minHeight: "inherit", gridTemplateAreas: `"appbar"
203
219
  "main"`, gridTemplateColumns: "minmax(0, 1fr)", gridTemplateRows: "auto minmax(0, 1fr)", transition: "grid-template-columns 240ms ease-out" } }, { "@layer components": { "@container console-page (min-width: 48rem)": { gridTemplateAreas: `"appbar appbar"
204
220
  "sidebar main"`, gridTemplateColumns: "var(--console-page-sidebar-width) minmax(0, 1fr)" } } }], ".console-page-appbar": { "@layer components": { gridArea: "appbar", zIndex: 20 } }, ".console-page-sidebar": [{ "@layer components": { display: "none", gridArea: "sidebar", minWidth: "0", overflow: "hidden", backgroundColor: "var(--color-surface-container-low)", borderInlineEnd: "1px solid var(--color-outline-variant)", transition: `opacity 160ms ease-out,
205
221
  visibility 160ms ease-out` } }, { "@layer components": { "@container console-page (min-width: 48rem)": { display: "flex", flexDirection: "column" } } }], ".console-page-sidebar-header, \n .console-page-sidebar-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", minHeight: "4rem", padding: "0.75rem 1rem", flexShrink: 0 } }, ".console-page-sidebar-header": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)" } }, ".console-page-sidebar-body": { "@layer components": { flex: 1, minHeight: "0", overflowY: "auto", overflowX: "hidden", paddingBlock: "0.5rem" } }, ".console-page-sidebar-footer": { "@layer components": { borderTop: "1px solid var(--color-outline-variant)" } }, ".console-page-main": { "@layer components": { gridArea: "main", minWidth: "0", overflow: "auto", padding: "clamp(1rem, 4cqi, 2.5rem)", backgroundColor: "var(--color-surface)" } }, ".console-page-nav-label": { "@layer components": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".console-page-sidebar-toggle": [{ "@layer components": { display: "none" } }, { "@layer components": { "@container console-page (min-width: 48rem)": { display: "inline-flex" } } }], ".console-page-menu-trigger": [{ "@layer components": { display: "inline-flex" } }, { "@layer components": { "@container console-page (min-width: 48rem)": { display: "none" } } }], ".console-page-mobile-menu": [{ "@layer components": { maxWidth: "min(20rem, calc(100cqi - 2rem))" } }, { "@layer components": { "@container console-page (min-width: 48rem)": { display: "none" } } }], ".console-page-sidebar-compact .console-page-frame": { "@layer components": { "@container console-page (min-width: 48rem)": { gridTemplateColumns: "var(--console-page-sidebar-compact-width) minmax(0, 1fr)" } } }, ".console-page-sidebar-compact .console-page-nav-label": { "@layer components": { "@container console-page (min-width: 48rem)": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } } }, ".console-page-sidebar-compact .console-page-sidebar-header, \n .console-page-sidebar-compact .console-page-sidebar-footer": { "@layer components": { "@container console-page (min-width: 48rem)": { justifyContent: "center", paddingInline: "0.75rem" } } }, ".console-page-sidebar-compact .console-page-sidebar-body :is(.nested-menu li > a, .nested-menu li > button, .nested-menu summary)": { "@layer components": { "@container console-page (min-width: 48rem)": { justifyContent: "center", paddingInline: "0.75rem" } } }, ".console-page-sidebar-compact .console-page-sidebar-body .drawer-item": { "@layer components": { "@container console-page (min-width: 48rem)": { justifyContent: "center", paddingInline: "0.75rem" } } }, ".console-page-sidebar-compact .console-page-sidebar-body :is(.nested-menu-title, details > ul, summary::after)": { "@layer components": { "@container console-page (min-width: 48rem)": { display: "none" } } }, ".console-page-sidebar-hidden .console-page-frame": { "@layer components": { "@container console-page (min-width: 48rem)": { gridTemplateAreas: `"appbar"