@solidxai/core-ui 0.1.5-beta.0 → 0.1.5-beta.10

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 (239) hide show
  1. package/dist/components/auth/AuthTabs.d.ts +14 -0
  2. package/dist/components/auth/AuthTabs.d.ts.map +1 -0
  3. package/dist/components/auth/AuthTabs.js +19 -0
  4. package/dist/components/auth/AuthTabs.js.map +1 -0
  5. package/dist/components/auth/AuthTabs.tsx +38 -0
  6. package/dist/components/common/AuthBanner.js.map +1 -1
  7. package/dist/components/common/SolidErrorStatePage.d.ts +12 -0
  8. package/dist/components/common/SolidErrorStatePage.d.ts.map +1 -0
  9. package/dist/components/common/SolidErrorStatePage.js +16 -0
  10. package/dist/components/common/SolidErrorStatePage.js.map +1 -0
  11. package/dist/components/common/SolidErrorStatePage.tsx +55 -0
  12. package/dist/components/core/chatter/SolidChatter.d.ts.map +1 -1
  13. package/dist/components/core/chatter/SolidChatter.js +6 -7
  14. package/dist/components/core/chatter/SolidChatter.js.map +1 -1
  15. package/dist/components/core/chatter/SolidChatter.tsx +6 -7
  16. package/dist/components/core/chatter/SolidChatterAuditMessage.d.ts +5 -2
  17. package/dist/components/core/chatter/SolidChatterAuditMessage.d.ts.map +1 -1
  18. package/dist/components/core/chatter/SolidChatterAuditMessage.js +19 -1
  19. package/dist/components/core/chatter/SolidChatterAuditMessage.js.map +1 -1
  20. package/dist/components/core/chatter/SolidChatterAuditMessage.tsx +29 -5
  21. package/dist/components/core/chatter/SolidChatterDateDivider.d.ts.map +1 -1
  22. package/dist/components/core/chatter/SolidChatterDateDivider.js +4 -1
  23. package/dist/components/core/chatter/SolidChatterDateDivider.js.map +1 -1
  24. package/dist/components/core/chatter/SolidChatterDateDivider.tsx +5 -1
  25. package/dist/components/core/common/SolidCreateButton.js +3 -3
  26. package/dist/components/core/common/SolidCreateButton.js.map +1 -1
  27. package/dist/components/core/common/SolidCreateButton.tsx +3 -3
  28. package/dist/components/core/common/SolidGlobalSearchElement.d.ts.map +1 -1
  29. package/dist/components/core/common/SolidGlobalSearchElement.js.map +1 -1
  30. package/dist/components/core/common/SolidGlobalSearchElement.tsx +1 -0
  31. package/dist/components/core/dashboard/DashboardFilter.d.ts +13 -0
  32. package/dist/components/core/dashboard/DashboardFilter.d.ts.map +1 -0
  33. package/dist/components/core/dashboard/DashboardFilter.js +305 -0
  34. package/dist/components/core/dashboard/DashboardFilter.js.map +1 -0
  35. package/dist/components/core/dashboard/DashboardFilter.tsx +356 -0
  36. package/dist/components/core/dashboard/PrimeDataTableWrapper.d.ts +3 -0
  37. package/dist/components/core/dashboard/PrimeDataTableWrapper.d.ts.map +1 -0
  38. package/dist/components/core/dashboard/PrimeDataTableWrapper.js +21 -0
  39. package/dist/components/core/dashboard/PrimeDataTableWrapper.js.map +1 -0
  40. package/dist/components/core/dashboard/PrimeDataTableWrapper.tsx +40 -0
  41. package/dist/components/core/dashboard/SolidDashboard.d.ts +0 -1
  42. package/dist/components/core/dashboard/SolidDashboard.d.ts.map +1 -1
  43. package/dist/components/core/dashboard/SolidDashboard.js +51 -22
  44. package/dist/components/core/dashboard/SolidDashboard.js.map +1 -1
  45. package/dist/components/core/dashboard/SolidDashboard.module.css +6 -2
  46. package/dist/components/core/dashboard/SolidDashboard.tsx +133 -56
  47. package/dist/components/core/dashboard/SolidDashboardBody.d.ts +13 -1
  48. package/dist/components/core/dashboard/SolidDashboardBody.d.ts.map +1 -1
  49. package/dist/components/core/dashboard/SolidDashboardBody.js +134 -48
  50. package/dist/components/core/dashboard/SolidDashboardBody.js.map +1 -1
  51. package/dist/components/core/dashboard/SolidDashboardBody.tsx +143 -91
  52. package/dist/components/core/dashboard/SolidQuestionRenderer.d.ts.map +1 -1
  53. package/dist/components/core/dashboard/SolidQuestionRenderer.js +1 -1
  54. package/dist/components/core/dashboard/SolidQuestionRenderer.js.map +1 -1
  55. package/dist/components/core/dashboard/SolidQuestionRenderer.tsx +12 -10
  56. package/dist/components/core/dashboard/chart-renderers/ChartJsRenderer.d.ts.map +1 -1
  57. package/dist/components/core/dashboard/chart-renderers/ChartJsRenderer.js +29 -2
  58. package/dist/components/core/dashboard/chart-renderers/ChartJsRenderer.js.map +1 -1
  59. package/dist/components/core/dashboard/chart-renderers/ChartJsRenderer.tsx +33 -3
  60. package/dist/components/core/extension/solid-core/dashboard/dashboardFormViewChangeHandler.d.ts +10 -0
  61. package/dist/components/core/extension/solid-core/dashboard/dashboardFormViewChangeHandler.d.ts.map +1 -0
  62. package/dist/components/core/extension/solid-core/dashboard/dashboardFormViewChangeHandler.js +16 -0
  63. package/dist/components/core/extension/solid-core/dashboard/dashboardFormViewChangeHandler.js.map +1 -0
  64. package/dist/components/core/extension/solid-core/dashboard/dashboardFormViewChangeHandler.ts +19 -0
  65. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionFieldChangeHandler.d.ts +8 -0
  66. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionFieldChangeHandler.d.ts.map +1 -0
  67. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionFieldChangeHandler.js +64 -0
  68. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionFieldChangeHandler.js.map +1 -0
  69. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionFieldChangeHandler.ts +30 -0
  70. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionOnFormLoadHandler.d.ts +8 -0
  71. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionOnFormLoadHandler.d.ts.map +1 -0
  72. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionOnFormLoadHandler.js +62 -0
  73. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionOnFormLoadHandler.js.map +1 -0
  74. package/dist/components/core/extension/solid-core/dashboard/dashboardQuestionOnFormLoadHandler.ts +29 -0
  75. package/dist/components/core/extension/solid-core/modelMetadata/list/DeleteModelRowAction.js +2 -2
  76. package/dist/components/core/extension/solid-core/modelMetadata/list/DeleteModelRowAction.js.map +1 -1
  77. package/dist/components/core/extension/solid-core/modelMetadata/list/DeleteModelRowAction.tsx +2 -2
  78. package/dist/components/core/form/SolidFormView.js +1 -1
  79. package/dist/components/core/form/SolidFormView.js.map +1 -1
  80. package/dist/components/core/form/SolidFormView.tsx +1 -1
  81. package/dist/components/core/kanban/SolidKanbanView.js +2 -2
  82. package/dist/components/core/kanban/SolidKanbanView.js.map +1 -1
  83. package/dist/components/core/kanban/SolidKanbanView.tsx +2 -2
  84. package/dist/components/core/list/PLAN.md +92 -0
  85. package/dist/components/core/list/SolidDataTable.d.ts +58 -0
  86. package/dist/components/core/list/SolidDataTable.d.ts.map +1 -0
  87. package/dist/components/core/list/SolidDataTable.js +141 -0
  88. package/dist/components/core/list/SolidDataTable.js.map +1 -0
  89. package/dist/components/core/list/SolidDataTable.tsx +314 -0
  90. package/dist/components/core/list/SolidDataTablePagination.d.ts +15 -0
  91. package/dist/components/core/list/SolidDataTablePagination.d.ts.map +1 -0
  92. package/dist/components/core/list/SolidDataTablePagination.js +22 -0
  93. package/dist/components/core/list/SolidDataTablePagination.js.map +1 -0
  94. package/dist/components/core/list/SolidDataTablePagination.tsx +71 -0
  95. package/dist/components/core/list/SolidListView.d.ts.map +1 -1
  96. package/dist/components/core/list/SolidListView.js +14 -11
  97. package/dist/components/core/list/SolidListView.js.map +1 -1
  98. package/dist/components/core/list/SolidListView.tsx +8 -7
  99. package/dist/components/core/list/columns/SolidDateColumn.d.ts +2 -0
  100. package/dist/components/core/list/columns/SolidDateColumn.d.ts.map +1 -1
  101. package/dist/components/core/list/columns/SolidDateColumn.js +9 -1
  102. package/dist/components/core/list/columns/SolidDateColumn.js.map +1 -1
  103. package/dist/components/core/list/columns/SolidDateColumn.tsx +13 -1
  104. package/dist/components/core/list/columns/SolidDatetimeColumn.js +1 -1
  105. package/dist/components/core/list/columns/SolidDatetimeColumn.js.map +1 -1
  106. package/dist/components/core/list/columns/SolidDatetimeColumn.tsx +1 -1
  107. package/dist/components/core/tree/SolidTreeView.d.ts.map +1 -1
  108. package/dist/components/core/tree/SolidTreeView.js +277 -43
  109. package/dist/components/core/tree/SolidTreeView.js.map +1 -1
  110. package/dist/components/core/tree/SolidTreeView.tsx +436 -4
  111. package/dist/components/layout/AdminTopHeader.d.ts +2 -0
  112. package/dist/components/layout/AdminTopHeader.d.ts.map +1 -0
  113. package/dist/components/layout/AdminTopHeader.js +68 -0
  114. package/dist/components/layout/AdminTopHeader.js.map +1 -0
  115. package/dist/components/layout/AdminTopHeader.tsx +135 -0
  116. package/dist/components/shad-cn-ui/SolidAutocomplete.d.ts +24 -0
  117. package/dist/components/shad-cn-ui/SolidAutocomplete.d.ts.map +1 -0
  118. package/dist/components/shad-cn-ui/SolidAutocomplete.js +224 -0
  119. package/dist/components/shad-cn-ui/SolidAutocomplete.js.map +1 -0
  120. package/dist/components/shad-cn-ui/SolidAutocomplete.tsx +339 -0
  121. package/dist/components/shad-cn-ui/SolidButton.d.ts +14 -0
  122. package/dist/components/shad-cn-ui/SolidButton.d.ts.map +1 -0
  123. package/dist/components/shad-cn-ui/SolidButton.js +36 -0
  124. package/dist/components/shad-cn-ui/SolidButton.js.map +1 -0
  125. package/dist/components/shad-cn-ui/SolidButton.tsx +54 -0
  126. package/dist/components/shad-cn-ui/SolidInput.d.ts +5 -0
  127. package/dist/components/shad-cn-ui/SolidInput.d.ts.map +1 -0
  128. package/dist/components/shad-cn-ui/SolidInput.js +35 -0
  129. package/dist/components/shad-cn-ui/SolidInput.js.map +1 -0
  130. package/dist/components/shad-cn-ui/SolidInput.tsx +12 -0
  131. package/dist/components/shad-cn-ui/SolidNumberInput.d.ts +10 -0
  132. package/dist/components/shad-cn-ui/SolidNumberInput.d.ts.map +1 -0
  133. package/dist/components/shad-cn-ui/SolidNumberInput.js +33 -0
  134. package/dist/components/shad-cn-ui/SolidNumberInput.js.map +1 -0
  135. package/dist/components/shad-cn-ui/SolidNumberInput.tsx +24 -0
  136. package/dist/components/shad-cn-ui/SolidSelect.d.ts +16 -0
  137. package/dist/components/shad-cn-ui/SolidSelect.d.ts.map +1 -0
  138. package/dist/components/shad-cn-ui/SolidSelect.js +26 -0
  139. package/dist/components/shad-cn-ui/SolidSelect.js.map +1 -0
  140. package/dist/components/shad-cn-ui/SolidSelect.tsx +65 -0
  141. package/dist/components/shad-cn-ui/SolidTabs.d.ts +18 -0
  142. package/dist/components/shad-cn-ui/SolidTabs.d.ts.map +1 -0
  143. package/dist/components/shad-cn-ui/SolidTabs.js +22 -0
  144. package/dist/components/shad-cn-ui/SolidTabs.js.map +1 -0
  145. package/dist/components/shad-cn-ui/SolidTabs.tsx +73 -0
  146. package/dist/components/shad-cn-ui/index.d.ts +7 -0
  147. package/dist/components/shad-cn-ui/index.d.ts.map +1 -0
  148. package/dist/components/shad-cn-ui/index.js +7 -0
  149. package/dist/components/shad-cn-ui/index.js.map +1 -0
  150. package/dist/components/shad-cn-ui/index.ts +6 -0
  151. package/dist/components/solid-ui/SolidButton.d.ts +14 -0
  152. package/dist/components/solid-ui/SolidButton.d.ts.map +1 -0
  153. package/dist/components/solid-ui/SolidButton.js +36 -0
  154. package/dist/components/solid-ui/SolidButton.js.map +1 -0
  155. package/dist/components/solid-ui/SolidButton.tsx +54 -0
  156. package/dist/components/solid-ui/SolidTabs.d.ts +18 -0
  157. package/dist/components/solid-ui/SolidTabs.d.ts.map +1 -0
  158. package/dist/components/solid-ui/SolidTabs.js +22 -0
  159. package/dist/components/solid-ui/SolidTabs.js.map +1 -0
  160. package/dist/components/solid-ui/SolidTabs.tsx +73 -0
  161. package/dist/components/solid-ui/index.d.ts +3 -0
  162. package/dist/components/solid-ui/index.d.ts.map +1 -0
  163. package/dist/components/solid-ui/index.js +3 -0
  164. package/dist/components/solid-ui/index.js.map +1 -0
  165. package/dist/components/solid-ui/index.ts +2 -0
  166. package/dist/constants/error-messages.d.ts +3 -0
  167. package/dist/constants/error-messages.d.ts.map +1 -1
  168. package/dist/constants/error-messages.js +3 -0
  169. package/dist/constants/error-messages.js.map +1 -1
  170. package/dist/constants/error-messages.ts +24 -20
  171. package/dist/helpers/registry.d.ts.map +1 -1
  172. package/dist/helpers/registry.js +10 -0
  173. package/dist/helpers/registry.js.map +1 -1
  174. package/dist/helpers/registry.ts +12 -0
  175. package/dist/helpers/routePaths.d.ts +1 -1
  176. package/dist/helpers/routePaths.d.ts.map +1 -1
  177. package/dist/helpers/routePaths.js +2 -2
  178. package/dist/helpers/routePaths.js.map +1 -1
  179. package/dist/helpers/routePaths.ts +2 -2
  180. package/dist/index.d.ts +2 -0
  181. package/dist/index.d.ts.map +1 -1
  182. package/dist/index.js +2 -0
  183. package/dist/index.js.map +1 -1
  184. package/dist/index.ts +8 -0
  185. package/dist/redux/api/dashboardLayoutApi.d.ts +24 -0
  186. package/dist/redux/api/dashboardLayoutApi.d.ts.map +1 -0
  187. package/dist/redux/api/dashboardLayoutApi.js +34 -0
  188. package/dist/redux/api/dashboardLayoutApi.js.map +1 -0
  189. package/dist/redux/api/dashboardLayoutApi.ts +55 -0
  190. package/dist/redux/store/defaultStoreConfig.d.ts +4 -0
  191. package/dist/redux/store/defaultStoreConfig.d.ts.map +1 -1
  192. package/dist/redux/store/defaultStoreConfig.js +3 -2
  193. package/dist/redux/store/defaultStoreConfig.js.map +1 -1
  194. package/dist/redux/store/defaultStoreConfig.ts +4 -2
  195. package/dist/resources/globals.css +8 -0
  196. package/dist/resources/images/errors/error-astronaut-404.png +0 -0
  197. package/dist/resources/shadcn-base.css +3200 -0
  198. package/dist/routes/pages/admin/core/DashboardPage.d.ts.map +1 -1
  199. package/dist/routes/pages/admin/core/DashboardPage.js +3 -7
  200. package/dist/routes/pages/admin/core/DashboardPage.js.map +1 -1
  201. package/dist/routes/pages/admin/core/DashboardPage.tsx +2 -5
  202. package/dist/routes/pages/admin/core/FormPage.d.ts.map +1 -1
  203. package/dist/routes/pages/admin/core/FormPage.js +6 -1
  204. package/dist/routes/pages/admin/core/FormPage.js.map +1 -1
  205. package/dist/routes/pages/admin/core/FormPage.tsx +7 -1
  206. package/dist/routes/solidRoutes.js +1 -1
  207. package/dist/routes/solidRoutes.js.map +1 -1
  208. package/dist/routes/solidRoutes.tsx +1 -1
  209. package/package.json +13 -11
  210. package/dist/components/auth/SolidOTPVerify.d.ts +0 -3
  211. package/dist/components/auth/SolidOTPVerify.d.ts.map +0 -1
  212. package/dist/components/auth/SolidOTPVerify.js +0 -67
  213. package/dist/components/auth/SolidOTPVerify.js.map +0 -1
  214. package/dist/components/auth/SolidOTPVerify.tsx +0 -133
  215. package/dist/components/core/common/LoadDynamicJsxComponent.d.ts +0 -2
  216. package/dist/components/core/common/LoadDynamicJsxComponent.d.ts.map +0 -1
  217. package/dist/components/core/common/LoadDynamicJsxComponent.js +0 -50
  218. package/dist/components/core/common/LoadDynamicJsxComponent.js.map +0 -1
  219. package/dist/components/core/common/LoadDynamicJsxComponent.tsx +0 -70
  220. package/dist/nextAuth/authProviders.d.ts +0 -4
  221. package/dist/nextAuth/authProviders.d.ts.map +0 -1
  222. package/dist/nextAuth/authProviders.js +0 -198
  223. package/dist/nextAuth/authProviders.js.map +0 -1
  224. package/dist/nextAuth/authProviders.tsx +0 -232
  225. package/dist/nextAuth/handleLogout.d.ts +0 -2
  226. package/dist/nextAuth/handleLogout.d.ts.map +0 -1
  227. package/dist/nextAuth/handleLogout.js +0 -36
  228. package/dist/nextAuth/handleLogout.js.map +0 -1
  229. package/dist/nextAuth/handleLogout.tsx +0 -39
  230. package/dist/nextAuth/refreshAccessToken.d.ts +0 -2
  231. package/dist/nextAuth/refreshAccessToken.d.ts.map +0 -1
  232. package/dist/nextAuth/refreshAccessToken.js +0 -24
  233. package/dist/nextAuth/refreshAccessToken.js.map +0 -1
  234. package/dist/nextAuth/refreshAccessToken.tsx +0 -28
  235. package/dist/redux/features/settingsSlice.d.ts +0 -20
  236. package/dist/redux/features/settingsSlice.d.ts.map +0 -1
  237. package/dist/redux/features/settingsSlice.js +0 -39
  238. package/dist/redux/features/settingsSlice.js.map +0 -1
  239. package/dist/redux/features/settingsSlice.ts +0 -60
