@rokkit/themes 1.0.0-next.14 → 1.0.0-next.140

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 (125) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +106 -9
  3. package/build.mjs +235 -0
  4. package/dist/base.css +4934 -0
  5. package/dist/glass.css +1400 -0
  6. package/dist/index.css +10991 -0
  7. package/dist/material.css +1435 -0
  8. package/dist/minimal.css +1389 -0
  9. package/dist/rokkit.css +1829 -0
  10. package/package.json +53 -52
  11. package/src/base/breadcrumbs.css +47 -0
  12. package/src/base/button.css +254 -0
  13. package/src/base/card.css +36 -0
  14. package/src/base/carousel.css +128 -0
  15. package/src/base/connector.css +92 -0
  16. package/src/base/display.css +91 -0
  17. package/src/base/floating-action.css +388 -0
  18. package/src/base/floating-navigation.css +405 -0
  19. package/src/base/graph-paper.css +83 -0
  20. package/src/base/grid.css +93 -0
  21. package/src/base/index.css +40 -0
  22. package/src/base/input.css +238 -0
  23. package/src/base/item.css +78 -0
  24. package/src/base/list.css +179 -0
  25. package/src/base/menu.css +274 -0
  26. package/src/base/pill.css +57 -0
  27. package/src/base/progress.css +34 -0
  28. package/src/base/range.css +121 -0
  29. package/src/base/rating.css +42 -0
  30. package/src/base/reveal.css +37 -0
  31. package/src/base/search-filter.css +132 -0
  32. package/src/base/select.css +411 -0
  33. package/src/base/shine.css +14 -0
  34. package/src/base/stepper.css +140 -0
  35. package/src/base/switch.css +152 -0
  36. package/src/base/table.css +159 -0
  37. package/src/base/tabs.css +171 -0
  38. package/src/base/tilt.css +14 -0
  39. package/src/base/timeline.css +84 -0
  40. package/src/base/toggle.css +138 -0
  41. package/src/base/toolbar.css +337 -0
  42. package/src/base/tree.css +235 -0
  43. package/src/base/upload-progress.css +155 -0
  44. package/src/base/upload-target.css +67 -0
  45. package/src/glass/button.css +153 -0
  46. package/src/glass/card.css +66 -0
  47. package/src/glass/floating-action.css +61 -0
  48. package/src/glass/floating-navigation.css +74 -0
  49. package/src/glass/index.css +23 -0
  50. package/src/glass/input.css +126 -0
  51. package/src/glass/list.css +122 -0
  52. package/src/glass/menu.css +92 -0
  53. package/src/glass/range.css +61 -0
  54. package/src/glass/search-filter.css +49 -0
  55. package/src/glass/select.css +178 -0
  56. package/src/glass/switch.css +28 -0
  57. package/src/glass/table.css +87 -0
  58. package/src/glass/tabs.css +58 -0
  59. package/src/glass/timeline.css +46 -0
  60. package/src/glass/toggle.css +48 -0
  61. package/src/glass/toolbar.css +84 -0
  62. package/src/glass/tree.css +110 -0
  63. package/src/index.css +18 -0
  64. package/src/index.js +25 -2
  65. package/src/material/button.css +157 -0
  66. package/src/material/card.css +61 -0
  67. package/src/material/floating-action.css +60 -0
  68. package/src/material/floating-navigation.css +74 -0
  69. package/src/material/index.css +23 -0
  70. package/src/material/input.css +159 -0
  71. package/src/material/list.css +126 -0
  72. package/src/material/menu.css +92 -0
  73. package/src/material/range.css +62 -0
  74. package/src/material/search-filter.css +49 -0
  75. package/src/material/select.css +170 -0
  76. package/src/material/switch.css +28 -0
  77. package/src/material/table.css +91 -0
  78. package/src/material/tabs.css +62 -0
  79. package/src/material/timeline.css +46 -0
  80. package/src/material/toggle.css +48 -0
  81. package/src/material/toolbar.css +85 -0
  82. package/src/material/tree.css +103 -0
  83. package/src/minimal/button.css +155 -0
  84. package/src/minimal/card.css +61 -0
  85. package/src/minimal/floating-action.css +59 -0
  86. package/src/minimal/floating-navigation.css +70 -0
  87. package/src/minimal/index.css +23 -0
  88. package/src/minimal/input.css +119 -0
  89. package/src/minimal/list.css +126 -0
  90. package/src/minimal/menu.css +88 -0
  91. package/src/minimal/range.css +61 -0
  92. package/src/minimal/search-filter.css +49 -0
  93. package/src/minimal/select.css +170 -0
  94. package/src/minimal/switch.css +28 -0
  95. package/src/minimal/table.css +89 -0
  96. package/src/minimal/tabs.css +68 -0
  97. package/src/minimal/timeline.css +45 -0
  98. package/src/minimal/toggle.css +48 -0
  99. package/src/minimal/toolbar.css +85 -0
  100. package/src/minimal/tree.css +106 -0
  101. package/src/palette.css +7 -0
  102. package/src/rokkit/button.css +254 -0
  103. package/src/rokkit/card.css +64 -0
  104. package/src/rokkit/connector.css +11 -0
  105. package/src/rokkit/floating-action.css +65 -0
  106. package/src/rokkit/floating-navigation.css +83 -0
  107. package/src/rokkit/grid.css +46 -0
  108. package/src/rokkit/index.css +27 -0
  109. package/src/rokkit/input.css +134 -0
  110. package/src/rokkit/list.css +132 -0
  111. package/src/rokkit/menu.css +93 -0
  112. package/src/rokkit/range.css +62 -0
  113. package/src/rokkit/search-filter.css +49 -0
  114. package/src/rokkit/select.css +190 -0
  115. package/src/rokkit/switch.css +28 -0
  116. package/src/rokkit/table.css +89 -0
  117. package/src/rokkit/tabs.css +87 -0
  118. package/src/rokkit/timeline.css +46 -0
  119. package/src/rokkit/toggle.css +48 -0
  120. package/src/rokkit/toolbar.css +84 -0
  121. package/src/rokkit/tree.css +149 -0
  122. package/src/rokkit/upload-progress.css +102 -0
  123. package/src/rokkit/upload-target.css +50 -0
  124. package/src/constants.js +0 -4
  125. package/src/utils.js +0 -88
package/dist/glass.css ADDED
@@ -0,0 +1,1400 @@
1
+ /**
2
+ * @rokkit/themes - Glass Theme
3
+ *
4
+ * Glassmorphism styling with blur, transparency, and subtle borders.
5
+ * Use with data-style="glass" wrapper.
6
+ */
7
+
8
+ /**
9
+ * Button - Glass Theme Styles
10
+ *
11
+ * Glassmorphism styling with blur and transparency.
12
+ */
13
+
14
+ /* =============================================================================
15
+ Default Style (filled)
16
+ ============================================================================= */
17
+
18
+ [data-style='glass'] [data-button][data-style='default'][data-variant='default'],
19
+ [data-style='glass'] [data-button]:not([data-style])[data-variant='default'],
20
+ [data-style='glass'] [data-button][data-style='default']:not([data-variant]),
21
+ [data-style='glass'] [data-button]:not([data-style]):not([data-variant]) {
22
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-200),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
23
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="default"][data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="default"][data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button]:not([data-style])[data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button]:not([data-style])[data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button][data-style="default"]:not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="default"]:not([data-variant]),[data-mode="dark"][data-style="glass"] [data-button]:not([data-style]):not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button]:not([data-style]):not([data-variant]){border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-800),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
24
+
25
+ [data-style='glass'] [data-button][data-style='default'][data-variant='primary'],
26
+ [data-style='glass'] [data-button]:not([data-style])[data-variant='primary'] {
27
+ background-color:rgba(var(--color-primary-500),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
28
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="default"][data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="default"][data-variant="primary"],[data-mode="dark"][data-style="glass"] [data-button]:not([data-style])[data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button]:not([data-style])[data-variant="primary"]{background-color:rgba(var(--color-primary-500),0.8);}
29
+
30
+ [data-style='glass'] [data-button][data-style='default'][data-variant='secondary'],
31
+ [data-style='glass'] [data-button]:not([data-style])[data-variant='secondary'] {
32
+ background-color:rgba(var(--color-secondary-400),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
33
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="default"][data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="default"][data-variant="secondary"],[data-mode="dark"][data-style="glass"] [data-button]:not([data-style])[data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button]:not([data-style])[data-variant="secondary"]{background-color:rgba(var(--color-secondary-600),0.8);}
34
+
35
+ [data-style='glass'] [data-button][data-style='default'][data-variant='danger'],
36
+ [data-style='glass'] [data-button]:not([data-style])[data-variant='danger'] {
37
+ background-color:rgba(var(--color-danger-400),0.8);--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
38
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"][data-style="glass"] [data-button]:not([data-style])[data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button]:not([data-style])[data-variant="danger"]{background-color:rgba(var(--color-danger-600),0.8);--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));}
39
+
40
+ /* =============================================================================
41
+ Outline Style
42
+ ============================================================================= */
43
+
44
+ [data-style='glass'] [data-button][data-style='outline'][data-variant='default'],
45
+ [data-style='glass'] [data-button][data-style='outline']:not([data-variant]) {
46
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.3);background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
47
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"][data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"][data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"]:not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"]:not([data-variant]){border-color:rgba(var(--color-surface-500),0.3);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
48
+
49
+ [data-style='glass'] [data-button][data-style='outline'][data-variant='primary'] {
50
+ border-width:1px;border-color:rgba(var(--color-primary-400),0.4);background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
51
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"][data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"][data-variant="primary"]{border-color:rgba(var(--color-primary-600),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
52
+
53
+ [data-style='glass'] [data-button][data-style='outline'][data-variant='secondary'] {
54
+ border-width:1px;border-color:rgba(var(--color-secondary-400),0.4);background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));
55
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"][data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"][data-variant="secondary"]{border-color:rgba(var(--color-secondary-600),0.4);--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
56
+
57
+ [data-style='glass'] [data-button][data-style='outline'][data-variant='danger'] {
58
+ border-width:1px;border-color:rgba(var(--color-danger-400),0.4);background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));
59
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"][data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"][data-variant="danger"]{border-color:rgba(var(--color-danger-600),0.4);--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
60
+
61
+ /* =============================================================================
62
+ Ghost Style
63
+ ============================================================================= */
64
+
65
+ [data-style='glass'] [data-button][data-style='ghost'] {
66
+ border-color:transparent;background-color:transparent;
67
+ }
68
+
69
+ [data-style='glass'] [data-button][data-style='ghost'][data-variant='default'],
70
+ [data-style='glass'] [data-button][data-style='ghost']:not([data-variant]) {
71
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
72
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"][data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"][data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"]:not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"]:not([data-variant]){--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
73
+
74
+ [data-style='glass'] [data-button][data-style='ghost'][data-variant='primary'] {
75
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
76
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"][data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"][data-variant="primary"]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
77
+
78
+ [data-style='glass'] [data-button][data-style='ghost'][data-variant='secondary'] {
79
+ --un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));
80
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"][data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"][data-variant="secondary"]{--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
81
+
82
+ [data-style='glass'] [data-button][data-style='ghost'][data-variant='danger'] {
83
+ --un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));
84
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"][data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"][data-variant="danger"]{--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
85
+
86
+ /* =============================================================================
87
+ Gradient Style
88
+ ============================================================================= */
89
+
90
+ [data-style='glass'] [data-button][data-style='gradient'][data-variant='default'],
91
+ [data-style='glass'] [data-button][data-style='gradient']:not([data-variant]) {
92
+ --un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-surface-300),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-surface-100),0.6) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
93
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="gradient"][data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="gradient"][data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button][data-style="gradient"]:not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="gradient"]:not([data-variant]){--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-surface-700),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-surface-900),0.6) var(--un-gradient-to-position);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
94
+
95
+ [data-style='glass'] [data-button][data-style='gradient'][data-variant='primary'] {
96
+ --un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-primary-300),0.6) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
97
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="gradient"][data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="gradient"][data-variant="primary"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-primary-700),0.6) var(--un-gradient-to-position);}
98
+
99
+ [data-style='glass'] [data-button][data-style='gradient'][data-variant='secondary'] {
100
+ --un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-secondary-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-300),0.6) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
101
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="gradient"][data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="gradient"][data-variant="secondary"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-secondary-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-700),0.6) var(--un-gradient-to-position);}
102
+
103
+ [data-style='glass'] [data-button][data-style='gradient'][data-variant='danger'] {
104
+ --un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-danger-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-danger-300),0.6) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
105
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="gradient"][data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="gradient"][data-variant="danger"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-danger-500),0.8) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-danger-700),0.6) var(--un-gradient-to-position);--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));}
106
+
107
+ [data-style='glass']
108
+ [data-button][data-style='gradient']:hover:not(:disabled):not([data-disabled]) {
109
+ filter: brightness(1.1);
110
+ }
111
+
112
+ /* =============================================================================
113
+ Link Style
114
+ ============================================================================= */
115
+
116
+ [data-style='glass'] [data-button][data-style='link'][data-variant='default'],
117
+ [data-style='glass'] [data-button][data-style='link']:not([data-variant]) {
118
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
119
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="link"][data-variant="default"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"][data-variant="default"],[data-mode="dark"][data-style="glass"] [data-button][data-style="link"]:not([data-variant]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"]:not([data-variant]){--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
120
+
121
+ [data-style='glass'] [data-button][data-style='link'][data-variant='primary'] {
122
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
123
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="link"][data-variant="primary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"][data-variant="primary"]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
124
+
125
+ [data-style='glass'] [data-button][data-style='link'][data-variant='secondary'] {
126
+ --un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));
127
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="link"][data-variant="secondary"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"][data-variant="secondary"]{--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
128
+
129
+ [data-style='glass'] [data-button][data-style='link'][data-variant='danger'] {
130
+ --un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));
131
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="link"][data-variant="danger"],[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"][data-variant="danger"]{--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
132
+
133
+ [data-style='glass'] [data-button][data-style='link']:hover:not(:disabled):not([data-disabled]) {
134
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
135
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="link"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="link"]:hover:not(:disabled):not([data-disabled]){--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
136
+
137
+ /* =============================================================================
138
+ Hover States
139
+ ============================================================================= */
140
+
141
+ [data-style='glass'] [data-button][data-style='default']:hover:not(:disabled):not([data-disabled]),
142
+ [data-style='glass'] [data-button]:not([data-style]):hover:not(:disabled):not([data-disabled]) {
143
+ --un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
144
+ }
145
+
146
+ [data-style='glass'] [data-button][data-style='outline']:hover:not(:disabled):not([data-disabled]) {
147
+ background-color:rgba(var(--color-surface-200),0.4);
148
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="outline"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="outline"]:hover:not(:disabled):not([data-disabled]){background-color:rgba(var(--color-surface-800),0.4);}
149
+
150
+ [data-style='glass'] [data-button][data-style='ghost']:hover:not(:disabled):not([data-disabled]) {
151
+ background-color:rgba(var(--color-surface-200),0.3);
152
+ }[data-mode="dark"][data-style="glass"] [data-button][data-style="ghost"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="glass"] [data-button][data-style="ghost"]:hover:not(:disabled):not([data-disabled]){background-color:rgba(var(--color-surface-800),0.3);}
153
+
154
+ /* =============================================================================
155
+ Focus
156
+ ============================================================================= */
157
+
158
+ [data-style='glass'] [data-button]:focus-visible {
159
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
160
+ }[data-mode="dark"][data-style="glass"] [data-button]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-button]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
161
+
162
+ /* Glass Theme - Form field and input styles
163
+ * Glassmorphism inputs with blur, transparency, and subtle borders.
164
+ */
165
+
166
+ /* Field root: text color, spacing */
167
+ [data-style='glass'] [data-field-root] {
168
+ gap:0.25rem;border-radius:0.375rem;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;
169
+ }[data-mode="dark"][data-style="glass"] [data-field-root],[data-mode="dark"] [data-style="glass"] [data-field-root]{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
170
+
171
+ /* Disabled state */
172
+ [data-style='glass'] [data-field-root][data-field-disabled] [data-input-root] {
173
+ cursor:not-allowed;opacity:0.5;
174
+ }
175
+
176
+ /* Labels */
177
+ [data-style='glass'] [data-field] > label {
178
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
179
+ }[data-mode="dark"][data-style="glass"] [data-field]>label,[data-mode="dark"] [data-style="glass"] [data-field]>label{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
180
+
181
+ [data-style='glass'] [data-form-root] label {
182
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
183
+ }[data-mode="dark"][data-style="glass"] [data-form-root] label,[data-mode="dark"] [data-style="glass"] [data-form-root] label{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
184
+
185
+ /* Info field value */
186
+ [data-style='glass'] [data-field-info] {
187
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));font-weight:500;
188
+ }[data-mode="dark"][data-style="glass"] [data-field-info],[data-mode="dark"] [data-style="glass"] [data-field-info]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
189
+
190
+ /* Separator */
191
+ [data-style='glass'] [data-form-separator] {
192
+ border-color:rgba(var(--color-surface-500),0.2);
193
+ }[data-mode="dark"][data-style="glass"] [data-form-separator],[data-mode="dark"] [data-style="glass"] [data-form-separator]{border-color:rgba(var(--color-surface-500),0.2);}
194
+
195
+ /* Input root: glass container — p-0.5 gives a small gap between border and content.
196
+ * No backdrop-blur here: it creates a stacking context that traps select dropdowns.
197
+ * The semi-transparent background provides the frosted glass look. */
198
+ [data-style='glass'] [data-input-root] {
199
+ display:flex;align-items:center;border-width:1px;border-color:rgba(var(--color-surface-500),0.2);border-radius:0.375rem;background-color:rgba(var(--color-surface-100),0.7);padding:0.125rem;transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;
200
+ }[data-mode="dark"][data-style="glass"] [data-input-root],[data-mode="dark"] [data-style="glass"] [data-input-root]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);}
201
+
202
+ [data-style='glass'] [data-input-root]:hover {
203
+ border-color:rgba(var(--color-surface-500),0.3);
204
+ }[data-mode="dark"][data-style="glass"] [data-input-root]:hover,[data-mode="dark"] [data-style="glass"] [data-input-root]:hover{border-color:rgba(var(--color-surface-500),0.3);}
205
+
206
+ [data-style='glass'] [data-input-root]:focus-within {
207
+ border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-surface-100),0.7);
208
+ }[data-mode="dark"][data-style="glass"] [data-input-root]:focus-within,[data-mode="dark"] [data-style="glass"] [data-input-root]:focus-within{border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-surface-900),0.7);}
209
+
210
+ /* Standard inputs inside wrapper */
211
+ [data-style='glass'] [data-input-root] input:not([type='checkbox'], [type='radio'], [type='color']),
212
+ [data-style='glass'] [data-input-root] select {
213
+ border-radius:0.375rem;border-style:none;background-color:transparent;padding-left:0.75rem;padding-right:0.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
214
+ font-size: 0.875rem;
215
+ height: 2.25rem;
216
+ }[data-mode="dark"][data-style="glass"] [data-input-root] input:not([type="checkbox"],[type="radio"],[type="color"]),[data-mode="dark"] [data-style="glass"] [data-input-root] input:not([type="checkbox"],[type="radio"],[type="color"]),[data-mode="dark"][data-style="glass"] [data-input-root] select,[data-mode="dark"] [data-style="glass"] [data-input-root] select{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}[data-style="glass"] [data-input-root] input:not([type="checkbox"],[type="radio"],[type="color"]):focus,[data-style="glass"] [data-input-root] select:focus{outline:2px solid transparent;outline-offset:2px;}
217
+
218
+ [data-style='glass'] [data-input-root] textarea {
219
+ border-radius:0.375rem;border-style:none;background-color:transparent;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.5rem;padding-bottom:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
220
+ font-size: 0.875rem;
221
+ }[data-mode="dark"][data-style="glass"] [data-input-root] textarea,[data-mode="dark"] [data-style="glass"] [data-input-root] textarea{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}[data-style="glass"] [data-input-root] textarea:focus{outline:2px solid transparent;outline-offset:2px;}
222
+
223
+ /* Select inside input-root: suppress standalone glass select styles */
224
+ [data-style='glass'] [data-input-root] [data-select-trigger] {
225
+ border-radius:0.375rem;border-style:none;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-shadow:0 0 var(--un-shadow-color, rgb(0 0 0 / 0));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-width:0px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
226
+ background-image: none;
227
+ backdrop-filter: none;
228
+ }[data-mode="dark"][data-style="glass"] [data-input-root] [data-select-trigger],[data-mode="dark"] [data-style="glass"] [data-input-root] [data-select-trigger]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}[data-style="glass"] [data-input-root] [data-select-trigger]:focus{outline:2px solid transparent;outline-offset:2px;}
229
+
230
+ /* Suppress standalone select open-state when inside input-root */
231
+ [data-style='glass'] [data-input-root] [data-select][data-open='true'] [data-select-trigger] {
232
+ border-style:none;--un-shadow:0 0 var(--un-shadow-color, rgb(0 0 0 / 0));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-width:0px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
233
+ }
234
+
235
+ /* Placeholders */
236
+ [data-style='glass'] [data-input-root] input::placeholder,
237
+ [data-style='glass'] [data-input-root] textarea::placeholder {
238
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
239
+ }[data-mode="dark"][data-style="glass"] [data-input-root] input::placeholder,[data-mode="dark"] [data-style="glass"] [data-input-root] input::placeholder,[data-mode="dark"][data-style="glass"] [data-input-root] textarea::placeholder,[data-mode="dark"] [data-style="glass"] [data-input-root] textarea::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
240
+
241
+ /* Checkbox field */
242
+ [data-style='glass'] [data-field-type='checkbox'] [data-field] {
243
+ display:flex;align-items:center;line-height:2;
244
+ }
245
+
246
+ /* Checkbox icon */
247
+ [data-style='glass'] [data-checkbox-icon] {
248
+ cursor:pointer;border-radius:0.25rem;font-size:1.125rem;line-height:1.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;
249
+ }[data-mode="dark"][data-style="glass"] [data-checkbox-icon],[data-mode="dark"] [data-style="glass"] [data-checkbox-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
250
+
251
+ [data-style='glass'] [data-checkbox-icon]:focus-visible {
252
+ outline-width:2px;--un-outline-color-opacity:1;outline-color:rgba(var(--color-primary-400),var(--un-outline-color-opacity));outline-offset:2px;
253
+ }[data-mode="dark"][data-style="glass"] [data-checkbox-icon]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-checkbox-icon]:focus-visible{--un-outline-color-opacity:1;outline-color:rgba(var(--color-primary-600),var(--un-outline-color-opacity));}
254
+
255
+ [data-style='glass']
256
+ [data-checkbox-root][data-variant='custom']:has(input:checked)
257
+ [data-checkbox-icon] {
258
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
259
+ }[data-mode="dark"][data-style="glass"] [data-checkbox-root][data-variant="custom"]:has(input:checked) [data-checkbox-icon],[data-mode="dark"] [data-style="glass"] [data-checkbox-root][data-variant="custom"]:has(input:checked) [data-checkbox-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
260
+
261
+ [data-style='glass'] [data-field] textarea {
262
+ min-height:5rem;padding-top:0.5rem;padding-bottom:0.5rem;
263
+ }
264
+
265
+ /* Color input */
266
+ [data-style='glass'] [data-field-type='color'] [data-input-root] {
267
+ overflow:hidden;
268
+ }
269
+
270
+ [data-style='glass'] [data-field-type='color'] input[type='color'] {
271
+ min-height:2.75rem;display:flex;flex:1 1 0%;border-radius:0.375rem;background-color:transparent;
272
+ }[data-style="glass"] [data-field-type="color"] input[type="color"]:focus{outline:2px solid transparent;outline-offset:2px;}
273
+
274
+ /* Description and message */
275
+ [data-style='glass'] [data-description],
276
+ [data-style='glass'] [data-message] {
277
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
278
+ }[data-mode="dark"][data-style="glass"] [data-description],[data-mode="dark"] [data-style="glass"] [data-description],[data-mode="dark"][data-style="glass"] [data-message],[data-mode="dark"] [data-style="glass"] [data-message]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
279
+
280
+ [data-style='glass'] [data-message] {
281
+ border-radius:0.375rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.25rem;padding-bottom:0.25rem;
282
+ }
283
+
284
+ /* Error state */
285
+ [data-style='glass'] [data-field-root][data-field-state='fail'] [data-input-root] {
286
+ border-color:rgba(var(--color-danger-500),0.5);
287
+ }[data-mode="dark"][data-style="glass"] [data-field-root][data-field-state="fail"] [data-input-root],[data-mode="dark"] [data-style="glass"] [data-field-root][data-field-state="fail"] [data-input-root]{border-color:rgba(var(--color-danger-500),0.5);}
288
+
289
+ /**
290
+ * Toolbar - Glass Theme Styles
291
+ *
292
+ * Glassmorphism styling with blur and transparency.
293
+ */
294
+
295
+ /* =============================================================================
296
+ Toolbar Container
297
+ ============================================================================= */
298
+
299
+ [data-style='glass'] [data-toolbar] {
300
+ background-color:rgba(var(--color-surface-100),0.7);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
301
+ }[data-mode="dark"][data-style="glass"] [data-toolbar],[data-mode="dark"] [data-style="glass"] [data-toolbar]{background-color:rgba(var(--color-surface-900),0.7);}
302
+
303
+ /* Position-based borders */
304
+ [data-style='glass'] [data-toolbar][data-toolbar-position='top'],
305
+ [data-style='glass'] [data-toolbar]:not([data-toolbar-position]) {
306
+ border-bottom-width:1px;border-color:rgba(var(--color-surface-500),0.2);
307
+ }[data-mode="dark"][data-style="glass"] [data-toolbar][data-toolbar-position="top"],[data-mode="dark"] [data-style="glass"] [data-toolbar][data-toolbar-position="top"],[data-mode="dark"][data-style="glass"] [data-toolbar]:not([data-toolbar-position]),[data-mode="dark"] [data-style="glass"] [data-toolbar]:not([data-toolbar-position]){border-color:rgba(var(--color-surface-500),0.2);}
308
+
309
+ [data-style='glass'] [data-toolbar][data-toolbar-position='bottom'] {
310
+ border-top-width:1px;border-color:rgba(var(--color-surface-500),0.2);
311
+ }[data-mode="dark"][data-style="glass"] [data-toolbar][data-toolbar-position="bottom"],[data-mode="dark"] [data-style="glass"] [data-toolbar][data-toolbar-position="bottom"]{border-color:rgba(var(--color-surface-500),0.2);}
312
+
313
+ [data-style='glass'] [data-toolbar][data-toolbar-position='left'] {
314
+ border-right-width:1px;border-color:rgba(var(--color-surface-500),0.2);
315
+ }[data-mode="dark"][data-style="glass"] [data-toolbar][data-toolbar-position="left"],[data-mode="dark"] [data-style="glass"] [data-toolbar][data-toolbar-position="left"]{border-color:rgba(var(--color-surface-500),0.2);}
316
+
317
+ [data-style='glass'] [data-toolbar][data-toolbar-position='right'] {
318
+ border-left-width:1px;border-color:rgba(var(--color-surface-500),0.2);
319
+ }[data-mode="dark"][data-style="glass"] [data-toolbar][data-toolbar-position="right"],[data-mode="dark"] [data-style="glass"] [data-toolbar][data-toolbar-position="right"]{border-color:rgba(var(--color-surface-500),0.2);}
320
+
321
+ /* =============================================================================
322
+ Toolbar Items
323
+ ============================================================================= */
324
+
325
+ [data-style='glass'] [data-toolbar-item] {
326
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
327
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item],[data-mode="dark"] [data-style="glass"] [data-toolbar-item]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
328
+
329
+ [data-style='glass'] [data-toolbar-item]:hover:not(:disabled):not([data-disabled='true']) {
330
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));
331
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-toolbar-item]:hover:not(:disabled):not([data-disabled="true"]){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
332
+
333
+ [data-style='glass'] [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled='true']) {
334
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
335
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled="true"]){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-ring-color:rgba(var(--color-surface-500),0.4);}
336
+
337
+ /* Active/pressed state */
338
+ [data-style='glass'] [data-toolbar-item][data-active='true'] {
339
+ background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
340
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item][data-active="true"],[data-mode="dark"] [data-style="glass"] [data-toolbar-item][data-active="true"]{background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
341
+
342
+ [data-style='glass'] [data-toolbar-item][data-active='true']:hover:not(:disabled) {
343
+ background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-950),var(--un-text-opacity));
344
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-toolbar-item][data-active="true"]:hover:not(:disabled){background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-50),var(--un-text-opacity));}
345
+
346
+ /* =============================================================================
347
+ Toolbar Icon
348
+ ============================================================================= */
349
+
350
+ [data-style='glass'] [data-toolbar-item] [data-toolbar-icon] {
351
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
352
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item] [data-toolbar-icon],[data-mode="dark"] [data-style="glass"] [data-toolbar-item] [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
353
+
354
+ [data-style='glass'] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon] {
355
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
356
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon],[data-mode="dark"] [data-style="glass"] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
357
+
358
+ [data-style='glass'] [data-toolbar-item][data-active='true'] [data-toolbar-icon] {
359
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
360
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-item][data-active="true"] [data-toolbar-icon],[data-mode="dark"] [data-style="glass"] [data-toolbar-item][data-active="true"] [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
361
+
362
+ /* =============================================================================
363
+ Separator & Divider
364
+ ============================================================================= */
365
+
366
+ [data-style='glass'] [data-toolbar-separator] {
367
+ background-color:rgba(var(--color-surface-500),0.2);
368
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-separator],[data-mode="dark"] [data-style="glass"] [data-toolbar-separator]{background-color:rgba(var(--color-surface-500),0.2);}
369
+
370
+ [data-style='glass'] [data-toolbar-divider] {
371
+ background-color:rgba(var(--color-surface-500),0.2);
372
+ }[data-mode="dark"][data-style="glass"] [data-toolbar-divider],[data-mode="dark"] [data-style="glass"] [data-toolbar-divider]{background-color:rgba(var(--color-surface-500),0.2);}
373
+
374
+ /**
375
+ * Tabs - Glass Theme Styles
376
+ *
377
+ * Glassmorphism styling with blur and transparency.
378
+ */
379
+
380
+ /* =============================================================================
381
+ Tab List
382
+ ============================================================================= */
383
+
384
+ [data-style='glass'] [data-tabs-list] {
385
+ border-bottom-width:1px;border-color:rgba(var(--color-surface-500),0.2);border-top-left-radius:0.5rem;border-top-right-radius:0.5rem;background-color:rgba(var(--color-surface-100),0.7);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
386
+ }[data-mode="dark"][data-style="glass"] [data-tabs-list],[data-mode="dark"] [data-style="glass"] [data-tabs-list]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);}
387
+
388
+ [data-style='glass'] [data-tabs][data-position='after'] [data-tabs-list] {
389
+ border-top-width:1px;border-bottom-width:0px;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem;
390
+ }
391
+
392
+ /* =============================================================================
393
+ Tab Triggers
394
+ ============================================================================= */
395
+
396
+ [data-style='glass'] [data-tabs-trigger] {
397
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
398
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger],[data-mode="dark"] [data-style="glass"] [data-tabs-trigger]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
399
+
400
+ [data-style='glass'] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]) {
401
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
402
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="glass"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
403
+
404
+ /* Selected state */
405
+ [data-style='glass'] [data-tabs-trigger][data-selected] {
406
+ border-width:1px;border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
407
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="glass"] [data-tabs-trigger][data-selected]{border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
408
+
409
+ /* =============================================================================
410
+ Tab Icon
411
+ ============================================================================= */
412
+
413
+ [data-style='glass'] [data-tabs-trigger] [data-tabs-icon] {
414
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
415
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger] [data-tabs-icon],[data-mode="dark"] [data-style="glass"] [data-tabs-trigger] [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
416
+
417
+ [data-style='glass'] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon] {
418
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
419
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon],[data-mode="dark"] [data-style="glass"] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
420
+
421
+ [data-style='glass'] [data-tabs-trigger][data-selected] [data-tabs-icon] {
422
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
423
+ }[data-mode="dark"][data-style="glass"] [data-tabs-trigger][data-selected] [data-tabs-icon],[data-mode="dark"] [data-style="glass"] [data-tabs-trigger][data-selected] [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
424
+
425
+ /* =============================================================================
426
+ Tab Panel
427
+ ============================================================================= */
428
+
429
+ [data-style='glass'] [data-tabs-content] {
430
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
431
+ }[data-mode="dark"][data-style="glass"] [data-tabs-content],[data-mode="dark"] [data-style="glass"] [data-tabs-content]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
432
+
433
+ /**
434
+ * Toggle - Glass Theme Styles
435
+ *
436
+ * Glassmorphism styling with blur and transparency.
437
+ */
438
+
439
+ /* =============================================================================
440
+ Toggle Container
441
+ ============================================================================= */
442
+
443
+ [data-style='glass'] [data-toggle] {
444
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);border-radius:0.5rem;background-color:rgba(var(--color-surface-100),0.7);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
445
+ }[data-mode="dark"][data-style="glass"] [data-toggle],[data-mode="dark"] [data-style="glass"] [data-toggle]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);}
446
+
447
+ /* =============================================================================
448
+ Toggle Options
449
+ ============================================================================= */
450
+
451
+ [data-style='glass'] [data-toggle-option] {
452
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
453
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option],[data-mode="dark"] [data-style="glass"] [data-toggle-option]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
454
+
455
+ [data-style='glass'] [data-toggle-option]:hover:not(:disabled):not([data-disabled='true']),
456
+ [data-style='glass'] [data-toggle-option]:focus:not(:disabled):not([data-disabled='true']) {
457
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
458
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-toggle-option]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"][data-style="glass"] [data-toggle-option]:focus:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-toggle-option]:focus:not(:disabled):not([data-disabled="true"]){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
459
+
460
+ /* Selected state */
461
+ [data-style='glass'] [data-toggle-option][data-selected='true'] {
462
+ border-width:1px;border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
463
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option][data-selected="true"],[data-mode="dark"] [data-style="glass"] [data-toggle-option][data-selected="true"]{border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
464
+
465
+ /* =============================================================================
466
+ Toggle Icon
467
+ ============================================================================= */
468
+
469
+ [data-style='glass'] [data-toggle-option] [data-toggle-icon] {
470
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
471
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option] [data-toggle-icon],[data-mode="dark"] [data-style="glass"] [data-toggle-option] [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
472
+
473
+ [data-style='glass'] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],
474
+ [data-style='glass'] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon] {
475
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
476
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],[data-mode="dark"] [data-style="glass"] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],[data-mode="dark"][data-style="glass"] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon],[data-mode="dark"] [data-style="glass"] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
477
+
478
+ [data-style='glass'] [data-toggle-option][data-selected='true'] [data-toggle-icon] {
479
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
480
+ }[data-mode="dark"][data-style="glass"] [data-toggle-option][data-selected="true"] [data-toggle-icon],[data-mode="dark"] [data-style="glass"] [data-toggle-option][data-selected="true"] [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
481
+
482
+ /**
483
+ * Switch - Glass Theme Styles
484
+ */
485
+
486
+ [data-style='glass'] [data-switch-track] {
487
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-200),0.5);--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
488
+ }[data-mode="dark"][data-style="glass"] [data-switch-track],[data-mode="dark"] [data-style="glass"] [data-switch-track]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-800),0.5);}
489
+
490
+ [data-style='glass'] [data-switch-thumb] {
491
+ background-color:rgba(var(--color-surface-700),0.8);--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
492
+ }[data-mode="dark"][data-style="glass"] [data-switch-thumb],[data-mode="dark"] [data-style="glass"] [data-switch-thumb]{background-color:rgba(var(--color-surface-300),0.8);}
493
+
494
+ [data-style='glass'] [data-switch]:focus-visible [data-switch-track] {
495
+ --un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-offset-width:1px;--un-ring-color:rgba(var(--color-primary-500),0.7);
496
+ }[data-mode="dark"][data-style="glass"] [data-switch]:focus-visible [data-switch-track],[data-mode="dark"] [data-style="glass"] [data-switch]:focus-visible [data-switch-track]{--un-ring-color:rgba(var(--color-primary-500),0.7);}
497
+
498
+ /* On state */
499
+ [data-style='glass'] [data-switch][aria-checked='true'] [data-switch-track] {
500
+ border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);
501
+ }[data-mode="dark"][data-style="glass"] [data-switch][aria-checked="true"] [data-switch-track],[data-mode="dark"] [data-style="glass"] [data-switch][aria-checked="true"] [data-switch-track]{border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.4);}
502
+
503
+ [data-style='glass'] [data-switch][aria-checked='true'] [data-switch-thumb] {
504
+ background-color:rgb(255 255 255 / 0.9);--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
505
+ }
506
+
507
+ [data-style='glass'] [data-switch-label] {
508
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
509
+ }[data-mode="dark"][data-style="glass"] [data-switch-label],[data-mode="dark"] [data-style="glass"] [data-switch-label]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
510
+
511
+ /**
512
+ * List - Glass Theme Styles
513
+ *
514
+ * Glassmorphism styling with blur and transparency.
515
+ */
516
+
517
+ /* =============================================================================
518
+ List Container
519
+ ============================================================================= */
520
+
521
+ [data-style='glass'] [data-list]:focus-within {
522
+ border-radius:0.25rem;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
523
+ }[data-mode="dark"][data-style="glass"] [data-list]:focus-within,[data-mode="dark"] [data-style="glass"] [data-list]:focus-within{--un-ring-color:rgba(var(--color-surface-500),0.4);}
524
+
525
+ /* =============================================================================
526
+ List Items
527
+ ============================================================================= */
528
+
529
+ [data-style='glass'] [data-list] [data-list-item] {
530
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
531
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
532
+
533
+ [data-style='glass'] [data-list] a[data-list-item],
534
+ [data-style='glass'] [data-list] button[data-list-item] {
535
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
536
+ }[data-mode="dark"][data-style="glass"] [data-list] a[data-list-item],[data-mode="dark"] [data-style="glass"] [data-list] a[data-list-item],[data-mode="dark"][data-style="glass"] [data-list] button[data-list-item],[data-mode="dark"] [data-style="glass"] [data-list] button[data-list-item]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
537
+
538
+ /* Hover and focus (keyboard navigation) */
539
+ [data-style='glass'] [data-list] [data-list-item]:hover:not(:disabled):not([data-disabled='true']),
540
+ [data-style='glass'] [data-list] [data-list-item]:focus:not(:disabled):not([data-disabled='true']) {
541
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
542
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"][data-style="glass"] [data-list] [data-list-item]:focus:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item]:focus:not(:disabled):not([data-disabled="true"]){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
543
+
544
+ /* Active state — muted when list not focused */
545
+ [data-style='glass'] [data-list] [data-list-item][data-active='true'] {
546
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
547
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"]{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
548
+
549
+ /* Active state — full highlight when list has focus */
550
+ [data-style='glass'] [data-list]:focus-within [data-list-item][data-active='true'] {
551
+ background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
552
+ }[data-mode="dark"][data-style="glass"] [data-list]:focus-within [data-list-item][data-active="true"],[data-mode="dark"] [data-style="glass"] [data-list]:focus-within [data-list-item][data-active="true"]{background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
553
+
554
+ /* Active + hover/focus */
555
+ [data-style='glass'] [data-list] [data-list-item][data-active='true']:hover:not(:disabled),
556
+ [data-style='glass'] [data-list] [data-list-item][data-active='true']:focus:not(:disabled) {
557
+ background-color:rgba(var(--color-primary-500),0.4);
558
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"]:focus:not(:disabled){background-color:rgba(var(--color-primary-500),0.4);}
559
+
560
+ /* =============================================================================
561
+ Item Elements
562
+ ============================================================================= */
563
+
564
+ [data-style='glass'] [data-list] [data-list-item] [data-item-icon] {
565
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
566
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
567
+
568
+ [data-style='glass'] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],
569
+ [data-style='glass'] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon] {
570
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
571
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"][data-style="glass"] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
572
+
573
+ [data-style='glass'] [data-list] [data-list-item][data-active='true'] [data-item-icon] {
574
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
575
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
576
+
577
+ [data-style='glass'] [data-list] [data-list-item] [data-item-description] {
578
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
579
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
580
+
581
+ [data-style='glass'] [data-list] [data-list-item][data-active='true'] [data-item-description] {
582
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
583
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
584
+
585
+ [data-style='glass'] [data-list] [data-list-item] [data-item-badge] {
586
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
587
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item] [data-item-badge],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item] [data-item-badge]{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
588
+
589
+ [data-style='glass'] [data-list] [data-list-item][data-active='true'] [data-item-badge] {
590
+ background-color:rgba(var(--color-primary-500),0.25);--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
591
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-badge],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-active="true"] [data-item-badge]{background-color:rgba(var(--color-primary-500),0.25);--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
592
+
593
+ /* =============================================================================
594
+ Groups
595
+ ============================================================================= */
596
+
597
+ [data-style='glass'] [data-list] [data-list-group] {
598
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
599
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-group],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-group]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
600
+
601
+ [data-style='glass'] [data-list] [data-list-group]:hover:not(:disabled),
602
+ [data-style='glass'] [data-list] [data-list-group]:focus:not(:disabled) {
603
+ background-color:rgba(var(--color-surface-300),0.25);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
604
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-group]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-group]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-list] [data-list-group]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-group]:focus:not(:disabled){background-color:rgba(var(--color-surface-700),0.25);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
605
+
606
+ /* =============================================================================
607
+ Separator
608
+ ============================================================================= */
609
+
610
+ [data-style='glass'] [data-list] [data-list-separator] {
611
+ background-color:rgba(var(--color-surface-500),0.2);
612
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-separator],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-separator]{background-color:rgba(var(--color-surface-500),0.2);}
613
+
614
+ /* =============================================================================
615
+ Multi-Selection
616
+ ============================================================================= */
617
+
618
+ [data-style='glass'] [data-list] [data-list-item][data-selected='true'] {
619
+ background-color:rgba(var(--color-primary-500),0.2);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
620
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-selected="true"],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-selected="true"]{background-color:rgba(var(--color-primary-500),0.2);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
621
+
622
+ [data-style='glass'] [data-list]:focus-within [data-list-item][data-selected='true'] {
623
+ background-color:rgba(var(--color-primary-500),0.3);
624
+ }[data-mode="dark"][data-style="glass"] [data-list]:focus-within [data-list-item][data-selected="true"],[data-mode="dark"] [data-style="glass"] [data-list]:focus-within [data-list-item][data-selected="true"]{background-color:rgba(var(--color-primary-500),0.3);}
625
+
626
+ [data-style='glass'] [data-list] [data-list-item][data-selected='true']:hover:not(:disabled) {
627
+ background-color:rgba(var(--color-primary-500),0.4);
628
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-selected="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-selected="true"]:hover:not(:disabled){background-color:rgba(var(--color-primary-500),0.4);}
629
+
630
+ [data-style='glass'] [data-list] [data-list-item][data-selected='true'] [data-item-icon] {
631
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
632
+ }[data-mode="dark"][data-style="glass"] [data-list] [data-list-item][data-selected="true"] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-list] [data-list-item][data-selected="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
633
+
634
+ /**
635
+ * Tree - Glass Theme Styles
636
+ *
637
+ * Glassmorphism styling with blur and transparency.
638
+ */
639
+
640
+ /* =============================================================================
641
+ Tree Container
642
+ ============================================================================= */
643
+
644
+ [data-style='glass'] [data-tree]:focus-within {
645
+ border-radius:0.25rem;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
646
+ }[data-mode="dark"][data-style="glass"] [data-tree]:focus-within,[data-mode="dark"] [data-style="glass"] [data-tree]:focus-within{--un-ring-color:rgba(var(--color-surface-500),0.4);}
647
+
648
+ /* =============================================================================
649
+ Tree Toggle Button
650
+ ============================================================================= */
651
+
652
+ [data-style='glass'] [data-tree-toggle-btn] {
653
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
654
+ }[data-mode="dark"][data-style="glass"] [data-tree-toggle-btn],[data-mode="dark"] [data-style="glass"] [data-tree-toggle-btn]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
655
+
656
+ [data-style='glass'] [data-tree-toggle-btn]:hover {
657
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
658
+ }[data-mode="dark"][data-style="glass"] [data-tree-toggle-btn]:hover,[data-mode="dark"] [data-style="glass"] [data-tree-toggle-btn]:hover{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
659
+
660
+ /* =============================================================================
661
+ Tree Item Content
662
+ ============================================================================= */
663
+
664
+ [data-style='glass'] [data-tree-item-content] {
665
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
666
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content],[data-mode="dark"] [data-style="glass"] [data-tree-item-content]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
667
+
668
+ [data-style='glass'] [data-tree-item-content]:hover:not(:disabled),
669
+ [data-style='glass'] [data-tree-item-content]:focus:not(:disabled) {
670
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
671
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-tree-item-content]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-tree-item-content]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-tree-item-content]:focus:not(:disabled){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
672
+
673
+ /* Focus visible for keyboard navigation */
674
+ [data-style='glass'] [data-tree-item-content]:focus-visible {
675
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
676
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-tree-item-content]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
677
+
678
+ /* Active/selected state */
679
+ [data-style='glass'] [data-tree-item-content][data-active='true'] {
680
+ background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
681
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content][data-active="true"],[data-mode="dark"] [data-style="glass"] [data-tree-item-content][data-active="true"]{background-color:rgba(var(--color-primary-500),0.3);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
682
+
683
+ [data-style='glass'] [data-tree-item-content][data-active='true']:hover:not(:disabled) {
684
+ background-color:rgba(var(--color-primary-500),0.4);
685
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-tree-item-content][data-active="true"]:hover:not(:disabled){background-color:rgba(var(--color-primary-500),0.4);}
686
+
687
+ /* =============================================================================
688
+ Item Elements
689
+ ============================================================================= */
690
+
691
+ [data-style='glass'] [data-tree-item-content] [data-item-icon] {
692
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
693
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-tree-item-content] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
694
+
695
+ [data-style='glass'] [data-tree-item-content]:hover:not(:disabled) [data-item-icon] {
696
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
697
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-tree-item-content]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
698
+
699
+ [data-style='glass'] [data-tree-item-content][data-active='true'] [data-item-icon] {
700
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
701
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
702
+
703
+ [data-style='glass'] [data-tree-item-content] [data-item-description] {
704
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
705
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-tree-item-content] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
706
+
707
+ [data-style='glass'] [data-tree-item-content][data-active='true'] [data-item-description] {
708
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
709
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
710
+
711
+ [data-style='glass'] [data-tree-item-content] [data-item-badge] {
712
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
713
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content] [data-item-badge],[data-mode="dark"] [data-style="glass"] [data-tree-item-content] [data-item-badge]{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
714
+
715
+ [data-style='glass'] [data-tree-item-content][data-active='true'] [data-item-badge] {
716
+ background-color:rgba(var(--color-primary-500),0.25);--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
717
+ }[data-mode="dark"][data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-badge],[data-mode="dark"] [data-style="glass"] [data-tree-item-content][data-active="true"] [data-item-badge]{background-color:rgba(var(--color-primary-500),0.25);--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
718
+
719
+ /* =============================================================================
720
+ Multi-Selection
721
+ ============================================================================= */
722
+
723
+ [data-style='glass'] [data-tree-node][data-selected='true'] [data-tree-node-row] {
724
+ background-color:rgba(var(--color-primary-500),0.2);
725
+ }[data-mode="dark"][data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-node-row],[data-mode="dark"] [data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-node-row]{background-color:rgba(var(--color-primary-500),0.2);}
726
+
727
+ [data-style='glass']
728
+ [data-tree]:focus-within
729
+ [data-tree-node][data-selected='true']
730
+ [data-tree-node-row] {
731
+ background-color:rgba(var(--color-primary-500),0.3);
732
+ }[data-mode="dark"][data-style="glass"] [data-tree]:focus-within [data-tree-node][data-selected="true"] [data-tree-node-row],[data-mode="dark"] [data-style="glass"] [data-tree]:focus-within [data-tree-node][data-selected="true"] [data-tree-node-row]{background-color:rgba(var(--color-primary-500),0.3);}
733
+
734
+ [data-style='glass'] [data-tree-node][data-selected='true'] [data-tree-item-content] {
735
+ --un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
736
+ }[data-mode="dark"][data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-item-content],[data-mode="dark"] [data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-item-content]{--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
737
+
738
+ [data-style='glass']
739
+ [data-tree-node][data-selected='true']
740
+ [data-tree-item-content]
741
+ [data-item-icon] {
742
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
743
+ }[data-mode="dark"][data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-item-content] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-tree-node][data-selected="true"] [data-tree-item-content] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
744
+
745
+ /**
746
+ * Select - Glass Theme Styles
747
+ *
748
+ * Glassmorphism styling with blur and transparency.
749
+ */
750
+
751
+ /* =============================================================================
752
+ Select Container — elevate when open so dropdown escapes sibling stacking contexts
753
+ ============================================================================= */
754
+
755
+ [data-style='glass'] [data-select][data-open='true'] {
756
+ z-index: 50;
757
+ }
758
+
759
+ /* =============================================================================
760
+ Trigger Button
761
+ ============================================================================= */
762
+
763
+ [data-style='glass'] [data-select-trigger] {
764
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
765
+ }[data-mode="dark"][data-style="glass"] [data-select-trigger],[data-mode="dark"] [data-style="glass"] [data-select-trigger]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
766
+
767
+ [data-style='glass'] [data-select-trigger]:hover:not(:disabled) {
768
+ border-color:rgba(var(--color-surface-500),0.3);background-color:rgba(var(--color-surface-200),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));
769
+ }[data-mode="dark"][data-style="glass"] [data-select-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-select-trigger]:hover:not(:disabled){border-color:rgba(var(--color-surface-500),0.3);background-color:rgba(var(--color-surface-800),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
770
+
771
+ [data-style='glass'] [data-select-trigger]:focus-visible {
772
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
773
+ }[data-mode="dark"][data-style="glass"] [data-select-trigger]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-select-trigger]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
774
+
775
+ [data-style='glass'] [data-select][data-open='true'] [data-select-trigger] {
776
+ border-color:rgba(var(--color-primary-500),0.5);
777
+ }[data-mode="dark"][data-style="glass"] [data-select][data-open="true"] [data-select-trigger],[data-mode="dark"] [data-style="glass"] [data-select][data-open="true"] [data-select-trigger]{border-color:rgba(var(--color-primary-500),0.5);}
778
+
779
+ /* =============================================================================
780
+ Placeholder
781
+ ============================================================================= */
782
+
783
+ [data-style='glass'] [data-select-placeholder] {
784
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
785
+ }[data-mode="dark"][data-style="glass"] [data-select-placeholder],[data-mode="dark"] [data-style="glass"] [data-select-placeholder]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
786
+
787
+ /* =============================================================================
788
+ Arrow
789
+ ============================================================================= */
790
+
791
+ [data-style='glass'] [data-select-arrow] {
792
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
793
+ }[data-mode="dark"][data-style="glass"] [data-select-arrow],[data-mode="dark"] [data-style="glass"] [data-select-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
794
+
795
+ [data-style='glass'] [data-select-trigger]:hover:not(:disabled) [data-select-arrow] {
796
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
797
+ }[data-mode="dark"][data-style="glass"] [data-select-trigger]:hover:not(:disabled) [data-select-arrow],[data-mode="dark"] [data-style="glass"] [data-select-trigger]:hover:not(:disabled) [data-select-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
798
+
799
+ /* =============================================================================
800
+ Tags (MultiSelect)
801
+ ============================================================================= */
802
+
803
+ [data-style='glass'] [data-select-tag] {
804
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
805
+ }[data-mode="dark"][data-style="glass"] [data-select-tag],[data-mode="dark"] [data-style="glass"] [data-select-tag]{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
806
+
807
+ [data-style='glass'] [data-select-tag-remove] {
808
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
809
+ }[data-mode="dark"][data-style="glass"] [data-select-tag-remove],[data-mode="dark"] [data-style="glass"] [data-select-tag-remove]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
810
+
811
+ [data-style='glass'] [data-select-tag-remove]:hover {
812
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
813
+ }[data-mode="dark"][data-style="glass"] [data-select-tag-remove]:hover,[data-mode="dark"] [data-style="glass"] [data-select-tag-remove]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
814
+
815
+ /* =============================================================================
816
+ Dropdown Panel
817
+ ============================================================================= */
818
+
819
+ [data-style='glass'] [data-select-dropdown] {
820
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-200),0.5);--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(16px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
821
+ }[data-mode="dark"][data-style="glass"] [data-select-dropdown],[data-mode="dark"] [data-style="glass"] [data-select-dropdown]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-800),0.5);}
822
+
823
+ /* =============================================================================
824
+ Options
825
+ ============================================================================= */
826
+
827
+ [data-style='glass'] [data-select-option] {
828
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
829
+ }[data-mode="dark"][data-style="glass"] [data-select-option],[data-mode="dark"] [data-style="glass"] [data-select-option]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
830
+
831
+ [data-style='glass'] [data-select-option]:hover:not(:disabled),
832
+ [data-style='glass'] [data-select-option]:focus:not(:disabled) {
833
+ background-color:rgba(var(--color-surface-200),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));
834
+ }[data-mode="dark"][data-style="glass"] [data-select-option]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-select-option]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-select-option]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-select-option]:focus:not(:disabled){background-color:rgba(var(--color-surface-800),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
835
+
836
+ [data-style='glass'] [data-select-option]:focus-visible {
837
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);--un-ring-inset:inset;
838
+ }[data-mode="dark"][data-style="glass"] [data-select-option]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-select-option]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
839
+
840
+ [data-style='glass'] [data-select-option][data-selected='true'] {
841
+ background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
842
+ }[data-mode="dark"][data-style="glass"] [data-select-option][data-selected="true"],[data-mode="dark"] [data-style="glass"] [data-select-option][data-selected="true"]{background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
843
+
844
+ [data-style='glass'] [data-select-option][data-selected='true']:hover:not(:disabled),
845
+ [data-style='glass'] [data-select-option][data-selected='true']:focus:not(:disabled) {
846
+ background-color:rgba(var(--color-primary-500),0.6);
847
+ }[data-mode="dark"][data-style="glass"] [data-select-option][data-selected="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-select-option][data-selected="true"]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-select-option][data-selected="true"]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-select-option][data-selected="true"]:focus:not(:disabled){background-color:rgba(var(--color-primary-500),0.6);}
848
+
849
+ /* Check mark */
850
+ [data-style='glass'] [data-select-check] {
851
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
852
+ }[data-mode="dark"][data-style="glass"] [data-select-check],[data-mode="dark"] [data-style="glass"] [data-select-check]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
853
+
854
+ /* Checkbox */
855
+ [data-style='glass'] [data-select-checkbox] {
856
+ border-color:rgba(var(--color-surface-500),0.4);background-color:rgba(var(--color-surface-100),0.7);
857
+ }[data-mode="dark"][data-style="glass"] [data-select-checkbox],[data-mode="dark"] [data-style="glass"] [data-select-checkbox]{border-color:rgba(var(--color-surface-500),0.4);background-color:rgba(var(--color-surface-900),0.7);}
858
+
859
+ [data-style='glass'] [data-select-checkbox][data-checked='true'] {
860
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));
861
+ }[data-mode="dark"][data-style="glass"] [data-select-checkbox][data-checked="true"],[data-mode="dark"] [data-style="glass"] [data-select-checkbox][data-checked="true"]{--un-border-opacity:1;border-color:rgba(var(--color-primary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
862
+
863
+ /* Item elements */
864
+ [data-style='glass'] [data-select-option] [data-item-icon] {
865
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
866
+ }[data-mode="dark"][data-style="glass"] [data-select-option] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-select-option] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
867
+
868
+ [data-style='glass'] [data-select-option]:hover:not(:disabled) [data-item-icon] {
869
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
870
+ }[data-mode="dark"][data-style="glass"] [data-select-option]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-select-option]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
871
+
872
+ [data-style='glass'] [data-select-option][data-selected='true'] [data-item-icon] {
873
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
874
+ }[data-mode="dark"][data-style="glass"] [data-select-option][data-selected="true"] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-select-option][data-selected="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
875
+
876
+ [data-style='glass'] [data-select-option] [data-item-description] {
877
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
878
+ }[data-mode="dark"][data-style="glass"] [data-select-option] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-select-option] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
879
+
880
+ [data-style='glass'] [data-select-option][data-selected='true'] [data-item-description] {
881
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
882
+ }[data-mode="dark"][data-style="glass"] [data-select-option][data-selected="true"] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-select-option][data-selected="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
883
+
884
+ /* =============================================================================
885
+ Groups
886
+ ============================================================================= */
887
+
888
+ [data-style='glass'] [data-select-group-label] {
889
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
890
+ }[data-mode="dark"][data-style="glass"] [data-select-group-label],[data-mode="dark"] [data-style="glass"] [data-select-group-label]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
891
+
892
+ /* =============================================================================
893
+ Divider
894
+ ============================================================================= */
895
+
896
+ [data-style='glass'] [data-select-divider] {
897
+ background-color:rgba(var(--color-surface-500),0.2);
898
+ }[data-mode="dark"][data-style="glass"] [data-select-divider],[data-mode="dark"] [data-style="glass"] [data-select-divider]{background-color:rgba(var(--color-surface-500),0.2);}
899
+
900
+ /* =============================================================================
901
+ Filter Input
902
+ ============================================================================= */
903
+
904
+ [data-style='glass'] [data-select-filter] {
905
+ background-color:rgba(var(--color-surface-200),0.3);
906
+ }[data-mode="dark"][data-style="glass"] [data-select-filter],[data-mode="dark"] [data-style="glass"] [data-select-filter]{background-color:rgba(var(--color-surface-800),0.3);}
907
+
908
+ [data-style='glass'] [data-select-filter-input] {
909
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
910
+ }[data-mode="dark"][data-style="glass"] [data-select-filter-input],[data-mode="dark"] [data-style="glass"] [data-select-filter-input]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
911
+
912
+ [data-style='glass'] [data-select-filter-input]:focus {
913
+ border-color:rgba(var(--color-primary-500),0.5);--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.3);
914
+ }[data-mode="dark"][data-style="glass"] [data-select-filter-input]:focus,[data-mode="dark"] [data-style="glass"] [data-select-filter-input]:focus{border-color:rgba(var(--color-primary-500),0.5);--un-ring-color:rgba(var(--color-surface-500),0.3);}
915
+
916
+ [data-style='glass'] [data-select-filter-input]::placeholder {
917
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
918
+ }[data-mode="dark"][data-style="glass"] [data-select-filter-input]::placeholder,[data-mode="dark"] [data-style="glass"] [data-select-filter-input]::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
919
+
920
+ [data-style='glass'] [data-select-empty] {
921
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
922
+ }[data-mode="dark"][data-style="glass"] [data-select-empty],[data-mode="dark"] [data-style="glass"] [data-select-empty]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
923
+
924
+ /**
925
+ * Menu - Glass Theme Styles
926
+ *
927
+ * Glassmorphism styling with blur and transparency.
928
+ */
929
+
930
+ /* =============================================================================
931
+ Menu Trigger
932
+ ============================================================================= */
933
+
934
+ [data-style='glass'] [data-menu-trigger] {
935
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
936
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger],[data-mode="dark"] [data-style="glass"] [data-menu-trigger]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
937
+
938
+ [data-style='glass'] [data-menu-trigger]:hover:not(:disabled) {
939
+ border-color:rgba(var(--color-surface-500),0.3);background-color:rgba(var(--color-surface-200),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));
940
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-menu-trigger]:hover:not(:disabled){border-color:rgba(var(--color-surface-500),0.3);background-color:rgba(var(--color-surface-800),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
941
+
942
+ [data-style='glass'] [data-menu-trigger]:focus-visible {
943
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
944
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-menu-trigger]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
945
+
946
+ [data-style='glass'] [data-menu][data-open='true'] [data-menu-trigger] {
947
+ border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.3);
948
+ }[data-mode="dark"][data-style="glass"] [data-menu][data-open="true"] [data-menu-trigger],[data-mode="dark"] [data-style="glass"] [data-menu][data-open="true"] [data-menu-trigger]{border-color:rgba(var(--color-primary-500),0.5);background-color:rgba(var(--color-primary-500),0.3);}
949
+
950
+ /* Trigger elements */
951
+ [data-style='glass'] [data-menu-trigger] [data-menu-icon] {
952
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
953
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger] [data-menu-icon],[data-mode="dark"] [data-style="glass"] [data-menu-trigger] [data-menu-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
954
+
955
+ [data-style='glass'] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon] {
956
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
957
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon],[data-mode="dark"] [data-style="glass"] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
958
+
959
+ [data-style='glass'] [data-menu-trigger] [data-menu-arrow] {
960
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
961
+ }[data-mode="dark"][data-style="glass"] [data-menu-trigger] [data-menu-arrow],[data-mode="dark"] [data-style="glass"] [data-menu-trigger] [data-menu-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
962
+
963
+ /* =============================================================================
964
+ Menu Dropdown
965
+ ============================================================================= */
966
+
967
+ [data-style='glass'] [data-menu-dropdown] {
968
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-200),0.5);--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(16px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
969
+ }[data-mode="dark"][data-style="glass"] [data-menu-dropdown],[data-mode="dark"] [data-style="glass"] [data-menu-dropdown]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-800),0.5);}
970
+
971
+ /* =============================================================================
972
+ Menu Items
973
+ ============================================================================= */
974
+
975
+ [data-style='glass'] [data-menu-item] {
976
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
977
+ }[data-mode="dark"][data-style="glass"] [data-menu-item],[data-mode="dark"] [data-style="glass"] [data-menu-item]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
978
+
979
+ [data-style='glass'] [data-menu-item]:hover:not(:disabled),
980
+ [data-style='glass'] [data-menu-item]:focus:not(:disabled) {
981
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
982
+ }[data-mode="dark"][data-style="glass"] [data-menu-item]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-menu-item]:hover:not(:disabled),[data-mode="dark"][data-style="glass"] [data-menu-item]:focus:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-menu-item]:focus:not(:disabled){background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
983
+
984
+ [data-style='glass'] [data-menu-item]:focus-visible {
985
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);--un-ring-inset:inset;
986
+ }[data-mode="dark"][data-style="glass"] [data-menu-item]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-menu-item]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
987
+
988
+ /* Item elements */
989
+ [data-style='glass'] [data-menu-item] [data-item-icon] {
990
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
991
+ }[data-mode="dark"][data-style="glass"] [data-menu-item] [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-menu-item] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
992
+
993
+ [data-style='glass'] [data-menu-item]:hover:not(:disabled) [data-item-icon] {
994
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
995
+ }[data-mode="dark"][data-style="glass"] [data-menu-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="glass"] [data-menu-item]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
996
+
997
+ [data-style='glass'] [data-menu-item] [data-item-description] {
998
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
999
+ }[data-mode="dark"][data-style="glass"] [data-menu-item] [data-item-description],[data-mode="dark"] [data-style="glass"] [data-menu-item] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1000
+
1001
+ /* =============================================================================
1002
+ Groups
1003
+ ============================================================================= */
1004
+
1005
+ [data-style='glass'] [data-menu-group] {
1006
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1007
+ }[data-mode="dark"][data-style="glass"] [data-menu-group],[data-mode="dark"] [data-style="glass"] [data-menu-group]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1008
+
1009
+ /* =============================================================================
1010
+ Divider
1011
+ ============================================================================= */
1012
+
1013
+ [data-style='glass'] [data-menu-separator] {
1014
+ background-color:rgba(var(--color-surface-500),0.2);
1015
+ }[data-mode="dark"][data-style="glass"] [data-menu-separator],[data-mode="dark"] [data-style="glass"] [data-menu-separator]{background-color:rgba(var(--color-surface-500),0.2);}
1016
+
1017
+ /**
1018
+ * FloatingAction - Glass Theme Styles
1019
+ *
1020
+ * Glassmorphism styling with blur and transparency.
1021
+ */
1022
+
1023
+ /* =============================================================================
1024
+ FAB Trigger Button
1025
+ ============================================================================= */
1026
+
1027
+ [data-style='glass'] [data-fab-trigger] {
1028
+ background-color:rgba(var(--color-primary-500),0.8);--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1029
+ }[data-mode="dark"][data-style="glass"] [data-fab-trigger],[data-mode="dark"] [data-style="glass"] [data-fab-trigger]{background-color:rgba(var(--color-primary-500),0.8);}
1030
+
1031
+ [data-style='glass'] [data-fab-trigger]:hover:not(:disabled) {
1032
+ background-color:rgba(var(--color-primary-500),0.9);--un-shadow:var(--un-shadow-inset) 0 20px 25px -5px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 8px 10px -6px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1033
+ transform: scale(1.05);
1034
+ }[data-mode="dark"][data-style="glass"] [data-fab-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-fab-trigger]:hover:not(:disabled){background-color:rgba(var(--color-primary-500),0.9);}
1035
+
1036
+ [data-style='glass'] [data-fab-trigger]:focus-visible {
1037
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
1038
+ }[data-mode="dark"][data-style="glass"] [data-fab-trigger]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-fab-trigger]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
1039
+
1040
+ [data-style='glass'] [data-fab][data-open='true'] [data-fab-trigger] {
1041
+ background-color:rgba(var(--color-surface-600),0.8);
1042
+ transform: rotate(45deg);
1043
+ }[data-mode="dark"][data-style="glass"] [data-fab][data-open="true"] [data-fab-trigger],[data-mode="dark"] [data-style="glass"] [data-fab][data-open="true"] [data-fab-trigger]{background-color:rgba(var(--color-surface-400),0.8);}
1044
+
1045
+ /* =============================================================================
1046
+ FAB Items
1047
+ ============================================================================= */
1048
+
1049
+ [data-style='glass'] [data-fab-item] {
1050
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1051
+ }[data-mode="dark"][data-style="glass"] [data-fab-item],[data-mode="dark"] [data-style="glass"] [data-fab-item]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1052
+
1053
+ [data-style='glass'] [data-fab-item]:hover:not(:disabled) {
1054
+ background-color:rgba(var(--color-surface-200),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1055
+ }[data-mode="dark"][data-style="glass"] [data-fab-item]:hover:not(:disabled),[data-mode="dark"] [data-style="glass"] [data-fab-item]:hover:not(:disabled){background-color:rgba(var(--color-surface-800),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
1056
+
1057
+ [data-style='glass'] [data-fab-item]:focus-visible {
1058
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
1059
+ }[data-mode="dark"][data-style="glass"] [data-fab-item]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-fab-item]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
1060
+
1061
+ /* Item icon */
1062
+ [data-style='glass'] [data-fab-item] [data-fab-item-icon] {
1063
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1064
+ }[data-mode="dark"][data-style="glass"] [data-fab-item] [data-fab-item-icon],[data-mode="dark"] [data-style="glass"] [data-fab-item] [data-fab-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1065
+
1066
+ [data-style='glass'] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon] {
1067
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1068
+ }[data-mode="dark"][data-style="glass"] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon],[data-mode="dark"] [data-style="glass"] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1069
+
1070
+ /* =============================================================================
1071
+ Backdrop
1072
+ ============================================================================= */
1073
+
1074
+ [data-style='glass'] [data-fab-backdrop] {
1075
+ background: rgba(0, 0, 0, 0.3);
1076
+ backdrop-filter: blur(4px);
1077
+ }
1078
+
1079
+ /**
1080
+ * Table - Glass Theme Styles
1081
+ *
1082
+ * Glassmorphism styling with blur and transparency.
1083
+ */
1084
+
1085
+ /* =============================================================================
1086
+ Header
1087
+ ============================================================================= */
1088
+
1089
+ [data-style='glass'] [data-table-header] th {
1090
+ border-bottom-width:1px;border-color:rgba(var(--color-surface-500),0.2);--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1091
+ }[data-mode="dark"][data-style="glass"] [data-table-header] th,[data-mode="dark"] [data-style="glass"] [data-table-header] th{border-color:rgba(var(--color-surface-500),0.2);--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1092
+
1093
+ [data-style='glass'] [data-table-header-cell][data-sortable='true']:hover {
1094
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1095
+ }[data-mode="dark"][data-style="glass"] [data-table-header-cell][data-sortable="true"]:hover,[data-mode="dark"] [data-style="glass"] [data-table-header-cell][data-sortable="true"]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1096
+
1097
+ [data-style='glass'] [data-table-header-cell][data-sort-order='ascending'],
1098
+ [data-style='glass'] [data-table-header-cell][data-sort-order='descending'] {
1099
+ --un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
1100
+ }[data-mode="dark"][data-style="glass"] [data-table-header-cell][data-sort-order="ascending"],[data-mode="dark"] [data-style="glass"] [data-table-header-cell][data-sort-order="ascending"],[data-mode="dark"][data-style="glass"] [data-table-header-cell][data-sort-order="descending"],[data-mode="dark"] [data-style="glass"] [data-table-header-cell][data-sort-order="descending"]{--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
1101
+
1102
+ [data-style='glass'] [data-table-sort-icon] {
1103
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1104
+ }[data-mode="dark"][data-style="glass"] [data-table-sort-icon],[data-mode="dark"] [data-style="glass"] [data-table-sort-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1105
+
1106
+ [data-style='glass'] [data-table-header-cell][data-sort-order='ascending'] [data-table-sort-icon],
1107
+ [data-style='glass'] [data-table-header-cell][data-sort-order='descending'] [data-table-sort-icon] {
1108
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1109
+ }[data-mode="dark"][data-style="glass"] [data-table-header-cell][data-sort-order="ascending"] [data-table-sort-icon],[data-mode="dark"] [data-style="glass"] [data-table-header-cell][data-sort-order="ascending"] [data-table-sort-icon],[data-mode="dark"][data-style="glass"] [data-table-header-cell][data-sort-order="descending"] [data-table-sort-icon],[data-mode="dark"] [data-style="glass"] [data-table-header-cell][data-sort-order="descending"] [data-table-sort-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1110
+
1111
+ /* =============================================================================
1112
+ Caption
1113
+ ============================================================================= */
1114
+
1115
+ [data-style='glass'] [data-table-caption] {
1116
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1117
+ }[data-mode="dark"][data-style="glass"] [data-table-caption],[data-mode="dark"] [data-style="glass"] [data-table-caption]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1118
+
1119
+ /* =============================================================================
1120
+ Rows
1121
+ ============================================================================= */
1122
+
1123
+ [data-style='glass'] [data-table-row] {
1124
+ border-bottom-width:1px;border-color:rgba(var(--color-surface-500),0.1);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1125
+ }[data-mode="dark"][data-style="glass"] [data-table-row],[data-mode="dark"] [data-style="glass"] [data-table-row]{border-color:rgba(var(--color-surface-500),0.1);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1126
+
1127
+ [data-style='glass'] [data-table-row]:hover {
1128
+ background-color:rgba(var(--color-surface-200),0.8);
1129
+ }[data-mode="dark"][data-style="glass"] [data-table-row]:hover,[data-mode="dark"] [data-style="glass"] [data-table-row]:hover{background-color:rgba(var(--color-surface-800),0.8);}
1130
+
1131
+ [data-style='glass'] [data-table-row]:focus {
1132
+ background-color:rgba(var(--color-surface-200),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
1133
+ }[data-mode="dark"][data-style="glass"] [data-table-row]:focus,[data-mode="dark"] [data-style="glass"] [data-table-row]:focus{background-color:rgba(var(--color-surface-800),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
1134
+
1135
+ [data-style='glass'] [data-table-row][data-selected='true'] {
1136
+ background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
1137
+ }[data-mode="dark"][data-style="glass"] [data-table-row][data-selected="true"],[data-mode="dark"] [data-style="glass"] [data-table-row][data-selected="true"]{background-color:rgba(var(--color-primary-500),0.4);--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
1138
+
1139
+ /* =============================================================================
1140
+ Striped
1141
+ ============================================================================= */
1142
+
1143
+ [data-style='glass'] [data-striped='true'] [data-table-body] tr:nth-child(even) {
1144
+ background-color:rgba(var(--color-surface-200),0.3);
1145
+ }[data-mode="dark"][data-style="glass"] [data-striped="true"] [data-table-body] tr:nth-child(even),[data-mode="dark"] [data-style="glass"] [data-striped="true"] [data-table-body] tr:nth-child(even){background-color:rgba(var(--color-surface-800),0.3);}
1146
+
1147
+ /* =============================================================================
1148
+ Empty
1149
+ ============================================================================= */
1150
+
1151
+ [data-style='glass'] [data-table-empty] {
1152
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1153
+ }[data-mode="dark"][data-style="glass"] [data-table-empty],[data-mode="dark"] [data-style="glass"] [data-table-empty]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1154
+
1155
+ /* =============================================================================
1156
+ Cell Icon
1157
+ ============================================================================= */
1158
+
1159
+ [data-style='glass'] [data-table-cell] [data-cell-icon] {
1160
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1161
+ }[data-mode="dark"][data-style="glass"] [data-table-cell] [data-cell-icon],[data-mode="dark"] [data-style="glass"] [data-table-cell] [data-cell-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1162
+
1163
+ [data-style='glass'] [data-table-row][data-selected='true'] [data-cell-icon] {
1164
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1165
+ }[data-mode="dark"][data-style="glass"] [data-table-row][data-selected="true"] [data-cell-icon],[data-mode="dark"] [data-style="glass"] [data-table-row][data-selected="true"] [data-cell-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1166
+
1167
+ /**
1168
+ * SearchFilter - Glass Theme Styles
1169
+ *
1170
+ * Glassmorphism styling with blur and transparency.
1171
+ */
1172
+
1173
+ /* =============================================================================
1174
+ Input
1175
+ ============================================================================= */
1176
+
1177
+ [data-style='glass'] [data-search-input] {
1178
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1179
+ }[data-mode="dark"][data-style="glass"] [data-search-input],[data-mode="dark"] [data-style="glass"] [data-search-input]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1180
+
1181
+ [data-style='glass'] [data-search-input]:focus {
1182
+ border-color:rgba(var(--color-primary-500),0.5);--un-ring-width:1px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.3);
1183
+ }[data-mode="dark"][data-style="glass"] [data-search-input]:focus,[data-mode="dark"] [data-style="glass"] [data-search-input]:focus{border-color:rgba(var(--color-primary-500),0.5);--un-ring-color:rgba(var(--color-surface-500),0.3);}
1184
+
1185
+ [data-style='glass'] [data-search-input]::placeholder {
1186
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1187
+ }[data-mode="dark"][data-style="glass"] [data-search-input]::placeholder,[data-mode="dark"] [data-style="glass"] [data-search-input]::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1188
+
1189
+ /* =============================================================================
1190
+ Clear Button
1191
+ ============================================================================= */
1192
+
1193
+ [data-style='glass'] [data-search-clear] {
1194
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1195
+ }[data-mode="dark"][data-style="glass"] [data-search-clear],[data-mode="dark"] [data-style="glass"] [data-search-clear]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1196
+
1197
+ [data-style='glass'] [data-search-clear]:hover {
1198
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1199
+ }[data-mode="dark"][data-style="glass"] [data-search-clear]:hover,[data-mode="dark"] [data-style="glass"] [data-search-clear]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1200
+
1201
+ /* =============================================================================
1202
+ Tags
1203
+ ============================================================================= */
1204
+
1205
+ [data-style='glass'] [data-search-tag] {
1206
+ background-color:rgba(var(--color-surface-200),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1207
+ }[data-mode="dark"][data-style="glass"] [data-search-tag],[data-mode="dark"] [data-style="glass"] [data-search-tag]{background-color:rgba(var(--color-surface-800),0.15);--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1208
+
1209
+ [data-style='glass'] [data-search-tag-remove] {
1210
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1211
+ }[data-mode="dark"][data-style="glass"] [data-search-tag-remove],[data-mode="dark"] [data-style="glass"] [data-search-tag-remove]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1212
+
1213
+ [data-style='glass'] [data-search-tag-remove]:hover {
1214
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1215
+ }[data-mode="dark"][data-style="glass"] [data-search-tag-remove]:hover,[data-mode="dark"] [data-style="glass"] [data-search-tag-remove]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1216
+
1217
+ /**
1218
+ * Range - Glass Theme Styles
1219
+ *
1220
+ * Glassmorphism styling with blur and transparency.
1221
+ */
1222
+
1223
+ /* =============================================================================
1224
+ Track
1225
+ ============================================================================= */
1226
+
1227
+ [data-style='glass'] [data-range-bar] {
1228
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-200),0.5);
1229
+ }[data-mode="dark"][data-style="glass"] [data-range-bar],[data-mode="dark"] [data-style="glass"] [data-range-bar]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-800),0.5);}
1230
+
1231
+ [data-style='glass'] [data-range-selected] {
1232
+ background-color:rgba(var(--color-primary),0.4);
1233
+ }
1234
+
1235
+ /* =============================================================================
1236
+ Thumb
1237
+ ============================================================================= */
1238
+
1239
+ [data-style='glass'] [data-range-thumb] {
1240
+ border-color:rgba(var(--color-primary),0.5);background-color:rgba(var(--color-primary),0.8);--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1241
+ }
1242
+
1243
+ [data-style='glass'] [data-range-thumb][data-sliding] {
1244
+ box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary) 20%, transparent);
1245
+ }
1246
+
1247
+ [data-style='glass'] [data-range-thumb]:focus-visible {
1248
+ box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary) 20%, transparent);
1249
+ }
1250
+
1251
+ /* =============================================================================
1252
+ Ticks
1253
+ ============================================================================= */
1254
+
1255
+ [data-style='glass'] [data-range-tick] {
1256
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1257
+ }[data-mode="dark"][data-style="glass"] [data-range-tick],[data-mode="dark"] [data-style="glass"] [data-range-tick]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1258
+
1259
+ [data-style='glass'] [data-tick-bar] {
1260
+ border-color:rgba(var(--color-surface-500),0.4);
1261
+ }[data-mode="dark"][data-style="glass"] [data-tick-bar],[data-mode="dark"] [data-style="glass"] [data-tick-bar]{border-color:rgba(var(--color-surface-500),0.4);}
1262
+
1263
+ [data-style='glass'] [data-tick-label] {
1264
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1265
+ }[data-mode="dark"][data-style="glass"] [data-tick-label],[data-mode="dark"] [data-style="glass"] [data-tick-label]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1266
+
1267
+ /* =============================================================================
1268
+ Disabled
1269
+ ============================================================================= */
1270
+
1271
+ [data-style='glass'] [data-range][data-disabled] [data-range-thumb] {
1272
+ border-color:rgba(var(--color-surface-400),0.3);background-color:rgba(var(--color-surface-400),0.5);
1273
+ }[data-mode="dark"][data-style="glass"] [data-range][data-disabled] [data-range-thumb],[data-mode="dark"] [data-style="glass"] [data-range][data-disabled] [data-range-thumb]{border-color:rgba(var(--color-surface-600),0.3);background-color:rgba(var(--color-surface-600),0.5);}
1274
+
1275
+ [data-style='glass'] [data-range][data-disabled] [data-range-selected] {
1276
+ background-color:rgba(var(--color-surface-400),0.3);
1277
+ }[data-mode="dark"][data-style="glass"] [data-range][data-disabled] [data-range-selected],[data-mode="dark"] [data-style="glass"] [data-range][data-disabled] [data-range-selected]{background-color:rgba(var(--color-surface-600),0.3);}
1278
+
1279
+ /**
1280
+ * Timeline - Glass Theme Styles
1281
+ *
1282
+ * Glassmorphism styling with blur and transparency.
1283
+ */
1284
+
1285
+ /* =============================================================================
1286
+ Circle
1287
+ ============================================================================= */
1288
+
1289
+ [data-style='glass'] [data-timeline-circle] {
1290
+ border-color:rgba(var(--color-surface-500),0.3);--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1291
+ }[data-mode="dark"][data-style="glass"] [data-timeline-circle],[data-mode="dark"] [data-style="glass"] [data-timeline-circle]{border-color:rgba(var(--color-surface-500),0.3);--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1292
+
1293
+ [data-style='glass'] [data-timeline-item][data-completed] [data-timeline-circle] {
1294
+ border-color:rgba(var(--color-primary),0.5);background-color:rgba(var(--color-primary),0.8);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1295
+ }
1296
+
1297
+ [data-style='glass'] [data-timeline-item][data-active] [data-timeline-circle] {
1298
+ border-color:rgba(var(--color-primary),0.6);--un-text-opacity:1;color:rgba(var(--color-primary),var(--un-text-opacity));
1299
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 15%, transparent);
1300
+ }
1301
+
1302
+ /* =============================================================================
1303
+ Connector
1304
+ ============================================================================= */
1305
+
1306
+ [data-style='glass'] [data-timeline-connector] {
1307
+ background-color:rgba(var(--color-surface-500),0.2);
1308
+ }[data-mode="dark"][data-style="glass"] [data-timeline-connector],[data-mode="dark"] [data-style="glass"] [data-timeline-connector]{background-color:rgba(var(--color-surface-500),0.2);}
1309
+
1310
+ [data-style='glass'] [data-timeline-item][data-completed] [data-timeline-connector] {
1311
+ background-color:rgba(var(--color-primary),0.4);
1312
+ }
1313
+
1314
+ /* =============================================================================
1315
+ Body
1316
+ ============================================================================= */
1317
+
1318
+ [data-style='glass'] [data-timeline-title] {
1319
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1320
+ }[data-mode="dark"][data-style="glass"] [data-timeline-title],[data-mode="dark"] [data-style="glass"] [data-timeline-title]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1321
+
1322
+ [data-style='glass'] [data-timeline-description] {
1323
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1324
+ }[data-mode="dark"][data-style="glass"] [data-timeline-description],[data-mode="dark"] [data-style="glass"] [data-timeline-description]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1325
+
1326
+ /**
1327
+ * FloatingNavigation - Glass Theme Styles
1328
+ *
1329
+ * Glassmorphism styling with blur and transparency.
1330
+ */
1331
+
1332
+ /* =============================================================================
1333
+ Container
1334
+ ============================================================================= */
1335
+
1336
+ [data-style='glass'] [data-floating-nav] {
1337
+ border-width:1px;border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-100),0.7);--un-shadow:var(--un-shadow-inset) 0 20px 25px -5px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 8px 10px -6px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-backdrop-blur:blur(24px);-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
1338
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav],[data-mode="dark"] [data-style="glass"] [data-floating-nav]{border-color:rgba(var(--color-surface-500),0.2);background-color:rgba(var(--color-surface-900),0.7);}
1339
+
1340
+ /* =============================================================================
1341
+ Header
1342
+ ============================================================================= */
1343
+
1344
+ [data-style='glass'] [data-floating-nav-title] {
1345
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1346
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-title],[data-mode="dark"] [data-style="glass"] [data-floating-nav-title]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1347
+
1348
+ [data-style='glass'] [data-floating-nav-pin] {
1349
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1350
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-pin],[data-mode="dark"] [data-style="glass"] [data-floating-nav-pin]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1351
+
1352
+ [data-style='glass'] [data-floating-nav-pin]:hover {
1353
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1354
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-pin]:hover,[data-mode="dark"] [data-style="glass"] [data-floating-nav-pin]:hover{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1355
+
1356
+ [data-style='glass'] [data-floating-nav-pin][aria-pressed='true'] {
1357
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1358
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-pin][aria-pressed="true"],[data-mode="dark"] [data-style="glass"] [data-floating-nav-pin][aria-pressed="true"]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1359
+
1360
+ /* =============================================================================
1361
+ Items
1362
+ ============================================================================= */
1363
+
1364
+ [data-style='glass'] [data-floating-nav-item] {
1365
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1366
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item],[data-mode="dark"] [data-style="glass"] [data-floating-nav-item]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1367
+
1368
+ [data-style='glass'] [data-floating-nav-item]:hover {
1369
+ background-color:rgba(var(--color-surface-200),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));
1370
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item]:hover,[data-mode="dark"] [data-style="glass"] [data-floating-nav-item]:hover{background-color:rgba(var(--color-surface-800),0.5);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
1371
+
1372
+ [data-style='glass'] [data-floating-nav-item][data-active] {
1373
+ background-color:rgba(var(--color-primary-500),0.1);--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1374
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item][data-active],[data-mode="dark"] [data-style="glass"] [data-floating-nav-item][data-active]{background-color:rgba(var(--color-primary-500),0.1);--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1375
+
1376
+ [data-style='glass'] [data-floating-nav-item]:focus-visible {
1377
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:rgba(var(--color-surface-500),0.4);
1378
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item]:focus-visible,[data-mode="dark"] [data-style="glass"] [data-floating-nav-item]:focus-visible{--un-ring-color:rgba(var(--color-surface-500),0.4);}
1379
+
1380
+ /* Icon */
1381
+ [data-style='glass'] [data-floating-nav-icon] {
1382
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1383
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-icon],[data-mode="dark"] [data-style="glass"] [data-floating-nav-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1384
+
1385
+ [data-style='glass'] [data-floating-nav-item]:hover [data-floating-nav-icon] {
1386
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1387
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item]:hover [data-floating-nav-icon],[data-mode="dark"] [data-style="glass"] [data-floating-nav-item]:hover [data-floating-nav-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1388
+
1389
+ [data-style='glass'] [data-floating-nav-item][data-active] [data-floating-nav-icon] {
1390
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1391
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-item][data-active] [data-floating-nav-icon],[data-mode="dark"] [data-style="glass"] [data-floating-nav-item][data-active] [data-floating-nav-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1392
+
1393
+ /* =============================================================================
1394
+ Active Indicator
1395
+ ============================================================================= */
1396
+
1397
+ [data-style='glass'] [data-floating-nav-indicator] {
1398
+ background-color:rgba(var(--color-primary-500),0.8);
1399
+ }[data-mode="dark"][data-style="glass"] [data-floating-nav-indicator],[data-mode="dark"] [data-style="glass"] [data-floating-nav-indicator]{background-color:rgba(var(--color-primary-500),0.8);}
1400
+