@@ -0,0 +1,3200 @@
1
+ :root {
2
+ --solid-surface-0: #f6f8fc;
3
+ --solid-surface-1: #ffffff;
4
+ --solid-surface-2: #eef2ff;
5
+ --solid-surface-3: #f8fafc;
6
+ --solid-surface-elevated: #ffffff;
7
+ --solid-text-primary: #0f172a;
8
+ --solid-text-secondary: #475569;
9
+ --solid-text-muted: #64748b;
10
+ --solid-border-default: #e2e8f0;
11
+ --solid-border-strong: #cbd5e1;
12
+ --solid-interactive-bg: #2563eb;
13
+ --solid-interactive-fg: #ffffff;
14
+ --solid-focus-ring: rgba(37, 99, 235, 0.35);
15
+ --background: #f6f8fc;
16
+ --foreground: #0f172a;
17
+ --card: #ffffff;
18
+ --card-foreground: #0f172a;
19
+ --border: #e2e8f0;
20
+ --muted: #64748b;
21
+ --muted-foreground: #475569;
22
+ --accent: #eef2ff;
23
+ --accent-foreground: #3730a3;
24
+ --primary: #2563eb;
25
+ --primary-foreground: #ffffff;
26
+ --ring: rgba(37, 99, 235, 0.35);
27
+ --sidebar-background: #f8fafc;
28
+ --sidebar-foreground: #0f172a;
29
+ --sidebar-border: #e2e8f0;
30
+ --sidebar-accent: #f1f5f9;
31
+ --sidebar-accent-foreground: #0f172a;
32
+ --sidebar-primary: #2563eb;
33
+ --sidebar-primary-foreground: #ffffff;
34
+ --sidebar-width: 272px;
35
+ --sidebar-width-collapsed: 76px;
36
+ --solid-sidebar-width: 272px;
37
+ --shadow-soft: 0 12px 28px rgba(15, 23, 42, 0.1);
38
+ }
39
+
40
+ html.dark,
41
+ [data-theme="dark"] {
42
+ --solid-surface-0: #090f1d;
43
+ --solid-surface-1: #111827;
44
+ --solid-surface-2: #172554;
45
+ --solid-surface-3: #020817;
46
+ --solid-surface-elevated: #111827;
47
+ --solid-text-primary: #f8fafc;
48
+ --solid-text-secondary: #cbd5e1;
49
+ --solid-text-muted: #94a3b8;
50
+ --solid-border-default: #1f2937;
51
+ --solid-border-strong: #374151;
52
+ --solid-interactive-bg: #60a5fa;
53
+ --solid-interactive-fg: #0b1220;
54
+ --solid-focus-ring: rgba(96, 165, 250, 0.35);
55
+ --background: #090f1d;
56
+ --foreground: #e5e7eb;
57
+ --card: #111827;
58
+ --card-foreground: #f8fafc;
59
+ --border: #1f2937;
60
+ --muted: #94a3b8;
61
+ --muted-foreground: #cbd5e1;
62
+ --accent: #172554;
63
+ --accent-foreground: #dbeafe;
64
+ --primary: #60a5fa;
65
+ --primary-foreground: #0b1220;
66
+ --ring: rgba(96, 165, 250, 0.35);
67
+ --sidebar-background: #020817;
68
+ --sidebar-foreground: #e2e8f0;
69
+ --sidebar-border: #111827;
70
+ --sidebar-accent: #0f172a;
71
+ --sidebar-accent-foreground: #f8fafc;
72
+ --sidebar-primary: #1d4ed8;
73
+ --sidebar-primary-foreground: #e5efff;
74
+ --shadow-soft: 0 18px 30px rgba(2, 6, 23, 0.6);
75
+ }
76
+
77
+ html,
78
+ body {
79
+ background: var(--background);
80
+ color: var(--foreground);
81
+ }
82
+
83
+ .solid-shell {
84
+ min-height: 100vh;
85
+ background: radial-gradient(circle at 0 0, rgba(37, 99, 235, 0.08), transparent 38%), var(--background);
86
+ }
87
+
88
+ .solid-main {
89
+ min-height: 100vh;
90
+ margin-left: var(--solid-sidebar-width);
91
+ transition: margin-left 200ms ease;
92
+ display: flex;
93
+ flex-direction: column;
94
+ }
95
+
96
+ .solid-main-content {
97
+ flex: 1;
98
+ min-height: 0;
99
+ display: flex;
100
+ flex-direction: column;
101
+ overflow: hidden;
102
+ }
103
+
104
+ .solid-admin-header {
105
+ position: sticky;
106
+ top: 0;
107
+ z-index: 58;
108
+ height: 46px;
109
+ border-bottom: 1px solid var(--border);
110
+ background: color-mix(in srgb, var(--background) 88%, transparent);
111
+ backdrop-filter: blur(8px);
112
+ }
113
+
114
+ .solid-admin-header-inner {
115
+ height: 100%;
116
+ display: flex;
117
+ align-items: center;
118
+ gap: 10px;
119
+ padding: 0 12px;
120
+ }
121
+
122
+ .solid-admin-sidebar-trigger {
123
+ width: 28px;
124
+ height: 28px;
125
+ border-radius: 8px;
126
+ border: 1px solid var(--border);
127
+ background: var(--card);
128
+ color: var(--card-foreground);
129
+ display: grid;
130
+ place-items: center;
131
+ }
132
+
133
+ .solid-admin-sidebar-trigger:hover,
134
+ .solid-admin-sidebar-trigger:focus-visible {
135
+ box-shadow: 0 0 0 3px var(--ring);
136
+ outline: none;
137
+ }
138
+
139
+ .solid-admin-header-sep {
140
+ width: 1px;
141
+ height: 16px;
142
+ background: var(--border);
143
+ }
144
+
145
+ .solid-admin-breadcrumbs {
146
+ display: flex;
147
+ align-items: center;
148
+ gap: 8px;
149
+ min-width: 0;
150
+ flex: 1;
151
+ }
152
+
153
+ .solid-admin-crumb {
154
+ display: inline-flex;
155
+ align-items: center;
156
+ gap: 8px;
157
+ font-size: 13px;
158
+ color: var(--muted-foreground);
159
+ white-space: nowrap;
160
+ }
161
+
162
+ .solid-admin-crumb:last-child {
163
+ color: var(--foreground);
164
+ }
165
+
166
+ .solid-admin-crumb-sep {
167
+ color: var(--muted);
168
+ }
169
+
170
+ .solid-admin-back-btn {
171
+ height: 28px;
172
+ border-radius: 8px;
173
+ border: 1px solid var(--border);
174
+ background: var(--card);
175
+ color: var(--card-foreground);
176
+ font-size: 12px;
177
+ padding: 0 10px;
178
+ }
179
+
180
+ .solid-admin-header-actions {
181
+ display: inline-flex;
182
+ align-items: center;
183
+ gap: 8px;
184
+ }
185
+
186
+ .solid-admin-theme-toggle {
187
+ width: 32px;
188
+ height: 32px;
189
+ border: 0;
190
+ border-radius: 8px;
191
+ background: transparent;
192
+ color: var(--muted-foreground);
193
+ display: inline-flex;
194
+ align-items: center;
195
+ justify-content: center;
196
+ cursor: pointer;
197
+ transition: background 120ms ease, color 120ms ease, box-shadow 120ms ease;
198
+ }
199
+
200
+ .solid-admin-theme-toggle:hover {
201
+ background: var(--accent);
202
+ color: var(--accent-foreground);
203
+ }
204
+
205
+ .solid-admin-theme-toggle:focus-visible {
206
+ outline: none;
207
+ box-shadow: 0 0 0 3px var(--ring);
208
+ }
209
+
210
+ .solid-sr-only {
211
+ position: absolute;
212
+ width: 1px;
213
+ height: 1px;
214
+ padding: 0;
215
+ margin: -1px;
216
+ overflow: hidden;
217
+ clip: rect(0, 0, 0, 0);
218
+ border: 0;
219
+ }
220
+
221
+ .solid-sidebar-backdrop {
222
+ position: fixed;
223
+ inset: 0;
224
+ background: rgba(2, 6, 23, 0.4);
225
+ z-index: 59;
226
+ }
227
+
228
+ .solid-sidebar-mobile-trigger {
229
+ position: fixed;
230
+ top: 14px;
231
+ left: 12px;
232
+ width: 38px;
233
+ height: 38px;
234
+ border-radius: 10px;
235
+ border: 1px solid var(--sidebar-border);
236
+ background: var(--card);
237
+ color: var(--card-foreground);
238
+ z-index: 61;
239
+ }
240
+
241
+ .solid-sidebar {
242
+ position: fixed;
243
+ inset: 0 auto 0 0;
244
+ width: var(--sidebar-width);
245
+ background: var(--sidebar-background);
246
+ color: var(--sidebar-foreground);
247
+ border-right: 1px solid var(--sidebar-border);
248
+ z-index: 60;
249
+ display: flex;
250
+ flex-direction: column;
251
+ transition: width 200ms ease, transform 200ms ease;
252
+ box-shadow: var(--shadow-soft);
253
+ }
254
+
255
+ .solid-sidebar.is-collapsed {
256
+ transform: translateX(calc(-1 * var(--sidebar-width)));
257
+ box-shadow: none;
258
+ }
259
+
260
+ .solid-sidebar-header {
261
+ border-bottom: 0;
262
+ padding: 10px 10px 8px;
263
+ display: flex;
264
+ align-items: center;
265
+ gap: 10px;
266
+ }
267
+
268
+ .solid-workspace-switcher {
269
+ position: relative;
270
+ flex: 1;
271
+ }
272
+
273
+ .solid-workspace-trigger {
274
+ width: 100%;
275
+ border: 1px solid var(--sidebar-border);
276
+ background: var(--card);
277
+ color: var(--card-foreground);
278
+ min-height: 40px;
279
+ border-radius: 10px;
280
+ display: flex;
281
+ align-items: center;
282
+ gap: 9px;
283
+ padding: 6px 9px;
284
+ text-align: left;
285
+ }
286
+
287
+ .solid-workspace-avatar {
288
+ width: 24px;
289
+ height: 24px;
290
+ border-radius: 8px;
291
+ background: linear-gradient(135deg, var(--sidebar-primary), #6366f1);
292
+ color: var(--sidebar-primary-foreground);
293
+ display: grid;
294
+ place-items: center;
295
+ font-size: 12px;
296
+ font-weight: 700;
297
+ }
298
+
299
+ .solid-workspace-label-wrap {
300
+ display: flex;
301
+ flex-direction: column;
302
+ min-width: 0;
303
+ flex: 1;
304
+ }
305
+
306
+ .solid-workspace-label-top {
307
+ font-size: 10px;
308
+ text-transform: uppercase;
309
+ letter-spacing: 0.06em;
310
+ color: var(--muted);
311
+ line-height: 1.1;
312
+ }
313
+
314
+ .solid-workspace-label {
315
+ font-size: 13px;
316
+ font-weight: 600;
317
+ line-height: 1.2;
318
+ white-space: nowrap;
319
+ overflow: hidden;
320
+ text-overflow: ellipsis;
321
+ }
322
+
323
+ .solid-workspace-chevron-dual {
324
+ width: 26px;
325
+ height: 26px;
326
+ border-radius: 999px;
327
+ border: 1px solid var(--sidebar-border);
328
+ display: inline-flex;
329
+ align-items: center;
330
+ justify-content: center;
331
+ color: var(--muted-foreground);
332
+ transition: transform 140ms ease, color 140ms ease, border-color 140ms ease;
333
+ }
334
+
335
+ .solid-workspace-chevron-dual.is-open {
336
+ transform: rotate(180deg);
337
+ }
338
+
339
+ .solid-workspace-trigger:hover .solid-workspace-chevron-dual {
340
+ color: var(--foreground);
341
+ border-color: color-mix(in srgb, var(--sidebar-border) 70%, var(--primary));
342
+ }
343
+
344
+ .solid-workspace-menu {
345
+ position: absolute;
346
+ left: 0;
347
+ right: 0;
348
+ top: calc(100% + 6px);
349
+ border: 1px solid var(--sidebar-border);
350
+ background: var(--card);
351
+ border-radius: 12px;
352
+ padding: 6px;
353
+ box-shadow: var(--shadow-soft);
354
+ z-index: 80;
355
+ }
356
+
357
+ .solid-workspace-item {
358
+ width: 100%;
359
+ border: 0;
360
+ border-radius: 8px;
361
+ height: 34px;
362
+ background: transparent;
363
+ color: var(--card-foreground);
364
+ display: flex;
365
+ align-items: center;
366
+ gap: 8px;
367
+ padding: 0 8px;
368
+ text-align: left;
369
+ }
370
+
371
+ .solid-workspace-item:hover {
372
+ background: var(--sidebar-accent);
373
+ }
374
+
375
+ .solid-workspace-item.is-active {
376
+ background: var(--accent);
377
+ color: var(--accent-foreground);
378
+ }
379
+
380
+ .solid-workspace-item-avatar {
381
+ width: 18px;
382
+ height: 18px;
383
+ border-radius: 6px;
384
+ background: var(--sidebar-primary);
385
+ color: var(--sidebar-primary-foreground);
386
+ display: grid;
387
+ place-items: center;
388
+ font-size: 10px;
389
+ font-weight: 700;
390
+ }
391
+
392
+ .solid-workspace-item-label {
393
+ font-size: 12px;
394
+ }
395
+
396
+ .solid-sidebar-external-trigger {
397
+ position: fixed;
398
+ top: 14px;
399
+ left: calc(var(--solid-sidebar-width) + 8px);
400
+ width: 30px;
401
+ height: 30px;
402
+ border-radius: 8px;
403
+ border: 1px solid var(--sidebar-border);
404
+ background: var(--card);
405
+ color: var(--card-foreground);
406
+ display: grid;
407
+ place-items: center;
408
+ z-index: 61;
409
+ transition: left 200ms ease, box-shadow 150ms ease;
410
+ }
411
+
412
+ .solid-sidebar-external-trigger:hover {
413
+ box-shadow: 0 0 0 3px var(--ring);
414
+ }
415
+
416
+ .solid-sidebar-hotspot {
417
+ position: fixed;
418
+ top: 0;
419
+ left: 0;
420
+ width: 14px;
421
+ height: 100vh;
422
+ border: 0;
423
+ background: transparent;
424
+ z-index: 61;
425
+ cursor: e-resize;
426
+ }
427
+
428
+ .solid-sidebar-hotspot::after {
429
+ content: "";
430
+ position: absolute;
431
+ top: 50%;
432
+ left: 4px;
433
+ transform: translateY(-50%);
434
+ width: 2px;
435
+ height: 88px;
436
+ border-radius: 999px;
437
+ background: rgba(100, 116, 139, 0.45);
438
+ opacity: 0;
439
+ transition: opacity 120ms ease;
440
+ }
441
+
442
+ .solid-sidebar-hotspot:hover::after {
443
+ opacity: 1;
444
+ }
445
+
446
+ .solid-sidebar-search-wrap {
447
+ padding: 8px 10px 6px;
448
+ }
449
+
450
+ .solid-sidebar-search {
451
+ width: 100%;
452
+ border: 1px solid var(--sidebar-border);
453
+ background: var(--card);
454
+ color: var(--card-foreground);
455
+ border-radius: 9px;
456
+ height: 34px;
457
+ padding: 0 10px;
458
+ outline: none;
459
+ font-size: 12px;
460
+ line-height: 1.2;
461
+ font-weight: 500;
462
+ letter-spacing: 0.01em;
463
+ }
464
+
465
+ .solid-sidebar-search::placeholder {
466
+ color: color-mix(in srgb, var(--muted-foreground) 82%, transparent);
467
+ font-size: 11.5px;
468
+ font-weight: 500;
469
+ }
470
+
471
+ .solid-sidebar-search:focus {
472
+ box-shadow: 0 0 0 3px var(--ring);
473
+ }
474
+
475
+ .solid-sidebar-tree-wrap {
476
+ padding: 2px 8px 8px;
477
+ overflow: auto;
478
+ flex: 1;
479
+ }
480
+
481
+ .solid-sidebar-tree-list {
482
+ list-style: none;
483
+ margin: 0;
484
+ padding: 0;
485
+ }
486
+
487
+ .solid-sidebar-tree-row {
488
+ min-height: 34px;
489
+ border-radius: 8px;
490
+ display: flex;
491
+ align-items: center;
492
+ gap: 8px;
493
+ }
494
+
495
+ .solid-sidebar-tree-row:hover {
496
+ background: var(--sidebar-accent);
497
+ }
498
+
499
+ .solid-sidebar-tree-row.is-active {
500
+ background: var(--accent);
501
+ color: var(--accent-foreground);
502
+ }
503
+
504
+ .solid-sidebar-tree-link {
505
+ color: inherit;
506
+ flex: 1;
507
+ min-width: 0;
508
+ }
509
+
510
+ .solid-sidebar-tree-parent {
511
+ border: 0;
512
+ background: transparent;
513
+ color: inherit;
514
+ flex: 1;
515
+ min-width: 0;
516
+ text-align: left;
517
+ height: 100%;
518
+ padding: 0;
519
+ cursor: pointer;
520
+ }
521
+
522
+ .solid-sidebar-tree-label {
523
+ font-size: 13px;
524
+ line-height: 1.2;
525
+ }
526
+
527
+ .solid-sidebar-tree-toggle {
528
+ border: 0;
529
+ background: transparent;
530
+ width: 26px;
531
+ height: 26px;
532
+ border-radius: 6px;
533
+ display: grid;
534
+ place-items: center;
535
+ }
536
+
537
+ .solid-sidebar-tree-toggle:hover {
538
+ background: rgba(148, 163, 184, 0.2);
539
+ }
540
+
541
+ .solid-tree-plusminus {
542
+ font-size: 16px;
543
+ line-height: 1;
544
+ font-weight: 500;
545
+ color: var(--muted);
546
+ }
547
+
548
+ .solid-sidebar-tree-children {
549
+ margin-top: 2px;
550
+ }
551
+
552
+ .solid-sidebar-collapsed-nav {
553
+ flex: 1;
554
+ display: flex;
555
+ flex-direction: column;
556
+ gap: 8px;
557
+ padding: 10px;
558
+ overflow: auto;
559
+ }
560
+
561
+ .solid-collapsed-item {
562
+ width: 40px;
563
+ height: 40px;
564
+ border-radius: 12px;
565
+ border: 1px solid transparent;
566
+ display: grid;
567
+ place-items: center;
568
+ font-size: 12px;
569
+ font-weight: 700;
570
+ color: var(--sidebar-foreground);
571
+ background: transparent;
572
+ margin-inline: auto;
573
+ }
574
+
575
+ .solid-collapsed-item:hover {
576
+ background: var(--sidebar-accent);
577
+ }
578
+
579
+ .solid-collapsed-item.is-active {
580
+ background: var(--sidebar-primary);
581
+ color: var(--sidebar-primary-foreground);
582
+ }
583
+
584
+ .solid-sidebar-footer {
585
+ border-top: 0;
586
+ padding: 6px 6px 8px;
587
+ }
588
+
589
+ .solid-user-menu {
590
+ position: relative;
591
+ }
592
+
593
+ .solid-sidebar-footer .userProfile {
594
+ display: block;
595
+ margin: 0;
596
+ text-align: left;
597
+ }
598
+
599
+ .solid-user-menu-trigger {
600
+ width: 100%;
601
+ border: 1px solid color-mix(in srgb, var(--sidebar-border) 88%, transparent);
602
+ background: color-mix(in srgb, var(--sidebar-accent) 52%, transparent);
603
+ color: var(--sidebar-foreground);
604
+ border-radius: 9px;
605
+ min-height: 38px;
606
+ display: flex;
607
+ align-items: center;
608
+ justify-content: space-between;
609
+ gap: 7px;
610
+ padding: 4px 8px;
611
+ cursor: pointer;
612
+ }
613
+
614
+ .solid-user-menu-trigger:hover {
615
+ background: color-mix(in srgb, var(--sidebar-accent) 75%, transparent);
616
+ border-color: color-mix(in srgb, var(--sidebar-border) 70%, var(--primary));
617
+ }
618
+
619
+ .solid-user-menu-trigger-left {
620
+ min-width: 0;
621
+ display: flex;
622
+ align-items: center;
623
+ gap: 8px;
624
+ }
625
+
626
+ .solid-user-menu-trigger-meta {
627
+ min-width: 0;
628
+ display: flex;
629
+ flex-direction: column;
630
+ }
631
+
632
+ .solid-user-menu-trigger-name {
633
+ font-size: 12.5px;
634
+ line-height: 1.1;
635
+ font-weight: 650;
636
+ white-space: nowrap;
637
+ overflow: hidden;
638
+ text-overflow: ellipsis;
639
+ }
640
+
641
+ .solid-user-menu-trigger-role {
642
+ font-size: 10.5px;
643
+ line-height: 1.1;
644
+ color: var(--muted);
645
+ }
646
+
647
+ .solid-user-avatar {
648
+ width: 30px;
649
+ height: 30px;
650
+ border-radius: 999px;
651
+ display: grid;
652
+ place-items: center;
653
+ color: #fff;
654
+ background: linear-gradient(135deg, #84cc16, #65a30d);
655
+ overflow: hidden;
656
+ }
657
+
658
+ .solid-user-avatar.is-compact {
659
+ width: 26px;
660
+ height: 26px;
661
+ }
662
+
663
+ .solid-user-avatar-image {
664
+ width: 100%;
665
+ height: 100%;
666
+ object-fit: cover;
667
+ display: block;
668
+ }
669
+
670
+ .solid-user-avatar-text {
671
+ font-size: 14px;
672
+ font-weight: 700;
673
+ line-height: 1;
674
+ }
675
+
676
+ .solid-user-menu-content {
677
+ position: absolute;
678
+ left: 2px;
679
+ right: auto;
680
+ bottom: calc(100% + 8px);
681
+ width: 232px;
682
+ max-width: min(232px, calc(100vw - 24px));
683
+ border: 1px solid var(--border);
684
+ border-radius: 10px;
685
+ background: var(--card);
686
+ color: var(--card-foreground);
687
+ box-shadow: 0 18px 42px rgba(2, 6, 23, 0.32);
688
+ padding: 5px;
689
+ z-index: 70;
690
+ }
691
+
692
+ .solid-user-menu-header {
693
+ display: flex;
694
+ align-items: center;
695
+ gap: 8px;
696
+ padding: 8px 8px;
697
+ }
698
+
699
+ .solid-user-menu-meta {
700
+ min-width: 0;
701
+ display: flex;
702
+ flex-direction: column;
703
+ gap: 2px;
704
+ }
705
+
706
+ .solid-user-menu-title {
707
+ font-size: 12.5px;
708
+ font-weight: 650;
709
+ line-height: 1.2;
710
+ white-space: nowrap;
711
+ overflow: hidden;
712
+ text-overflow: ellipsis;
713
+ }
714
+
715
+ .solid-user-menu-subtitle {
716
+ font-size: 10.5px;
717
+ color: var(--muted-foreground);
718
+ line-height: 1.2;
719
+ white-space: nowrap;
720
+ overflow: hidden;
721
+ text-overflow: ellipsis;
722
+ }
723
+
724
+ .solid-user-menu-sep {
725
+ height: 1px;
726
+ background: var(--border);
727
+ margin: 5px 0;
728
+ }
729
+
730
+ .solid-user-menu-item {
731
+ width: 100%;
732
+ border: 0;
733
+ background: transparent;
734
+ color: var(--card-foreground);
735
+ border-radius: 8px;
736
+ min-height: 31px;
737
+ display: flex;
738
+ align-items: center;
739
+ gap: 8px;
740
+ padding: 0 8px;
741
+ text-align: left;
742
+ font-size: 12.5px;
743
+ font-weight: 500;
744
+ cursor: pointer;
745
+ }
746
+
747
+ .solid-user-menu-item:hover {
748
+ background: var(--accent);
749
+ color: var(--accent-foreground);
750
+ }
751
+
752
+ .solid-user-menu-item i {
753
+ font-size: 12px;
754
+ }
755
+
756
+ .solid-user-menu-item svg {
757
+ flex: 0 0 auto;
758
+ color: inherit;
759
+ }
760
+
761
+ .solid-user-menu-item.is-danger {
762
+ color: #ef4444;
763
+ }
764
+
765
+ .solid-user-menu-item.is-danger:hover {
766
+ background: rgba(239, 68, 68, 0.12);
767
+ color: #ef4444;
768
+ }
769
+
770
+ .solid-inline-toast {
771
+ display: flex;
772
+ align-items: flex-start;
773
+ justify-content: space-between;
774
+ gap: 10px;
775
+ padding: 10px 11px;
776
+ border-radius: 10px;
777
+ border: 1px solid var(--border);
778
+ background: var(--card);
779
+ color: var(--card-foreground);
780
+ margin-bottom: 8px;
781
+ }
782
+
783
+ .solid-inline-toast.is-error {
784
+ border-color: color-mix(in srgb, #ef4444 45%, var(--border));
785
+ }
786
+
787
+ .solid-inline-toast.is-success {
788
+ border-color: color-mix(in srgb, #22c55e 45%, var(--border));
789
+ }
790
+
791
+ .solid-inline-toast.is-warn {
792
+ border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
793
+ }
794
+
795
+ .solid-inline-toast.is-info {
796
+ border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
797
+ }
798
+
799
+ .solid-inline-toast-body {
800
+ min-width: 0;
801
+ display: flex;
802
+ flex-direction: column;
803
+ gap: 2px;
804
+ }
805
+
806
+ .solid-inline-toast-title {
807
+ font-size: 12px;
808
+ font-weight: 650;
809
+ line-height: 1.25;
810
+ }
811
+
812
+ .solid-inline-toast-detail {
813
+ font-size: 12px;
814
+ color: var(--muted-foreground);
815
+ line-height: 1.25;
816
+ }
817
+
818
+ .solid-inline-toast-close {
819
+ width: 22px;
820
+ height: 22px;
821
+ border: 0;
822
+ border-radius: 6px;
823
+ background: transparent;
824
+ color: var(--muted-foreground);
825
+ font-size: 16px;
826
+ line-height: 1;
827
+ cursor: pointer;
828
+ }
829
+
830
+ .solid-inline-toast-close:hover {
831
+ background: var(--accent);
832
+ color: var(--accent-foreground);
833
+ }
834
+
835
+ .solid-dialog-backdrop {
836
+ position: fixed;
837
+ inset: 0;
838
+ background: rgba(2, 6, 23, 0.42);
839
+ backdrop-filter: blur(2px);
840
+ z-index: 1000;
841
+ display: grid;
842
+ place-items: center;
843
+ padding: 16px;
844
+ }
845
+
846
+ .solid-shadcn-confirm-dialog {
847
+ width: min(360px, calc(100vw - 32px));
848
+ border: 1px solid var(--border);
849
+ border-radius: 12px;
850
+ background: var(--card);
851
+ color: var(--card-foreground);
852
+ box-shadow: 0 18px 44px rgba(2, 6, 23, 0.35);
853
+ }
854
+
855
+ .solid-shadcn-dialog-head {
856
+ padding: 12px 14px;
857
+ }
858
+
859
+ .solid-shadcn-dialog-head h3 {
860
+ margin: 0;
861
+ font-size: 14px;
862
+ line-height: 1.2;
863
+ font-weight: 600;
864
+ }
865
+
866
+ .solid-shadcn-dialog-sep {
867
+ height: 1px;
868
+ background: var(--border);
869
+ }
870
+
871
+ .solid-shadcn-dialog-body {
872
+ padding: 14px;
873
+ }
874
+
875
+ .solid-shadcn-dialog-text {
876
+ margin: 0;
877
+ font-size: 13px;
878
+ color: var(--muted-foreground);
879
+ }
880
+
881
+ .solid-shadcn-dialog-actions {
882
+ display: flex;
883
+ justify-content: flex-end;
884
+ gap: 8px;
885
+ padding: 0 14px 14px;
886
+ }
887
+
888
+ .solid-popup-backdrop {
889
+ position: fixed;
890
+ inset: 0;
891
+ z-index: 1000;
892
+ background: rgba(2, 6, 23, 0.45);
893
+ backdrop-filter: blur(2px);
894
+ display: grid;
895
+ place-items: center;
896
+ padding: 16px;
897
+ }
898
+
899
+ .solid-popup-surface.solid-common-dialog {
900
+ max-width: min(92vw, 1100px);
901
+ max-height: calc(100vh - 32px);
902
+ overflow: auto;
903
+ border-radius: 8px;
904
+ border: 1px solid var(--border);
905
+ background: var(--card);
906
+ color: var(--card-foreground);
907
+ box-shadow: 0 18px 48px rgba(2, 6, 23, 0.35);
908
+ }
909
+
910
+ @media (max-width: 1199px) {
911
+ .solid-main {
912
+ margin-left: 0;
913
+ }
914
+
915
+ .solid-admin-header-inner {
916
+ padding-inline: 10px;
917
+ }
918
+
919
+ .solid-sidebar {
920
+ width: min(88vw, 320px);
921
+ transform: translateX(-104%);
922
+ }
923
+
924
+ .solid-sidebar.is-open {
925
+ transform: translateX(0);
926
+ }
927
+
928
+ .solid-sidebar.is-collapsed {
929
+ width: min(88vw, 320px);
930
+ }
931
+
932
+ .solid-sidebar-hotspot {
933
+ display: none;
934
+ }
935
+
936
+ .solid-user-menu-content {
937
+ left: 0;
938
+ right: auto;
939
+ width: min(270px, calc(100vw - 24px));
940
+ }
941
+
942
+ .solid-shadcn-confirm-dialog {
943
+ width: min(360px, calc(100vw - 24px));
944
+ }
945
+ }
946
+
947
+ /* Reusable Solid UI primitives */
948
+ .solid-btn {
949
+ --solid-btn-bg: var(--primary);
950
+ --solid-btn-fg: var(--primary-foreground);
951
+ --solid-btn-border: transparent;
952
+ height: 36px;
953
+ border-radius: 9px;
954
+ border: 1px solid var(--solid-btn-border);
955
+ background: var(--solid-btn-bg);
956
+ color: var(--solid-btn-fg);
957
+ display: inline-flex;
958
+ align-items: center;
959
+ justify-content: center;
960
+ gap: 8px;
961
+ padding: 0 12px;
962
+ font-size: 13px;
963
+ font-weight: 500;
964
+ line-height: 1;
965
+ cursor: pointer;
966
+ transition: border-color 120ms ease, background 120ms ease, color 120ms ease, box-shadow 120ms ease;
967
+ }
968
+
969
+ .solid-btn:hover {
970
+ box-shadow: 0 0 0 3px var(--ring);
971
+ }
972
+
973
+ .solid-btn:focus-visible {
974
+ outline: none;
975
+ box-shadow: 0 0 0 3px var(--ring);
976
+ }
977
+
978
+ .solid-btn:disabled {
979
+ opacity: 0.6;
980
+ cursor: not-allowed;
981
+ }
982
+
983
+ .solid-btn--sm {
984
+ height: 32px;
985
+ padding: 0 10px;
986
+ border-radius: 8px;
987
+ font-size: 12px;
988
+ }
989
+
990
+ .solid-btn--lg {
991
+ height: 40px;
992
+ padding: 0 16px;
993
+ border-radius: 10px;
994
+ font-size: 14px;
995
+ }
996
+
997
+ .solid-btn--full {
998
+ width: 100%;
999
+ }
1000
+
1001
+ .solid-btn--primary {
1002
+ --solid-btn-bg: var(--primary);
1003
+ --solid-btn-fg: var(--primary-foreground);
1004
+ --solid-btn-border: transparent;
1005
+ }
1006
+
1007
+ .solid-btn--secondary {
1008
+ --solid-btn-bg: var(--accent);
1009
+ --solid-btn-fg: var(--accent-foreground);
1010
+ --solid-btn-border: transparent;
1011
+ }
1012
+
1013
+ .solid-btn--ghost {
1014
+ --solid-btn-bg: transparent;
1015
+ --solid-btn-fg: var(--foreground);
1016
+ --solid-btn-border: transparent;
1017
+ }
1018
+
1019
+ .solid-btn--outline {
1020
+ --solid-btn-bg: var(--card);
1021
+ --solid-btn-fg: var(--card-foreground);
1022
+ --solid-btn-border: var(--border);
1023
+ }
1024
+
1025
+ .solid-btn--destructive {
1026
+ --solid-btn-bg: #ef4444;
1027
+ --solid-btn-fg: #fff;
1028
+ --solid-btn-border: transparent;
1029
+ }
1030
+
1031
+ .solid-btn-spinner {
1032
+ width: 14px;
1033
+ height: 14px;
1034
+ border-radius: 999px;
1035
+ border: 2px solid color-mix(in srgb, currentColor 45%, transparent);
1036
+ border-top-color: currentColor;
1037
+ animation: solid-spin 0.8s linear infinite;
1038
+ }
1039
+
1040
+ .solid-btn-icon {
1041
+ display: inline-flex;
1042
+ align-items: center;
1043
+ justify-content: center;
1044
+ }
1045
+
1046
+ .solid-btn-label {
1047
+ white-space: nowrap;
1048
+ }
1049
+
1050
+ .solid-select-wrap {
1051
+ position: relative;
1052
+ width: 100%;
1053
+ }
1054
+
1055
+ .solid-select {
1056
+ width: 100%;
1057
+ min-height: 32px;
1058
+ border-radius: 8px;
1059
+ border: 1px solid var(--border);
1060
+ background: var(--card);
1061
+ color: var(--card-foreground);
1062
+ font-size: 12px;
1063
+ line-height: 1.2;
1064
+ padding: 0 30px 0 10px;
1065
+ appearance: none;
1066
+ }
1067
+
1068
+ .solid-select:focus-visible {
1069
+ outline: none;
1070
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 28%, transparent);
1071
+ border-color: color-mix(in srgb, var(--ring) 56%, transparent);
1072
+ }
1073
+
1074
+ .solid-select:disabled {
1075
+ opacity: 0.6;
1076
+ cursor: not-allowed;
1077
+ }
1078
+
1079
+ .solid-select-icon {
1080
+ position: absolute;
1081
+ right: 8px;
1082
+ top: 50%;
1083
+ transform: translateY(-50%);
1084
+ pointer-events: none;
1085
+ color: color-mix(in srgb, var(--foreground) 62%, transparent);
1086
+ font-size: 10px;
1087
+ }
1088
+
1089
+ .solid-input {
1090
+ width: 100%;
1091
+ min-height: 32px;
1092
+ border-radius: 8px;
1093
+ border: 1px solid var(--border);
1094
+ background: var(--card);
1095
+ color: var(--card-foreground);
1096
+ font-size: 12px;
1097
+ line-height: 1.2;
1098
+ padding: 0 10px;
1099
+ }
1100
+
1101
+ .solid-input::placeholder {
1102
+ color: var(--muted-foreground);
1103
+ }
1104
+
1105
+ .solid-input:focus-visible {
1106
+ outline: none;
1107
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 28%, transparent);
1108
+ border-color: color-mix(in srgb, var(--ring) 56%, transparent);
1109
+ }
1110
+
1111
+ .solid-input:disabled {
1112
+ opacity: 0.6;
1113
+ cursor: not-allowed;
1114
+ }
1115
+
1116
+ .solid-autocomplete {
1117
+ position: relative;
1118
+ width: 100%;
1119
+ }
1120
+
1121
+ .solid-autocomplete-control {
1122
+ position: relative;
1123
+ display: flex;
1124
+ align-items: center;
1125
+ width: 100%;
1126
+ }
1127
+
1128
+ .solid-autocomplete-chip-control {
1129
+ min-height: 32px;
1130
+ border: 1px solid var(--border);
1131
+ border-radius: 8px;
1132
+ background: var(--card);
1133
+ padding: 2px 26px 2px 4px;
1134
+ gap: 4px;
1135
+ flex-wrap: wrap;
1136
+ }
1137
+
1138
+ .solid-autocomplete-chip-control.is-focused {
1139
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 28%, transparent);
1140
+ border-color: color-mix(in srgb, var(--ring) 56%, transparent);
1141
+ }
1142
+
1143
+ .solid-autocomplete-input {
1144
+ padding-right: 30px;
1145
+ }
1146
+
1147
+ .solid-autocomplete-inline-input {
1148
+ border: 0;
1149
+ box-shadow: none !important;
1150
+ background: transparent;
1151
+ min-height: 24px;
1152
+ height: 24px;
1153
+ flex: 1 1 110px;
1154
+ padding: 0 4px;
1155
+ }
1156
+
1157
+ .solid-autocomplete-inline-input:focus-visible {
1158
+ box-shadow: none;
1159
+ border-color: transparent;
1160
+ }
1161
+
1162
+ .solid-autocomplete-trigger {
1163
+ position: absolute;
1164
+ right: 2px;
1165
+ top: 2px;
1166
+ height: calc(100% - 4px);
1167
+ width: 24px;
1168
+ min-width: 24px;
1169
+ border: 0;
1170
+ border-radius: 6px;
1171
+ background: transparent;
1172
+ color: color-mix(in srgb, var(--foreground) 65%, transparent);
1173
+ cursor: pointer;
1174
+ }
1175
+
1176
+ .solid-autocomplete-trigger:hover {
1177
+ background: color-mix(in srgb, var(--accent) 66%, transparent);
1178
+ }
1179
+
1180
+ .solid-autocomplete-panel {
1181
+ position: absolute;
1182
+ top: calc(100% + 4px);
1183
+ left: 0;
1184
+ right: 0;
1185
+ z-index: 40;
1186
+ border: 1px solid var(--border);
1187
+ border-radius: 8px;
1188
+ background: var(--card);
1189
+ box-shadow: 0 12px 26px rgba(2, 6, 23, 0.16);
1190
+ max-height: 220px;
1191
+ overflow-y: auto;
1192
+ padding: 4px;
1193
+ }
1194
+
1195
+ .solid-autocomplete-option {
1196
+ width: 100%;
1197
+ text-align: left;
1198
+ border: 0;
1199
+ background: transparent;
1200
+ color: var(--foreground);
1201
+ font-size: 12px;
1202
+ border-radius: 6px;
1203
+ min-height: 26px;
1204
+ padding: 4px 8px;
1205
+ cursor: pointer;
1206
+ }
1207
+
1208
+ .solid-autocomplete-option:hover,
1209
+ .solid-autocomplete-option.is-active {
1210
+ background: color-mix(in srgb, var(--accent) 70%, transparent);
1211
+ }
1212
+
1213
+ .solid-autocomplete-chip {
1214
+ display: inline-flex;
1215
+ align-items: center;
1216
+ gap: 4px;
1217
+ min-height: 22px;
1218
+ border-radius: 999px;
1219
+ border: 1px solid color-mix(in srgb, var(--primary) 24%, transparent);
1220
+ background: color-mix(in srgb, var(--primary) 10%, transparent);
1221
+ color: color-mix(in srgb, var(--foreground) 90%, transparent);
1222
+ padding: 0 6px;
1223
+ font-size: 11px;
1224
+ }
1225
+
1226
+ .solid-autocomplete-chip-label {
1227
+ max-width: 130px;
1228
+ overflow: hidden;
1229
+ text-overflow: ellipsis;
1230
+ white-space: nowrap;
1231
+ }
1232
+
1233
+ .solid-autocomplete-chip-remove {
1234
+ border: 0;
1235
+ background: transparent;
1236
+ width: 14px;
1237
+ height: 14px;
1238
+ border-radius: 999px;
1239
+ padding: 0;
1240
+ display: inline-flex;
1241
+ align-items: center;
1242
+ justify-content: center;
1243
+ cursor: pointer;
1244
+ color: color-mix(in srgb, var(--foreground) 68%, transparent);
1245
+ }
1246
+
1247
+ .solid-autocomplete-chip-remove:hover {
1248
+ background: color-mix(in srgb, var(--accent) 76%, transparent);
1249
+ color: color-mix(in srgb, var(--foreground) 92%, transparent);
1250
+ }
1251
+
1252
+ .solid-autocomplete-chip-manage {
1253
+ border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
1254
+ background: color-mix(in srgb, var(--accent) 60%, transparent);
1255
+ color: color-mix(in srgb, var(--foreground) 82%, transparent);
1256
+ border-radius: 999px;
1257
+ min-height: 22px;
1258
+ padding: 0 6px;
1259
+ font-size: 10px;
1260
+ cursor: pointer;
1261
+ }
1262
+
1263
+ .solid-autocomplete-manager-panel {
1264
+ position: absolute;
1265
+ top: calc(100% + 4px);
1266
+ left: 0;
1267
+ width: min(360px, 100%);
1268
+ z-index: 45;
1269
+ border: 1px solid var(--border);
1270
+ border-radius: 8px;
1271
+ background: var(--card);
1272
+ box-shadow: 0 12px 26px rgba(2, 6, 23, 0.16);
1273
+ overflow: hidden;
1274
+ }
1275
+
1276
+ .solid-autocomplete-manager-header {
1277
+ display: flex;
1278
+ align-items: center;
1279
+ justify-content: space-between;
1280
+ border-bottom: 1px solid var(--border);
1281
+ padding: 8px 10px;
1282
+ }
1283
+
1284
+ .solid-autocomplete-manager-title {
1285
+ font-size: 11px;
1286
+ font-weight: 600;
1287
+ }
1288
+
1289
+ .solid-autocomplete-manager-clear {
1290
+ border: 0;
1291
+ background: transparent;
1292
+ font-size: 11px;
1293
+ color: color-mix(in srgb, var(--primary) 84%, var(--foreground) 16%);
1294
+ cursor: pointer;
1295
+ }
1296
+
1297
+ .solid-autocomplete-manager-body {
1298
+ padding: 8px 10px;
1299
+ display: flex;
1300
+ flex-wrap: wrap;
1301
+ gap: 6px;
1302
+ max-height: 220px;
1303
+ overflow-y: auto;
1304
+ }
1305
+
1306
+ .solid-tabs {}
1307
+
1308
+ .solid-tabs-list {
1309
+ display: inline-flex;
1310
+ }
1311
+
1312
+ .solid-tabs-trigger {}
1313
+
1314
+ .solid-tabs-panel {}
1315
+
1316
+ @keyframes solid-spin {
1317
+ to {
1318
+ transform: rotate(360deg);
1319
+ }
1320
+ }
1321
+
1322
+ .solid-error-page {
1323
+ min-height: 100vh;
1324
+ display: grid;
1325
+ grid-template-columns: 1fr;
1326
+ background: var(--background);
1327
+ }
1328
+
1329
+ .solid-error-page__content {
1330
+ display: flex;
1331
+ align-items: center;
1332
+ justify-content: center;
1333
+ padding: 32px 28px;
1334
+ }
1335
+
1336
+ .solid-error-page__copy {
1337
+ text-align: center;
1338
+ max-width: 460px;
1339
+ }
1340
+
1341
+ .solid-error-page__eyebrow {
1342
+ margin: 0 0 12px;
1343
+ font-size: clamp(30px, 4vw, 52px);
1344
+ font-weight: 700;
1345
+ color: var(--foreground);
1346
+ }
1347
+
1348
+ .solid-error-page__title {
1349
+ margin: 0 0 8px;
1350
+ font-size: clamp(26px, 2.4vw, 34px);
1351
+ line-height: 1.2;
1352
+ color: var(--foreground);
1353
+ }
1354
+
1355
+ .solid-error-page__description {
1356
+ margin: 0 auto 20px;
1357
+ max-width: 420px;
1358
+ font-size: 15px;
1359
+ line-height: 1.55;
1360
+ color: var(--muted-foreground);
1361
+ }
1362
+
1363
+ .solid-error-page__cta {
1364
+ border-radius: 10px;
1365
+ }
1366
+
1367
+ .solid-error-page__visual {
1368
+ display: none;
1369
+ position: relative;
1370
+ padding: 32px 28px;
1371
+ align-items: center;
1372
+ justify-content: center;
1373
+ }
1374
+
1375
+ .solid-error-page__visual-card {
1376
+ width: min(100%, 620px);
1377
+ height: min(82vh, 640px);
1378
+ border-radius: 20px;
1379
+ background: #050505;
1380
+ display: flex;
1381
+ align-items: center;
1382
+ justify-content: center;
1383
+ position: relative;
1384
+ overflow: hidden;
1385
+ }
1386
+
1387
+ .solid-error-page__code {
1388
+ position: absolute;
1389
+ inset: 50% auto auto 50%;
1390
+ transform: translate(-50%, -50%);
1391
+ font-size: clamp(140px, 18vw, 270px);
1392
+ line-height: 0.9;
1393
+ font-weight: 800;
1394
+ letter-spacing: 0.02em;
1395
+ color: rgba(255, 255, 255, 0.18);
1396
+ user-select: none;
1397
+ }
1398
+
1399
+ .solid-error-page__icon {
1400
+ width: clamp(96px, 10vw, 160px);
1401
+ height: clamp(96px, 10vw, 160px);
1402
+ color: #ffffff;
1403
+ z-index: 1;
1404
+ }
1405
+
1406
+ @media (min-width: 1024px) {
1407
+ .solid-error-page {
1408
+ grid-template-columns: 1fr 1fr;
1409
+ }
1410
+
1411
+ .solid-error-page__visual {
1412
+ display: flex;
1413
+ }
1414
+ }
1415
+
1416
+ /* Auth (ShadCN-style shell while preserving existing auth logic) */
1417
+ .solid-auth-theme-wrapper {
1418
+ min-height: 100vh;
1419
+ position: relative;
1420
+ display: grid;
1421
+ place-items: center;
1422
+ background:
1423
+ radial-gradient(900px 500px at 10% -20%, color-mix(in srgb, var(--primary) 18%, transparent), transparent),
1424
+ radial-gradient(700px 420px at 100% 0, color-mix(in srgb, var(--primary) 12%, transparent), transparent),
1425
+ var(--background);
1426
+ padding: 24px;
1427
+ }
1428
+
1429
+ .solid-auth-theme-wrapper.center {
1430
+ place-items: center;
1431
+ }
1432
+
1433
+ .solid-auth-theme-wrapper.left > .grid,
1434
+ .solid-auth-theme-wrapper.right > .grid {
1435
+ display: grid !important;
1436
+ grid-template-columns: 1fr 1fr;
1437
+ width: min(1180px, 100%);
1438
+ min-height: min(760px, calc(100vh - 48px));
1439
+ border: 1px solid var(--border);
1440
+ border-radius: 16px;
1441
+ overflow: hidden;
1442
+ background: var(--card);
1443
+ box-shadow: var(--shadow-soft);
1444
+ }
1445
+
1446
+ .solid-auth-theme-wrapper.left .solid-login-dark-bg,
1447
+ .solid-auth-theme-wrapper.right .solid-login-dark-bg {
1448
+ background: var(--card);
1449
+ color: var(--card-foreground);
1450
+ padding: 36px 44px;
1451
+ }
1452
+
1453
+ .solid-auth-theme-wrapper.left .solid-left-layout,
1454
+ .solid-auth-theme-wrapper.right .solid-right-layout {
1455
+ position: relative;
1456
+ background-size: cover;
1457
+ background-position: center;
1458
+ overflow: hidden;
1459
+ }
1460
+
1461
+ .solid-auth-theme-wrapper.left .solid-left-layout::after,
1462
+ .solid-auth-theme-wrapper.right .solid-right-layout::after {
1463
+ content: "";
1464
+ position: absolute;
1465
+ inset: 0;
1466
+ background: linear-gradient(180deg, rgba(2, 6, 23, 0.24), rgba(2, 6, 23, 0.48));
1467
+ }
1468
+
1469
+ .solid-auth-theme-wrapper.left .solid-left-layout > *,
1470
+ .solid-auth-theme-wrapper.right .solid-right-layout > * {
1471
+ position: relative;
1472
+ z-index: 1;
1473
+ }
1474
+
1475
+ .solid-auth-theme-wrapper.left .solid-logo.in_image_view,
1476
+ .solid-auth-theme-wrapper.right .solid-logo.in_image_view {
1477
+ top: 24px;
1478
+ left: 24px;
1479
+ right: auto;
1480
+ }
1481
+
1482
+ .solid-center-layout {
1483
+ width: min(460px, calc(100vw - 32px));
1484
+ }
1485
+
1486
+ .auth-container {
1487
+ width: 100%;
1488
+ max-width: 460px;
1489
+ border: 1px solid var(--border);
1490
+ border-radius: 14px;
1491
+ background: var(--card);
1492
+ color: var(--card-foreground);
1493
+ padding: 24px;
1494
+ box-shadow: 0 10px 30px rgba(2, 6, 23, 0.08);
1495
+ }
1496
+
1497
+ .auth-container.side {
1498
+ width: 100%;
1499
+ max-width: 460px;
1500
+ }
1501
+
1502
+ .solid-auth-title {
1503
+ font-size: 1.625rem;
1504
+ font-weight: 600;
1505
+ line-height: 1.15;
1506
+ letter-spacing: -0.01em;
1507
+ }
1508
+
1509
+ .solid-auth-input-label {
1510
+ font-size: 12.5px;
1511
+ font-weight: 500;
1512
+ color: var(--muted-foreground);
1513
+ }
1514
+
1515
+ .auth-container .p-inputtext,
1516
+ .auth-container .p-password .p-inputtext,
1517
+ .auth-container .p-password-input {
1518
+ width: 100%;
1519
+ height: 40px;
1520
+ border-radius: 10px;
1521
+ border: 1px solid var(--border);
1522
+ background: var(--background);
1523
+ color: var(--foreground);
1524
+ padding: 0 12px;
1525
+ box-shadow: none;
1526
+ }
1527
+
1528
+ .auth-container .p-password {
1529
+ width: 100%;
1530
+ }
1531
+
1532
+ .auth-container .p-inputtext:focus,
1533
+ .auth-container .p-password .p-inputtext:focus {
1534
+ border-color: color-mix(in srgb, var(--primary) 65%, var(--border));
1535
+ box-shadow: 0 0 0 3px var(--ring);
1536
+ }
1537
+
1538
+ .auth-container .p-password .p-password-toggle-mask-icon {
1539
+ color: var(--muted);
1540
+ }
1541
+
1542
+ .auth-container .p-message {
1543
+ border-radius: 8px;
1544
+ margin-top: 4px;
1545
+ padding: 8px 10px;
1546
+ }
1547
+
1548
+ .auth-container .p-message-text {
1549
+ font-size: 12px;
1550
+ }
1551
+
1552
+ .auth-submit-button.p-button,
1553
+ .auth-back-button.p-button {
1554
+ width: 100%;
1555
+ min-height: 40px;
1556
+ border-radius: 10px;
1557
+ font-weight: 500;
1558
+ }
1559
+
1560
+ .auth-submit-button.p-button .p-button-label,
1561
+ .auth-back-button.p-button .p-button-label {
1562
+ font-weight: 500;
1563
+ }
1564
+
1565
+ .auth-back-button.p-button.p-button-link {
1566
+ justify-content: flex-start;
1567
+ color: var(--muted-foreground);
1568
+ }
1569
+
1570
+ .auth-back-button.p-button.p-button-link:hover {
1571
+ color: var(--foreground);
1572
+ text-decoration: none;
1573
+ }
1574
+
1575
+ .solid-auth-tabs {
1576
+ margin-top: 10px;
1577
+ }
1578
+
1579
+ .solid-auth-tabs-list {
1580
+ display: grid;
1581
+ grid-template-columns: 1fr 1fr;
1582
+ gap: 4px;
1583
+ padding: 4px;
1584
+ border: 1px solid var(--border);
1585
+ border-radius: 10px;
1586
+ background: color-mix(in srgb, var(--muted) 12%, transparent);
1587
+ }
1588
+
1589
+ .solid-auth-tabs-trigger {
1590
+ border: 0;
1591
+ background: transparent;
1592
+ color: var(--muted-foreground);
1593
+ border-radius: 8px;
1594
+ height: 34px;
1595
+ font-size: 12.5px;
1596
+ font-weight: 500;
1597
+ cursor: pointer;
1598
+ }
1599
+
1600
+ .solid-auth-tabs-trigger.is-active {
1601
+ background: var(--card);
1602
+ color: var(--foreground);
1603
+ box-shadow: 0 1px 0 rgba(2, 6, 23, 0.08);
1604
+ }
1605
+
1606
+ .solid-auth-tabs-panel {
1607
+ margin-top: 8px;
1608
+ }
1609
+
1610
+ .auth-container .p-divider.p-divider-horizontal {
1611
+ margin: 18px 0 10px;
1612
+ }
1613
+
1614
+ .auth-container .p-divider .p-divider-content {
1615
+ border: 1px solid var(--border);
1616
+ border-radius: 999px;
1617
+ background: var(--card);
1618
+ color: var(--muted-foreground);
1619
+ font-size: 11px;
1620
+ font-weight: 600;
1621
+ letter-spacing: 0.08em;
1622
+ padding: 4px 10px;
1623
+ }
1624
+
1625
+ .google-auth-button {
1626
+ width: 100%;
1627
+ height: 40px;
1628
+ border-radius: 10px;
1629
+ border: 1px solid var(--border);
1630
+ background: var(--card);
1631
+ color: var(--card-foreground);
1632
+ display: inline-flex;
1633
+ align-items: center;
1634
+ justify-content: center;
1635
+ gap: 8px;
1636
+ font-size: 13px;
1637
+ font-weight: 500;
1638
+ transition: box-shadow 120ms ease, border-color 120ms ease, background 120ms ease;
1639
+ }
1640
+
1641
+ .google-auth-button:hover {
1642
+ border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
1643
+ background: color-mix(in srgb, var(--accent) 55%, var(--card));
1644
+ }
1645
+
1646
+ .google-auth-button:focus-visible {
1647
+ outline: none;
1648
+ box-shadow: 0 0 0 3px var(--ring);
1649
+ }
1650
+
1651
+ .solid-auth-social-grid {
1652
+ display: grid;
1653
+ grid-template-columns: repeat(3, minmax(0, 1fr));
1654
+ gap: 8px;
1655
+ }
1656
+
1657
+ .solid-auth-social-btn.solid-btn {
1658
+ width: 100%;
1659
+ height: 36px;
1660
+ min-height: 36px;
1661
+ border-radius: 8px;
1662
+ padding: 0;
1663
+ display: inline-flex;
1664
+ align-items: center;
1665
+ justify-content: center;
1666
+ border: 1px solid #2f2f37;
1667
+ background: #18181b;
1668
+ color: #f4f4f5;
1669
+ }
1670
+
1671
+ .solid-auth-social-btn.solid-btn:hover {
1672
+ background: #1f1f23;
1673
+ border-color: #3f3f46;
1674
+ }
1675
+
1676
+ .solid-auth-social-btn.solid-btn:focus-visible {
1677
+ box-shadow: 0 0 0 2px rgba(244, 244, 245, 0.08);
1678
+ }
1679
+
1680
+ .solid-shadcn-toast.p-toast-message {
1681
+ border: 1px solid #27272a;
1682
+ border-radius: 10px;
1683
+ background: #111113;
1684
+ color: #fafafa;
1685
+ box-shadow: 0 12px 30px rgba(2, 6, 23, 0.35);
1686
+ }
1687
+
1688
+ .solid-shadcn-toast .p-toast-message-content {
1689
+ padding: 10px 12px;
1690
+ }
1691
+
1692
+ .solid-shadcn-toast .p-toast-message-icon,
1693
+ .solid-shadcn-toast .p-toast-icon-close {
1694
+ color: #a1a1aa;
1695
+ }
1696
+
1697
+ .solid-shadcn-toast-content {
1698
+ display: flex;
1699
+ flex-direction: column;
1700
+ gap: 2px;
1701
+ }
1702
+
1703
+ .solid-shadcn-toast-title {
1704
+ font-size: 12px;
1705
+ font-weight: 600;
1706
+ line-height: 1.2;
1707
+ color: #fafafa;
1708
+ }
1709
+
1710
+ .solid-shadcn-toast-description {
1711
+ font-size: 11px;
1712
+ line-height: 1.3;
1713
+ color: #a1a1aa;
1714
+ }
1715
+
1716
+ .solid-auth-footer,
1717
+ .solid-auth-footer-2 {
1718
+ color: var(--muted-foreground);
1719
+ }
1720
+
1721
+ .solid-auth-theme-wrapper.left .solid-auth-footer,
1722
+ .solid-auth-theme-wrapper.left .solid-auth-footer-2,
1723
+ .solid-auth-theme-wrapper.right .solid-auth-footer,
1724
+ .solid-auth-theme-wrapper.right .solid-auth-footer-2 {
1725
+ width: min(1180px, 100%);
1726
+ left: 50%;
1727
+ transform: translateX(-50%);
1728
+ }
1729
+
1730
+ .solid-auth-image-title {
1731
+ font-size: clamp(2rem, 4vw, 3.5rem);
1732
+ line-height: 1.05;
1733
+ }
1734
+
1735
+ .solid-auth-image-subtitle {
1736
+ font-size: clamp(1.25rem, 2.4vw, 2rem);
1737
+ line-height: 1.1;
1738
+ }
1739
+
1740
+ .solid-auth-image-helper-text {
1741
+ font-size: 0.925rem;
1742
+ max-width: 40ch;
1743
+ }
1744
+
1745
+ @media (max-width: 1199px) {
1746
+ .solid-auth-theme-wrapper {
1747
+ padding: 14px;
1748
+ }
1749
+
1750
+ .solid-auth-theme-wrapper.left > .grid,
1751
+ .solid-auth-theme-wrapper.right > .grid {
1752
+ grid-template-columns: 1fr;
1753
+ min-height: auto;
1754
+ border-radius: 14px;
1755
+ }
1756
+
1757
+ .solid-auth-theme-wrapper.left .solid-left-layout,
1758
+ .solid-auth-theme-wrapper.right .solid-right-layout {
1759
+ display: none !important;
1760
+ }
1761
+
1762
+ .solid-auth-theme-wrapper.left .solid-login-dark-bg,
1763
+ .solid-auth-theme-wrapper.right .solid-login-dark-bg {
1764
+ padding: 16px;
1765
+ }
1766
+
1767
+ .auth-container {
1768
+ max-width: 100%;
1769
+ padding: 18px;
1770
+ }
1771
+
1772
+ .solid-center-layout {
1773
+ width: 100%;
1774
+ max-width: 460px;
1775
+ }
1776
+ }
1777
+
1778
+ /* Auth visual alignment (match shadcn login blocks) */
1779
+ .solid-auth-theme-wrapper {
1780
+ min-height: 100vh;
1781
+ background: #020204;
1782
+ color: #f4f4f5;
1783
+ padding: 0;
1784
+ }
1785
+
1786
+ .solid-auth-theme-wrapper.center {
1787
+ display: grid;
1788
+ place-items: center;
1789
+ padding: 24px;
1790
+ }
1791
+
1792
+ .solid-auth-theme-wrapper.center .solid-center-layout {
1793
+ width: min(380px, calc(100vw - 28px));
1794
+ }
1795
+
1796
+ .solid-auth-theme-wrapper.center .auth-container {
1797
+ margin: 0 auto;
1798
+ }
1799
+
1800
+ .solid-auth-theme-wrapper.left > .grid,
1801
+ .solid-auth-theme-wrapper.right > .grid {
1802
+ width: 100%;
1803
+ min-height: 100vh;
1804
+ display: grid !important;
1805
+ grid-template-columns: 1fr 1fr;
1806
+ border: 0;
1807
+ border-radius: 0;
1808
+ background: #020204;
1809
+ box-shadow: none;
1810
+ }
1811
+
1812
+ .solid-auth-theme-wrapper.left .solid-login-dark-bg,
1813
+ .solid-auth-theme-wrapper.right .solid-login-dark-bg {
1814
+ display: flex;
1815
+ align-items: flex-start;
1816
+ justify-content: center;
1817
+ padding: 36px 40px;
1818
+ background: #020204;
1819
+ }
1820
+
1821
+ .solid-auth-theme-wrapper.left .solid-left-layout,
1822
+ .solid-auth-theme-wrapper.right .solid-right-layout {
1823
+ background-color: #27272a;
1824
+ background-size: cover;
1825
+ background-position: center;
1826
+ border-left: 1px solid #18181b;
1827
+ }
1828
+
1829
+ .solid-auth-theme-wrapper.left .solid-left-layout::after,
1830
+ .solid-auth-theme-wrapper.right .solid-right-layout::after {
1831
+ content: "";
1832
+ position: absolute;
1833
+ inset: 0;
1834
+ background: rgba(24, 24, 27, 0.62);
1835
+ }
1836
+
1837
+ .solid-auth-theme-wrapper.left .solid-left-layout > *,
1838
+ .solid-auth-theme-wrapper.right .solid-right-layout > * {
1839
+ position: relative;
1840
+ z-index: 2;
1841
+ }
1842
+
1843
+ .solid-auth-theme-wrapper.left .solid-logo.in_image_view,
1844
+ .solid-auth-theme-wrapper.right .solid-logo.in_image_view {
1845
+ top: 24px;
1846
+ left: 24px;
1847
+ right: auto;
1848
+ }
1849
+
1850
+ .auth-container {
1851
+ width: 100%;
1852
+ max-width: 360px;
1853
+ border: 1px solid #27272a;
1854
+ border-radius: 14px;
1855
+ background: #111113;
1856
+ color: #f4f4f5;
1857
+ padding: 18px;
1858
+ box-shadow: none;
1859
+ }
1860
+
1861
+ .auth-container.side {
1862
+ max-width: 360px;
1863
+ }
1864
+
1865
+ .solid-auth-title {
1866
+ font-size: 1.2rem;
1867
+ font-weight: 700;
1868
+ line-height: 1.25;
1869
+ letter-spacing: -0.01em;
1870
+ color: #fafafa;
1871
+ text-align: left;
1872
+ }
1873
+
1874
+ .solid-auth-helper {
1875
+ font-size: 11px;
1876
+ line-height: 1.4;
1877
+ color: #a1a1aa;
1878
+ text-align: left;
1879
+ }
1880
+
1881
+ .solid-auth-input-label {
1882
+ color: #e4e4e7;
1883
+ font-size: 13px;
1884
+ font-weight: 500;
1885
+ }
1886
+
1887
+ .solid-auth-inline-link {
1888
+ color: #d4d4d8;
1889
+ font-size: 13px;
1890
+ text-decoration: none;
1891
+ }
1892
+
1893
+ .solid-auth-inline-link:hover {
1894
+ color: #fafafa;
1895
+ text-decoration: underline;
1896
+ }
1897
+
1898
+ .auth-container .p-inputtext,
1899
+ .auth-container .p-password .p-inputtext,
1900
+ .auth-container .p-password-input {
1901
+ width: 100%;
1902
+ height: 36px;
1903
+ border: 1px solid #27272a;
1904
+ border-radius: 10px;
1905
+ background: #18181b;
1906
+ color: #fafafa;
1907
+ }
1908
+
1909
+ .auth-container .p-inputtext::placeholder,
1910
+ .auth-container .p-password .p-inputtext::placeholder {
1911
+ color: #71717a;
1912
+ }
1913
+
1914
+ .auth-container .p-inputtext:focus,
1915
+ .auth-container .p-password .p-inputtext:focus {
1916
+ border-color: #3f3f46;
1917
+ box-shadow: 0 0 0 2px rgba(244, 244, 245, 0.08);
1918
+ }
1919
+
1920
+ .auth-container .p-password .p-password-toggle-mask-icon {
1921
+ color: #a1a1aa;
1922
+ }
1923
+
1924
+ .auth-container .p-message {
1925
+ background: rgba(239, 68, 68, 0.12);
1926
+ border-color: rgba(239, 68, 68, 0.3);
1927
+ color: #fca5a5;
1928
+ }
1929
+
1930
+ .solid-auth-tabs-list {
1931
+ border: 1px solid #27272a;
1932
+ background: #18181b;
1933
+ border-radius: 10px;
1934
+ padding: 4px;
1935
+ }
1936
+
1937
+ .solid-auth-tabs .solid-tabs-trigger {
1938
+ border: 0;
1939
+ background: transparent;
1940
+ color: #a1a1aa;
1941
+ border-radius: 8px;
1942
+ height: 30px;
1943
+ font-size: 11px;
1944
+ font-weight: 500;
1945
+ cursor: pointer;
1946
+ }
1947
+
1948
+ .solid-auth-tabs .solid-tabs-trigger.is-active {
1949
+ background: #27272a;
1950
+ color: #fafafa;
1951
+ box-shadow: none;
1952
+ }
1953
+
1954
+ .auth-submit-button.p-button {
1955
+ min-height: 36px;
1956
+ background: #f4f4f5;
1957
+ border-color: #f4f4f5;
1958
+ color: #09090b;
1959
+ }
1960
+
1961
+ .auth-submit-button.p-button .p-button-label {
1962
+ color: #09090b;
1963
+ font-weight: 600;
1964
+ }
1965
+
1966
+ .auth-submit-button.p-button:not(:disabled):hover {
1967
+ background: #e4e4e7;
1968
+ border-color: #e4e4e7;
1969
+ }
1970
+
1971
+ .auth-back-button.p-button.p-button-link {
1972
+ color: #a1a1aa;
1973
+ }
1974
+
1975
+ .auth-back-button.p-button.p-button-link:hover {
1976
+ color: #fafafa;
1977
+ }
1978
+
1979
+ .auth-container .p-divider {
1980
+ margin: 16px 0 10px;
1981
+ }
1982
+
1983
+ .auth-container .p-divider .p-divider-content {
1984
+ background: #111113;
1985
+ color: #a1a1aa;
1986
+ border: 0;
1987
+ border-radius: 0;
1988
+ padding: 0 10px;
1989
+ font-size: 12px;
1990
+ letter-spacing: 0;
1991
+ text-transform: none;
1992
+ }
1993
+
1994
+ .auth-container .p-divider.p-divider-horizontal::before {
1995
+ border-top-color: #27272a;
1996
+ }
1997
+
1998
+ .google-auth-button.solid-btn,
1999
+ .google-auth-button {
2000
+ width: 100%;
2001
+ height: 36px;
2002
+ border: 1px solid #27272a;
2003
+ border-radius: 10px;
2004
+ background: #18181b;
2005
+ color: #fafafa;
2006
+ font-size: 13px;
2007
+ font-weight: 500;
2008
+ box-shadow: none;
2009
+ }
2010
+
2011
+ .solid-auth-center-stack {
2012
+ display: flex;
2013
+ flex-direction: column;
2014
+ gap: 12px;
2015
+ }
2016
+
2017
+ .solid-auth-brand {
2018
+ display: inline-flex;
2019
+ align-items: center;
2020
+ gap: 8px;
2021
+ color: #e4e4e7;
2022
+ text-decoration: none;
2023
+ font-size: 13px;
2024
+ font-weight: 500;
2025
+ }
2026
+
2027
+ .solid-auth-brand.is-center {
2028
+ align-self: center;
2029
+ }
2030
+
2031
+ .solid-auth-brand-icon {
2032
+ width: 24px;
2033
+ height: 24px;
2034
+ border-radius: 7px;
2035
+ border: 1px solid #27272a;
2036
+ background: #18181b;
2037
+ display: grid;
2038
+ place-items: center;
2039
+ overflow: hidden;
2040
+ }
2041
+
2042
+ .solid-auth-brand-icon img {
2043
+ width: 100%;
2044
+ height: 100%;
2045
+ object-fit: contain;
2046
+ display: block;
2047
+ }
2048
+
2049
+ .solid-auth-brand-fallback {
2050
+ font-size: 12px;
2051
+ font-weight: 700;
2052
+ color: #fafafa;
2053
+ }
2054
+
2055
+ .solid-auth-brand-text {
2056
+ color: #f4f4f5;
2057
+ line-height: 1;
2058
+ }
2059
+
2060
+ .google-auth-button.solid-btn:hover,
2061
+ .google-auth-button:hover {
2062
+ background: #1f1f23;
2063
+ border-color: #3f3f46;
2064
+ box-shadow: none;
2065
+ }
2066
+
2067
+ .google-auth-button.solid-btn:focus-visible,
2068
+ .google-auth-button:focus-visible {
2069
+ box-shadow: 0 0 0 2px rgba(244, 244, 245, 0.08);
2070
+ }
2071
+
2072
+ .solid-auth-footer,
2073
+ .solid-auth-footer-2 {
2074
+ color: #a1a1aa;
2075
+ }
2076
+
2077
+ .solid-auth-subtitle a,
2078
+ .solid-auth-footer a,
2079
+ .solid-auth-footer-2 a {
2080
+ color: #d4d4d8;
2081
+ }
2082
+
2083
+ @media (max-width: 1199px) {
2084
+ .solid-auth-theme-wrapper.center {
2085
+ padding: 16px;
2086
+ }
2087
+
2088
+ .solid-auth-theme-wrapper.left > .grid,
2089
+ .solid-auth-theme-wrapper.right > .grid {
2090
+ grid-template-columns: 1fr;
2091
+ }
2092
+
2093
+ .solid-auth-theme-wrapper.left .solid-left-layout,
2094
+ .solid-auth-theme-wrapper.right .solid-right-layout {
2095
+ display: none !important;
2096
+ }
2097
+
2098
+ .solid-auth-theme-wrapper.left .solid-login-dark-bg,
2099
+ .solid-auth-theme-wrapper.right .solid-login-dark-bg {
2100
+ padding: 20px;
2101
+ }
2102
+
2103
+ .auth-container {
2104
+ max-width: 100%;
2105
+ padding: 20px;
2106
+ }
2107
+ }
2108
+
2109
+ /* Final auth isolation overrides against legacy global auth CSS */
2110
+ .solid-auth-theme-wrapper .auth-container,
2111
+ .solid-auth-theme-wrapper .auth-container.side {
2112
+ min-width: 0 !important;
2113
+ width: min(100%, 388px) !important;
2114
+ max-width: 388px !important;
2115
+ padding: 18px !important;
2116
+ border-radius: 12px !important;
2117
+ backdrop-filter: none !important;
2118
+ box-shadow: none !important;
2119
+ }
2120
+
2121
+ .solid-auth-theme-wrapper.left .auth-container,
2122
+ .solid-auth-theme-wrapper.right .auth-container {
2123
+ width: min(100%, 392px) !important;
2124
+ max-width: 392px !important;
2125
+ }
2126
+
2127
+ .solid-auth-theme-wrapper.center .solid-center-layout {
2128
+ width: min(388px, calc(100vw - 24px)) !important;
2129
+ }
2130
+
2131
+ .solid-auth-theme-wrapper .auth-container form .mt-3 {
2132
+ margin-top: 0.9rem !important;
2133
+ }
2134
+
2135
+ .solid-auth-theme-wrapper .auth-container form .mt-4 {
2136
+ margin-top: 1.1rem !important;
2137
+ }
2138
+
2139
+ .solid-auth-theme-wrapper .solid-auth-title {
2140
+ margin-top: 0 !important;
2141
+ font-size: 1rem !important;
2142
+ line-height: 1.25 !important;
2143
+ letter-spacing: -0.01em !important;
2144
+ }
2145
+
2146
+ .solid-auth-theme-wrapper .solid-auth-helper {
2147
+ margin-top: 0.5rem !important;
2148
+ margin-bottom: 0.5rem !important;
2149
+ font-size: 11px !important;
2150
+ line-height: 1.35 !important;
2151
+ }
2152
+
2153
+ .solid-auth-theme-wrapper .solid-auth-tabs-list {
2154
+ display: grid !important;
2155
+ grid-template-columns: 1fr 1fr !important;
2156
+ gap: 4px !important;
2157
+ padding: 3px !important;
2158
+ border-radius: 10px !important;
2159
+ border: 1px solid #27272a !important;
2160
+ background: #18181b !important;
2161
+ }
2162
+
2163
+ .solid-auth-theme-wrapper .solid-auth-tabs .solid-tabs-trigger {
2164
+ appearance: none;
2165
+ -webkit-appearance: none;
2166
+ border: 0 !important;
2167
+ outline: 0;
2168
+ box-shadow: none;
2169
+ min-height: 30px !important;
2170
+ padding: 0 8px !important;
2171
+ font-size: 12px !important;
2172
+ line-height: 1 !important;
2173
+ border-radius: 7px !important;
2174
+ background: transparent !important;
2175
+ color: #a1a1aa !important;
2176
+ font-weight: 500 !important;
2177
+ }
2178
+
2179
+ .solid-auth-theme-wrapper .solid-auth-tabs .solid-tabs-trigger.is-active {
2180
+ background: #2a2a2f !important;
2181
+ color: #fafafa !important;
2182
+ }
2183
+
2184
+ .solid-auth-theme-wrapper .auth-container .p-inputtext,
2185
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext,
2186
+ .solid-auth-theme-wrapper .auth-container .p-password-input {
2187
+ height: 36px !important;
2188
+ border-radius: 8px !important;
2189
+ padding: 0 10px !important;
2190
+ border: 1px solid #2f2f37 !important;
2191
+ border-color: #2f2f37 !important;
2192
+ border-top-color: #2f2f37 !important;
2193
+ border-right-color: #2f2f37 !important;
2194
+ border-bottom-color: #2f2f37 !important;
2195
+ border-left-color: #2f2f37 !important;
2196
+ background: #18181b !important;
2197
+ color: #fafafa !important;
2198
+ outline: 0 !important;
2199
+ box-shadow: none !important;
2200
+ }
2201
+
2202
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:hover,
2203
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:hover,
2204
+ .solid-auth-theme-wrapper .auth-container .p-password-input:hover {
2205
+ border-color: #2f2f37 !important;
2206
+ border-top-color: #2f2f37 !important;
2207
+ border-right-color: #2f2f37 !important;
2208
+ border-bottom-color: #2f2f37 !important;
2209
+ border-left-color: #2f2f37 !important;
2210
+ }
2211
+
2212
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:focus,
2213
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:focus,
2214
+ .solid-auth-theme-wrapper .auth-container .p-password-input:focus {
2215
+ border-color: #2f2f37 !important;
2216
+ border-top-color: #2f2f37 !important;
2217
+ border-right-color: #2f2f37 !important;
2218
+ border-bottom-color: #2f2f37 !important;
2219
+ border-left-color: #2f2f37 !important;
2220
+ box-shadow: none !important;
2221
+ }
2222
+
2223
+ .solid-auth-theme-wrapper .auth-container .p-inputtext.p-invalid,
2224
+ .solid-auth-theme-wrapper .auth-container .p-password.p-invalid .p-inputtext,
2225
+ .solid-auth-theme-wrapper .auth-container .p-password-input.p-invalid,
2226
+ .solid-auth-theme-wrapper .auth-container .p-inputtext.p-invalid:enabled:hover,
2227
+ .solid-auth-theme-wrapper .auth-container .p-password.p-invalid .p-inputtext:enabled:hover,
2228
+ .solid-auth-theme-wrapper .auth-container .p-password-input.p-invalid:enabled:hover {
2229
+ border-color: var(--solid-danger, #ef4444) !important;
2230
+ border-top-color: var(--solid-danger, #ef4444) !important;
2231
+ border-right-color: var(--solid-danger, #ef4444) !important;
2232
+ border-bottom-color: var(--solid-danger, #ef4444) !important;
2233
+ border-left-color: var(--solid-danger, #ef4444) !important;
2234
+ box-shadow: 0 0 0 3px var(--solid-danger-soft, rgba(239, 68, 68, 0.2)) !important;
2235
+ }
2236
+
2237
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:enabled:hover,
2238
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:enabled:focus,
2239
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:enabled:hover,
2240
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:enabled:focus,
2241
+ .solid-auth-theme-wrapper .auth-container .p-password-input:enabled:hover,
2242
+ .solid-auth-theme-wrapper .auth-container .p-password-input:enabled:focus {
2243
+ border-color: #2f2f37 !important;
2244
+ border-top-color: #2f2f37 !important;
2245
+ border-right-color: #2f2f37 !important;
2246
+ border-bottom-color: #2f2f37 !important;
2247
+ border-left-color: #2f2f37 !important;
2248
+ box-shadow: none !important;
2249
+ }
2250
+
2251
+ .solid-auth-theme-wrapper .auth-container .p-password.p-component {
2252
+ border: 0 !important;
2253
+ box-shadow: none !important;
2254
+ background: transparent !important;
2255
+ }
2256
+
2257
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:-webkit-autofill,
2258
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:-webkit-autofill:hover,
2259
+ .solid-auth-theme-wrapper .auth-container .p-inputtext:-webkit-autofill:focus,
2260
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:-webkit-autofill,
2261
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:-webkit-autofill:hover,
2262
+ .solid-auth-theme-wrapper .auth-container .p-password .p-inputtext:-webkit-autofill:focus {
2263
+ -webkit-text-fill-color: #fafafa !important;
2264
+ -webkit-box-shadow: 0 0 0 1000px #18181b inset !important;
2265
+ box-shadow: 0 0 0 1000px #18181b inset !important;
2266
+ border-color: #2f2f37 !important;
2267
+ }
2268
+
2269
+ .solid-auth-theme-wrapper .auth-submit-button.p-button,
2270
+ .solid-auth-theme-wrapper .google-auth-button.solid-btn,
2271
+ .solid-auth-theme-wrapper .google-auth-button {
2272
+ min-height: 36px !important;
2273
+ height: 36px !important;
2274
+ border-radius: 8px !important;
2275
+ }
2276
+
2277
+ .solid-auth-theme-wrapper .auth-container .p-message {
2278
+ margin-top: 6px !important;
2279
+ padding: 0 !important;
2280
+ background: transparent !important;
2281
+ border: 0 !important;
2282
+ box-shadow: none !important;
2283
+ min-height: unset !important;
2284
+ }
2285
+
2286
+ .solid-auth-theme-wrapper .auth-container .p-inline-message {
2287
+ margin-top: 6px !important;
2288
+ padding: 0 !important;
2289
+ background: transparent !important;
2290
+ border: 0 !important;
2291
+ box-shadow: none !important;
2292
+ min-height: unset !important;
2293
+ }
2294
+
2295
+ .solid-auth-theme-wrapper .auth-container .p-message-wrapper,
2296
+ .solid-auth-theme-wrapper .auth-container .p-inline-message-text {
2297
+ background: transparent !important;
2298
+ border: 0 !important;
2299
+ box-shadow: none !important;
2300
+ padding: 0 !important;
2301
+ }
2302
+
2303
+ .solid-auth-theme-wrapper .auth-container .p-message .p-message-text {
2304
+ font-size: 12px !important;
2305
+ line-height: 1.35 !important;
2306
+ color: var(--solid-danger, #ef4444) !important;
2307
+ font-weight: 500 !important;
2308
+ }
2309
+
2310
+ .solid-auth-theme-wrapper .auth-container .p-inline-message .p-inline-message-text,
2311
+ .solid-auth-theme-wrapper .auth-container .p-message-text,
2312
+ .solid-auth-theme-wrapper .auth-container .p-inline-message-text,
2313
+ .solid-auth-theme-wrapper .auth-container .p-message-content,
2314
+ .solid-auth-theme-wrapper .auth-container .p-message-content > * {
2315
+ color: var(--solid-danger, #ef4444) !important;
2316
+ }
2317
+
2318
+ .solid-auth-theme-wrapper .auth-container .text-red-500,
2319
+ .solid-auth-theme-wrapper .auth-container [class*="text-red"] {
2320
+ color: var(--solid-danger, #ef4444) !important;
2321
+ }
2322
+
2323
+ .solid-auth-theme-wrapper .auth-container .p-message .p-message-icon,
2324
+ .solid-auth-theme-wrapper .auth-container .p-message .p-inline-message-icon {
2325
+ display: none !important;
2326
+ }
2327
+
2328
+ /* Side auth layout shell (left/right) */
2329
+ .solid-auth-theme-wrapper.left,
2330
+ .solid-auth-theme-wrapper.right {
2331
+ padding: 0 !important;
2332
+ display: block !important;
2333
+ }
2334
+
2335
+ .solid-auth-theme-wrapper .solid-auth-split {
2336
+ width: 100%;
2337
+ min-height: 100vh;
2338
+ display: grid;
2339
+ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
2340
+ background: #020204;
2341
+ }
2342
+
2343
+ .solid-auth-theme-wrapper .solid-auth-form-pane {
2344
+ display: flex;
2345
+ align-items: center;
2346
+ justify-content: center;
2347
+ padding: 36px 40px;
2348
+ background: #020204;
2349
+ }
2350
+
2351
+ .solid-auth-theme-wrapper .solid-auth-form-pane-inner {
2352
+ width: 100%;
2353
+ max-width: 440px;
2354
+ display: flex;
2355
+ flex-direction: column;
2356
+ align-items: stretch;
2357
+ }
2358
+
2359
+ .solid-auth-theme-wrapper.left .solid-auth-form-pane,
2360
+ .solid-auth-theme-wrapper.right .solid-auth-form-pane {
2361
+ align-items: center !important;
2362
+ justify-content: center !important;
2363
+ }
2364
+
2365
+ .solid-auth-theme-wrapper.left .solid-auth-form-pane .solid-auth-brand,
2366
+ .solid-auth-theme-wrapper.right .solid-auth-form-pane .solid-auth-brand {
2367
+ align-self: flex-start;
2368
+ margin-bottom: 10px;
2369
+ }
2370
+
2371
+ .solid-auth-theme-wrapper .solid-auth-image-pane {
2372
+ position: relative;
2373
+ min-height: 100vh;
2374
+ background-color: #27272a;
2375
+ background-size: cover;
2376
+ background-position: center;
2377
+ overflow: hidden;
2378
+ }
2379
+
2380
+ .solid-auth-theme-wrapper .solid-auth-image-pane.pane-on-right {
2381
+ border-left: 1px solid #18181b;
2382
+ }
2383
+
2384
+ .solid-auth-theme-wrapper .solid-auth-image-pane.pane-on-left {
2385
+ border-right: 1px solid #18181b;
2386
+ }
2387
+
2388
+ @media (max-width: 1199px) {
2389
+ .solid-auth-theme-wrapper .solid-auth-split {
2390
+ grid-template-columns: 1fr;
2391
+ }
2392
+
2393
+ .solid-auth-theme-wrapper .solid-auth-image-pane {
2394
+ display: none;
2395
+ }
2396
+
2397
+ .solid-auth-theme-wrapper .solid-auth-form-pane {
2398
+ min-height: 100vh;
2399
+ padding: 20px;
2400
+ }
2401
+ }
2402
+
2403
+ /* Auth theme contract (triggered by API value: authPagesTheme) */
2404
+ .solid-auth-theme-wrapper {
2405
+ --solid-surface-base: #020204;
2406
+ --solid-surface-pane: #020204;
2407
+ --solid-surface-image: #27272a;
2408
+ --solid-surface-card: #111113;
2409
+ --solid-surface-input: #18181b;
2410
+ --solid-surface-tab: #18181b;
2411
+ --solid-surface-tab-active: #2a2a2f;
2412
+ --solid-surface-social: #18181b;
2413
+ --solid-text-primary: #fafafa;
2414
+ --solid-text-secondary: #e4e4e7;
2415
+ --solid-text-muted: #a1a1aa;
2416
+ --solid-input-placeholder: #71717a;
2417
+ --solid-border-default: #27272a;
2418
+ --solid-border-strong: #2f2f37;
2419
+ --solid-image-border: #18181b;
2420
+ --solid-danger: #ef4444;
2421
+ --solid-danger-soft: rgba(239, 68, 68, 0.22);
2422
+ }
2423
+
2424
+ .solid-auth-theme-wrapper.auth-theme-light {
2425
+ --solid-surface-base: #f5f6f8;
2426
+ --solid-surface-pane: #f5f6f8;
2427
+ --solid-surface-image: #e5e7eb;
2428
+ --solid-surface-card: #ffffff;
2429
+ --solid-surface-input: #ffffff;
2430
+ --solid-surface-tab: #f3f4f6;
2431
+ --solid-surface-tab-active: #ffffff;
2432
+ --solid-surface-social: #ffffff;
2433
+ --solid-text-primary: #111827;
2434
+ --solid-text-secondary: #374151;
2435
+ --solid-text-muted: #6b7280;
2436
+ --solid-input-placeholder: #9ca3af;
2437
+ --solid-border-default: #d1d5db;
2438
+ --solid-border-strong: #cbd5e1;
2439
+ --solid-image-border: #d1d5db;
2440
+ --solid-danger: #ef4444;
2441
+ --solid-danger-soft: rgba(239, 68, 68, 0.18);
2442
+ }
2443
+
2444
+ .solid-auth-theme-wrapper.auth-theme-light,
2445
+ .solid-auth-theme-wrapper.auth-theme-dark {
2446
+ background: var(--solid-surface-base) !important;
2447
+ color: var(--solid-text-secondary) !important;
2448
+ }
2449
+
2450
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-split,
2451
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-split {
2452
+ background: var(--solid-surface-base) !important;
2453
+ }
2454
+
2455
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-form-pane,
2456
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-form-pane {
2457
+ background: var(--solid-surface-pane) !important;
2458
+ }
2459
+
2460
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-image-pane,
2461
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-image-pane {
2462
+ background-color: var(--solid-surface-image) !important;
2463
+ }
2464
+
2465
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-image-pane.pane-on-right,
2466
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-image-pane.pane-on-right {
2467
+ border-left-color: var(--solid-image-border) !important;
2468
+ }
2469
+
2470
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-image-pane.pane-on-left,
2471
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-image-pane.pane-on-left {
2472
+ border-right-color: var(--solid-image-border) !important;
2473
+ }
2474
+
2475
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container,
2476
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container {
2477
+ background: var(--solid-surface-card) !important;
2478
+ border-color: var(--solid-border-default) !important;
2479
+ }
2480
+
2481
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-title,
2482
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-title {
2483
+ color: var(--solid-text-primary) !important;
2484
+ }
2485
+
2486
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-helper,
2487
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-helper,
2488
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-input-label,
2489
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-input-label,
2490
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-brand,
2491
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-brand,
2492
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-brand-text,
2493
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-brand-text {
2494
+ color: var(--solid-text-secondary) !important;
2495
+ }
2496
+
2497
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-inline-link,
2498
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-inline-link,
2499
+ .solid-auth-theme-wrapper.auth-theme-light .p-divider .p-divider-content,
2500
+ .solid-auth-theme-wrapper.auth-theme-dark .p-divider .p-divider-content {
2501
+ color: var(--solid-text-muted) !important;
2502
+ }
2503
+
2504
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-tabs-list,
2505
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-tabs-list {
2506
+ background: var(--solid-surface-tab) !important;
2507
+ border-color: var(--solid-border-default) !important;
2508
+ }
2509
+
2510
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-tabs .solid-tabs-trigger,
2511
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-tabs .solid-tabs-trigger {
2512
+ color: var(--solid-text-muted) !important;
2513
+ }
2514
+
2515
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-tabs .solid-tabs-trigger.is-active,
2516
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-tabs .solid-tabs-trigger.is-active {
2517
+ background: var(--solid-surface-tab-active) !important;
2518
+ color: var(--solid-text-primary) !important;
2519
+ }
2520
+
2521
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-inputtext,
2522
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-inputtext,
2523
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-password .p-inputtext,
2524
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-password .p-inputtext,
2525
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-password-input,
2526
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-password-input {
2527
+ background: var(--solid-surface-input) !important;
2528
+ color: var(--solid-text-primary) !important;
2529
+ border-color: var(--solid-border-strong) !important;
2530
+ border-top-color: var(--solid-border-strong) !important;
2531
+ border-right-color: var(--solid-border-strong) !important;
2532
+ border-bottom-color: var(--solid-border-strong) !important;
2533
+ border-left-color: var(--solid-border-strong) !important;
2534
+ }
2535
+
2536
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-inputtext::placeholder,
2537
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-inputtext::placeholder,
2538
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-password .p-inputtext::placeholder,
2539
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-password .p-inputtext::placeholder {
2540
+ color: var(--solid-input-placeholder) !important;
2541
+ }
2542
+
2543
+ .solid-auth-theme-wrapper.auth-theme-light .solid-auth-social-btn.solid-btn,
2544
+ .solid-auth-theme-wrapper.auth-theme-dark .solid-auth-social-btn.solid-btn {
2545
+ background: var(--solid-surface-social) !important;
2546
+ border-color: var(--solid-border-strong) !important;
2547
+ color: var(--solid-text-primary) !important;
2548
+ }
2549
+
2550
+ .solid-auth-theme-wrapper .solid-auth-helper-emphasis {
2551
+ color: var(--solid-text-primary);
2552
+ font-weight: 600;
2553
+ }
2554
+
2555
+ .solid-auth-theme-wrapper .solid-auth-otp-field {
2556
+ display: flex;
2557
+ flex-direction: column;
2558
+ gap: 10px;
2559
+ margin-top: 12px;
2560
+ }
2561
+
2562
+ .solid-auth-theme-wrapper .solid-auth-otp-top {
2563
+ display: flex;
2564
+ align-items: center;
2565
+ justify-content: space-between;
2566
+ gap: 8px;
2567
+ }
2568
+
2569
+ .solid-auth-theme-wrapper .solid-auth-otp-resend.solid-btn {
2570
+ min-height: 28px;
2571
+ height: 28px;
2572
+ padding: 0 8px;
2573
+ border-radius: 6px;
2574
+ font-size: 11px;
2575
+ line-height: 1;
2576
+ gap: 6px;
2577
+ }
2578
+
2579
+ .solid-auth-theme-wrapper .solid-auth-otp-time {
2580
+ margin: 0;
2581
+ font-size: 11px;
2582
+ line-height: 1.3;
2583
+ color: var(--solid-text-muted);
2584
+ }
2585
+
2586
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp {
2587
+ display: flex;
2588
+ align-items: center;
2589
+ justify-content: center;
2590
+ gap: 8px;
2591
+ width: 100%;
2592
+ }
2593
+
2594
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp .p-inputotp-input {
2595
+ width: 42px;
2596
+ min-width: 42px;
2597
+ height: 46px;
2598
+ border-radius: 10px;
2599
+ border: 1px solid var(--solid-border-strong) !important;
2600
+ background: var(--solid-surface-input) !important;
2601
+ color: var(--solid-text-primary) !important;
2602
+ text-align: center;
2603
+ font-size: 1.15rem;
2604
+ font-weight: 600;
2605
+ }
2606
+
2607
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp .p-inputotp-input:focus {
2608
+ outline: none;
2609
+ border-color: var(--solid-border-strong) !important;
2610
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--solid-focus-ring) 60%, transparent);
2611
+ }
2612
+
2613
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp .p-inputotp-input:nth-child(3) {
2614
+ margin-right: 10px;
2615
+ }
2616
+
2617
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp .p-inputotp-input:nth-child(4) {
2618
+ margin-left: 10px;
2619
+ }
2620
+
2621
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp.p-invalid .p-inputotp-input {
2622
+ border-color: #ef4444 !important;
2623
+ }
2624
+
2625
+ @media (max-width: 480px) {
2626
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp {
2627
+ gap: 6px;
2628
+ }
2629
+
2630
+ .solid-auth-theme-wrapper .solid-auth-otp-input.p-inputotp .p-inputotp-input {
2631
+ width: 36px;
2632
+ min-width: 36px;
2633
+ height: 42px;
2634
+ font-size: 1rem;
2635
+ }
2636
+ }
2637
+
2638
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-divider .p-divider-content,
2639
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-divider .p-divider-content {
2640
+ background: var(--solid-surface-card) !important;
2641
+ color: var(--solid-text-muted) !important;
2642
+ border: 0 !important;
2643
+ box-shadow: none !important;
2644
+ font-size: 12px !important;
2645
+ font-weight: 500 !important;
2646
+ letter-spacing: 0 !important;
2647
+ text-transform: none !important;
2648
+ }
2649
+
2650
+ .solid-auth-theme-wrapper.auth-theme-light .auth-container .p-divider.p-divider-horizontal::before,
2651
+ .solid-auth-theme-wrapper.auth-theme-dark .auth-container .p-divider.p-divider-horizontal::before {
2652
+ border-top: 1px solid var(--solid-border-default) !important;
2653
+ }
2654
+
2655
+ /* Unified ambient auth glow across center/left/right layouts */
2656
+ .solid-auth-theme-wrapper {
2657
+ isolation: isolate;
2658
+ overflow: hidden;
2659
+ }
2660
+
2661
+ .solid-auth-theme-wrapper::before,
2662
+ .solid-auth-theme-wrapper::after {
2663
+ content: "";
2664
+ position: absolute;
2665
+ pointer-events: none;
2666
+ z-index: 0;
2667
+ border-radius: 999px;
2668
+ filter: blur(6px);
2669
+ }
2670
+
2671
+ .solid-auth-theme-wrapper::before {
2672
+ width: min(280px, 36vw);
2673
+ height: min(280px, 36vw);
2674
+ top: -120px;
2675
+ left: -70px;
2676
+ background:
2677
+ radial-gradient(circle at center,
2678
+ color-mix(in srgb, #a855f7 78%, #c084fc 22%) 0%,
2679
+ color-mix(in srgb, #7c3aed 60%, transparent) 42%,
2680
+ transparent 72%);
2681
+ opacity: 0.9;
2682
+ }
2683
+
2684
+ .solid-auth-theme-wrapper::after {
2685
+ width: min(340px, 44vw);
2686
+ height: min(340px, 44vw);
2687
+ right: -130px;
2688
+ bottom: -170px;
2689
+ background:
2690
+ radial-gradient(circle at center,
2691
+ color-mix(in srgb, #9333ea 68%, #6366f1 32%) 0%,
2692
+ color-mix(in srgb, #6d28d9 58%, transparent) 46%,
2693
+ transparent 75%);
2694
+ opacity: 0.62;
2695
+ }
2696
+
2697
+ .solid-auth-theme-wrapper.auth-theme-light::before {
2698
+ opacity: 0.48;
2699
+ }
2700
+
2701
+ .solid-auth-theme-wrapper.auth-theme-light::after {
2702
+ opacity: 0.34;
2703
+ }
2704
+
2705
+ .solid-auth-theme-wrapper > * {
2706
+ position: relative;
2707
+ z-index: 1;
2708
+ }
2709
+
2710
+ /* List table (non-Prime table layer) */
2711
+ .solid-list-page-wrapper {
2712
+ height: calc(100dvh - 46px) !important;
2713
+ max-height: calc(100dvh - 46px) !important;
2714
+ min-height: 0;
2715
+ flex: 1 1 auto;
2716
+ overflow: hidden !important;
2717
+ background-color: var(--background) !important;
2718
+ padding: 12px;
2719
+ }
2720
+
2721
+ .solid-list-page-wrapper .page-header {
2722
+ flex-shrink: 0;
2723
+ }
2724
+
2725
+ .solid-list-content {
2726
+ display: flex;
2727
+ flex-direction: column;
2728
+ flex: 1 1 auto;
2729
+ min-height: 0;
2730
+ height: 100%;
2731
+ }
2732
+
2733
+ .solid-list-surface {
2734
+ width: 100%;
2735
+ height: 100%;
2736
+ min-height: 0;
2737
+ display: flex;
2738
+ flex-direction: column;
2739
+ flex: 1 1 auto;
2740
+ background: var(--card);
2741
+ border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
2742
+ border-radius: 12px;
2743
+ box-shadow: 0 8px 24px rgba(2, 6, 23, 0.08);
2744
+ overflow: hidden;
2745
+ }
2746
+
2747
+ .solid-list-toolbar {
2748
+ padding: 10px 12px;
2749
+ border-bottom: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
2750
+ background: color-mix(in srgb, var(--card) 94%, var(--background) 6%);
2751
+ }
2752
+
2753
+ .solid-list-toolbar .view-title {
2754
+ font-size: 15px;
2755
+ font-weight: 600;
2756
+ line-height: 1.2;
2757
+ color: var(--foreground);
2758
+ }
2759
+
2760
+ .solid-list-toolbar .solid-list-toolbar-actions {
2761
+ gap: 8px !important;
2762
+ }
2763
+
2764
+ .solid-list-toolbar .solid-global-search-element {
2765
+ height: 36px;
2766
+ border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
2767
+ border-radius: 10px;
2768
+ background: var(--background);
2769
+ padding: 0 0 0 6px;
2770
+ }
2771
+
2772
+ .solid-list-toolbar .solid-global-search-element:focus-within {
2773
+ border-color: color-mix(in srgb, var(--ring) 60%, var(--border) 40%);
2774
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 18%, transparent);
2775
+ }
2776
+
2777
+ .solid-list-toolbar .solid-global-search-element-wrapper {
2778
+ width: min(460px, 42vw);
2779
+ }
2780
+
2781
+ .solid-list-toolbar .solid-global-search-element input {
2782
+ height: 34px;
2783
+ max-width: none !important;
2784
+ width: 100%;
2785
+ border: 0;
2786
+ background: transparent;
2787
+ font-size: 13px;
2788
+ color: var(--foreground);
2789
+ padding-left: 8px;
2790
+ padding-right: 40px;
2791
+ }
2792
+
2793
+ .solid-list-toolbar .solid-global-search-element input::placeholder {
2794
+ color: color-mix(in srgb, var(--muted-foreground) 78%, transparent);
2795
+ }
2796
+
2797
+ .solid-list-toolbar .custom-filter-button {
2798
+ border: 0;
2799
+ background: transparent;
2800
+ height: 34px;
2801
+ width: 34px;
2802
+ border-radius: 8px;
2803
+ right: 1px;
2804
+ }
2805
+
2806
+ .solid-list-toolbar .custom-filter-button:hover {
2807
+ background: color-mix(in srgb, var(--accent) 65%, transparent);
2808
+ }
2809
+
2810
+ .solid-list-toolbar .p-button {
2811
+ height: 32px;
2812
+ border-radius: 8px;
2813
+ font-size: 12px;
2814
+ font-weight: 500;
2815
+ }
2816
+
2817
+ .solid-list-toolbar .p-button.p-button-secondary,
2818
+ .solid-list-toolbar .p-button.p-button-outlined,
2819
+ .solid-list-toolbar .solid-icon-button {
2820
+ border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
2821
+ background: var(--background);
2822
+ color: var(--foreground);
2823
+ }
2824
+
2825
+ .solid-list-toolbar .solid-icon-button {
2826
+ width: 32px !important;
2827
+ min-width: 32px !important;
2828
+ padding: 0 !important;
2829
+ }
2830
+
2831
+ .solid-list-table-area {
2832
+ display: flex;
2833
+ flex-direction: column;
2834
+ flex: 1;
2835
+ min-height: 0;
2836
+ padding: 0 10px 0;
2837
+ }
2838
+
2839
+ .solid-list-page-wrapper .solid-datatable-wrapper {
2840
+ height: 100% !important;
2841
+ min-height: 0;
2842
+ }
2843
+
2844
+ .solid-list-table-area > .solid-data-table-root {
2845
+ flex: 1 1 auto;
2846
+ min-height: 0;
2847
+ }
2848
+
2849
+ .solid-data-table-root {
2850
+ height: 100%;
2851
+ display: grid;
2852
+ grid-template-rows: minmax(0, 1fr) auto;
2853
+ min-height: 0;
2854
+ overflow: hidden;
2855
+ }
2856
+
2857
+ .solid-data-table-viewport {
2858
+ min-height: 0;
2859
+ height: 100%;
2860
+ overflow-y: auto;
2861
+ overflow-x: auto;
2862
+ }
2863
+
2864
+ .solid-datatable-wrapper table {
2865
+ width: 100%;
2866
+ min-width: max-content;
2867
+ table-layout: auto;
2868
+ }
2869
+
2870
+ .solid-datatable-wrapper th,
2871
+ .solid-datatable-wrapper td {
2872
+ font-size: 13px;
2873
+ line-height: 1.35;
2874
+ white-space: nowrap;
2875
+ color: var(--foreground);
2876
+ }
2877
+
2878
+ .solid-data-table-head {
2879
+ background: color-mix(in srgb, var(--card) 88%, var(--background) 12%);
2880
+ }
2881
+
2882
+ .solid-data-table-th {
2883
+ font-weight: 600;
2884
+ color: color-mix(in srgb, var(--foreground) 90%, transparent);
2885
+ border-bottom: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
2886
+ }
2887
+
2888
+ .solid-data-table-td {
2889
+ color: color-mix(in srgb, var(--foreground) 94%, transparent);
2890
+ }
2891
+
2892
+ .solid-data-table-row {
2893
+ border-top: 1px solid color-mix(in srgb, var(--border) 58%, transparent);
2894
+ transition: background-color 140ms ease;
2895
+ }
2896
+
2897
+ .solid-data-table-row:hover {
2898
+ background: color-mix(in srgb, var(--accent) 46%, transparent);
2899
+ }
2900
+
2901
+ .solid-table-density-compact .solid-data-table-th,
2902
+ .solid-table-density-compact .solid-data-table-td {
2903
+ height: 34px;
2904
+ padding: 0.3125rem 0.5625rem;
2905
+ }
2906
+
2907
+ .solid-table-density-cozy .solid-data-table-th,
2908
+ .solid-table-density-cozy .solid-data-table-td {
2909
+ height: 38px;
2910
+ padding: 0.375rem 0.625rem;
2911
+ }
2912
+
2913
+ .solid-table-density-comfortable .solid-data-table-th,
2914
+ .solid-table-density-comfortable .solid-data-table-td {
2915
+ height: 46px;
2916
+ padding: 0.5rem 0.875rem;
2917
+ }
2918
+
2919
+ .solid-data-table-selection-col {
2920
+ width: 48px;
2921
+ min-width: 48px;
2922
+ max-width: 48px;
2923
+ text-align: center;
2924
+ padding-left: 0.75rem !important;
2925
+ padding-right: 0.75rem !important;
2926
+ }
2927
+
2928
+ .solid-table-cell-numeric {
2929
+ text-align: right;
2930
+ font-variant-numeric: tabular-nums;
2931
+ }
2932
+
2933
+ .solid-table-header-numeric {
2934
+ text-align: right;
2935
+ font-variant-numeric: tabular-nums;
2936
+ }
2937
+
2938
+ .solid-table-header-button {
2939
+ all: unset;
2940
+ display: inline-flex;
2941
+ align-items: center;
2942
+ gap: 5px;
2943
+ font-weight: 600;
2944
+ color: inherit;
2945
+ font-size: 12px;
2946
+ line-height: 1.2;
2947
+ }
2948
+
2949
+ .solid-table-header-button.is-sortable {
2950
+ cursor: pointer;
2951
+ }
2952
+
2953
+ .solid-table-header-button i {
2954
+ font-size: 11px;
2955
+ }
2956
+
2957
+ .solid-data-table-root input[type="checkbox"] {
2958
+ width: 15px;
2959
+ height: 15px;
2960
+ accent-color: var(--primary);
2961
+ }
2962
+
2963
+ .solid-table-paginator {
2964
+ flex-shrink: 0;
2965
+ min-height: 44px;
2966
+ position: relative;
2967
+ z-index: 1;
2968
+ background: var(--card);
2969
+ border-color: color-mix(in srgb, var(--border) 86%, transparent) !important;
2970
+ border-bottom: 0;
2971
+ border-bottom-left-radius: 0;
2972
+ border-bottom-right-radius: 0;
2973
+ padding-top: 8px;
2974
+ padding-bottom: 8px;
2975
+ }
2976
+
2977
+ .solid-table-paginator-align-end {
2978
+ align-self: end;
2979
+ }
2980
+
2981
+ .solid-paginator-meta {
2982
+ align-items: center;
2983
+ }
2984
+
2985
+ .solid-paginator-label,
2986
+ .solid-paginator-report {
2987
+ font-size: 12px;
2988
+ line-height: 1;
2989
+ color: color-mix(in srgb, var(--foreground) 82%, transparent);
2990
+ font-weight: 500;
2991
+ }
2992
+
2993
+ .solid-paginator-select {
2994
+ height: 32px;
2995
+ min-width: 46px;
2996
+ border-radius: 8px;
2997
+ border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
2998
+ background: var(--background);
2999
+ color: var(--foreground);
3000
+ font-size: 12px;
3001
+ font-weight: 500;
3002
+ line-height: 1;
3003
+ padding: 0 26px 0 8px;
3004
+ }
3005
+
3006
+ .solid-paginator-btn {
3007
+ height: 32px;
3008
+ min-width: 72px;
3009
+ display: inline-flex;
3010
+ align-items: center;
3011
+ justify-content: center;
3012
+ border-radius: 8px;
3013
+ border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
3014
+ background: var(--background);
3015
+ color: var(--foreground);
3016
+ font-size: 12px;
3017
+ font-weight: 500;
3018
+ line-height: 1;
3019
+ padding: 0 12px;
3020
+ transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
3021
+ }
3022
+
3023
+ .solid-paginator-btn:hover:not(:disabled) {
3024
+ background: var(--accent);
3025
+ border-color: color-mix(in srgb, var(--border) 74%, transparent);
3026
+ }
3027
+
3028
+ .solid-paginator-btn:disabled {
3029
+ opacity: 0.46;
3030
+ cursor: not-allowed;
3031
+ }
3032
+
3033
+ .solid-data-table-viewport {
3034
+ scrollbar-width: thin;
3035
+ scrollbar-color: color-mix(in srgb, var(--foreground) 26%, transparent) color-mix(in srgb, var(--background) 86%, transparent);
3036
+ }
3037
+
3038
+ .solid-data-table-viewport::-webkit-scrollbar {
3039
+ width: 10px;
3040
+ height: 10px;
3041
+ }
3042
+
3043
+ .solid-data-table-viewport::-webkit-scrollbar-track {
3044
+ background: color-mix(in srgb, var(--background) 86%, transparent);
3045
+ border-radius: 999px;
3046
+ }
3047
+
3048
+ .solid-data-table-viewport::-webkit-scrollbar-thumb {
3049
+ background: color-mix(in srgb, var(--foreground) 26%, transparent);
3050
+ border-radius: 999px;
3051
+ border: 2px solid color-mix(in srgb, var(--background) 86%, transparent);
3052
+ }
3053
+
3054
+ .solid-data-table-viewport::-webkit-scrollbar-thumb:hover {
3055
+ background: color-mix(in srgb, var(--foreground) 36%, transparent);
3056
+ }
3057
+
3058
+ .solid-datatable-wrapper .greyed-out-row {
3059
+ opacity: 0.55;
3060
+ }
3061
+
3062
+ .solid-datatable-wrapper a {
3063
+ color: color-mix(in srgb, var(--primary) 84%, var(--foreground) 16%);
3064
+ font-weight: 500;
3065
+ }
3066
+
3067
+ .solid-list-external-link {
3068
+ border: 0;
3069
+ background: transparent;
3070
+ color: color-mix(in srgb, var(--primary) 84%, var(--foreground) 16%);
3071
+ display: inline-flex;
3072
+ align-items: center;
3073
+ gap: 6px;
3074
+ font-size: 13px;
3075
+ line-height: 1.25;
3076
+ font-weight: 500;
3077
+ padding: 0;
3078
+ cursor: pointer;
3079
+ }
3080
+
3081
+ .solid-list-external-link:hover {
3082
+ color: color-mix(in srgb, var(--primary) 94%, var(--foreground) 6%);
3083
+ }
3084
+
3085
+ .solid-list-external-link-text {
3086
+ white-space: nowrap;
3087
+ }
3088
+
3089
+ .solid-list-external-link-icon {
3090
+ opacity: 0.9;
3091
+ }
3092
+
3093
+ .solid-data-table-viewport {
3094
+ border-width: 1px !important;
3095
+ }
3096
+
3097
+ .solid-row-menu-trigger.p-button,
3098
+ .solid-row-menu-trigger {
3099
+ width: 28px;
3100
+ height: 28px;
3101
+ min-width: 28px;
3102
+ border-radius: 8px;
3103
+ border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
3104
+ background: var(--background);
3105
+ color: color-mix(in srgb, var(--foreground) 78%, transparent);
3106
+ display: inline-flex;
3107
+ align-items: center;
3108
+ justify-content: center;
3109
+ cursor: pointer;
3110
+ transition: background 120ms ease, color 120ms ease;
3111
+ }
3112
+
3113
+ .solid-row-menu-trigger.p-button:hover,
3114
+ .solid-row-menu-trigger:hover {
3115
+ background: var(--accent);
3116
+ color: var(--accent-foreground);
3117
+ }
3118
+
3119
+ .solid-row-menu-trigger .p-button-label {
3120
+ display: none;
3121
+ }
3122
+
3123
+ .solid-custom-overlay .p-overlaypanel-content {
3124
+ padding: 3px;
3125
+ border-radius: 8px;
3126
+ border: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
3127
+ background: var(--card);
3128
+ box-shadow: 0 10px 24px color-mix(in srgb, hsl(222 47% 11%) 18%, transparent);
3129
+ }
3130
+
3131
+ .solid-row-actions-menu {
3132
+ min-width: 152px;
3133
+ }
3134
+
3135
+ .solid-row-action-button.p-button {
3136
+ width: 100%;
3137
+ justify-content: flex-start;
3138
+ border: 1px solid transparent;
3139
+ background: transparent;
3140
+ color: var(--foreground);
3141
+ border-radius: 6px;
3142
+ min-height: 27px;
3143
+ padding: 0 8px;
3144
+ font-size: 12px;
3145
+ font-weight: 500;
3146
+ line-height: 1.1;
3147
+ }
3148
+
3149
+ .solid-row-action-button.p-button .p-button-label {
3150
+ flex: 1;
3151
+ text-align: left;
3152
+ line-height: 1.1;
3153
+ }
3154
+
3155
+ .solid-row-action-button.p-button .p-button-icon {
3156
+ font-size: 11px;
3157
+ margin-right: 6px;
3158
+ }
3159
+
3160
+ .solid-row-action-button.p-button:hover {
3161
+ background: var(--accent);
3162
+ border-color: color-mix(in srgb, var(--border) 82%, transparent);
3163
+ }
3164
+
3165
+ .solid-row-action-button.p-button:focus-visible {
3166
+ outline: none;
3167
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 24%, transparent);
3168
+ }
3169
+
3170
+ .solid-row-action-button.p-button.solid-row-action-button-danger {
3171
+ color: hsl(0 72% 45%);
3172
+ }
3173
+
3174
+ .solid-row-action-button.p-button.solid-row-action-button-danger:hover {
3175
+ background: color-mix(in srgb, hsl(0 72% 45%) 11%, transparent);
3176
+ border-color: color-mix(in srgb, hsl(0 72% 45%) 40%, transparent);
3177
+ }
3178
+
3179
+ .solid-inline-row-button.p-button {
3180
+ min-height: 28px;
3181
+ border-radius: 8px;
3182
+ border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
3183
+ background: transparent;
3184
+ color: var(--foreground);
3185
+ font-size: 12px;
3186
+ font-weight: 500;
3187
+ padding: 0 9px;
3188
+ }
3189
+
3190
+ .solid-inline-row-button.p-button:hover {
3191
+ background: var(--accent);
3192
+ border-color: color-mix(in srgb, var(--border) 78%, transparent);
3193
+ }
3194
+
3195
+ .solid-inline-row-button.solid-inline-row-button-icon.p-button {
3196
+ width: 28px;
3197
+ min-width: 28px;
3198
+ padding: 0;
3199
+ justify-content: center;
3200
+ }