@uploadcare/file-uploader 1.28.0-alpha.1 → 1.28.0-alpha.666

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 (722) hide show
  1. package/dist/abstract/loadFileUploaderFrom.d.ts +4 -3
  2. package/dist/abstract/loadFileUploaderFrom.js +6 -7
  3. package/dist/env.d.ts +4 -2
  4. package/dist/env.js +6 -7
  5. package/dist/index.css +6 -9
  6. package/dist/index.d.ts +3099 -42
  7. package/dist/index.js +8 -1796
  8. package/dist/index.layered.css +7 -9
  9. package/dist/index.ssr.js +1609 -0
  10. package/dist/locales/file-uploader/ar.d.ts +2 -1
  11. package/dist/locales/file-uploader/ar.js +6 -142
  12. package/dist/locales/file-uploader/az.d.ts +2 -1
  13. package/dist/locales/file-uploader/az.js +6 -134
  14. package/dist/locales/file-uploader/ca.d.ts +2 -1
  15. package/dist/locales/file-uploader/ca.js +6 -136
  16. package/dist/locales/file-uploader/cs.d.ts +2 -1
  17. package/dist/locales/file-uploader/cs.js +6 -138
  18. package/dist/locales/file-uploader/da.d.ts +2 -1
  19. package/dist/locales/file-uploader/da.js +6 -134
  20. package/dist/locales/file-uploader/de.d.ts +2 -1
  21. package/dist/locales/file-uploader/de.js +6 -134
  22. package/dist/locales/file-uploader/el.d.ts +2 -1
  23. package/dist/locales/file-uploader/el.js +6 -134
  24. package/dist/locales/file-uploader/en.d.ts +2 -1
  25. package/dist/locales/file-uploader/en.js +6 -7
  26. package/dist/locales/file-uploader/es.d.ts +2 -1
  27. package/dist/locales/file-uploader/es.js +6 -136
  28. package/dist/locales/file-uploader/et.d.ts +2 -1
  29. package/dist/locales/file-uploader/et.js +6 -134
  30. package/dist/locales/file-uploader/fi.d.ts +2 -1
  31. package/dist/locales/file-uploader/fi.js +6 -134
  32. package/dist/locales/file-uploader/fr.d.ts +2 -1
  33. package/dist/locales/file-uploader/fr.js +6 -136
  34. package/dist/locales/file-uploader/he.d.ts +2 -1
  35. package/dist/locales/file-uploader/he.js +6 -136
  36. package/dist/locales/file-uploader/hy.d.ts +2 -1
  37. package/dist/locales/file-uploader/hy.js +6 -134
  38. package/dist/locales/file-uploader/is.d.ts +2 -1
  39. package/dist/locales/file-uploader/is.js +6 -134
  40. package/dist/locales/file-uploader/it.d.ts +2 -1
  41. package/dist/locales/file-uploader/it.js +6 -136
  42. package/dist/locales/file-uploader/ja.d.ts +2 -1
  43. package/dist/locales/file-uploader/ja.js +6 -134
  44. package/dist/locales/file-uploader/ka.d.ts +2 -1
  45. package/dist/locales/file-uploader/ka.js +6 -134
  46. package/dist/locales/file-uploader/kk.d.ts +2 -1
  47. package/dist/locales/file-uploader/kk.js +6 -134
  48. package/dist/locales/file-uploader/ko.d.ts +2 -1
  49. package/dist/locales/file-uploader/ko.js +6 -134
  50. package/dist/locales/file-uploader/lv.d.ts +2 -1
  51. package/dist/locales/file-uploader/lv.js +6 -136
  52. package/dist/locales/file-uploader/nb.d.ts +2 -1
  53. package/dist/locales/file-uploader/nb.js +6 -134
  54. package/dist/locales/file-uploader/nl.d.ts +2 -1
  55. package/dist/locales/file-uploader/nl.js +6 -134
  56. package/dist/locales/file-uploader/pl.d.ts +2 -1
  57. package/dist/locales/file-uploader/pl.js +6 -138
  58. package/dist/locales/file-uploader/pt.d.ts +2 -1
  59. package/dist/locales/file-uploader/pt.js +6 -136
  60. package/dist/locales/file-uploader/ro.d.ts +2 -1
  61. package/dist/locales/file-uploader/ro.js +6 -136
  62. package/dist/locales/file-uploader/ru.d.ts +2 -1
  63. package/dist/locales/file-uploader/ru.js +6 -138
  64. package/dist/locales/file-uploader/sk.d.ts +2 -1
  65. package/dist/locales/file-uploader/sk.js +6 -138
  66. package/dist/locales/file-uploader/sr.d.ts +2 -1
  67. package/dist/locales/file-uploader/sr.js +6 -136
  68. package/dist/locales/file-uploader/sv.d.ts +2 -1
  69. package/dist/locales/file-uploader/sv.js +6 -134
  70. package/dist/locales/file-uploader/tr.d.ts +2 -1
  71. package/dist/locales/file-uploader/tr.js +6 -134
  72. package/dist/locales/file-uploader/uk.d.ts +2 -1
  73. package/dist/locales/file-uploader/uk.js +6 -138
  74. package/dist/locales/file-uploader/vi.d.ts +2 -1
  75. package/dist/locales/file-uploader/vi.js +6 -134
  76. package/dist/locales/file-uploader/zh-TW.d.ts +2 -1
  77. package/dist/locales/file-uploader/zh-TW.js +6 -134
  78. package/dist/locales/file-uploader/zh.d.ts +2 -1
  79. package/dist/locales/file-uploader/zh.js +6 -134
  80. package/package.json +34 -40
  81. package/web/file-uploader.iife.min.d.ts +3241 -0
  82. package/web/file-uploader.iife.min.js +8 -697
  83. package/web/file-uploader.iife.min.js.LEGAL.txt +71 -0
  84. package/web/file-uploader.min.d.ts +3241 -0
  85. package/web/file-uploader.min.js +7 -1858
  86. package/web/file-uploader.min.js.LEGAL.txt +71 -0
  87. package/web/uc-basic.layered.min.css +7 -6046
  88. package/web/uc-basic.min.css +6 -5487
  89. package/web/uc-cloud-image-editor.layered.min.css +7 -1884
  90. package/web/uc-cloud-image-editor.min.css +6 -1675
  91. package/web/uc-cloud-image-editor.min.d.ts +3198 -0
  92. package/web/uc-cloud-image-editor.min.js +7 -456
  93. package/web/uc-cloud-image-editor.min.js.LEGAL.txt +70 -0
  94. package/web/uc-file-uploader-inline.layered.min.css +7 -4352
  95. package/web/uc-file-uploader-inline.min.css +6 -3836
  96. package/web/uc-file-uploader-inline.min.d.ts +3241 -0
  97. package/web/uc-file-uploader-inline.min.js +7 -1858
  98. package/web/uc-file-uploader-inline.min.js.LEGAL.txt +71 -0
  99. package/web/uc-file-uploader-minimal.layered.min.css +7 -4352
  100. package/web/uc-file-uploader-minimal.min.css +6 -3836
  101. package/web/uc-file-uploader-minimal.min.d.ts +3241 -0
  102. package/web/uc-file-uploader-minimal.min.js +7 -1858
  103. package/web/uc-file-uploader-minimal.min.js.LEGAL.txt +71 -0
  104. package/web/uc-file-uploader-regular.layered.min.css +7 -4352
  105. package/web/uc-file-uploader-regular.min.css +6 -3836
  106. package/web/uc-file-uploader-regular.min.d.ts +3241 -0
  107. package/web/uc-file-uploader-regular.min.js +7 -1858
  108. package/web/uc-file-uploader-regular.min.js.LEGAL.txt +71 -0
  109. package/web/uc-img.min.d.ts +75 -0
  110. package/web/uc-img.min.js +7 -894
  111. package/web/uc-img.min.js.LEGAL.txt +24 -0
  112. package/dist/ActivityHeader-R6Mlx-dA.js +0 -9
  113. package/dist/ActivityHeader.css +0 -23
  114. package/dist/ActivityHeader.layered.css +0 -24
  115. package/dist/CameraSource-DDwj1jCV.js +0 -511
  116. package/dist/CameraSource-n1tun2Df.js +0 -10
  117. package/dist/CameraSource.css +0 -180
  118. package/dist/CameraSource.layered.css +0 -209
  119. package/dist/CloudImageEditor-DcVoIRb3.js +0 -2163
  120. package/dist/CloudImageEditorActivity-Csij4nlC.js +0 -87
  121. package/dist/CloudImageEditorActivity-DD4NdU0P.js +0 -9
  122. package/dist/CloudImageEditorActivity.css +0 -14
  123. package/dist/CloudImageEditorActivity.layered.css +0 -15
  124. package/dist/Config-DKOromHY.js +0 -433
  125. package/dist/Config.css +0 -4
  126. package/dist/Config.layered.css +0 -5
  127. package/dist/ExternalSource-6MSUgxqy.js +0 -10
  128. package/dist/ExternalSource-DVEjSkPB.js +0 -253
  129. package/dist/ExternalSource.css +0 -98
  130. package/dist/ExternalSource.layered.css +0 -116
  131. package/dist/Icon-tXRTvEF2.js +0 -1810
  132. package/dist/Icon.css +0 -14
  133. package/dist/Icon.layered.css +0 -15
  134. package/dist/LitUploaderBlock-LxeOZ0ya.js +0 -998
  135. package/dist/UrlSource-BkyX00I2.js +0 -73
  136. package/dist/UrlSource-RI8TSD48.js +0 -10
  137. package/dist/UrlSource.css +0 -17
  138. package/dist/UrlSource.layered.css +0 -18
  139. package/dist/abstract/CTX.d.ts +0 -40
  140. package/dist/abstract/TypedCollection.d.ts +0 -47
  141. package/dist/abstract/TypedCollection.test.d.ts +0 -1
  142. package/dist/abstract/TypedData.d.ts +0 -12
  143. package/dist/abstract/TypedData.test.d.ts +0 -1
  144. package/dist/abstract/UploaderPublicApi.d.ts +0 -41
  145. package/dist/abstract/buildOutputCollectionState.d.ts +0 -3
  146. package/dist/abstract/customConfigOptions.d.ts +0 -65
  147. package/dist/abstract/defineComponents.d.ts +0 -1
  148. package/dist/abstract/features/ClipboardLayer.d.ts +0 -12
  149. package/dist/abstract/localeRegistry.d.ts +0 -5
  150. package/dist/abstract/managers/LocaleManager.d.ts +0 -10
  151. package/dist/abstract/managers/ModalManager.d.ts +0 -53
  152. package/dist/abstract/managers/SecureUploadsManager.d.ts +0 -7
  153. package/dist/abstract/managers/TelemetryManager.d.ts +0 -41
  154. package/dist/abstract/managers/ValidationManager.d.ts +0 -34
  155. package/dist/abstract/managers/__tests__/ModalManager.test.d.ts +0 -13
  156. package/dist/abstract/managers/__tests__/SecureUploadsManager.test.d.ts +0 -1
  157. package/dist/abstract/managers/a11y.d.ts +0 -9
  158. package/dist/abstract/managers/plugin/PluginManager.d.ts +0 -25
  159. package/dist/abstract/managers/plugin/PluginTypes.d.ts +0 -146
  160. package/dist/abstract/managers/plugin/index.d.ts +0 -2
  161. package/dist/abstract/sharedConfigKey.d.ts +0 -2
  162. package/dist/abstract/uploadEntrySchema.d.ts +0 -34
  163. package/dist/blocks/ActivityHeader/ActivityHeader.d.ts +0 -8
  164. package/dist/blocks/CameraSource/CameraSource.d.ts +0 -121
  165. package/dist/blocks/CameraSource/__tests__/calcCameraModes.test.d.ts +0 -1
  166. package/dist/blocks/CameraSource/calcCameraModes.d.ts +0 -5
  167. package/dist/blocks/CameraSource/constants.d.ts +0 -15
  168. package/dist/blocks/CloudImageEditor/index.d.ts +0 -1
  169. package/dist/blocks/CloudImageEditor/src/CloudImageEditorBlock.d.ts +0 -60
  170. package/dist/blocks/CloudImageEditor/src/CropFrame.d.ts +0 -56
  171. package/dist/blocks/CloudImageEditor/src/EditorAspectRatioButtonControl.d.ts +0 -24
  172. package/dist/blocks/CloudImageEditor/src/EditorButtonControl.d.ts +0 -14
  173. package/dist/blocks/CloudImageEditor/src/EditorCropButtonControl.d.ts +0 -13
  174. package/dist/blocks/CloudImageEditor/src/EditorFilterControl.d.ts +0 -35
  175. package/dist/blocks/CloudImageEditor/src/EditorImageCropper.d.ts +0 -56
  176. package/dist/blocks/CloudImageEditor/src/EditorImageFader.d.ts +0 -63
  177. package/dist/blocks/CloudImageEditor/src/EditorOperationControl.d.ts +0 -15
  178. package/dist/blocks/CloudImageEditor/src/EditorScroller.d.ts +0 -15
  179. package/dist/blocks/CloudImageEditor/src/EditorSlider.d.ts +0 -33
  180. package/dist/blocks/CloudImageEditor/src/EditorToolbar.d.ts +0 -68
  181. package/dist/blocks/CloudImageEditor/src/crop-utils.d.ts +0 -36
  182. package/dist/blocks/CloudImageEditor/src/crop-utils.test.d.ts +0 -1
  183. package/dist/blocks/CloudImageEditor/src/cropper-constants.d.ts +0 -10
  184. package/dist/blocks/CloudImageEditor/src/elements/button/BtnUi.d.ts +0 -31
  185. package/dist/blocks/CloudImageEditor/src/elements/line-loader/LineLoaderUi.d.ts +0 -19
  186. package/dist/blocks/CloudImageEditor/src/elements/presence-toggle/PresenceToggle.d.ts +0 -27
  187. package/dist/blocks/CloudImageEditor/src/elements/slider/SliderUi.d.ts +0 -38
  188. package/dist/blocks/CloudImageEditor/src/index.d.ts +0 -15
  189. package/dist/blocks/CloudImageEditor/src/lib/classNames.d.ts +0 -5
  190. package/dist/blocks/CloudImageEditor/src/lib/classNames.test.d.ts +0 -1
  191. package/dist/blocks/CloudImageEditor/src/lib/linspace.d.ts +0 -1
  192. package/dist/blocks/CloudImageEditor/src/lib/linspace.test.d.ts +0 -1
  193. package/dist/blocks/CloudImageEditor/src/lib/parseCropPreset.d.ts +0 -4
  194. package/dist/blocks/CloudImageEditor/src/lib/parseCropPreset.test.d.ts +0 -1
  195. package/dist/blocks/CloudImageEditor/src/lib/parseTabs.d.ts +0 -2
  196. package/dist/blocks/CloudImageEditor/src/lib/pick.d.ts +0 -1
  197. package/dist/blocks/CloudImageEditor/src/lib/pick.test.d.ts +0 -1
  198. package/dist/blocks/CloudImageEditor/src/lib/transformationUtils.d.ts +0 -7
  199. package/dist/blocks/CloudImageEditor/src/state.d.ts +0 -20
  200. package/dist/blocks/CloudImageEditor/src/svg-sprite.d.ts +0 -2
  201. package/dist/blocks/CloudImageEditor/src/toolbar-constants.d.ts +0 -61
  202. package/dist/blocks/CloudImageEditor/src/types.d.ts +0 -60
  203. package/dist/blocks/CloudImageEditor/src/util.d.ts +0 -2
  204. package/dist/blocks/CloudImageEditor/src/utils/parseFilterValue.d.ts +0 -7
  205. package/dist/blocks/CloudImageEditor/src/utils/parseFilterValue.test.d.ts +0 -1
  206. package/dist/blocks/CloudImageEditorActivity/CloudImageEditorActivity.d.ts +0 -25
  207. package/dist/blocks/Config/Config.d.ts +0 -60
  208. package/dist/blocks/Config/assertions.d.ts +0 -5
  209. package/dist/blocks/Config/computed-properties.d.ts +0 -24
  210. package/dist/blocks/Config/computed-properties.test.d.ts +0 -1
  211. package/dist/blocks/Config/initialConfig.d.ts +0 -6
  212. package/dist/blocks/Config/normalizeConfigValue.d.ts +0 -2
  213. package/dist/blocks/Config/validatorsType.d.ts +0 -18
  214. package/dist/blocks/Copyright/Copyright.d.ts +0 -10
  215. package/dist/blocks/DropArea/DropArea.d.ts +0 -47
  216. package/dist/blocks/DropArea/addDropzone.d.ts +0 -17
  217. package/dist/blocks/DropArea/getDropItems.d.ts +0 -12
  218. package/dist/blocks/ExternalSource/ExternalSource.d.ts +0 -45
  219. package/dist/blocks/ExternalSource/MessageBridge.d.ts +0 -11
  220. package/dist/blocks/ExternalSource/buildThemeDefinition.d.ts +0 -4
  221. package/dist/blocks/ExternalSource/query-string.d.ts +0 -1
  222. package/dist/blocks/ExternalSource/types.d.ts +0 -105
  223. package/dist/blocks/FileItem/FileItem.d.ts +0 -50
  224. package/dist/blocks/FileItem/FileItemConfig.d.ts +0 -10
  225. package/dist/blocks/FormInput/FormInput.d.ts +0 -18
  226. package/dist/blocks/Icon/Icon.d.ts +0 -19
  227. package/dist/blocks/Img/Img.d.ts +0 -14
  228. package/dist/blocks/Img/ImgBase.d.ts +0 -29
  229. package/dist/blocks/Img/ImgConfig.d.ts +0 -28
  230. package/dist/blocks/Img/configurations.d.ts +0 -11
  231. package/dist/blocks/Img/props-map.d.ts +0 -28
  232. package/dist/blocks/Img/utils/parseObjectToString.d.ts +0 -2
  233. package/dist/blocks/Modal/Modal.d.ts +0 -34
  234. package/dist/blocks/PluginActivityRenderer/PluginActivityRenderer.d.ts +0 -32
  235. package/dist/blocks/PluginActivityRenderer/index.d.ts +0 -1
  236. package/dist/blocks/ProgressBar/ProgressBar.d.ts +0 -21
  237. package/dist/blocks/ProgressBarCommon/ProgressBarCommon.d.ts +0 -17
  238. package/dist/blocks/Select/Select.d.ts +0 -18
  239. package/dist/blocks/SimpleBtn/SimpleBtn.d.ts +0 -15
  240. package/dist/blocks/SourceBtn/SourceBtn.d.ts +0 -23
  241. package/dist/blocks/SourceList/SourceList.d.ts +0 -24
  242. package/dist/blocks/Spinner/Spinner.d.ts +0 -9
  243. package/dist/blocks/StartFrom/StartFrom.d.ts +0 -12
  244. package/dist/blocks/Thumb/Thumb.d.ts +0 -35
  245. package/dist/blocks/UploadCtxProvider/EventEmitter.d.ts +0 -70
  246. package/dist/blocks/UploadCtxProvider/UploadCtxProvider.d.ts +0 -44
  247. package/dist/blocks/UploadList/UploadList.d.ts +0 -39
  248. package/dist/blocks/UrlSource/UrlSource.d.ts +0 -14
  249. package/dist/blocks/svg-backgrounds/svg-backgrounds.d.ts +0 -3
  250. package/dist/blocks/themes/uc-basic/svg-sprite.d.ts +0 -2
  251. package/dist/cameraPlugin-weRKO7eG.js +0 -8
  252. package/dist/cloud-image-editor-hhbyNWLG.js +0 -11
  253. package/dist/cloud-image-editor.css +0 -1380
  254. package/dist/cloud-image-editor.layered.css +0 -1549
  255. package/dist/cloudImageEditorPlugin-FjUgbMK3.js +0 -8
  256. package/dist/core.d.ts +0 -42
  257. package/dist/en-8OWEmZim.js +0 -135
  258. package/dist/env-mM-ksNPq.js +0 -8
  259. package/dist/externalSourcesPlugin-CMBmLT8S.js +0 -8
  260. package/dist/imageShrinkPlugin-BN6loiP2.js +0 -8
  261. package/dist/index-base.css +0 -2497
  262. package/dist/index-base.layered.css +0 -2837
  263. package/dist/instagramPlugin-CXRm8MGL.js +0 -8
  264. package/dist/lit/BaseComponent.d.ts +0 -12
  265. package/dist/lit/Constructor.d.ts +0 -1
  266. package/dist/lit/CssDataMixin.d.ts +0 -7
  267. package/dist/lit/LightDomMixin.d.ts +0 -8
  268. package/dist/lit/LitActivityBlock.d.ts +0 -53
  269. package/dist/lit/LitBlock.d.ts +0 -83
  270. package/dist/lit/LitSolutionBlock.d.ts +0 -21
  271. package/dist/lit/LitUploaderBlock.d.ts +0 -53
  272. package/dist/lit/PubSubCompat.d.ts +0 -18
  273. package/dist/lit/RegisterableElementMixin.d.ts +0 -7
  274. package/dist/lit/SharedState.d.ts +0 -119
  275. package/dist/lit/SymbioteCompatMixin.d.ts +0 -40
  276. package/dist/lit/TestModeController.d.ts +0 -16
  277. package/dist/lit/Uid.d.ts +0 -3
  278. package/dist/lit/activity-constants.d.ts +0 -11
  279. package/dist/lit/createDebugPrinter.d.ts +0 -3
  280. package/dist/lit/findBlockInCtx.d.ts +0 -3
  281. package/dist/lit/getOutputData.d.ts +0 -2
  282. package/dist/lit/hasBlockInCtx.d.ts +0 -3
  283. package/dist/lit/l10n.d.ts +0 -5
  284. package/dist/lit/parseCssPropertyValue.d.ts +0 -1
  285. package/dist/lit/shared-instances.d.ts +0 -65
  286. package/dist/loadFileUploaderFrom-Bfz8L3VB.js +0 -28
  287. package/dist/plugins/cameraPlugin.d.ts +0 -2
  288. package/dist/plugins/cloudImageEditorPlugin.d.ts +0 -2
  289. package/dist/plugins/externalSourcesPlugin.d.ts +0 -2
  290. package/dist/plugins/imageShrinkPlugin.d.ts +0 -2
  291. package/dist/plugins/instagramPlugin.d.ts +0 -2
  292. package/dist/plugins/unsplashPlugin.d.ts +0 -16
  293. package/dist/plugins/urlSourcePlugin.d.ts +0 -2
  294. package/dist/plugins-CGUls7EV.js +0 -278
  295. package/dist/solutions/adaptive-image/index.d.ts +0 -2
  296. package/dist/solutions/cloud-image-editor/CloudImageEditor.d.ts +0 -11
  297. package/dist/solutions/cloud-image-editor/index.d.ts +0 -5
  298. package/dist/solutions/file-uploader/inline/FileUploaderInline.d.ts +0 -20
  299. package/dist/solutions/file-uploader/inline/index.d.ts +0 -1
  300. package/dist/solutions/file-uploader/minimal/FileUploaderMinimal.d.ts +0 -23
  301. package/dist/solutions/file-uploader/minimal/index.d.ts +0 -1
  302. package/dist/solutions/file-uploader/regular/FileUploaderRegular.d.ts +0 -17
  303. package/dist/solutions/file-uploader/regular/index.d.ts +0 -1
  304. package/dist/types/dom.d.ts +0 -1
  305. package/dist/types/events.d.ts +0 -4
  306. package/dist/types/exported.d.ts +0 -492
  307. package/dist/types/index.d.ts +0 -5
  308. package/dist/urlSourcePlugin-_WdbEhq2.js +0 -8
  309. package/dist/utils/UID.d.ts +0 -5
  310. package/dist/utils/UID.test.d.ts +0 -1
  311. package/dist/utils/UploadSource.d.ts +0 -37
  312. package/dist/utils/WindowHeightTracker.d.ts +0 -9
  313. package/dist/utils/abilities.d.ts +0 -1
  314. package/dist/utils/applyStyles.d.ts +0 -1
  315. package/dist/utils/browser-info.d.ts +0 -12
  316. package/dist/utils/browser-info.test.d.ts +0 -1
  317. package/dist/utils/cdn-utils.d.ts +0 -53
  318. package/dist/utils/cdn-utils.test.d.ts +0 -1
  319. package/dist/utils/comma-separated.d.ts +0 -2
  320. package/dist/utils/debounce.d.ts +0 -3
  321. package/dist/utils/delay.d.ts +0 -1
  322. package/dist/utils/fileTypes.d.ts +0 -11
  323. package/dist/utils/fileTypes.test.d.ts +0 -1
  324. package/dist/utils/get-top-level-origin.d.ts +0 -1
  325. package/dist/utils/get-top-level-origin.test.d.ts +0 -1
  326. package/dist/utils/getLocaleDirection.d.ts +0 -1
  327. package/dist/utils/getPluralForm.d.ts +0 -1
  328. package/dist/utils/getPluralForm.test.d.ts +0 -1
  329. package/dist/utils/isPromiseLike.d.ts +0 -1
  330. package/dist/utils/isPromiseLike.test.d.ts +0 -1
  331. package/dist/utils/isSecureTokenExpired.d.ts +0 -8
  332. package/dist/utils/isSecureTokenExpired.test.d.ts +0 -1
  333. package/dist/utils/memoize.d.ts +0 -1
  334. package/dist/utils/memoize.test.d.ts +0 -1
  335. package/dist/utils/mixinClass.d.ts +0 -8
  336. package/dist/utils/parseCdnUrl.d.ts +0 -11
  337. package/dist/utils/parseCdnUrl.test.d.ts +0 -1
  338. package/dist/utils/parseShrink.d.ts +0 -7
  339. package/dist/utils/parseShrink.test.d.ts +0 -1
  340. package/dist/utils/preloadImage.d.ts +0 -10
  341. package/dist/utils/prettyBytes.d.ts +0 -11
  342. package/dist/utils/prettyBytes.test.d.ts +0 -1
  343. package/dist/utils/resizeImage.d.ts +0 -1
  344. package/dist/utils/stringToArray.d.ts +0 -1
  345. package/dist/utils/stringToArray.test.d.ts +0 -1
  346. package/dist/utils/template-utils.d.ts +0 -16
  347. package/dist/utils/template-utils.test.d.ts +0 -1
  348. package/dist/utils/throttle.d.ts +0 -3
  349. package/dist/utils/toKebabCase.d.ts +0 -2
  350. package/dist/utils/toKebabCase.test.d.ts +0 -1
  351. package/dist/utils/transparentPixelSrc.d.ts +0 -1
  352. package/dist/utils/uniqueArray.d.ts +0 -1
  353. package/dist/utils/uniqueArray.test.d.ts +0 -1
  354. package/dist/utils/userAgent.d.ts +0 -2
  355. package/dist/utils/validators/collection/index.d.ts +0 -2
  356. package/dist/utils/validators/collection/validateCollectionUploadError.d.ts +0 -2
  357. package/dist/utils/validators/collection/validateMultiple.d.ts +0 -2
  358. package/dist/utils/validators/file/index.d.ts +0 -4
  359. package/dist/utils/validators/file/validateFileType.d.ts +0 -2
  360. package/dist/utils/validators/file/validateIsImage.d.ts +0 -2
  361. package/dist/utils/validators/file/validateMaxSizeLimit.d.ts +0 -2
  362. package/dist/utils/validators/file/validateUploadError.d.ts +0 -2
  363. package/dist/utils/warnOnce.d.ts +0 -1
  364. package/dist/utils/wildcardRegexp.d.ts +0 -1
  365. package/dist/utils/wildcardRegexp.test.d.ts +0 -1
  366. package/dist/utils/withResolvers.d.ts +0 -5
  367. package/dist/utils/withResolvers.test.d.ts +0 -1
  368. package/web/ActivityHeader-BFdTdVfD.js +0 -9
  369. package/web/ActivityHeader-DQy6rII1.js +0 -9
  370. package/web/ActivityHeader-DvzMl0uj.js +0 -9
  371. package/web/ActivityHeader-i4x6_Fne.js +0 -9
  372. package/web/CameraSource-BAWIA4Wm.js +0 -508
  373. package/web/CameraSource-BqZCQcij.js +0 -11
  374. package/web/CameraSource-Brxr4tz4.js +0 -508
  375. package/web/CameraSource-BvBJ5Uzy.js +0 -508
  376. package/web/CameraSource-CkHzIE-h.js +0 -11
  377. package/web/CameraSource-D964yPLu.js +0 -508
  378. package/web/CameraSource-DE48Az-f.js +0 -11
  379. package/web/CameraSource-DyPebtRF.js +0 -478
  380. package/web/CameraSource-pj7Xo81m.js +0 -11
  381. package/web/CloudImageEditor-CTgUWB07.js +0 -2192
  382. package/web/CloudImageEditor-CxqV9Lwm.js +0 -2192
  383. package/web/CloudImageEditor-DoLWHpqV.js +0 -2192
  384. package/web/CloudImageEditor-Drywn265.js +0 -2192
  385. package/web/CloudImageEditor-MXcaDtMx.js +0 -2187
  386. package/web/CloudImageEditorActivity-BPzmfaJV.js +0 -85
  387. package/web/CloudImageEditorActivity-Br8pU5gd.js +0 -11
  388. package/web/CloudImageEditorActivity-Cw8b2CEz.js +0 -11
  389. package/web/CloudImageEditorActivity-Df1ySGq0.js +0 -86
  390. package/web/CloudImageEditorActivity-DinG5r0y.js +0 -11
  391. package/web/CloudImageEditorActivity-DmnLLINR.js +0 -85
  392. package/web/CloudImageEditorActivity-U90BGCek.js +0 -85
  393. package/web/CloudImageEditorActivity-dNLQZRZI.js +0 -11
  394. package/web/CloudImageEditorActivity-ur-hQ-6p.js +0 -85
  395. package/web/Config-8hlBNhvs.js +0 -455
  396. package/web/Config-BDZhPIyz.js +0 -455
  397. package/web/Config-CJVNrrjj.js +0 -455
  398. package/web/Config-DvkVtlQ7.js +0 -455
  399. package/web/ExternalSource-B9ycBFiD.js +0 -10
  400. package/web/ExternalSource-BE7HX47E.js +0 -250
  401. package/web/ExternalSource-BL5GSlol.js +0 -250
  402. package/web/ExternalSource-BXQY6Dlc.js +0 -10
  403. package/web/ExternalSource-BXxH3JCD.js +0 -250
  404. package/web/ExternalSource-BYSS-PPV.js +0 -245
  405. package/web/ExternalSource-C57a61QN.js +0 -10
  406. package/web/ExternalSource-CKfMtOgU.js +0 -250
  407. package/web/ExternalSource-DP6q8ylB.js +0 -10
  408. package/web/LitUploaderBlock-AX6jOdAS.js +0 -996
  409. package/web/LitUploaderBlock-BjAaoLl2.js +0 -996
  410. package/web/LitUploaderBlock-D8E5HuwH.js +0 -996
  411. package/web/LitUploaderBlock-Dl3ce0Tc.js +0 -996
  412. package/web/LitUploaderBlock-Oi33U0uf.js +0 -996
  413. package/web/UrlSource-B9SX3K0L.js +0 -10
  414. package/web/UrlSource-C3zB1rCb.js +0 -70
  415. package/web/UrlSource-C7bEU6Xv.js +0 -10
  416. package/web/UrlSource-CE389CBz.js +0 -70
  417. package/web/UrlSource-CnvAJ58Y.js +0 -10
  418. package/web/UrlSource-CqF0h6B-.js +0 -10
  419. package/web/UrlSource-D-971Nut.js +0 -70
  420. package/web/UrlSource-DhI3YCt5.js +0 -70
  421. package/web/UrlSource-hWV7jtB2.js +0 -70
  422. package/web/abstract/CTX.d.ts +0 -40
  423. package/web/abstract/TypedCollection.d.ts +0 -47
  424. package/web/abstract/TypedCollection.test.d.ts +0 -1
  425. package/web/abstract/TypedData.d.ts +0 -12
  426. package/web/abstract/TypedData.test.d.ts +0 -1
  427. package/web/abstract/UploaderPublicApi.d.ts +0 -41
  428. package/web/abstract/buildOutputCollectionState.d.ts +0 -3
  429. package/web/abstract/customConfigOptions.d.ts +0 -65
  430. package/web/abstract/defineComponents.d.ts +0 -1
  431. package/web/abstract/features/ClipboardLayer.d.ts +0 -12
  432. package/web/abstract/loadFileUploaderFrom.d.ts +0 -13
  433. package/web/abstract/localeRegistry.d.ts +0 -5
  434. package/web/abstract/managers/LocaleManager.d.ts +0 -10
  435. package/web/abstract/managers/ModalManager.d.ts +0 -53
  436. package/web/abstract/managers/SecureUploadsManager.d.ts +0 -7
  437. package/web/abstract/managers/TelemetryManager.d.ts +0 -41
  438. package/web/abstract/managers/ValidationManager.d.ts +0 -34
  439. package/web/abstract/managers/__tests__/ModalManager.test.d.ts +0 -13
  440. package/web/abstract/managers/__tests__/SecureUploadsManager.test.d.ts +0 -1
  441. package/web/abstract/managers/a11y.d.ts +0 -9
  442. package/web/abstract/managers/plugin/PluginManager.d.ts +0 -25
  443. package/web/abstract/managers/plugin/PluginTypes.d.ts +0 -146
  444. package/web/abstract/managers/plugin/index.d.ts +0 -2
  445. package/web/abstract/sharedConfigKey.d.ts +0 -2
  446. package/web/abstract/uploadEntrySchema.d.ts +0 -34
  447. package/web/blocks/ActivityHeader/ActivityHeader.d.ts +0 -8
  448. package/web/blocks/CameraSource/CameraSource.d.ts +0 -121
  449. package/web/blocks/CameraSource/__tests__/calcCameraModes.test.d.ts +0 -1
  450. package/web/blocks/CameraSource/calcCameraModes.d.ts +0 -5
  451. package/web/blocks/CameraSource/constants.d.ts +0 -15
  452. package/web/blocks/CloudImageEditor/index.d.ts +0 -1
  453. package/web/blocks/CloudImageEditor/src/CloudImageEditorBlock.d.ts +0 -60
  454. package/web/blocks/CloudImageEditor/src/CropFrame.d.ts +0 -56
  455. package/web/blocks/CloudImageEditor/src/EditorAspectRatioButtonControl.d.ts +0 -24
  456. package/web/blocks/CloudImageEditor/src/EditorButtonControl.d.ts +0 -14
  457. package/web/blocks/CloudImageEditor/src/EditorCropButtonControl.d.ts +0 -13
  458. package/web/blocks/CloudImageEditor/src/EditorFilterControl.d.ts +0 -35
  459. package/web/blocks/CloudImageEditor/src/EditorImageCropper.d.ts +0 -56
  460. package/web/blocks/CloudImageEditor/src/EditorImageFader.d.ts +0 -63
  461. package/web/blocks/CloudImageEditor/src/EditorOperationControl.d.ts +0 -15
  462. package/web/blocks/CloudImageEditor/src/EditorScroller.d.ts +0 -15
  463. package/web/blocks/CloudImageEditor/src/EditorSlider.d.ts +0 -33
  464. package/web/blocks/CloudImageEditor/src/EditorToolbar.d.ts +0 -68
  465. package/web/blocks/CloudImageEditor/src/crop-utils.d.ts +0 -36
  466. package/web/blocks/CloudImageEditor/src/crop-utils.test.d.ts +0 -1
  467. package/web/blocks/CloudImageEditor/src/cropper-constants.d.ts +0 -10
  468. package/web/blocks/CloudImageEditor/src/elements/button/BtnUi.d.ts +0 -31
  469. package/web/blocks/CloudImageEditor/src/elements/line-loader/LineLoaderUi.d.ts +0 -19
  470. package/web/blocks/CloudImageEditor/src/elements/presence-toggle/PresenceToggle.d.ts +0 -27
  471. package/web/blocks/CloudImageEditor/src/elements/slider/SliderUi.d.ts +0 -38
  472. package/web/blocks/CloudImageEditor/src/index.d.ts +0 -15
  473. package/web/blocks/CloudImageEditor/src/lib/classNames.d.ts +0 -5
  474. package/web/blocks/CloudImageEditor/src/lib/classNames.test.d.ts +0 -1
  475. package/web/blocks/CloudImageEditor/src/lib/linspace.d.ts +0 -1
  476. package/web/blocks/CloudImageEditor/src/lib/linspace.test.d.ts +0 -1
  477. package/web/blocks/CloudImageEditor/src/lib/parseCropPreset.d.ts +0 -4
  478. package/web/blocks/CloudImageEditor/src/lib/parseCropPreset.test.d.ts +0 -1
  479. package/web/blocks/CloudImageEditor/src/lib/parseTabs.d.ts +0 -2
  480. package/web/blocks/CloudImageEditor/src/lib/pick.d.ts +0 -1
  481. package/web/blocks/CloudImageEditor/src/lib/pick.test.d.ts +0 -1
  482. package/web/blocks/CloudImageEditor/src/lib/transformationUtils.d.ts +0 -7
  483. package/web/blocks/CloudImageEditor/src/state.d.ts +0 -20
  484. package/web/blocks/CloudImageEditor/src/svg-sprite.d.ts +0 -2
  485. package/web/blocks/CloudImageEditor/src/toolbar-constants.d.ts +0 -61
  486. package/web/blocks/CloudImageEditor/src/types.d.ts +0 -60
  487. package/web/blocks/CloudImageEditor/src/util.d.ts +0 -2
  488. package/web/blocks/CloudImageEditor/src/utils/parseFilterValue.d.ts +0 -7
  489. package/web/blocks/CloudImageEditor/src/utils/parseFilterValue.test.d.ts +0 -1
  490. package/web/blocks/CloudImageEditorActivity/CloudImageEditorActivity.d.ts +0 -25
  491. package/web/blocks/Config/Config.d.ts +0 -60
  492. package/web/blocks/Config/assertions.d.ts +0 -5
  493. package/web/blocks/Config/computed-properties.d.ts +0 -24
  494. package/web/blocks/Config/computed-properties.test.d.ts +0 -1
  495. package/web/blocks/Config/initialConfig.d.ts +0 -6
  496. package/web/blocks/Config/normalizeConfigValue.d.ts +0 -2
  497. package/web/blocks/Config/validatorsType.d.ts +0 -18
  498. package/web/blocks/Copyright/Copyright.d.ts +0 -10
  499. package/web/blocks/DropArea/DropArea.d.ts +0 -47
  500. package/web/blocks/DropArea/addDropzone.d.ts +0 -17
  501. package/web/blocks/DropArea/getDropItems.d.ts +0 -12
  502. package/web/blocks/ExternalSource/ExternalSource.d.ts +0 -45
  503. package/web/blocks/ExternalSource/MessageBridge.d.ts +0 -11
  504. package/web/blocks/ExternalSource/buildThemeDefinition.d.ts +0 -4
  505. package/web/blocks/ExternalSource/query-string.d.ts +0 -1
  506. package/web/blocks/ExternalSource/types.d.ts +0 -105
  507. package/web/blocks/FileItem/FileItem.d.ts +0 -50
  508. package/web/blocks/FileItem/FileItemConfig.d.ts +0 -10
  509. package/web/blocks/FormInput/FormInput.d.ts +0 -18
  510. package/web/blocks/Icon/Icon.d.ts +0 -19
  511. package/web/blocks/Img/Img.d.ts +0 -14
  512. package/web/blocks/Img/ImgBase.d.ts +0 -29
  513. package/web/blocks/Img/ImgConfig.d.ts +0 -28
  514. package/web/blocks/Img/configurations.d.ts +0 -11
  515. package/web/blocks/Img/props-map.d.ts +0 -28
  516. package/web/blocks/Img/utils/parseObjectToString.d.ts +0 -2
  517. package/web/blocks/Modal/Modal.d.ts +0 -34
  518. package/web/blocks/PluginActivityRenderer/PluginActivityRenderer.d.ts +0 -32
  519. package/web/blocks/PluginActivityRenderer/index.d.ts +0 -1
  520. package/web/blocks/ProgressBar/ProgressBar.d.ts +0 -21
  521. package/web/blocks/ProgressBarCommon/ProgressBarCommon.d.ts +0 -17
  522. package/web/blocks/Select/Select.d.ts +0 -18
  523. package/web/blocks/SimpleBtn/SimpleBtn.d.ts +0 -15
  524. package/web/blocks/SourceBtn/SourceBtn.d.ts +0 -23
  525. package/web/blocks/SourceList/SourceList.d.ts +0 -24
  526. package/web/blocks/Spinner/Spinner.d.ts +0 -9
  527. package/web/blocks/StartFrom/StartFrom.d.ts +0 -12
  528. package/web/blocks/Thumb/Thumb.d.ts +0 -35
  529. package/web/blocks/UploadCtxProvider/EventEmitter.d.ts +0 -70
  530. package/web/blocks/UploadCtxProvider/UploadCtxProvider.d.ts +0 -44
  531. package/web/blocks/UploadList/UploadList.d.ts +0 -39
  532. package/web/blocks/UrlSource/UrlSource.d.ts +0 -14
  533. package/web/blocks/svg-backgrounds/svg-backgrounds.d.ts +0 -3
  534. package/web/blocks/themes/uc-basic/svg-sprite.d.ts +0 -2
  535. package/web/cameraPlugin-DeedXMWV.js +0 -8
  536. package/web/cameraPlugin-Duy1QwjB.js +0 -8
  537. package/web/cameraPlugin-QS9SUOtO.js +0 -8
  538. package/web/cameraPlugin-bq8ggY04.js +0 -8
  539. package/web/cameraPlugin-cel9YgP_.js +0 -8
  540. package/web/cloud-image-editor-8DrVRZ7E.js +0 -12
  541. package/web/cloud-image-editor-BX50EK1U.js +0 -12
  542. package/web/cloud-image-editor-DSW3oWq-.js +0 -12
  543. package/web/cloud-image-editor-DuI2Lx4M.js +0 -12
  544. package/web/cloudImageEditorPlugin-5my6aD36.js +0 -8
  545. package/web/cloudImageEditorPlugin-Bk19DmJv.js +0 -8
  546. package/web/cloudImageEditorPlugin-CcdnmtBW.js +0 -8
  547. package/web/cloudImageEditorPlugin-DQJmDl03.js +0 -8
  548. package/web/cloudImageEditorPlugin-kojghfqw.js +0 -8
  549. package/web/constants-BCfCF0cJ.js +0 -4025
  550. package/web/core.d.ts +0 -42
  551. package/web/env.d.ts +0 -2
  552. package/web/externalSourcesPlugin-BTeRm5C0.js +0 -8
  553. package/web/externalSourcesPlugin-BXgVeojg.js +0 -8
  554. package/web/externalSourcesPlugin-BgLpuIK9.js +0 -8
  555. package/web/externalSourcesPlugin-DMc9zs4T.js +0 -8
  556. package/web/externalSourcesPlugin-Dm9vnTBv.js +0 -8
  557. package/web/imageShrinkPlugin-BdHgEGZH.js +0 -8
  558. package/web/imageShrinkPlugin-BjkMGfvT.js +0 -8
  559. package/web/imageShrinkPlugin-CCkGHL2w.js +0 -8
  560. package/web/imageShrinkPlugin-D4WjaRGo.js +0 -8
  561. package/web/imageShrinkPlugin-DqYGutVx.js +0 -8
  562. package/web/index.d.ts +0 -42
  563. package/web/instagramPlugin-BTMz0K2a.js +0 -8
  564. package/web/instagramPlugin-BbIKgTH7.js +0 -8
  565. package/web/instagramPlugin-CQQhsEJa.js +0 -8
  566. package/web/instagramPlugin-Cm7lWKae.js +0 -8
  567. package/web/instagramPlugin-DcclxM_d.js +0 -8
  568. package/web/lit/BaseComponent.d.ts +0 -12
  569. package/web/lit/Constructor.d.ts +0 -1
  570. package/web/lit/CssDataMixin.d.ts +0 -7
  571. package/web/lit/LightDomMixin.d.ts +0 -8
  572. package/web/lit/LitActivityBlock.d.ts +0 -53
  573. package/web/lit/LitBlock.d.ts +0 -83
  574. package/web/lit/LitSolutionBlock.d.ts +0 -21
  575. package/web/lit/LitUploaderBlock.d.ts +0 -53
  576. package/web/lit/PubSubCompat.d.ts +0 -18
  577. package/web/lit/RegisterableElementMixin.d.ts +0 -7
  578. package/web/lit/SharedState.d.ts +0 -119
  579. package/web/lit/SymbioteCompatMixin.d.ts +0 -40
  580. package/web/lit/TestModeController.d.ts +0 -16
  581. package/web/lit/Uid.d.ts +0 -3
  582. package/web/lit/activity-constants.d.ts +0 -11
  583. package/web/lit/createDebugPrinter.d.ts +0 -3
  584. package/web/lit/findBlockInCtx.d.ts +0 -3
  585. package/web/lit/getOutputData.d.ts +0 -2
  586. package/web/lit/hasBlockInCtx.d.ts +0 -3
  587. package/web/lit/l10n.d.ts +0 -5
  588. package/web/lit/parseCssPropertyValue.d.ts +0 -1
  589. package/web/lit/shared-instances.d.ts +0 -65
  590. package/web/locales/file-uploader/ar.d.ts +0 -137
  591. package/web/locales/file-uploader/az.d.ts +0 -129
  592. package/web/locales/file-uploader/ca.d.ts +0 -131
  593. package/web/locales/file-uploader/cs.d.ts +0 -133
  594. package/web/locales/file-uploader/da.d.ts +0 -129
  595. package/web/locales/file-uploader/de.d.ts +0 -129
  596. package/web/locales/file-uploader/el.d.ts +0 -129
  597. package/web/locales/file-uploader/en.d.ts +0 -129
  598. package/web/locales/file-uploader/es.d.ts +0 -131
  599. package/web/locales/file-uploader/et.d.ts +0 -129
  600. package/web/locales/file-uploader/fi.d.ts +0 -129
  601. package/web/locales/file-uploader/fr.d.ts +0 -131
  602. package/web/locales/file-uploader/he.d.ts +0 -131
  603. package/web/locales/file-uploader/hy.d.ts +0 -129
  604. package/web/locales/file-uploader/is.d.ts +0 -129
  605. package/web/locales/file-uploader/it.d.ts +0 -131
  606. package/web/locales/file-uploader/ja.d.ts +0 -129
  607. package/web/locales/file-uploader/ka.d.ts +0 -129
  608. package/web/locales/file-uploader/kk.d.ts +0 -129
  609. package/web/locales/file-uploader/ko.d.ts +0 -129
  610. package/web/locales/file-uploader/lv.d.ts +0 -131
  611. package/web/locales/file-uploader/nb.d.ts +0 -129
  612. package/web/locales/file-uploader/nl.d.ts +0 -129
  613. package/web/locales/file-uploader/pl.d.ts +0 -133
  614. package/web/locales/file-uploader/pt.d.ts +0 -131
  615. package/web/locales/file-uploader/ro.d.ts +0 -131
  616. package/web/locales/file-uploader/ru.d.ts +0 -133
  617. package/web/locales/file-uploader/sk.d.ts +0 -133
  618. package/web/locales/file-uploader/sr.d.ts +0 -131
  619. package/web/locales/file-uploader/sv.d.ts +0 -129
  620. package/web/locales/file-uploader/tr.d.ts +0 -129
  621. package/web/locales/file-uploader/uk.d.ts +0 -133
  622. package/web/locales/file-uploader/vi.d.ts +0 -129
  623. package/web/locales/file-uploader/zh-TW.d.ts +0 -129
  624. package/web/locales/file-uploader/zh.d.ts +0 -129
  625. package/web/plugins/cameraPlugin.d.ts +0 -2
  626. package/web/plugins/cloudImageEditorPlugin.d.ts +0 -2
  627. package/web/plugins/externalSourcesPlugin.d.ts +0 -2
  628. package/web/plugins/imageShrinkPlugin.d.ts +0 -2
  629. package/web/plugins/instagramPlugin.d.ts +0 -2
  630. package/web/plugins/unsplashPlugin.d.ts +0 -16
  631. package/web/plugins/urlSourcePlugin.d.ts +0 -2
  632. package/web/plugins-Bt7FXHKx.js +0 -562
  633. package/web/plugins-CaaolyMk.js +0 -562
  634. package/web/plugins-Cjgw5oWg.js +0 -562
  635. package/web/plugins-CzNtrVQB.js +0 -562
  636. package/web/plugins-DS0hIs2V.js +0 -563
  637. package/web/ref-BOnG19ns.js +0 -4040
  638. package/web/ref-BejJFG7m.js +0 -4040
  639. package/web/ref-DcRg7zo9.js +0 -4040
  640. package/web/ref-ZWPcLQB9.js +0 -4040
  641. package/web/solutions/adaptive-image/index.d.ts +0 -2
  642. package/web/solutions/cloud-image-editor/CloudImageEditor.d.ts +0 -11
  643. package/web/solutions/cloud-image-editor/index.d.ts +0 -5
  644. package/web/solutions/file-uploader/inline/FileUploaderInline.d.ts +0 -20
  645. package/web/solutions/file-uploader/inline/index.d.ts +0 -1
  646. package/web/solutions/file-uploader/minimal/FileUploaderMinimal.d.ts +0 -23
  647. package/web/solutions/file-uploader/minimal/index.d.ts +0 -1
  648. package/web/solutions/file-uploader/regular/FileUploaderRegular.d.ts +0 -17
  649. package/web/solutions/file-uploader/regular/index.d.ts +0 -1
  650. package/web/style-map-BmZdux7T.js +0 -37
  651. package/web/style-map-CZ6fSV6e.js +0 -37
  652. package/web/style-map-Dk7mLCrB.js +0 -37
  653. package/web/style-map-HkHnu9oA.js +0 -37
  654. package/web/style-map-tw1yUEaj.js +0 -37
  655. package/web/types/dom.d.ts +0 -1
  656. package/web/types/events.d.ts +0 -4
  657. package/web/types/exported.d.ts +0 -492
  658. package/web/types/index.d.ts +0 -5
  659. package/web/urlSourcePlugin-9lhcr02f.js +0 -8
  660. package/web/urlSourcePlugin-C-sLGhGb.js +0 -8
  661. package/web/urlSourcePlugin-DNXDpnRD.js +0 -8
  662. package/web/urlSourcePlugin-JnD0cnxb.js +0 -8
  663. package/web/urlSourcePlugin-hcMU2K6T.js +0 -8
  664. package/web/utils/UID.d.ts +0 -5
  665. package/web/utils/UID.test.d.ts +0 -1
  666. package/web/utils/UploadSource.d.ts +0 -37
  667. package/web/utils/WindowHeightTracker.d.ts +0 -9
  668. package/web/utils/abilities.d.ts +0 -1
  669. package/web/utils/applyStyles.d.ts +0 -1
  670. package/web/utils/browser-info.d.ts +0 -12
  671. package/web/utils/browser-info.test.d.ts +0 -1
  672. package/web/utils/cdn-utils.d.ts +0 -53
  673. package/web/utils/cdn-utils.test.d.ts +0 -1
  674. package/web/utils/comma-separated.d.ts +0 -2
  675. package/web/utils/debounce.d.ts +0 -3
  676. package/web/utils/delay.d.ts +0 -1
  677. package/web/utils/fileTypes.d.ts +0 -11
  678. package/web/utils/fileTypes.test.d.ts +0 -1
  679. package/web/utils/get-top-level-origin.d.ts +0 -1
  680. package/web/utils/get-top-level-origin.test.d.ts +0 -1
  681. package/web/utils/getLocaleDirection.d.ts +0 -1
  682. package/web/utils/getPluralForm.d.ts +0 -1
  683. package/web/utils/getPluralForm.test.d.ts +0 -1
  684. package/web/utils/isPromiseLike.d.ts +0 -1
  685. package/web/utils/isPromiseLike.test.d.ts +0 -1
  686. package/web/utils/isSecureTokenExpired.d.ts +0 -8
  687. package/web/utils/isSecureTokenExpired.test.d.ts +0 -1
  688. package/web/utils/memoize.d.ts +0 -1
  689. package/web/utils/memoize.test.d.ts +0 -1
  690. package/web/utils/mixinClass.d.ts +0 -8
  691. package/web/utils/parseCdnUrl.d.ts +0 -11
  692. package/web/utils/parseCdnUrl.test.d.ts +0 -1
  693. package/web/utils/parseShrink.d.ts +0 -7
  694. package/web/utils/parseShrink.test.d.ts +0 -1
  695. package/web/utils/preloadImage.d.ts +0 -10
  696. package/web/utils/prettyBytes.d.ts +0 -11
  697. package/web/utils/prettyBytes.test.d.ts +0 -1
  698. package/web/utils/resizeImage.d.ts +0 -1
  699. package/web/utils/stringToArray.d.ts +0 -1
  700. package/web/utils/stringToArray.test.d.ts +0 -1
  701. package/web/utils/template-utils.d.ts +0 -16
  702. package/web/utils/template-utils.test.d.ts +0 -1
  703. package/web/utils/throttle.d.ts +0 -3
  704. package/web/utils/toKebabCase.d.ts +0 -2
  705. package/web/utils/toKebabCase.test.d.ts +0 -1
  706. package/web/utils/transparentPixelSrc.d.ts +0 -1
  707. package/web/utils/uniqueArray.d.ts +0 -1
  708. package/web/utils/uniqueArray.test.d.ts +0 -1
  709. package/web/utils/userAgent.d.ts +0 -2
  710. package/web/utils/validators/collection/index.d.ts +0 -2
  711. package/web/utils/validators/collection/validateCollectionUploadError.d.ts +0 -2
  712. package/web/utils/validators/collection/validateMultiple.d.ts +0 -2
  713. package/web/utils/validators/file/index.d.ts +0 -4
  714. package/web/utils/validators/file/validateFileType.d.ts +0 -2
  715. package/web/utils/validators/file/validateIsImage.d.ts +0 -2
  716. package/web/utils/validators/file/validateMaxSizeLimit.d.ts +0 -2
  717. package/web/utils/validators/file/validateUploadError.d.ts +0 -2
  718. package/web/utils/warnOnce.d.ts +0 -1
  719. package/web/utils/wildcardRegexp.d.ts +0 -1
  720. package/web/utils/wildcardRegexp.test.d.ts +0 -1
  721. package/web/utils/withResolvers.d.ts +0 -5
  722. package/web/utils/withResolvers.test.d.ts +0 -1
@@ -1,4352 +1,7 @@
1
- @layer uc.components {
2
- uc-icon {
3
- display: inline-flex;
4
- align-items: center;
5
- justify-content: center;
6
- width: var(--uc-button-size);
7
- height: var(--uc-button-size);
8
- }
9
-
10
- uc-icon svg {
11
- width: calc(var(--uc-button-size) / 2);
12
- height: calc(var(--uc-button-size) / 2);
13
- overflow: visible;
14
- }
15
- }
16
- @layer uc.components {
17
- uc-config {
18
- display: none;
19
- }
20
- }
21
- @layer uc.components {
22
- uc-activity-header {
23
- display: flex;
24
- justify-content: space-between;
25
- gap: var(--uc-padding);
26
- padding: var(--uc-padding);
27
- color: var(--uc-foreground);
28
- font-weight: 500;
29
- font-size: 1em;
30
- }
31
-
32
- uc-activity-header > * {
33
- display: flex;
34
- align-items: center;
35
- }
36
-
37
- uc-activity-header > div > uc-icon {
38
- width: auto;
39
- }
40
-
41
- uc-activity-header > div {
42
- gap: var(--uc-padding);
43
- }
44
- }
45
- @layer uc.components {
46
- uc-select {
47
- display: inline-flex;
48
- }
49
-
50
- uc-select select {
51
- position: relative;
52
- display: inline-flex;
53
- align-items: center;
54
- justify-content: center;
55
- height: var(--uc-button-size);
56
- padding: 0 14px;
57
- font-size: 1em;
58
- font-family: inherit;
59
- white-space: nowrap;
60
- border: none;
61
- border-radius: var(--uc-radius);
62
- cursor: pointer;
63
- user-select: none;
64
- transition: background-color var(--uc-transition);
65
- color: var(--uc-secondary-foreground);
66
- background-color: var(--uc-secondary);
67
- }
68
- }
69
- @layer uc.components {
70
- uc-camera-source {
71
- position: relative;
72
- display: flex;
73
- flex-direction: column;
74
- width: 100%;
75
- height: 100%;
76
- max-height: 100%;
77
- overflow: hidden;
78
- background-color: var(--uc-background);
79
- border-radius: var(--uc-radius);
80
- }
81
-
82
- [uc-modal] > dialog:has([activity="camera"][active]) {
83
- width: 100%;
84
- height: 100%;
85
- }
86
-
87
- uc-camera-source video {
88
- display: block;
89
- width: 100%;
90
- max-height: 100%;
91
- object-fit: contain;
92
- object-position: center center;
93
- background-color: var(--uc-muted);
94
- border-radius: var(--uc-radius);
95
- }
96
-
97
- uc-camera-source .uc-toolbar {
98
- position: absolute;
99
- bottom: 0;
100
- display: flex;
101
- justify-content: space-between;
102
- width: 100%;
103
- padding: var(--uc-padding);
104
- background-color: var(--uc-background);
105
- }
106
-
107
- uc-camera-source .uc-content {
108
- display: flex;
109
- flex: 1;
110
- justify-content: center;
111
- width: 100%;
112
- height: 100%;
113
- padding: var(--uc-padding);
114
- padding-top: 0;
115
- overflow: hidden;
116
- }
117
-
118
- uc-camera-source .uc-message-box {
119
- display: flex;
120
- flex-direction: column;
121
- gap: 40px;
122
- align-items: center;
123
- justify-content: center;
124
- padding: 40px 40px 0;
125
- color: var(--uc-foreground);
126
- }
127
-
128
- uc-camera-source .uc-message-box button {
129
- color: var(--uc-primary-foreground);
130
- background-color: var(--uc-primary);
131
- }
132
-
133
- uc-camera-source .uc-shot-btn {
134
- width: 58px;
135
- height: 58px;
136
- color: var(--uc-background);
137
- background-color: var(--uc-primary-light);
138
- border-radius: 50%;
139
- opacity: 0.85;
140
- transition:
141
- bottom var(--uc-transition),
142
- opacity var(--uc-transition),
143
- transform var(--uc-transition);
144
- }
145
-
146
- uc-camera-source .uc-shot-btn:hover {
147
- transform: scale(1.05);
148
- opacity: 1;
149
- }
150
-
151
- uc-camera-source .uc-shot-btn:active {
152
- transform: scale(1);
153
- opacity: 1;
154
- }
155
-
156
- uc-camera-source .uc-shot-btn[disabled] {
157
- bottom: -80px;
158
- }
159
-
160
- uc-camera-source .uc-shot-btn uc-icon svg {
161
- width: 20px;
162
- height: 20px;
163
- }
164
-
165
- uc-camera-source .uc-controls {
166
- position: relative;
167
- display: flex;
168
- align-items: center;
169
- flex-wrap: wrap;
170
- justify-content: space-between;
171
- padding: 0 var(--uc-padding) var(--uc-padding);
172
- min-height: 74px;
173
- }
174
-
175
- uc-camera-source:not(.uc-initialized) .uc-controls {
176
- display: none;
177
- }
178
-
179
- uc-camera-source .uc-switcher {
180
- display: flex;
181
- gap: calc(var(--uc-padding) / 2);
182
- }
183
- uc-camera-source .uc-switch.uc-active {
184
- background-color: var(--uc-secondary);
185
- }
186
-
187
- uc-camera-source .uc-camera-actions {
188
- display: flex;
189
- justify-content: center;
190
- align-items: center;
191
- gap: 5px;
192
- }
193
-
194
- uc-camera-source .uc-stop-record {
195
- background-color: var(--uc-destructive-foreground-light);
196
- opacity: 1;
197
- }
198
-
199
- :where(uc-camera-source:is(.uc-recording)) .uc-recording-timer uc-icon {
200
- display: none;
201
- }
202
-
203
- :where(uc-camera-source:is(.uc-recording)) .uc-recording-timer {
204
- pointer-events: none;
205
- }
206
-
207
- uc-camera-source .uc-recording-timer {
208
- z-index: 1;
209
- position: relative;
210
- overflow: hidden;
211
- }
212
-
213
- :where(uc-camera-source) .uc-recording-timer uc-icon {
214
- width: 10px;
215
- height: 10px;
216
- margin-right: 10px;
217
- }
218
-
219
- uc-camera-source .uc-recording-timer .uc-line {
220
- position: absolute;
221
- content: "";
222
- bottom: 0;
223
- left: 0;
224
- right: 0;
225
- height: 2px;
226
- background-color: var(--uc-foreground-light);
227
- transform: scaleX(0);
228
- transform-origin: left;
229
- transition: transform var(--uc-transition);
230
- }
231
-
232
- uc-camera-source .uc-btn-microphone {
233
- z-index: 1;
234
- }
235
-
236
- uc-camera-source .uc-select {
237
- display: flex;
238
- }
239
-
240
- uc-camera-source .uc-audio-select {
241
- width: 98px;
242
- }
243
-
244
- uc-camera-source .uc-audio-select select {
245
- width: 100%;
246
- }
247
-
248
- uc-camera-source .uc-camera-action {
249
- position: absolute;
250
- inset: 0 var(--uc-padding) var(--uc-padding);
251
- margin: 0 auto;
252
- }
253
- }
254
- @layer uc.components {
255
- uc-cloud-image-editor-activity {
256
- position: relative;
257
- display: flex;
258
- width: 100%;
259
- height: 100%;
260
- overflow: hidden;
261
- background-color: var(--uc-background);
262
- }
263
-
264
- [uc-modal] > dialog:has([activity="cloud-image-edit"][active]) {
265
- width: 100%;
266
- height: 100%;
267
- }
268
- }
269
- @layer uc.components {
270
- @keyframes uc-spinner-keyframes {
271
- from {
272
- transform: rotate(0deg);
273
- }
274
- to {
275
- transform: rotate(360deg);
276
- }
277
- }
278
-
279
- .uc-spinner {
280
- width: 1em;
281
- height: 1em;
282
- border: solid 2px transparent;
283
- border-top-color: currentColor;
284
- border-left-color: currentColor;
285
- border-radius: 50%;
286
- animation: uc-spinner-keyframes 400ms linear infinite;
287
- }
288
- }
289
- @layer uc.components {
290
- uc-external-source {
291
- display: flex;
292
- flex-direction: column;
293
- width: 100%;
294
- height: 100%;
295
- background-color: var(--uc-background);
296
- overflow: hidden;
297
- position: relative;
298
- }
299
-
300
- [uc-modal] > dialog:has([activity="external"][active]) {
301
- width: 100%;
302
- height: 100%;
303
- }
304
-
305
- uc-external-source > .uc-content {
306
- position: relative;
307
- display: grid;
308
- flex: 1;
309
- grid-template-rows: 1fr min-content;
310
- }
311
-
312
- uc-external-source iframe {
313
- display: block;
314
- width: 100%;
315
- height: 100%;
316
- border: none;
317
- }
318
-
319
- uc-external-source .uc-iframe-wrapper {
320
- overflow: hidden;
321
- }
322
-
323
- uc-external-source .uc-toolbar {
324
- display: flex;
325
- width: 100%;
326
- gap: var(--uc-padding);
327
- align-items: center;
328
- justify-content: space-between;
329
- padding: var(--uc-padding);
330
- border-top: 1px solid var(--uc-border);
331
- }
332
-
333
- uc-external-source .uc-back-btn {
334
- padding-left: 0;
335
- }
336
-
337
- uc-external-source .uc-selection-status-box {
338
- color: var(--uc-foreground);
339
- display: flex;
340
- flex-direction: column;
341
- align-items: center;
342
- justify-content: center;
343
- }
344
-
345
- uc-external-source .uc-selection-status-box button {
346
- color: var(--uc-primary);
347
- height: auto;
348
- padding: 0;
349
- background: none;
350
- }
351
-
352
- uc-external-source .uc-selection-status-box button:hover {
353
- text-decoration: underline;
354
- }
355
-
356
- uc-external-source uc-activity-header {
357
- position: absolute;
358
- width: 100%;
359
- justify-content: flex-end;
360
- z-index: 1;
361
- left: 0;
362
- top: 0;
363
- right: 0;
364
- pointer-events: none;
365
- }
366
-
367
- uc-external-source uc-activity-header .uc-close-btn {
368
- pointer-events: auto;
369
- }
370
-
371
- uc-external-source .uc-done-btn > span.uc-hidden {
372
- visibility: hidden;
373
- pointer-events: none;
374
- }
375
-
376
- uc-external-source .uc-done-btn > uc-spinner {
377
- position: absolute;
378
- width: 100%;
379
- height: 100%;
380
- display: flex;
381
- align-items: center;
382
- justify-content: center;
383
- }
384
- }
385
- @layer uc.components {
386
- uc-url-source {
387
- display: block;
388
- background-color: var(--uc-background);
389
- }
390
-
391
- uc-url-source > .uc-content {
392
- display: grid;
393
- gap: 4px;
394
- grid-template-columns: 1fr min-content;
395
- padding: var(--uc-padding);
396
- padding-top: 0;
397
- }
398
-
399
- uc-url-source .uc-url-input {
400
- display: flex;
401
- }
402
- }
403
- @layer uc.components {
404
- @supports selector(dialog::backdrop) {
405
- :where([uc-modal]) > dialog::backdrop {
406
- /* backdrop don't inherit theme properties */
407
- background-color: oklch(0% 0 0 / 0.1);
408
- }
409
- :where([uc-modal])[strokes] > dialog::backdrop {
410
- /* TODO: it's not working, fix it */
411
- background-image: var(--modal-backdrop-background-image);
412
- }
413
- }
414
-
415
- :where([uc-modal]) > dialog[open] {
416
- transform: translateY(0px);
417
- visibility: visible;
418
- opacity: 1;
419
- }
420
-
421
- :where([uc-modal]) > dialog:not([open]) {
422
- transform: translateY(20px);
423
- visibility: hidden;
424
- opacity: 0;
425
- }
426
-
427
- :where([uc-modal]) > dialog {
428
- display: flex;
429
- flex-direction: column;
430
- width: min(var(--uc-dialog-width), 100%);
431
- max-width: min(calc(100% - var(--uc-padding) * 2), var(--uc-dialog-max-width));
432
- min-height: var(--uc-button-size);
433
- max-height: min(calc(100% - var(--uc-padding) * 2), var(--uc-dialog-max-height));
434
- margin: auto;
435
- padding: 0;
436
- overflow: hidden;
437
- background-color: var(--uc-background);
438
- border: 0;
439
- border-radius: calc(var(--uc-radius) * 1.75);
440
- box-shadow: var(--uc-dialog-shadow);
441
- transition:
442
- transform 0.4s ease,
443
- opacity 0.4s ease;
444
- }
445
-
446
- :where(.uc-contrast) :where([uc-modal]) > dialog {
447
- outline: 1px solid var(--uc-border);
448
- }
449
- }
450
- @layer uc.components {
451
- uc-copyright {
452
- display: flex;
453
- width: 100%;
454
- justify-content: center;
455
- }
456
-
457
- uc-copyright .uc-credits {
458
- all: unset;
459
- position: absolute;
460
- bottom: 12px;
461
- background-color: var(--uc-background);
462
- padding: 2px 5px;
463
- border-radius: 6px;
464
- color: var(--uc-muted-foreground);
465
- font-weight: normal;
466
- font-size: 12px;
467
- opacity: 0.9;
468
- cursor: pointer;
469
- transition:
470
- opacity var(--uc-transition),
471
- background-color var(--uc-transition);
472
- }
473
-
474
- uc-copyright .uc-credits:focus-visible {
475
- outline: 1px auto Highlight;
476
- outline: 1px auto -webkit-focus-ring-color;
477
- }
478
-
479
- uc-copyright .uc-credits:hover {
480
- opacity: 1;
481
- background-color: var(--uc-muted);
482
- }
483
- }
484
- @layer uc.components {
485
- uc-progress-bar {
486
- --visible-opacity: 1;
487
- --l-progress-value: 0;
488
-
489
- position: absolute;
490
- top: 0;
491
- bottom: 0;
492
- left: 0;
493
- width: 100%;
494
- height: 100%;
495
- overflow: hidden;
496
- pointer-events: none;
497
- transition: opacity 0.3s;
498
- opacity: 1;
499
- }
500
-
501
- uc-progress-bar.uc-progress-bar--hidden {
502
- opacity: 0;
503
- }
504
-
505
- uc-progress-bar .uc-progress {
506
- position: absolute;
507
- width: calc(var(--l-progress-value) * 1%);
508
- height: 100%;
509
- background-color: var(--uc-primary);
510
- transform: translateX(0);
511
- opacity: var(--visible-opacity);
512
- transition:
513
- width 0.6s,
514
- opacity 0.3s;
515
- }
516
-
517
- uc-progress-bar .uc-progress--hidden {
518
- opacity: 0;
519
- transition: opacity 0.3s;
520
- }
521
-
522
- uc-progress-bar .uc-fake-progress {
523
- --l-fake-progress-width: 30;
524
-
525
- position: absolute;
526
- width: calc(var(--l-fake-progress-width) * 1%);
527
- height: 100%;
528
- background-color: var(--uc-primary);
529
- animation: fake-progress-animation 1s ease-in-out infinite;
530
- opacity: var(--visible-opacity);
531
- transition: opacity 0.3s;
532
- z-index: 1;
533
- }
534
-
535
- uc-progress-bar .uc-fake-progress--hidden {
536
- opacity: 0;
537
- animation: none;
538
- }
539
-
540
- @keyframes fake-progress-animation {
541
- from {
542
- transform: translateX(-100%);
543
- }
544
-
545
- to {
546
- transform: translateX(calc(100 / var(--l-fake-progress-width) * 100 * 1%));
547
- }
548
- }
549
- }
550
- @layer uc.components {
551
- uc-progress-bar-common {
552
- position: fixed;
553
- right: 0;
554
- bottom: 0;
555
- left: 0;
556
- z-index: 10000;
557
- display: block;
558
- height: 10px;
559
- background-color: var(--uc-background);
560
- transition: opacity 0.3s;
561
- }
562
-
563
- uc-progress-bar-common:not([active]) {
564
- opacity: 0;
565
- pointer-events: none;
566
- }
567
- }
568
- @layer uc.components {
569
- uc-source-btn > button {
570
- display: flex;
571
- align-items: center;
572
- margin-bottom: 2px;
573
- padding: 2px var(--uc-padding);
574
- color: var(--uc-foreground);
575
- border-radius: var(--uc-radius);
576
- cursor: pointer;
577
- transition:
578
- background-color var(--uc-transition),
579
- color var(--uc-transition);
580
- user-select: none;
581
- width: 100%;
582
- background-color: unset;
583
- height: unset;
584
- }
585
-
586
- uc-source-btn:last-child > button {
587
- margin-bottom: 0;
588
- }
589
-
590
- uc-source-btn > button:hover {
591
- background-color: var(--uc-primary-transparent);
592
- }
593
-
594
- :where(.uc-contrast) uc-source-btn > button:hover {
595
- background-color: var(--uc-secondary);
596
- color: var(--uc-foreground);
597
- }
598
-
599
- uc-source-btn uc-icon {
600
- display: inline-flex;
601
- flex-grow: 1;
602
- justify-content: center;
603
- min-width: var(--uc-button-size);
604
- margin-right: var(--uc-padding);
605
- opacity: 0.8;
606
- }
607
-
608
- :where(.uc-contrast) uc-source-btn uc-icon {
609
- opacity: 1;
610
- }
611
-
612
- uc-source-btn .uc-txt {
613
- display: flex;
614
- align-items: center;
615
- box-sizing: border-box;
616
- width: 100%;
617
- height: var(--uc-button-size);
618
- padding: 0;
619
- white-space: nowrap;
620
- border: none;
621
- }
622
- }
623
- @layer uc.components {
624
- uc-thumb {
625
- width: 100%;
626
- height: 100%;
627
- }
628
-
629
- .uc-thumb {
630
- position: relative;
631
- overflow: hidden;
632
- width: 100%;
633
- height: 100%;
634
- }
635
-
636
- .uc-thumb__img {
637
- position: absolute;
638
- inset: 0;
639
- width: 100%;
640
- height: 100%;
641
- object-fit: cover;
642
- display: block;
643
- pointer-events: none;
644
- }
645
- }
646
- @layer uc.components {
647
- uc-start-from {
648
- display: block;
649
- overflow-y: auto;
650
- }
651
-
652
- uc-start-from .uc-content {
653
- display: grid;
654
- grid-auto-flow: row;
655
- gap: calc(var(--uc-padding) * 2);
656
- width: 100%;
657
- height: 100%;
658
- padding: calc(var(--uc-padding) * 2);
659
- background-color: var(--uc-background);
660
- }
661
-
662
- [uc-modal] > dialog:has(uc-start-from[active]) {
663
- width: var(--uc-dialog-width);
664
- }
665
-
666
- [uc-modal] uc-start-from uc-drop-area {
667
- border-radius: var(--uc-radius);
668
- }
669
-
670
- @media only screen and (max-width: 430px) {
671
- [uc-modal] uc-start-from uc-drop-area {
672
- display: none;
673
- }
674
- }
675
- }
676
- @layer uc.components {
677
- uc-upload-list {
678
- position: relative;
679
- display: flex;
680
- flex-direction: column;
681
- width: 100%;
682
- height: max-content;
683
- overflow: hidden;
684
- background-color: var(--uc-background);
685
- transition: opacity var(--uc-transition);
686
- }
687
-
688
- uc-upload-list .uc-no-files {
689
- height: 32px;
690
- padding: 20px;
691
- }
692
-
693
- uc-upload-list .uc-files {
694
- display: block;
695
- flex: 1;
696
- min-height: 32px;
697
- padding: 0 var(--uc-padding);
698
- overflow: auto;
699
- }
700
-
701
- uc-upload-list .uc-files-wrapper {
702
- display: contents;
703
- }
704
-
705
- uc-upload-list .uc-toolbar {
706
- display: flex;
707
- gap: 4px;
708
- justify-content: space-between;
709
- padding: var(--uc-padding);
710
- background-color: var(--uc-background);
711
- }
712
-
713
- uc-upload-list .uc-toolbar-spacer {
714
- flex: 1;
715
- }
716
-
717
- uc-upload-list uc-drop-area {
718
- position: absolute;
719
- top: 0;
720
- left: 0;
721
- width: calc(100% - var(--uc-padding) * 2);
722
- height: calc(100% - var(--uc-padding) * 2);
723
- margin: var(--uc-padding);
724
- border-radius: var(--uc-radius);
725
- }
726
-
727
- uc-upload-list uc-activity-header > .uc-header-text {
728
- padding: 0 var(--uc-padding);
729
- }
730
-
731
- uc-upload-list .uc-common-error {
732
- border-radius: var(--uc-radius);
733
- color: var(--uc-destructive-foreground);
734
- background-color: var(--uc-destructive);
735
- display: flex;
736
- align-items: center;
737
- justify-content: center;
738
- padding: var(--uc-padding);
739
- margin: 4px var(--uc-padding) 0 var(--uc-padding);
740
- font-size: 0.925em;
741
- }
742
-
743
- uc-upload-list .uc-add-more-btn uc-icon {
744
- display: none;
745
- }
746
-
747
- /* GRID */
748
- uc-upload-list[mode="grid"] .uc-files {
749
- display: flex;
750
- flex-wrap: wrap;
751
- gap: var(--uc-grid-gap);
752
- }
753
-
754
- uc-upload-list .uc-files .uc-add-more-btn,
755
- uc-upload-list[mode="grid"] uc-file-item {
756
- flex: 0 0 calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));
757
- max-width: calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));
758
- height: var(--uc-grid-preview-image-height);
759
- aspect-ratio: var(--uc-grid-aspect-ratio);
760
- }
761
-
762
- uc-upload-list .uc-files .uc-add-more-btn {
763
- display: none;
764
- }
765
- }
766
- @layer uc.components {
767
- uc-file-item {
768
- --uc-file-item-gap: 4px;
769
- --uc-file-item-height: calc(var(--uc-preview-size) + var(--uc-padding) * 2 + var(--uc-file-item-gap));
770
-
771
- display: block;
772
- overflow: hidden;
773
- min-height: var(--uc-file-item-height);
774
- }
775
-
776
- uc-file-item:last-of-type {
777
- --uc-file-item-gap: 0;
778
- }
779
-
780
- uc-file-item > .uc-inner {
781
- position: relative;
782
- display: grid;
783
- grid-template-columns: var(--uc-preview-size) 1fr max-content;
784
- gap: 2px;
785
- align-items: center;
786
- margin-bottom: var(--uc-file-item-gap);
787
- padding: var(--uc-padding);
788
- overflow: hidden;
789
- font-size: 0.925em;
790
- background-color: var(--uc-muted);
791
- border-radius: var(--uc-radius);
792
- transition: background-color var(--uc-transition);
793
- }
794
-
795
- uc-file-item > .uc-inner[data-focused] {
796
- background-color: transparent;
797
- }
798
-
799
- uc-file-item > .uc-inner[data-uploading] .uc-edit-btn {
800
- display: none;
801
- }
802
-
803
- uc-file-item > :where(.uc-inner[data-failed], .uc-inner[data-limit-overflow]) {
804
- background-color: var(--uc-destructive);
805
- }
806
-
807
- uc-file-item .uc-thumb {
808
- position: relative;
809
- display: inline-flex;
810
- width: var(--uc-preview-size);
811
- height: var(--uc-preview-size);
812
- background-color: var(--uc-secondary);
813
- background-position: center center;
814
- background-repeat: no-repeat;
815
- background-size: cover;
816
- border-radius: var(--uc-radius);
817
- }
818
-
819
- uc-file-item .uc-file-name-wrapper {
820
- text-align: left;
821
- display: flex;
822
- flex-direction: column;
823
- align-items: flex-start;
824
- justify-content: center;
825
- max-width: 100%;
826
- padding-right: var(--uc-padding);
827
- padding-left: var(--uc-padding);
828
- overflow: hidden;
829
- color: var(--uc-muted-foreground);
830
- }
831
-
832
- uc-file-item .uc-file-name {
833
- max-width: 100%;
834
- overflow: hidden;
835
- white-space: nowrap;
836
- text-overflow: ellipsis;
837
- }
838
-
839
- uc-file-item .uc-file-error {
840
- display: none;
841
- color: var(--uc-destructive-foreground);
842
- font-size: 0.85em;
843
- z-index: 2;
844
- }
845
-
846
- uc-file-item button.uc-remove-btn,
847
- uc-file-item button.uc-edit-btn {
848
- color: var(--uc-muted-foreground);
849
- }
850
-
851
- uc-file-item button svg {
852
- pointer-events: none;
853
- }
854
-
855
- uc-file-item button.uc-upload-btn {
856
- display: none;
857
- }
858
-
859
- uc-file-item .uc-badge {
860
- position: absolute;
861
- bottom: 2px;
862
- right: 2px;
863
- width: 14px;
864
- height: 14px;
865
- color: var(--uc-background);
866
- background-color: var(--uc-foreground);
867
- border-radius: 50%;
868
- transform: scale(0.3);
869
- opacity: 0;
870
- transition:
871
- opacity var(--uc-transition),
872
- transform var(--uc-transition);
873
- display: flex;
874
- justify-content: center;
875
- align-items: center;
876
- }
877
-
878
- uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow], [data-finished]) .uc-badge {
879
- transform: scale(1);
880
- opacity: 1;
881
- }
882
-
883
- uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow]) .uc-badge {
884
- background-color: var(--uc-destructive-foreground);
885
- }
886
-
887
- uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow]) .uc-file-error {
888
- display: block;
889
- }
890
-
891
- uc-file-item .uc-badge uc-icon,
892
- uc-file-item .uc-badge uc-icon svg {
893
- width: 100%;
894
- height: 100%;
895
- }
896
-
897
- uc-file-item .uc-progress-bar {
898
- --visible-opacity: 0.7;
899
-
900
- top: calc(100% - 2px);
901
- height: 2px;
902
- }
903
-
904
- :where(.uc-contrast) uc-file-item .uc-progress-bar {
905
- --visible-opacity: 1;
906
- }
907
-
908
- uc-file-item .uc-file-actions {
909
- display: flex;
910
- gap: 2px;
911
- align-items: center;
912
- justify-content: center;
913
- }
914
-
915
- /* File item in the grid */
916
- uc-file-item[mode="grid"] {
917
- overflow: visible;
918
- min-height: initial;
919
- }
920
-
921
- uc-file-item[mode="grid"] .uc-inner {
922
- height: 100%;
923
- grid-template-columns: 1fr;
924
- grid-template-rows: 1fr max-content;
925
- padding: 0;
926
- background-color: transparent;
927
- margin-bottom: 0;
928
- border-radius: 0;
929
- }
930
-
931
- uc-file-item[mode="grid"] .uc-inner[data-failed] .uc-badge {
932
- display: none;
933
- }
934
-
935
- uc-file-item[mode="grid"] .uc-thumb {
936
- width: 100%;
937
- height: 100%;
938
- }
939
-
940
- uc-file-item[mode="grid"] .uc-badge {
941
- right: var(--uc-padding);
942
- bottom: var(--uc-padding);
943
- }
944
-
945
- uc-file-item[mode="grid"] .uc-file-name-wrapper {
946
- padding: 0;
947
- }
948
-
949
- uc-file-item[mode="grid"] .uc-file-name:not([hidden]) + .uc-file-error {
950
- bottom: calc(var(--uc-padding) + var(--uc-font-size));
951
- }
952
-
953
- uc-file-item[mode="grid"] .uc-file-error {
954
- position: absolute;
955
- background-color: var(--uc-destructive-foreground);
956
- border-radius: var(--uc-radius);
957
- color: var(--uc-background);
958
- bottom: var(--uc-padding);
959
- left: var(--uc-padding);
960
- right: var(--uc-padding);
961
- padding: calc(var(--uc-padding) / 2) var(--uc-padding);
962
- }
963
-
964
- uc-file-item[mode="grid"] .uc-file-hint {
965
- position: absolute;
966
- background-color: var(--uc-background);
967
- border-radius: var(--uc-radius);
968
- color: var(--uc-foreground);
969
- bottom: calc(var(--uc-padding) * 2);
970
- left: var(--uc-padding);
971
- right: var(--uc-padding);
972
- padding: calc(var(--uc-padding) / 2) var(--uc-padding);
973
- }
974
-
975
- uc-file-item[mode="grid"] .uc-file-actions {
976
- position: absolute;
977
- top: var(--uc-padding);
978
- right: var(--uc-padding);
979
- }
980
-
981
- uc-file-item[mode="grid"] button {
982
- background-color: var(--uc-background);
983
- }
984
-
985
- uc-file-item[mode="grid"] button:hover {
986
- background-color: var(--uc-muted);
987
- }
988
-
989
- uc-file-item[mode="grid"] .uc-progress-bar {
990
- width: initial;
991
- height: 4px;
992
- top: initial;
993
- bottom: var(--uc-padding);
994
- left: var(--uc-padding);
995
- right: var(--uc-padding);
996
- border-radius: var(--uc-radius);
997
- z-index: 1;
998
- transition:
999
- background-color 0.3s,
1000
- opacity 0.3s;
1001
- background-color: var(--uc-background);
1002
- }
1003
-
1004
- uc-file-item[mode="grid"] .uc-progress-bar :is(.uc-fake-progress, .uc-progress) {
1005
- background-color: var(--uc-primary);
1006
- }
1007
-
1008
- uc-file-item[mode="grid"] .uc-progress-bar[hasfilename] {
1009
- bottom: calc(var(--uc-padding) + var(--uc-font-size));
1010
- }
1011
- }
1012
- @layer uc.components {
1013
- :where([uc-drop-area]) {
1014
- padding: 2px;
1015
- overflow: hidden;
1016
- border: 1px dashed var(--uc-border);
1017
- border-radius: calc(var(--uc-radius) * 1.75);
1018
- transition:
1019
- border var(--uc-transition),
1020
- border-radius var(--uc-transition);
1021
- }
1022
-
1023
- :where([uc-drop-area]),
1024
- :where([uc-drop-area]) .uc-content-wrapper {
1025
- display: flex;
1026
- align-items: center;
1027
- justify-content: center;
1028
- width: 100%;
1029
- height: 100%;
1030
- }
1031
-
1032
- :where([uc-drop-area]) .uc-text {
1033
- position: relative;
1034
- margin: var(--uc-padding);
1035
- color: var(--uc-muted-foreground);
1036
- transition: color var(--uc-transition);
1037
- }
1038
-
1039
- :where([uc-drop-area])[ghost][drag-state="inactive"] {
1040
- display: none;
1041
- }
1042
-
1043
- :where([uc-drop-area])[ghost]:not([fullscreen]):is([drag-state="active"], [drag-state="near"], [drag-state="over"]) {
1044
- background: var(--uc-background);
1045
- }
1046
-
1047
- :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"], [drag-state="over"], :hover) {
1048
- background: var(--uc-primary-transparent);
1049
- border-color: var(--uc-primary-transparent);
1050
- }
1051
-
1052
- :where(.uc-contrast)
1053
- :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"], [drag-state="over"], :hover) {
1054
- color: var(--uc-foreground);
1055
- background: transparent;
1056
- border-color: var(--uc-foreground);
1057
- border-width: 2px;
1058
- border-style: solid;
1059
- }
1060
-
1061
- :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"]) {
1062
- opacity: 1;
1063
- }
1064
-
1065
- :where([uc-drop-area])[drag-state="over"] {
1066
- border-color: var(--uc-primary);
1067
- opacity: 1;
1068
- }
1069
-
1070
- :where([uc-drop-area])[with-icon] {
1071
- min-height: 180px;
1072
- }
1073
-
1074
- :where([uc-drop-area])[with-icon] .uc-content-wrapper {
1075
- display: flex;
1076
- flex-direction: column;
1077
- }
1078
-
1079
- :where([uc-drop-area])[with-icon] .uc-text {
1080
- color: var(--uc-foreground);
1081
- font-weight: 500;
1082
- font-size: 1.1em;
1083
- }
1084
-
1085
- :where([uc-drop-area])[with-icon] .uc-icon-container {
1086
- position: relative;
1087
- width: 64px;
1088
- height: 64px;
1089
- margin: var(--uc-padding);
1090
- overflow: hidden;
1091
- color: var(--uc-foreground);
1092
- background-color: var(--uc-muted);
1093
- border-radius: 50%;
1094
- transition:
1095
- color var(--uc-transition),
1096
- background-color var(--uc-transition);
1097
- }
1098
-
1099
- :where([uc-drop-area])[with-icon] uc-icon {
1100
- position: absolute;
1101
- width: 32px;
1102
- height: 32px;
1103
- top: calc(50% - 16px);
1104
- left: calc(50% - 16px);
1105
- transition: transform var(--uc-transition);
1106
- }
1107
-
1108
- :where([uc-drop-area])[with-icon] uc-icon:last-child {
1109
- transform: translateY(48px);
1110
- }
1111
-
1112
- :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container,
1113
- :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-text {
1114
- color: var(--uc-foreground);
1115
- }
1116
-
1117
- :where([uc-drop-area])[with-icon]:hover .uc-icon-container {
1118
- background-color: var(--uc-primary-transparent);
1119
- }
1120
-
1121
- :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container {
1122
- background-color: var(--uc-muted);
1123
- }
1124
-
1125
- :where([uc-drop-area])[with-icon]
1126
- > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"])
1127
- .uc-icon-container {
1128
- color: var(--uc-primary-foreground);
1129
- background-color: var(--uc-primary);
1130
- }
1131
-
1132
- :where([uc-drop-area])[with-icon]
1133
- > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"])
1134
- .uc-text {
1135
- color: var(--uc-foreground);
1136
- }
1137
-
1138
- :where(.uc-contrast)
1139
- :where([uc-drop-area])[with-icon]
1140
- > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"])
1141
- .uc-text {
1142
- color: var(--uc-foreground);
1143
- }
1144
-
1145
- :where([uc-drop-area])[with-icon]
1146
- > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"])
1147
- uc-icon:first-child {
1148
- transform: translateY(-48px);
1149
- }
1150
-
1151
- :where([uc-drop-area])[with-icon]
1152
- > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"])
1153
- uc-icon:last-child {
1154
- transform: translateY(0);
1155
- }
1156
-
1157
- :where([uc-drop-area])[with-icon] > .uc-content-wrapper[drag-state="near"] uc-icon:last-child {
1158
- transform: scale(1.3);
1159
- }
1160
-
1161
- :where([uc-drop-area])[with-icon] > .uc-content-wrapper[drag-state="over"] uc-icon:last-child {
1162
- transform: scale(1.5);
1163
- }
1164
-
1165
- :where([uc-drop-area])[fullscreen] {
1166
- position: fixed;
1167
- top: 0;
1168
- right: 0;
1169
- bottom: 0;
1170
- left: 0;
1171
- z-index: 2147483647;
1172
- display: flex;
1173
- align-items: center;
1174
- justify-content: center;
1175
- width: calc(100vw - var(--uc-padding) * 2);
1176
- height: calc(100vh - var(--uc-padding) * 2);
1177
- margin: var(--uc-padding);
1178
- }
1179
-
1180
- :where([uc-drop-area])[fullscreen] .uc-content-wrapper {
1181
- width: 100%;
1182
- max-width: calc(var(--uc-dialog-width) * 0.8);
1183
- height: 180px;
1184
- color: var(--uc-foreground);
1185
- background-color: var(--uc-background);
1186
- border-radius: calc(var(--uc-radius) * 1.75);
1187
- box-shadow: var(--uc-dialog-shadow);
1188
- transition:
1189
- color var(--uc-transition),
1190
- background-color var(--uc-transition),
1191
- box-shadow var(--uc-transition),
1192
- border-radius var(--uc-transition),
1193
- transform var(--uc-transition);
1194
- }
1195
-
1196
- :where([uc-drop-area])[with-icon][fullscreen][drag-state="active"] > .uc-content-wrapper,
1197
- :where([uc-drop-area])[with-icon][fullscreen][drag-state="near"] > .uc-content-wrapper {
1198
- transform: translateY(10px);
1199
- opacity: 0;
1200
- }
1201
-
1202
- :where([uc-drop-area])[with-icon][fullscreen][drag-state="over"] > .uc-content-wrapper {
1203
- transform: translateY(0px);
1204
- opacity: 1;
1205
- }
1206
-
1207
- :is(:where([uc-drop-area])[with-icon][fullscreen]) > .uc-content-wrapper uc-icon:first-child {
1208
- transform: translateY(-48px);
1209
- }
1210
-
1211
- :where([uc-drop-area])[clickable] {
1212
- cursor: pointer;
1213
- }
1214
- }
1215
- @layer uc.components {
1216
- :where([uc-simple-btn]) {
1217
- position: relative;
1218
- display: inline-flex;
1219
- }
1220
-
1221
- :where([uc-simple-btn]) button {
1222
- height: auto;
1223
- gap: 0.5em;
1224
- padding: var(--uc-simple-btn-padding);
1225
- background-color: var(--uc-simple-btn);
1226
- color: var(--uc-simple-btn-foreground);
1227
- font-size: var(--uc-simple-btn-font-size);
1228
- font-family: var(--uc-simple-btn-font-family);
1229
- }
1230
-
1231
- :where([uc-simple-btn]) button uc-icon {
1232
- width: auto;
1233
- height: auto;
1234
- }
1235
-
1236
- :where([uc-simple-btn]) button uc-icon svg {
1237
- width: 0.9em;
1238
- height: 0.9em;
1239
- }
1240
-
1241
- :where([uc-simple-btn]) button:hover {
1242
- background-color: var(--uc-simple-btn-hover);
1243
- }
1244
-
1245
- :where([uc-simple-btn]) > uc-drop-area {
1246
- display: contents;
1247
- }
1248
-
1249
- :where([uc-simple-btn]) .uc-visual-drop-area {
1250
- position: absolute;
1251
- top: 0px;
1252
- left: 0px;
1253
- display: flex;
1254
- align-items: center;
1255
- justify-content: center;
1256
- width: 100%;
1257
- height: 100%;
1258
- padding: var(--uc-simple-btn-padding);
1259
- background-color: transparent;
1260
- color: transparent;
1261
- font-size: var(--uc-simple-btn-font-size);
1262
- border: 1px dashed var(--uc-simple-btn-foreground);
1263
- border-radius: inherit;
1264
- opacity: 0;
1265
- transition: opacity var(--uc-transition);
1266
- }
1267
-
1268
- :where([uc-simple-btn]) > uc-drop-area[drag-state="active"] .uc-visual-drop-area {
1269
- opacity: 1;
1270
- }
1271
- :where([uc-simple-btn]) > uc-drop-area[drag-state="inactive"] .uc-visual-drop-area {
1272
- opacity: 0;
1273
- }
1274
- :where([uc-simple-btn]) > uc-drop-area[drag-state="near"] .uc-visual-drop-area {
1275
- opacity: 1;
1276
- }
1277
- :where([uc-simple-btn]) > uc-drop-area[drag-state="over"] .uc-visual-drop-area {
1278
- opacity: 1;
1279
- }
1280
- }
1281
- @layer uc.components {
1282
- uc-plugin-activity-host {
1283
- position: relative;
1284
- display: flex;
1285
- width: 100%;
1286
- height: 100%;
1287
- overflow: hidden;
1288
- }
1289
- }
1290
- @layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
1291
- @layer uc.base {
1292
- :where([uc-wgt-common]) {
1293
- --cfg-init-activity: "start-from";
1294
- --cfg-done-activity: "";
1295
- }
1296
- }
1297
- @layer uc.base {
1298
- :where([uc-wgt-common]) {
1299
- /* Font */
1300
- --uc-font-family: system-ui;
1301
- --uc-font-size: 14px;
1302
- --uc-line-height: normal;
1303
- --uc-simple-btn-font-family: system-ui;
1304
- --uc-simple-btn-font-size: 14px;
1305
-
1306
- /* Sizes */
1307
- --uc-button-size: 32px;
1308
- --uc-preview-size: 32px;
1309
- --uc-padding: 10px;
1310
- --uc-radius: 8px;
1311
- --uc-transition: 0.2s ease;
1312
- --uc-dialog-width: 430px;
1313
- --uc-dialog-max-width: 920px;
1314
- --uc-dialog-max-height: 675px;
1315
- --uc-simple-btn-padding: 7px 14px;
1316
-
1317
- --uc-grid-col: 3;
1318
- --uc-grid-preview-image-height: auto;
1319
- --uc-grid-gap: calc(var(--uc-padding) / 2);
1320
- --uc-grid-aspect-ratio: 1 / 1;
1321
-
1322
- /* Default colors, in case of media query failure */
1323
- --uc-background: var(--uc-background-light);
1324
- --uc-foreground: var(--uc-foreground-light);
1325
- --uc-primary: var(--uc-primary-light);
1326
- --uc-primary-hover: var(--uc-primary-hover-light);
1327
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1328
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1329
- --uc-secondary: var(--uc-secondary-light);
1330
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1331
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1332
- --uc-muted: var(--uc-muted-light);
1333
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1334
- --uc-destructive: var(--uc-destructive-light);
1335
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1336
- --uc-border: var(--uc-border-light);
1337
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1338
- --uc-simple-btn: var(--uc-simple-btn-light);
1339
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1340
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1341
- }
1342
-
1343
- @supports not (color: oklch(0% 0 0)) {
1344
- :where([uc-wgt-common]) {
1345
- /* Light colors RGB fallback */
1346
- --uc-primary-rgb-light: 23 75 215;
1347
- --uc-primary-light: rgb(var(--uc-primary-rgb-light));
1348
- --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
1349
- --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
1350
- --uc-background-light: rgb(255 255 255);
1351
- --uc-foreground-light: rgb(24 24 24);
1352
- --uc-primary-foreground-light: #fff;
1353
- --uc-secondary-light: rgb(24 24 24 / 5%);
1354
- --uc-secondary-hover-light: rgb(24 24 24 / 8%);
1355
- --uc-secondary-foreground-light: rgb(24 24 24);
1356
- --uc-muted-light: rgb(245 245 245);
1357
- --uc-muted-foreground-light: rgb(113 113 113);
1358
- --uc-destructive-light: rgb(232 19 20 / 5%);
1359
- --uc-destructive-foreground-light: rgb(232 19 20);
1360
- --uc-border-light: rgb(228 228 232);
1361
- --uc-dialog-shadow-light: 0px 6px 20px rgb(0 0 0 / 10%);
1362
- --uc-simple-btn-light: rgb(235 235 235);
1363
- --uc-simple-btn-hover-light: rgb(228 228 228);
1364
- --uc-simple-btn-foreground-light: rgb(24 24 24);
1365
-
1366
- /* Dark colors RGB fallback */
1367
- --uc-primary-rgb-dark: 87 154 255;
1368
- --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
1369
- --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
1370
- --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
1371
- --uc-background-dark: rgb(27 27 27);
1372
- --uc-foreground-dark: rgb(225 225 225);
1373
- --uc-primary-foreground-dark: rgb(0 0 0);
1374
- --uc-secondary-dark: rgb(225 225 225 / 7%);
1375
- --uc-secondary-hover-dark: rgb(225 225 225 / 10%);
1376
- --uc-secondary-foreground-dark: rgb(225 225 225);
1377
- --uc-muted-dark: rgb(36 36 36);
1378
- --uc-muted-foreground-dark: rgb(152 152 152);
1379
- --uc-destructive-dark: rgb(244 90 79 / 10%);
1380
- --uc-destructive-foreground-dark: rgb(244 90 79);
1381
- --uc-border-dark: rgb(61 61 61);
1382
- --uc-dialog-shadow-dark: 0px 6px 20px rgb(0 0 0 / 25%);
1383
- --uc-simple-btn-dark: rgb(36 36 36);
1384
- --uc-simple-btn-hover-dark: rgb(43 43 43);
1385
- --uc-simple-btn-foreground-dark: rgb(255 255 255);
1386
- }
1387
- }
1388
-
1389
- @supports (color: oklch(0% 0 0)) {
1390
- :where([uc-wgt-common]) {
1391
- /* Light colors OKLCH */
1392
- --uc-primary-oklch-light: 47% 0.22 264; /* Quick customization: change this value to your brand color */
1393
- --uc-primary-light: oklch(var(--uc-primary-oklch-light));
1394
- --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
1395
- --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
1396
- --uc-background-light: oklch(100% 0 0);
1397
- --uc-foreground-light: oklch(21% 0 0);
1398
- --uc-primary-foreground-light: oklch(100% 0 0);
1399
- --uc-secondary-light: oklch(21% 0 0 / 0.05);
1400
- --uc-secondary-hover-light: oklch(21% 0 0 / 0.08);
1401
- --uc-secondary-foreground-light: oklch(21% 0 0);
1402
- --uc-muted-light: oklch(97% 0 0);
1403
- --uc-muted-foreground-light: oklch(40% 0 0);
1404
- --uc-destructive-light: oklch(59% 0.235 28.5 / 0.05);
1405
- --uc-destructive-foreground-light: oklch(59% 0.235 28.5);
1406
- --uc-border-light: oklch(92% 0 0);
1407
- --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / 0.1);
1408
- --uc-simple-btn-light: oklch(94% 0 0);
1409
- --uc-simple-btn-hover-light: oklch(92% 0 0);
1410
- --uc-simple-btn-foreground-light: oklch(20% 0 0);
1411
-
1412
- /* Dark colors OKLCH */
1413
- --uc-primary-oklch-dark: 69% 0.1768 258.4; /* Quick customization: change this value to your brand color */
1414
- --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
1415
- --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
1416
- --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
1417
- --uc-background-dark: oklch(22% 0 0);
1418
- --uc-foreground-dark: oklch(91% 0 0);
1419
- --uc-primary-foreground-dark: oklch(0% 0 0);
1420
- --uc-secondary-dark: oklch(91% 0 0 / 0.07);
1421
- --uc-secondary-hover-dark: oklch(91% 0 0 / 0.1);
1422
- --uc-secondary-foreground-dark: oklch(91% 0 0);
1423
- --uc-muted-dark: oklch(26% 0 0);
1424
- --uc-muted-foreground-dark: oklch(68% 0 0);
1425
- --uc-destructive-dark: oklch(67% 0.191 27.5 / 0.1);
1426
- --uc-destructive-foreground-dark: oklch(67% 0.191 27.5);
1427
- --uc-border-dark: oklch(36% 0 0);
1428
- --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / 0.25);
1429
- --uc-simple-btn-dark: oklch(26% 0 0);
1430
- --uc-simple-btn-hover-dark: oklch(29% 0 0);
1431
- --uc-simple-btn-foreground-dark: oklch(100% 0 0);
1432
- }
1433
- }
1434
-
1435
- @media only screen and (max-height: 600px) {
1436
- :where([uc-wgt-common]) {
1437
- --uc-dialog-max-height: 100%;
1438
- }
1439
- }
1440
-
1441
- @media only screen and (max-width: 680px) {
1442
- :where([uc-wgt-common]) {
1443
- --uc-grid-col: 2;
1444
- }
1445
- }
1446
-
1447
- @media only screen and (max-width: 430px) {
1448
- :where([uc-wgt-common]) {
1449
- --uc-dialog-max-width: 100vw;
1450
- --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
1451
- --uc-grid-col: 1;
1452
- }
1453
- }
1454
-
1455
- @media (prefers-color-scheme: light) {
1456
- :where([uc-wgt-common]) {
1457
- --uc-background: var(--uc-background-light);
1458
- --uc-foreground: var(--uc-foreground-light);
1459
- --uc-primary: var(--uc-primary-light);
1460
- --uc-primary-hover: var(--uc-primary-hover-light);
1461
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1462
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1463
- --uc-secondary: var(--uc-secondary-light);
1464
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1465
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1466
- --uc-muted: var(--uc-muted-light);
1467
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1468
- --uc-destructive: var(--uc-destructive-light);
1469
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1470
- --uc-border: var(--uc-border-light);
1471
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1472
- --uc-simple-btn: var(--uc-simple-btn-light);
1473
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1474
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1475
- }
1476
- }
1477
-
1478
- @media (prefers-color-scheme: dark) {
1479
- :where([uc-wgt-common]) {
1480
- --uc-background: var(--uc-background-dark);
1481
- --uc-foreground: var(--uc-foreground-dark);
1482
- --uc-primary: var(--uc-primary-dark);
1483
- --uc-primary-hover: var(--uc-primary-hover-dark);
1484
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
1485
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
1486
- --uc-secondary: var(--uc-secondary-dark);
1487
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
1488
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
1489
- --uc-muted: var(--uc-muted-dark);
1490
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
1491
- --uc-destructive: var(--uc-destructive-dark);
1492
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
1493
- --uc-border: var(--uc-border-dark);
1494
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
1495
- --uc-simple-btn: var(--uc-simple-btn-dark);
1496
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
1497
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
1498
- }
1499
- }
1500
-
1501
- :where(.uc-light) {
1502
- --uc-background: var(--uc-background-light);
1503
- --uc-foreground: var(--uc-foreground-light);
1504
- --uc-primary: var(--uc-primary-light);
1505
- --uc-primary-hover: var(--uc-primary-hover-light);
1506
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1507
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1508
- --uc-secondary: var(--uc-secondary-light);
1509
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1510
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1511
- --uc-muted: var(--uc-muted-light);
1512
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1513
- --uc-destructive: var(--uc-destructive-light);
1514
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1515
- --uc-border: var(--uc-border-light);
1516
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1517
- --uc-simple-btn: var(--uc-simple-btn-light);
1518
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1519
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1520
- }
1521
-
1522
- :where(.uc-dark) {
1523
- --uc-background: var(--uc-background-dark);
1524
- --uc-foreground: var(--uc-foreground-dark);
1525
- --uc-primary: var(--uc-primary-dark);
1526
- --uc-primary-hover: var(--uc-primary-hover-dark);
1527
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
1528
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
1529
- --uc-secondary: var(--uc-secondary-dark);
1530
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
1531
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
1532
- --uc-muted: var(--uc-muted-dark);
1533
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
1534
- --uc-destructive: var(--uc-destructive-dark);
1535
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
1536
- --uc-border: var(--uc-border-dark);
1537
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
1538
- --uc-simple-btn: var(--uc-simple-btn-dark);
1539
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
1540
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
1541
- }
1542
-
1543
- :where(.uc-purple) {
1544
- --uc-primary-oklch-light: 47% 0.22 300;
1545
- --uc-primary-oklch-dark: 69% 0.1768 300;
1546
- }
1547
-
1548
- :where(.uc-red) {
1549
- --uc-primary-oklch-light: 47% 0.21 21;
1550
- --uc-primary-oklch-dark: 71% 0.1768 21;
1551
- }
1552
-
1553
- :where(.uc-orange) {
1554
- --uc-primary-oklch-light: 47% 0.1376 51.88;
1555
- --uc-primary-oklch-dark: 69% 0.1768 51.88;
1556
- }
1557
-
1558
- :where(.uc-green) {
1559
- --uc-primary-oklch-light: 45% 0.14 130;
1560
- --uc-primary-oklch-dark: 69% 0.1768 130;
1561
- }
1562
-
1563
- :where(.uc-turquoise) {
1564
- --uc-primary-oklch-light: 45% 0.0854 174;
1565
- --uc-primary-oklch-dark: 69% 0.1768 174;
1566
- }
1567
-
1568
- :where(.uc-gray) {
1569
- --uc-primary-oklch-light: 10% 0 0;
1570
- --uc-primary-oklch-dark: 97% 0 0;
1571
- }
1572
-
1573
- :where(.uc-contrast) {
1574
- --uc-border-light: oklch(50% 0 0);
1575
- --uc-border-dark: oklch(50% 0 0);
1576
-
1577
- --uc-muted-light: oklch(98% 0 0);
1578
- --uc-muted-dark: oklch(16% 0 0);
1579
-
1580
- --uc-muted-foreground-light: oklch(20% 0 0);
1581
- --uc-muted-foreground-dark: oklch(80% 0 0);
1582
-
1583
- --uc-background-light: oklch(100% 0 0);
1584
- --uc-foreground-light: oklch(0% 0 0);
1585
-
1586
- --uc-background-dark: oklch(10% 0 0);
1587
- --uc-foreground-dark: oklch(100% 0 0);
1588
- }
1589
- }
1590
- @layer uc.base {
1591
- :where([uc-wgt-common]) {
1592
- color: var(--uc-foreground);
1593
- font-size: var(--uc-font-size);
1594
- line-height: var(--uc-line-height);
1595
- font-family: var(--uc-font-family);
1596
- }
1597
-
1598
- :where([uc-wgt-common]) * {
1599
- box-sizing: border-box;
1600
- }
1601
-
1602
- :where([uc-wgt-common]) button {
1603
- display: flex;
1604
- align-items: center;
1605
- justify-content: center;
1606
- height: var(--uc-button-size);
1607
- padding-right: 14px;
1608
- padding-left: 14px;
1609
- font-size: 1em;
1610
- font-family: inherit;
1611
- white-space: nowrap;
1612
- border: none;
1613
- border-radius: var(--uc-radius);
1614
- cursor: pointer;
1615
- user-select: none;
1616
- transition: background-color var(--uc-transition);
1617
- }
1618
-
1619
- :where([uc-wgt-common]) button:focus-visible {
1620
- outline-offset: 2px;
1621
- }
1622
-
1623
- :where([uc-wgt-common]) button.uc-primary-btn {
1624
- color: var(--uc-primary-foreground);
1625
- background-color: var(--uc-primary);
1626
- }
1627
-
1628
- :where([uc-wgt-common]) button.uc-primary-btn:hover {
1629
- background-color: var(--uc-primary-hover);
1630
- }
1631
-
1632
- :where([uc-wgt-common]) button.uc-secondary-btn {
1633
- color: var(--uc-secondary-foreground);
1634
- background-color: var(--uc-secondary);
1635
- }
1636
-
1637
- :where([uc-wgt-common]) button.uc-secondary-btn:hover {
1638
- background-color: var(--uc-secondary-hover);
1639
- }
1640
-
1641
- :where([uc-wgt-common].uc-contrast) button.uc-secondary-btn {
1642
- border: 1px solid var(--uc-border);
1643
- }
1644
-
1645
- :where([uc-wgt-common]) button.uc-mini-btn {
1646
- height: var(--uc-button-size);
1647
- padding: 0;
1648
- background-color: transparent;
1649
- color: var(--uc-secondary-foreground);
1650
- }
1651
-
1652
- :where([uc-wgt-common]) button.uc-mini-btn:hover {
1653
- background-color: var(--uc-secondary);
1654
- }
1655
-
1656
- :where([uc-wgt-common]) :is(button[disabled], button.uc-primary-btn[disabled], button.uc-secondary-btn[disabled]) {
1657
- opacity: 0.5;
1658
- pointer-events: none;
1659
- }
1660
-
1661
- :where([uc-wgt-common]) a {
1662
- color: var(--uc-primary);
1663
- text-decoration: none;
1664
- }
1665
-
1666
- /* TODO: if we're using disabled <a> somewhere, we should stop */
1667
- :where([uc-wgt-common]) a[disabled] {
1668
- pointer-events: none;
1669
- }
1670
-
1671
- :where([uc-wgt-common]) input[type="text"] {
1672
- display: flex;
1673
- width: 100%;
1674
- height: var(--uc-button-size);
1675
- padding-right: 10px;
1676
- padding-left: 10px;
1677
- color: var(--uc-foreground);
1678
- font-size: 1em;
1679
- font-family: inherit;
1680
- background-color: var(--uc-background);
1681
- border: 1px solid var(--uc-border);
1682
- outline: 1px solid transparent;
1683
- border-radius: var(--uc-radius);
1684
- transition:
1685
- border-color var(--uc-transition),
1686
- outline-color var(--uc-transition);
1687
- }
1688
-
1689
- :where([uc-wgt-common]) input[type="text"]::placeholder {
1690
- color: var(--uc-muted-foreground);
1691
- }
1692
-
1693
- :where([uc-wgt-common]) input[type="text"]:focus {
1694
- outline-color: var(--uc-primary-hover);
1695
- border-color: var(--uc-primary-hover);
1696
- }
1697
-
1698
- /* TODO: check if there's any necessity of disabled input */
1699
- :where([uc-wgt-common]) input[disabled] {
1700
- opacity: 0.6;
1701
- pointer-events: none;
1702
- }
1703
- :where([uc-wgt-common]) uc-select[disabled],
1704
- :where([uc-wgt-common]) select[disabled] {
1705
- opacity: 0.6;
1706
- pointer-events: none;
1707
- }
1708
- }
1709
- @layer uc.rules {
1710
- :where([uc-wgt-common]) [hidden] {
1711
- display: none;
1712
- }
1713
-
1714
- :where([uc-wgt-common]) [activity]:not([active], .active) {
1715
- display: none;
1716
- }
1717
-
1718
- :where([uc-wgt-common]) dialog:not([open]) [activity] {
1719
- display: none;
1720
- }
1721
- }
1722
- @layer uc.post-reset {
1723
- :where([uc-wgt-common]) uc-source-btn[type] {
1724
- all: unset;
1725
- }
1726
- }
1727
- @layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
1728
- @layer uc.base {
1729
- :where([uc-wgt-common]) {
1730
- --cfg-init-activity: "start-from";
1731
- --cfg-done-activity: "";
1732
- }
1733
- }
1734
- @layer uc.base {
1735
- :where([uc-wgt-common]) {
1736
- /* Font */
1737
- --uc-font-family: system-ui;
1738
- --uc-font-size: 14px;
1739
- --uc-line-height: normal;
1740
- --uc-simple-btn-font-family: system-ui;
1741
- --uc-simple-btn-font-size: 14px;
1742
-
1743
- /* Sizes */
1744
- --uc-button-size: 32px;
1745
- --uc-preview-size: 32px;
1746
- --uc-padding: 10px;
1747
- --uc-radius: 8px;
1748
- --uc-transition: 0.2s ease;
1749
- --uc-dialog-width: 430px;
1750
- --uc-dialog-max-width: 920px;
1751
- --uc-dialog-max-height: 675px;
1752
- --uc-simple-btn-padding: 7px 14px;
1753
-
1754
- --uc-grid-col: 3;
1755
- --uc-grid-preview-image-height: auto;
1756
- --uc-grid-gap: calc(var(--uc-padding) / 2);
1757
- --uc-grid-aspect-ratio: 1 / 1;
1758
-
1759
- /* Default colors, in case of media query failure */
1760
- --uc-background: var(--uc-background-light);
1761
- --uc-foreground: var(--uc-foreground-light);
1762
- --uc-primary: var(--uc-primary-light);
1763
- --uc-primary-hover: var(--uc-primary-hover-light);
1764
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1765
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1766
- --uc-secondary: var(--uc-secondary-light);
1767
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1768
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1769
- --uc-muted: var(--uc-muted-light);
1770
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1771
- --uc-destructive: var(--uc-destructive-light);
1772
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1773
- --uc-border: var(--uc-border-light);
1774
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1775
- --uc-simple-btn: var(--uc-simple-btn-light);
1776
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1777
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1778
- }
1779
-
1780
- @supports not (color: oklch(0% 0 0)) {
1781
- :where([uc-wgt-common]) {
1782
- /* Light colors RGB fallback */
1783
- --uc-primary-rgb-light: 23 75 215;
1784
- --uc-primary-light: rgb(var(--uc-primary-rgb-light));
1785
- --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
1786
- --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
1787
- --uc-background-light: rgb(255 255 255);
1788
- --uc-foreground-light: rgb(24 24 24);
1789
- --uc-primary-foreground-light: #fff;
1790
- --uc-secondary-light: rgb(24 24 24 / 5%);
1791
- --uc-secondary-hover-light: rgb(24 24 24 / 8%);
1792
- --uc-secondary-foreground-light: rgb(24 24 24);
1793
- --uc-muted-light: rgb(245 245 245);
1794
- --uc-muted-foreground-light: rgb(113 113 113);
1795
- --uc-destructive-light: rgb(232 19 20 / 5%);
1796
- --uc-destructive-foreground-light: rgb(232 19 20);
1797
- --uc-border-light: rgb(228 228 232);
1798
- --uc-dialog-shadow-light: 0px 6px 20px rgb(0 0 0 / 10%);
1799
- --uc-simple-btn-light: rgb(235 235 235);
1800
- --uc-simple-btn-hover-light: rgb(228 228 228);
1801
- --uc-simple-btn-foreground-light: rgb(24 24 24);
1802
-
1803
- /* Dark colors RGB fallback */
1804
- --uc-primary-rgb-dark: 87 154 255;
1805
- --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
1806
- --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
1807
- --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
1808
- --uc-background-dark: rgb(27 27 27);
1809
- --uc-foreground-dark: rgb(225 225 225);
1810
- --uc-primary-foreground-dark: rgb(0 0 0);
1811
- --uc-secondary-dark: rgb(225 225 225 / 7%);
1812
- --uc-secondary-hover-dark: rgb(225 225 225 / 10%);
1813
- --uc-secondary-foreground-dark: rgb(225 225 225);
1814
- --uc-muted-dark: rgb(36 36 36);
1815
- --uc-muted-foreground-dark: rgb(152 152 152);
1816
- --uc-destructive-dark: rgb(244 90 79 / 10%);
1817
- --uc-destructive-foreground-dark: rgb(244 90 79);
1818
- --uc-border-dark: rgb(61 61 61);
1819
- --uc-dialog-shadow-dark: 0px 6px 20px rgb(0 0 0 / 25%);
1820
- --uc-simple-btn-dark: rgb(36 36 36);
1821
- --uc-simple-btn-hover-dark: rgb(43 43 43);
1822
- --uc-simple-btn-foreground-dark: rgb(255 255 255);
1823
- }
1824
- }
1825
-
1826
- @supports (color: oklch(0% 0 0)) {
1827
- :where([uc-wgt-common]) {
1828
- /* Light colors OKLCH */
1829
- --uc-primary-oklch-light: 47% 0.22 264; /* Quick customization: change this value to your brand color */
1830
- --uc-primary-light: oklch(var(--uc-primary-oklch-light));
1831
- --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
1832
- --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
1833
- --uc-background-light: oklch(100% 0 0);
1834
- --uc-foreground-light: oklch(21% 0 0);
1835
- --uc-primary-foreground-light: oklch(100% 0 0);
1836
- --uc-secondary-light: oklch(21% 0 0 / 0.05);
1837
- --uc-secondary-hover-light: oklch(21% 0 0 / 0.08);
1838
- --uc-secondary-foreground-light: oklch(21% 0 0);
1839
- --uc-muted-light: oklch(97% 0 0);
1840
- --uc-muted-foreground-light: oklch(40% 0 0);
1841
- --uc-destructive-light: oklch(59% 0.235 28.5 / 0.05);
1842
- --uc-destructive-foreground-light: oklch(59% 0.235 28.5);
1843
- --uc-border-light: oklch(92% 0 0);
1844
- --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / 0.1);
1845
- --uc-simple-btn-light: oklch(94% 0 0);
1846
- --uc-simple-btn-hover-light: oklch(92% 0 0);
1847
- --uc-simple-btn-foreground-light: oklch(20% 0 0);
1848
-
1849
- /* Dark colors OKLCH */
1850
- --uc-primary-oklch-dark: 69% 0.1768 258.4; /* Quick customization: change this value to your brand color */
1851
- --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
1852
- --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
1853
- --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
1854
- --uc-background-dark: oklch(22% 0 0);
1855
- --uc-foreground-dark: oklch(91% 0 0);
1856
- --uc-primary-foreground-dark: oklch(0% 0 0);
1857
- --uc-secondary-dark: oklch(91% 0 0 / 0.07);
1858
- --uc-secondary-hover-dark: oklch(91% 0 0 / 0.1);
1859
- --uc-secondary-foreground-dark: oklch(91% 0 0);
1860
- --uc-muted-dark: oklch(26% 0 0);
1861
- --uc-muted-foreground-dark: oklch(68% 0 0);
1862
- --uc-destructive-dark: oklch(67% 0.191 27.5 / 0.1);
1863
- --uc-destructive-foreground-dark: oklch(67% 0.191 27.5);
1864
- --uc-border-dark: oklch(36% 0 0);
1865
- --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / 0.25);
1866
- --uc-simple-btn-dark: oklch(26% 0 0);
1867
- --uc-simple-btn-hover-dark: oklch(29% 0 0);
1868
- --uc-simple-btn-foreground-dark: oklch(100% 0 0);
1869
- }
1870
- }
1871
-
1872
- @media only screen and (max-height: 600px) {
1873
- :where([uc-wgt-common]) {
1874
- --uc-dialog-max-height: 100%;
1875
- }
1876
- }
1877
-
1878
- @media only screen and (max-width: 680px) {
1879
- :where([uc-wgt-common]) {
1880
- --uc-grid-col: 2;
1881
- }
1882
- }
1883
-
1884
- @media only screen and (max-width: 430px) {
1885
- :where([uc-wgt-common]) {
1886
- --uc-dialog-max-width: 100vw;
1887
- --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
1888
- --uc-grid-col: 1;
1889
- }
1890
- }
1891
-
1892
- @media (prefers-color-scheme: light) {
1893
- :where([uc-wgt-common]) {
1894
- --uc-background: var(--uc-background-light);
1895
- --uc-foreground: var(--uc-foreground-light);
1896
- --uc-primary: var(--uc-primary-light);
1897
- --uc-primary-hover: var(--uc-primary-hover-light);
1898
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1899
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1900
- --uc-secondary: var(--uc-secondary-light);
1901
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1902
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1903
- --uc-muted: var(--uc-muted-light);
1904
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1905
- --uc-destructive: var(--uc-destructive-light);
1906
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1907
- --uc-border: var(--uc-border-light);
1908
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1909
- --uc-simple-btn: var(--uc-simple-btn-light);
1910
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1911
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1912
- }
1913
- }
1914
-
1915
- @media (prefers-color-scheme: dark) {
1916
- :where([uc-wgt-common]) {
1917
- --uc-background: var(--uc-background-dark);
1918
- --uc-foreground: var(--uc-foreground-dark);
1919
- --uc-primary: var(--uc-primary-dark);
1920
- --uc-primary-hover: var(--uc-primary-hover-dark);
1921
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
1922
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
1923
- --uc-secondary: var(--uc-secondary-dark);
1924
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
1925
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
1926
- --uc-muted: var(--uc-muted-dark);
1927
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
1928
- --uc-destructive: var(--uc-destructive-dark);
1929
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
1930
- --uc-border: var(--uc-border-dark);
1931
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
1932
- --uc-simple-btn: var(--uc-simple-btn-dark);
1933
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
1934
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
1935
- }
1936
- }
1937
-
1938
- :where(.uc-light) {
1939
- --uc-background: var(--uc-background-light);
1940
- --uc-foreground: var(--uc-foreground-light);
1941
- --uc-primary: var(--uc-primary-light);
1942
- --uc-primary-hover: var(--uc-primary-hover-light);
1943
- --uc-primary-transparent: var(--uc-primary-transparent-light);
1944
- --uc-primary-foreground: var(--uc-primary-foreground-light);
1945
- --uc-secondary: var(--uc-secondary-light);
1946
- --uc-secondary-hover: var(--uc-secondary-hover-light);
1947
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
1948
- --uc-muted: var(--uc-muted-light);
1949
- --uc-muted-foreground: var(--uc-muted-foreground-light);
1950
- --uc-destructive: var(--uc-destructive-light);
1951
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
1952
- --uc-border: var(--uc-border-light);
1953
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
1954
- --uc-simple-btn: var(--uc-simple-btn-light);
1955
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
1956
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
1957
- }
1958
-
1959
- :where(.uc-dark) {
1960
- --uc-background: var(--uc-background-dark);
1961
- --uc-foreground: var(--uc-foreground-dark);
1962
- --uc-primary: var(--uc-primary-dark);
1963
- --uc-primary-hover: var(--uc-primary-hover-dark);
1964
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
1965
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
1966
- --uc-secondary: var(--uc-secondary-dark);
1967
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
1968
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
1969
- --uc-muted: var(--uc-muted-dark);
1970
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
1971
- --uc-destructive: var(--uc-destructive-dark);
1972
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
1973
- --uc-border: var(--uc-border-dark);
1974
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
1975
- --uc-simple-btn: var(--uc-simple-btn-dark);
1976
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
1977
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
1978
- }
1979
-
1980
- :where(.uc-purple) {
1981
- --uc-primary-oklch-light: 47% 0.22 300;
1982
- --uc-primary-oklch-dark: 69% 0.1768 300;
1983
- }
1984
-
1985
- :where(.uc-red) {
1986
- --uc-primary-oklch-light: 47% 0.21 21;
1987
- --uc-primary-oklch-dark: 71% 0.1768 21;
1988
- }
1989
-
1990
- :where(.uc-orange) {
1991
- --uc-primary-oklch-light: 47% 0.1376 51.88;
1992
- --uc-primary-oklch-dark: 69% 0.1768 51.88;
1993
- }
1994
-
1995
- :where(.uc-green) {
1996
- --uc-primary-oklch-light: 45% 0.14 130;
1997
- --uc-primary-oklch-dark: 69% 0.1768 130;
1998
- }
1999
-
2000
- :where(.uc-turquoise) {
2001
- --uc-primary-oklch-light: 45% 0.0854 174;
2002
- --uc-primary-oklch-dark: 69% 0.1768 174;
2003
- }
2004
-
2005
- :where(.uc-gray) {
2006
- --uc-primary-oklch-light: 10% 0 0;
2007
- --uc-primary-oklch-dark: 97% 0 0;
2008
- }
2009
-
2010
- :where(.uc-contrast) {
2011
- --uc-border-light: oklch(50% 0 0);
2012
- --uc-border-dark: oklch(50% 0 0);
2013
-
2014
- --uc-muted-light: oklch(98% 0 0);
2015
- --uc-muted-dark: oklch(16% 0 0);
2016
-
2017
- --uc-muted-foreground-light: oklch(20% 0 0);
2018
- --uc-muted-foreground-dark: oklch(80% 0 0);
2019
-
2020
- --uc-background-light: oklch(100% 0 0);
2021
- --uc-foreground-light: oklch(0% 0 0);
2022
-
2023
- --uc-background-dark: oklch(10% 0 0);
2024
- --uc-foreground-dark: oklch(100% 0 0);
2025
- }
2026
- }
2027
- @layer uc.base {
2028
- :where([uc-wgt-common]) {
2029
- color: var(--uc-foreground);
2030
- font-size: var(--uc-font-size);
2031
- line-height: var(--uc-line-height);
2032
- font-family: var(--uc-font-family);
2033
- }
2034
-
2035
- :where([uc-wgt-common]) * {
2036
- box-sizing: border-box;
2037
- }
2038
-
2039
- :where([uc-wgt-common]) button {
2040
- display: flex;
2041
- align-items: center;
2042
- justify-content: center;
2043
- height: var(--uc-button-size);
2044
- padding-right: 14px;
2045
- padding-left: 14px;
2046
- font-size: 1em;
2047
- font-family: inherit;
2048
- white-space: nowrap;
2049
- border: none;
2050
- border-radius: var(--uc-radius);
2051
- cursor: pointer;
2052
- user-select: none;
2053
- transition: background-color var(--uc-transition);
2054
- }
2055
-
2056
- :where([uc-wgt-common]) button:focus-visible {
2057
- outline-offset: 2px;
2058
- }
2059
-
2060
- :where([uc-wgt-common]) button.uc-primary-btn {
2061
- color: var(--uc-primary-foreground);
2062
- background-color: var(--uc-primary);
2063
- }
2064
-
2065
- :where([uc-wgt-common]) button.uc-primary-btn:hover {
2066
- background-color: var(--uc-primary-hover);
2067
- }
2068
-
2069
- :where([uc-wgt-common]) button.uc-secondary-btn {
2070
- color: var(--uc-secondary-foreground);
2071
- background-color: var(--uc-secondary);
2072
- }
2073
-
2074
- :where([uc-wgt-common]) button.uc-secondary-btn:hover {
2075
- background-color: var(--uc-secondary-hover);
2076
- }
2077
-
2078
- :where([uc-wgt-common].uc-contrast) button.uc-secondary-btn {
2079
- border: 1px solid var(--uc-border);
2080
- }
2081
-
2082
- :where([uc-wgt-common]) button.uc-mini-btn {
2083
- height: var(--uc-button-size);
2084
- padding: 0;
2085
- background-color: transparent;
2086
- color: var(--uc-secondary-foreground);
2087
- }
2088
-
2089
- :where([uc-wgt-common]) button.uc-mini-btn:hover {
2090
- background-color: var(--uc-secondary);
2091
- }
2092
-
2093
- :where([uc-wgt-common]) :is(button[disabled], button.uc-primary-btn[disabled], button.uc-secondary-btn[disabled]) {
2094
- opacity: 0.5;
2095
- pointer-events: none;
2096
- }
2097
-
2098
- :where([uc-wgt-common]) a {
2099
- color: var(--uc-primary);
2100
- text-decoration: none;
2101
- }
2102
-
2103
- /* TODO: if we're using disabled <a> somewhere, we should stop */
2104
- :where([uc-wgt-common]) a[disabled] {
2105
- pointer-events: none;
2106
- }
2107
-
2108
- :where([uc-wgt-common]) input[type="text"] {
2109
- display: flex;
2110
- width: 100%;
2111
- height: var(--uc-button-size);
2112
- padding-right: 10px;
2113
- padding-left: 10px;
2114
- color: var(--uc-foreground);
2115
- font-size: 1em;
2116
- font-family: inherit;
2117
- background-color: var(--uc-background);
2118
- border: 1px solid var(--uc-border);
2119
- outline: 1px solid transparent;
2120
- border-radius: var(--uc-radius);
2121
- transition:
2122
- border-color var(--uc-transition),
2123
- outline-color var(--uc-transition);
2124
- }
2125
-
2126
- :where([uc-wgt-common]) input[type="text"]::placeholder {
2127
- color: var(--uc-muted-foreground);
2128
- }
2129
-
2130
- :where([uc-wgt-common]) input[type="text"]:focus {
2131
- outline-color: var(--uc-primary-hover);
2132
- border-color: var(--uc-primary-hover);
2133
- }
2134
-
2135
- /* TODO: check if there's any necessity of disabled input */
2136
- :where([uc-wgt-common]) input[disabled] {
2137
- opacity: 0.6;
2138
- pointer-events: none;
2139
- }
2140
- :where([uc-wgt-common]) uc-select[disabled],
2141
- :where([uc-wgt-common]) select[disabled] {
2142
- opacity: 0.6;
2143
- pointer-events: none;
2144
- }
2145
- }
2146
- @layer uc.rules {
2147
- :where([uc-wgt-common]) [hidden] {
2148
- display: none;
2149
- }
2150
-
2151
- :where([uc-wgt-common]) [activity]:not([active], .active) {
2152
- display: none;
2153
- }
2154
-
2155
- :where([uc-wgt-common]) dialog:not([open]) [activity] {
2156
- display: none;
2157
- }
2158
- }
2159
- @layer uc.post-reset {
2160
- :where([uc-wgt-common]) uc-source-btn[type] {
2161
- all: unset;
2162
- }
2163
- }
2164
- @layer uc.solutions {
2165
- [uc-file-uploader-inline] uc-start-from {
2166
- height: 100%;
2167
- container-type: inline-size;
2168
- }
2169
-
2170
- [uc-file-uploader-inline] {
2171
- --cfg-done-activity: "start-from";
2172
- --cfg-init-activity: "start-from";
2173
-
2174
- flex: 1;
2175
- }
2176
-
2177
- [uc-file-uploader-inline] uc-activity-header::after {
2178
- width: var(--uc-button-size);
2179
- height: var(--uc-button-size);
2180
- content: "";
2181
- }
2182
-
2183
- [uc-file-uploader-inline] uc-activity-header .uc-close-btn {
2184
- display: none;
2185
- }
2186
-
2187
- [uc-file-uploader-inline] uc-copyright .uc-credits {
2188
- position: static;
2189
- }
2190
-
2191
- @container (min-width: 500px) {
2192
- [uc-file-uploader-inline] uc-start-from .uc-content {
2193
- grid-template-columns: 1fr max-content;
2194
- grid-template-rows: 1fr max-content;
2195
- height: 100%;
2196
- }
2197
-
2198
- [uc-file-uploader-inline] uc-start-from uc-copyright {
2199
- grid-column: 2;
2200
- }
2201
-
2202
- [uc-file-uploader-inline] uc-start-from uc-drop-area {
2203
- grid-row: span 3;
2204
- }
2205
-
2206
- [uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]) uc-drop-area {
2207
- grid-row: span 2;
2208
- }
2209
-
2210
- [uc-file-uploader-inline] uc-start-from:has(.uc-cancel-btn[hidden]) uc-drop-area {
2211
- grid-row: span 2;
2212
- }
2213
-
2214
- [uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]):has(.uc-cancel-btn[hidden]) uc-drop-area {
2215
- grid-row: span 1;
2216
- }
2217
- }
2218
- }
2219
- @layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
2220
- @layer uc.base {
2221
- :where([uc-wgt-common]) {
2222
- --cfg-init-activity: "start-from";
2223
- --cfg-done-activity: "";
2224
- }
2225
- }
2226
- @layer uc.base {
2227
- :where([uc-wgt-common]) {
2228
- /* Font */
2229
- --uc-font-family: system-ui;
2230
- --uc-font-size: 14px;
2231
- --uc-line-height: normal;
2232
- --uc-simple-btn-font-family: system-ui;
2233
- --uc-simple-btn-font-size: 14px;
2234
-
2235
- /* Sizes */
2236
- --uc-button-size: 32px;
2237
- --uc-preview-size: 32px;
2238
- --uc-padding: 10px;
2239
- --uc-radius: 8px;
2240
- --uc-transition: 0.2s ease;
2241
- --uc-dialog-width: 430px;
2242
- --uc-dialog-max-width: 920px;
2243
- --uc-dialog-max-height: 675px;
2244
- --uc-simple-btn-padding: 7px 14px;
2245
-
2246
- --uc-grid-col: 3;
2247
- --uc-grid-preview-image-height: auto;
2248
- --uc-grid-gap: calc(var(--uc-padding) / 2);
2249
- --uc-grid-aspect-ratio: 1 / 1;
2250
-
2251
- /* Default colors, in case of media query failure */
2252
- --uc-background: var(--uc-background-light);
2253
- --uc-foreground: var(--uc-foreground-light);
2254
- --uc-primary: var(--uc-primary-light);
2255
- --uc-primary-hover: var(--uc-primary-hover-light);
2256
- --uc-primary-transparent: var(--uc-primary-transparent-light);
2257
- --uc-primary-foreground: var(--uc-primary-foreground-light);
2258
- --uc-secondary: var(--uc-secondary-light);
2259
- --uc-secondary-hover: var(--uc-secondary-hover-light);
2260
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
2261
- --uc-muted: var(--uc-muted-light);
2262
- --uc-muted-foreground: var(--uc-muted-foreground-light);
2263
- --uc-destructive: var(--uc-destructive-light);
2264
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
2265
- --uc-border: var(--uc-border-light);
2266
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
2267
- --uc-simple-btn: var(--uc-simple-btn-light);
2268
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
2269
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
2270
- }
2271
-
2272
- @supports not (color: oklch(0% 0 0)) {
2273
- :where([uc-wgt-common]) {
2274
- /* Light colors RGB fallback */
2275
- --uc-primary-rgb-light: 23 75 215;
2276
- --uc-primary-light: rgb(var(--uc-primary-rgb-light));
2277
- --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
2278
- --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
2279
- --uc-background-light: rgb(255 255 255);
2280
- --uc-foreground-light: rgb(24 24 24);
2281
- --uc-primary-foreground-light: #fff;
2282
- --uc-secondary-light: rgb(24 24 24 / 5%);
2283
- --uc-secondary-hover-light: rgb(24 24 24 / 8%);
2284
- --uc-secondary-foreground-light: rgb(24 24 24);
2285
- --uc-muted-light: rgb(245 245 245);
2286
- --uc-muted-foreground-light: rgb(113 113 113);
2287
- --uc-destructive-light: rgb(232 19 20 / 5%);
2288
- --uc-destructive-foreground-light: rgb(232 19 20);
2289
- --uc-border-light: rgb(228 228 232);
2290
- --uc-dialog-shadow-light: 0px 6px 20px rgb(0 0 0 / 10%);
2291
- --uc-simple-btn-light: rgb(235 235 235);
2292
- --uc-simple-btn-hover-light: rgb(228 228 228);
2293
- --uc-simple-btn-foreground-light: rgb(24 24 24);
2294
-
2295
- /* Dark colors RGB fallback */
2296
- --uc-primary-rgb-dark: 87 154 255;
2297
- --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
2298
- --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
2299
- --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
2300
- --uc-background-dark: rgb(27 27 27);
2301
- --uc-foreground-dark: rgb(225 225 225);
2302
- --uc-primary-foreground-dark: rgb(0 0 0);
2303
- --uc-secondary-dark: rgb(225 225 225 / 7%);
2304
- --uc-secondary-hover-dark: rgb(225 225 225 / 10%);
2305
- --uc-secondary-foreground-dark: rgb(225 225 225);
2306
- --uc-muted-dark: rgb(36 36 36);
2307
- --uc-muted-foreground-dark: rgb(152 152 152);
2308
- --uc-destructive-dark: rgb(244 90 79 / 10%);
2309
- --uc-destructive-foreground-dark: rgb(244 90 79);
2310
- --uc-border-dark: rgb(61 61 61);
2311
- --uc-dialog-shadow-dark: 0px 6px 20px rgb(0 0 0 / 25%);
2312
- --uc-simple-btn-dark: rgb(36 36 36);
2313
- --uc-simple-btn-hover-dark: rgb(43 43 43);
2314
- --uc-simple-btn-foreground-dark: rgb(255 255 255);
2315
- }
2316
- }
2317
-
2318
- @supports (color: oklch(0% 0 0)) {
2319
- :where([uc-wgt-common]) {
2320
- /* Light colors OKLCH */
2321
- --uc-primary-oklch-light: 47% 0.22 264; /* Quick customization: change this value to your brand color */
2322
- --uc-primary-light: oklch(var(--uc-primary-oklch-light));
2323
- --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
2324
- --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
2325
- --uc-background-light: oklch(100% 0 0);
2326
- --uc-foreground-light: oklch(21% 0 0);
2327
- --uc-primary-foreground-light: oklch(100% 0 0);
2328
- --uc-secondary-light: oklch(21% 0 0 / 0.05);
2329
- --uc-secondary-hover-light: oklch(21% 0 0 / 0.08);
2330
- --uc-secondary-foreground-light: oklch(21% 0 0);
2331
- --uc-muted-light: oklch(97% 0 0);
2332
- --uc-muted-foreground-light: oklch(40% 0 0);
2333
- --uc-destructive-light: oklch(59% 0.235 28.5 / 0.05);
2334
- --uc-destructive-foreground-light: oklch(59% 0.235 28.5);
2335
- --uc-border-light: oklch(92% 0 0);
2336
- --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / 0.1);
2337
- --uc-simple-btn-light: oklch(94% 0 0);
2338
- --uc-simple-btn-hover-light: oklch(92% 0 0);
2339
- --uc-simple-btn-foreground-light: oklch(20% 0 0);
2340
-
2341
- /* Dark colors OKLCH */
2342
- --uc-primary-oklch-dark: 69% 0.1768 258.4; /* Quick customization: change this value to your brand color */
2343
- --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
2344
- --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
2345
- --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
2346
- --uc-background-dark: oklch(22% 0 0);
2347
- --uc-foreground-dark: oklch(91% 0 0);
2348
- --uc-primary-foreground-dark: oklch(0% 0 0);
2349
- --uc-secondary-dark: oklch(91% 0 0 / 0.07);
2350
- --uc-secondary-hover-dark: oklch(91% 0 0 / 0.1);
2351
- --uc-secondary-foreground-dark: oklch(91% 0 0);
2352
- --uc-muted-dark: oklch(26% 0 0);
2353
- --uc-muted-foreground-dark: oklch(68% 0 0);
2354
- --uc-destructive-dark: oklch(67% 0.191 27.5 / 0.1);
2355
- --uc-destructive-foreground-dark: oklch(67% 0.191 27.5);
2356
- --uc-border-dark: oklch(36% 0 0);
2357
- --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / 0.25);
2358
- --uc-simple-btn-dark: oklch(26% 0 0);
2359
- --uc-simple-btn-hover-dark: oklch(29% 0 0);
2360
- --uc-simple-btn-foreground-dark: oklch(100% 0 0);
2361
- }
2362
- }
2363
-
2364
- @media only screen and (max-height: 600px) {
2365
- :where([uc-wgt-common]) {
2366
- --uc-dialog-max-height: 100%;
2367
- }
2368
- }
2369
-
2370
- @media only screen and (max-width: 680px) {
2371
- :where([uc-wgt-common]) {
2372
- --uc-grid-col: 2;
2373
- }
2374
- }
2375
-
2376
- @media only screen and (max-width: 430px) {
2377
- :where([uc-wgt-common]) {
2378
- --uc-dialog-max-width: 100vw;
2379
- --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
2380
- --uc-grid-col: 1;
2381
- }
2382
- }
2383
-
2384
- @media (prefers-color-scheme: light) {
2385
- :where([uc-wgt-common]) {
2386
- --uc-background: var(--uc-background-light);
2387
- --uc-foreground: var(--uc-foreground-light);
2388
- --uc-primary: var(--uc-primary-light);
2389
- --uc-primary-hover: var(--uc-primary-hover-light);
2390
- --uc-primary-transparent: var(--uc-primary-transparent-light);
2391
- --uc-primary-foreground: var(--uc-primary-foreground-light);
2392
- --uc-secondary: var(--uc-secondary-light);
2393
- --uc-secondary-hover: var(--uc-secondary-hover-light);
2394
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
2395
- --uc-muted: var(--uc-muted-light);
2396
- --uc-muted-foreground: var(--uc-muted-foreground-light);
2397
- --uc-destructive: var(--uc-destructive-light);
2398
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
2399
- --uc-border: var(--uc-border-light);
2400
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
2401
- --uc-simple-btn: var(--uc-simple-btn-light);
2402
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
2403
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
2404
- }
2405
- }
2406
-
2407
- @media (prefers-color-scheme: dark) {
2408
- :where([uc-wgt-common]) {
2409
- --uc-background: var(--uc-background-dark);
2410
- --uc-foreground: var(--uc-foreground-dark);
2411
- --uc-primary: var(--uc-primary-dark);
2412
- --uc-primary-hover: var(--uc-primary-hover-dark);
2413
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
2414
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
2415
- --uc-secondary: var(--uc-secondary-dark);
2416
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
2417
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
2418
- --uc-muted: var(--uc-muted-dark);
2419
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
2420
- --uc-destructive: var(--uc-destructive-dark);
2421
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
2422
- --uc-border: var(--uc-border-dark);
2423
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
2424
- --uc-simple-btn: var(--uc-simple-btn-dark);
2425
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
2426
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
2427
- }
2428
- }
2429
-
2430
- :where(.uc-light) {
2431
- --uc-background: var(--uc-background-light);
2432
- --uc-foreground: var(--uc-foreground-light);
2433
- --uc-primary: var(--uc-primary-light);
2434
- --uc-primary-hover: var(--uc-primary-hover-light);
2435
- --uc-primary-transparent: var(--uc-primary-transparent-light);
2436
- --uc-primary-foreground: var(--uc-primary-foreground-light);
2437
- --uc-secondary: var(--uc-secondary-light);
2438
- --uc-secondary-hover: var(--uc-secondary-hover-light);
2439
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
2440
- --uc-muted: var(--uc-muted-light);
2441
- --uc-muted-foreground: var(--uc-muted-foreground-light);
2442
- --uc-destructive: var(--uc-destructive-light);
2443
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
2444
- --uc-border: var(--uc-border-light);
2445
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
2446
- --uc-simple-btn: var(--uc-simple-btn-light);
2447
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
2448
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
2449
- }
2450
-
2451
- :where(.uc-dark) {
2452
- --uc-background: var(--uc-background-dark);
2453
- --uc-foreground: var(--uc-foreground-dark);
2454
- --uc-primary: var(--uc-primary-dark);
2455
- --uc-primary-hover: var(--uc-primary-hover-dark);
2456
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
2457
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
2458
- --uc-secondary: var(--uc-secondary-dark);
2459
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
2460
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
2461
- --uc-muted: var(--uc-muted-dark);
2462
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
2463
- --uc-destructive: var(--uc-destructive-dark);
2464
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
2465
- --uc-border: var(--uc-border-dark);
2466
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
2467
- --uc-simple-btn: var(--uc-simple-btn-dark);
2468
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
2469
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
2470
- }
2471
-
2472
- :where(.uc-purple) {
2473
- --uc-primary-oklch-light: 47% 0.22 300;
2474
- --uc-primary-oklch-dark: 69% 0.1768 300;
2475
- }
2476
-
2477
- :where(.uc-red) {
2478
- --uc-primary-oklch-light: 47% 0.21 21;
2479
- --uc-primary-oklch-dark: 71% 0.1768 21;
2480
- }
2481
-
2482
- :where(.uc-orange) {
2483
- --uc-primary-oklch-light: 47% 0.1376 51.88;
2484
- --uc-primary-oklch-dark: 69% 0.1768 51.88;
2485
- }
2486
-
2487
- :where(.uc-green) {
2488
- --uc-primary-oklch-light: 45% 0.14 130;
2489
- --uc-primary-oklch-dark: 69% 0.1768 130;
2490
- }
2491
-
2492
- :where(.uc-turquoise) {
2493
- --uc-primary-oklch-light: 45% 0.0854 174;
2494
- --uc-primary-oklch-dark: 69% 0.1768 174;
2495
- }
2496
-
2497
- :where(.uc-gray) {
2498
- --uc-primary-oklch-light: 10% 0 0;
2499
- --uc-primary-oklch-dark: 97% 0 0;
2500
- }
2501
-
2502
- :where(.uc-contrast) {
2503
- --uc-border-light: oklch(50% 0 0);
2504
- --uc-border-dark: oklch(50% 0 0);
2505
-
2506
- --uc-muted-light: oklch(98% 0 0);
2507
- --uc-muted-dark: oklch(16% 0 0);
2508
-
2509
- --uc-muted-foreground-light: oklch(20% 0 0);
2510
- --uc-muted-foreground-dark: oklch(80% 0 0);
2511
-
2512
- --uc-background-light: oklch(100% 0 0);
2513
- --uc-foreground-light: oklch(0% 0 0);
2514
-
2515
- --uc-background-dark: oklch(10% 0 0);
2516
- --uc-foreground-dark: oklch(100% 0 0);
2517
- }
2518
- }
2519
- @layer uc.base {
2520
- :where([uc-wgt-common]) {
2521
- color: var(--uc-foreground);
2522
- font-size: var(--uc-font-size);
2523
- line-height: var(--uc-line-height);
2524
- font-family: var(--uc-font-family);
2525
- }
2526
-
2527
- :where([uc-wgt-common]) * {
2528
- box-sizing: border-box;
2529
- }
2530
-
2531
- :where([uc-wgt-common]) button {
2532
- display: flex;
2533
- align-items: center;
2534
- justify-content: center;
2535
- height: var(--uc-button-size);
2536
- padding-right: 14px;
2537
- padding-left: 14px;
2538
- font-size: 1em;
2539
- font-family: inherit;
2540
- white-space: nowrap;
2541
- border: none;
2542
- border-radius: var(--uc-radius);
2543
- cursor: pointer;
2544
- user-select: none;
2545
- transition: background-color var(--uc-transition);
2546
- }
2547
-
2548
- :where([uc-wgt-common]) button:focus-visible {
2549
- outline-offset: 2px;
2550
- }
2551
-
2552
- :where([uc-wgt-common]) button.uc-primary-btn {
2553
- color: var(--uc-primary-foreground);
2554
- background-color: var(--uc-primary);
2555
- }
2556
-
2557
- :where([uc-wgt-common]) button.uc-primary-btn:hover {
2558
- background-color: var(--uc-primary-hover);
2559
- }
2560
-
2561
- :where([uc-wgt-common]) button.uc-secondary-btn {
2562
- color: var(--uc-secondary-foreground);
2563
- background-color: var(--uc-secondary);
2564
- }
2565
-
2566
- :where([uc-wgt-common]) button.uc-secondary-btn:hover {
2567
- background-color: var(--uc-secondary-hover);
2568
- }
2569
-
2570
- :where([uc-wgt-common].uc-contrast) button.uc-secondary-btn {
2571
- border: 1px solid var(--uc-border);
2572
- }
2573
-
2574
- :where([uc-wgt-common]) button.uc-mini-btn {
2575
- height: var(--uc-button-size);
2576
- padding: 0;
2577
- background-color: transparent;
2578
- color: var(--uc-secondary-foreground);
2579
- }
2580
-
2581
- :where([uc-wgt-common]) button.uc-mini-btn:hover {
2582
- background-color: var(--uc-secondary);
2583
- }
2584
-
2585
- :where([uc-wgt-common]) :is(button[disabled], button.uc-primary-btn[disabled], button.uc-secondary-btn[disabled]) {
2586
- opacity: 0.5;
2587
- pointer-events: none;
2588
- }
2589
-
2590
- :where([uc-wgt-common]) a {
2591
- color: var(--uc-primary);
2592
- text-decoration: none;
2593
- }
2594
-
2595
- /* TODO: if we're using disabled <a> somewhere, we should stop */
2596
- :where([uc-wgt-common]) a[disabled] {
2597
- pointer-events: none;
2598
- }
2599
-
2600
- :where([uc-wgt-common]) input[type="text"] {
2601
- display: flex;
2602
- width: 100%;
2603
- height: var(--uc-button-size);
2604
- padding-right: 10px;
2605
- padding-left: 10px;
2606
- color: var(--uc-foreground);
2607
- font-size: 1em;
2608
- font-family: inherit;
2609
- background-color: var(--uc-background);
2610
- border: 1px solid var(--uc-border);
2611
- outline: 1px solid transparent;
2612
- border-radius: var(--uc-radius);
2613
- transition:
2614
- border-color var(--uc-transition),
2615
- outline-color var(--uc-transition);
2616
- }
2617
-
2618
- :where([uc-wgt-common]) input[type="text"]::placeholder {
2619
- color: var(--uc-muted-foreground);
2620
- }
2621
-
2622
- :where([uc-wgt-common]) input[type="text"]:focus {
2623
- outline-color: var(--uc-primary-hover);
2624
- border-color: var(--uc-primary-hover);
2625
- }
2626
-
2627
- /* TODO: check if there's any necessity of disabled input */
2628
- :where([uc-wgt-common]) input[disabled] {
2629
- opacity: 0.6;
2630
- pointer-events: none;
2631
- }
2632
- :where([uc-wgt-common]) uc-select[disabled],
2633
- :where([uc-wgt-common]) select[disabled] {
2634
- opacity: 0.6;
2635
- pointer-events: none;
2636
- }
2637
- }
2638
- @layer uc.rules {
2639
- :where([uc-wgt-common]) [hidden] {
2640
- display: none;
2641
- }
2642
-
2643
- :where([uc-wgt-common]) [activity]:not([active], .active) {
2644
- display: none;
2645
- }
2646
-
2647
- :where([uc-wgt-common]) dialog:not([open]) [activity] {
2648
- display: none;
2649
- }
2650
- }
2651
- @layer uc.post-reset {
2652
- :where([uc-wgt-common]) uc-source-btn[type] {
2653
- all: unset;
2654
- }
2655
- }
2656
- @layer uc.solutions {
2657
- /* ICONS: */
2658
- :where([uc-file-uploader-minimal]) {
2659
- --cfg-init-activity: "start-from";
2660
- --cfg-done-activity: "upload-list";
2661
-
2662
- position: relative;
2663
- display: block;
2664
- }
2665
-
2666
- [uc-file-uploader-minimal] > uc-start-from .uc-content {
2667
- display: flex;
2668
- flex-direction: column;
2669
- gap: 4px;
2670
- padding: 0;
2671
- overflow: hidden;
2672
- align-items: center;
2673
- background-color: transparent;
2674
- }
2675
-
2676
- :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area) {
2677
- display: flex;
2678
- position: relative;
2679
- align-items: center;
2680
- justify-content: center;
2681
- width: 100%;
2682
- min-height: calc(var(--uc-preview-size) + var(--uc-padding) * 2 + 8px);
2683
- padding: 0;
2684
- text-align: center;
2685
- background-color: var(--uc-muted);
2686
- border-radius: calc(var(--uc-radius) * 1.75);
2687
- }
2688
-
2689
- :where(.uc-contrast) :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area) {
2690
- background-color: transparent;
2691
- }
2692
-
2693
- /* hack to make transparent :hover colors work in any conditions */
2694
- :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area)::before {
2695
- content: "";
2696
- z-index: -1;
2697
- width: 100%;
2698
- height: 100%;
2699
- position: absolute;
2700
- background-color: var(--uc-background);
2701
- }
2702
-
2703
- :where([uc-file-uploader-minimal]:has([single]) > uc-start-from uc-drop-area) {
2704
- aspect-ratio: var(--uc-grid-aspect-ratio);
2705
- }
2706
-
2707
- [uc-file-uploader-minimal] uc-upload-list uc-activity-header {
2708
- display: none;
2709
- }
2710
-
2711
- [uc-file-uploader-minimal] uc-upload-list > .uc-toolbar {
2712
- background-color: transparent;
2713
- }
2714
-
2715
- [uc-file-uploader-minimal] uc-upload-list {
2716
- width: 100%;
2717
- height: unset;
2718
- padding: 4px;
2719
- background-color: var(--uc-background);
2720
- border: 1px dashed var(--uc-border);
2721
- border-radius: calc(var(--uc-radius) * 1.75);
2722
- }
2723
-
2724
- [uc-file-uploader-minimal] uc-upload-list .uc-files {
2725
- padding: 0;
2726
- }
2727
-
2728
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar {
2729
- display: block;
2730
- padding: 0;
2731
- }
2732
-
2733
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-cancel-btn,
2734
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-upload-btn,
2735
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-done-btn {
2736
- display: none;
2737
- }
2738
-
2739
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn {
2740
- width: 100%;
2741
- height: calc(var(--uc-preview-size) + var(--uc-padding) * 2);
2742
- margin-top: 4px;
2743
- }
2744
-
2745
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn[disabled] {
2746
- display: none;
2747
- }
2748
-
2749
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn > span {
2750
- display: none;
2751
- }
2752
-
2753
- [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn > uc-icon {
2754
- display: flex;
2755
- }
2756
-
2757
- [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar {
2758
- top: 0;
2759
- height: 100%;
2760
- }
2761
-
2762
- [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar .uc-progress {
2763
- background-color: var(--uc-primary-transparent);
2764
- border-radius: var(--uc-radius);
2765
- }
2766
-
2767
- [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar .uc-fake-progress {
2768
- background-color: var(--uc-primary-transparent);
2769
- border-radius: var(--uc-radius);
2770
- }
2771
-
2772
- [uc-file-uploader-minimal] uc-upload-list uc-drop-area {
2773
- width: 100%;
2774
- height: 100%;
2775
- margin: 0;
2776
- border-radius: calc(var(--uc-radius) * 1.75);
2777
- }
2778
-
2779
- [uc-file-uploader-minimal] uc-upload-list .uc-common-error {
2780
- margin: 4px 0 0;
2781
- }
2782
-
2783
- [uc-file-uploader-minimal] uc-copyright .uc-credits {
2784
- position: static;
2785
- }
2786
-
2787
- [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-toolbar .uc-add-more-btn {
2788
- display: none;
2789
- }
2790
-
2791
- [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn {
2792
- display: flex;
2793
- }
2794
-
2795
- [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn > span {
2796
- display: none;
2797
- }
2798
-
2799
- [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn > uc-icon {
2800
- display: flex;
2801
- }
2802
- }
2803
- @layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
2804
- @layer uc.base {
2805
- :where([uc-wgt-common]) {
2806
- /* Font */
2807
- --uc-font-family: system-ui;
2808
- --uc-font-size: 14px;
2809
- --uc-line-height: normal;
2810
- --uc-simple-btn-font-family: system-ui;
2811
- --uc-simple-btn-font-size: 14px;
2812
-
2813
- /* Sizes */
2814
- --uc-button-size: 32px;
2815
- --uc-preview-size: 32px;
2816
- --uc-padding: 10px;
2817
- --uc-radius: 8px;
2818
- --uc-transition: 0.2s ease;
2819
- --uc-dialog-width: 430px;
2820
- --uc-dialog-max-width: 920px;
2821
- --uc-dialog-max-height: 675px;
2822
- --uc-simple-btn-padding: 7px 14px;
2823
-
2824
- --uc-grid-col: 3;
2825
- --uc-grid-preview-image-height: auto;
2826
- --uc-grid-gap: calc(var(--uc-padding) / 2);
2827
- --uc-grid-aspect-ratio: 1 / 1;
2828
-
2829
- /* Default colors, in case of media query failure */
2830
- --uc-background: var(--uc-background-light);
2831
- --uc-foreground: var(--uc-foreground-light);
2832
- --uc-primary: var(--uc-primary-light);
2833
- --uc-primary-hover: var(--uc-primary-hover-light);
2834
- --uc-primary-transparent: var(--uc-primary-transparent-light);
2835
- --uc-primary-foreground: var(--uc-primary-foreground-light);
2836
- --uc-secondary: var(--uc-secondary-light);
2837
- --uc-secondary-hover: var(--uc-secondary-hover-light);
2838
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
2839
- --uc-muted: var(--uc-muted-light);
2840
- --uc-muted-foreground: var(--uc-muted-foreground-light);
2841
- --uc-destructive: var(--uc-destructive-light);
2842
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
2843
- --uc-border: var(--uc-border-light);
2844
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
2845
- --uc-simple-btn: var(--uc-simple-btn-light);
2846
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
2847
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
2848
- }
2849
-
2850
- @supports not (color: oklch(0% 0 0)) {
2851
- :where([uc-wgt-common]) {
2852
- /* Light colors RGB fallback */
2853
- --uc-primary-rgb-light: 23 75 215;
2854
- --uc-primary-light: rgb(var(--uc-primary-rgb-light));
2855
- --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
2856
- --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
2857
- --uc-background-light: rgb(255 255 255);
2858
- --uc-foreground-light: rgb(24 24 24);
2859
- --uc-primary-foreground-light: #fff;
2860
- --uc-secondary-light: rgb(24 24 24 / 5%);
2861
- --uc-secondary-hover-light: rgb(24 24 24 / 8%);
2862
- --uc-secondary-foreground-light: rgb(24 24 24);
2863
- --uc-muted-light: rgb(245 245 245);
2864
- --uc-muted-foreground-light: rgb(113 113 113);
2865
- --uc-destructive-light: rgb(232 19 20 / 5%);
2866
- --uc-destructive-foreground-light: rgb(232 19 20);
2867
- --uc-border-light: rgb(228 228 232);
2868
- --uc-dialog-shadow-light: 0px 6px 20px rgb(0 0 0 / 10%);
2869
- --uc-simple-btn-light: rgb(235 235 235);
2870
- --uc-simple-btn-hover-light: rgb(228 228 228);
2871
- --uc-simple-btn-foreground-light: rgb(24 24 24);
2872
-
2873
- /* Dark colors RGB fallback */
2874
- --uc-primary-rgb-dark: 87 154 255;
2875
- --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
2876
- --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
2877
- --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
2878
- --uc-background-dark: rgb(27 27 27);
2879
- --uc-foreground-dark: rgb(225 225 225);
2880
- --uc-primary-foreground-dark: rgb(0 0 0);
2881
- --uc-secondary-dark: rgb(225 225 225 / 7%);
2882
- --uc-secondary-hover-dark: rgb(225 225 225 / 10%);
2883
- --uc-secondary-foreground-dark: rgb(225 225 225);
2884
- --uc-muted-dark: rgb(36 36 36);
2885
- --uc-muted-foreground-dark: rgb(152 152 152);
2886
- --uc-destructive-dark: rgb(244 90 79 / 10%);
2887
- --uc-destructive-foreground-dark: rgb(244 90 79);
2888
- --uc-border-dark: rgb(61 61 61);
2889
- --uc-dialog-shadow-dark: 0px 6px 20px rgb(0 0 0 / 25%);
2890
- --uc-simple-btn-dark: rgb(36 36 36);
2891
- --uc-simple-btn-hover-dark: rgb(43 43 43);
2892
- --uc-simple-btn-foreground-dark: rgb(255 255 255);
2893
- }
2894
- }
2895
-
2896
- @supports (color: oklch(0% 0 0)) {
2897
- :where([uc-wgt-common]) {
2898
- /* Light colors OKLCH */
2899
- --uc-primary-oklch-light: 47% 0.22 264; /* Quick customization: change this value to your brand color */
2900
- --uc-primary-light: oklch(var(--uc-primary-oklch-light));
2901
- --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
2902
- --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
2903
- --uc-background-light: oklch(100% 0 0);
2904
- --uc-foreground-light: oklch(21% 0 0);
2905
- --uc-primary-foreground-light: oklch(100% 0 0);
2906
- --uc-secondary-light: oklch(21% 0 0 / 0.05);
2907
- --uc-secondary-hover-light: oklch(21% 0 0 / 0.08);
2908
- --uc-secondary-foreground-light: oklch(21% 0 0);
2909
- --uc-muted-light: oklch(97% 0 0);
2910
- --uc-muted-foreground-light: oklch(40% 0 0);
2911
- --uc-destructive-light: oklch(59% 0.235 28.5 / 0.05);
2912
- --uc-destructive-foreground-light: oklch(59% 0.235 28.5);
2913
- --uc-border-light: oklch(92% 0 0);
2914
- --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / 0.1);
2915
- --uc-simple-btn-light: oklch(94% 0 0);
2916
- --uc-simple-btn-hover-light: oklch(92% 0 0);
2917
- --uc-simple-btn-foreground-light: oklch(20% 0 0);
2918
-
2919
- /* Dark colors OKLCH */
2920
- --uc-primary-oklch-dark: 69% 0.1768 258.4; /* Quick customization: change this value to your brand color */
2921
- --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
2922
- --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
2923
- --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
2924
- --uc-background-dark: oklch(22% 0 0);
2925
- --uc-foreground-dark: oklch(91% 0 0);
2926
- --uc-primary-foreground-dark: oklch(0% 0 0);
2927
- --uc-secondary-dark: oklch(91% 0 0 / 0.07);
2928
- --uc-secondary-hover-dark: oklch(91% 0 0 / 0.1);
2929
- --uc-secondary-foreground-dark: oklch(91% 0 0);
2930
- --uc-muted-dark: oklch(26% 0 0);
2931
- --uc-muted-foreground-dark: oklch(68% 0 0);
2932
- --uc-destructive-dark: oklch(67% 0.191 27.5 / 0.1);
2933
- --uc-destructive-foreground-dark: oklch(67% 0.191 27.5);
2934
- --uc-border-dark: oklch(36% 0 0);
2935
- --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / 0.25);
2936
- --uc-simple-btn-dark: oklch(26% 0 0);
2937
- --uc-simple-btn-hover-dark: oklch(29% 0 0);
2938
- --uc-simple-btn-foreground-dark: oklch(100% 0 0);
2939
- }
2940
- }
2941
-
2942
- @media only screen and (max-height: 600px) {
2943
- :where([uc-wgt-common]) {
2944
- --uc-dialog-max-height: 100%;
2945
- }
2946
- }
2947
-
2948
- @media only screen and (max-width: 680px) {
2949
- :where([uc-wgt-common]) {
2950
- --uc-grid-col: 2;
2951
- }
2952
- }
2953
-
2954
- @media only screen and (max-width: 430px) {
2955
- :where([uc-wgt-common]) {
2956
- --uc-dialog-max-width: 100vw;
2957
- --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
2958
- --uc-grid-col: 1;
2959
- }
2960
- }
2961
-
2962
- @media (prefers-color-scheme: light) {
2963
- :where([uc-wgt-common]) {
2964
- --uc-background: var(--uc-background-light);
2965
- --uc-foreground: var(--uc-foreground-light);
2966
- --uc-primary: var(--uc-primary-light);
2967
- --uc-primary-hover: var(--uc-primary-hover-light);
2968
- --uc-primary-transparent: var(--uc-primary-transparent-light);
2969
- --uc-primary-foreground: var(--uc-primary-foreground-light);
2970
- --uc-secondary: var(--uc-secondary-light);
2971
- --uc-secondary-hover: var(--uc-secondary-hover-light);
2972
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
2973
- --uc-muted: var(--uc-muted-light);
2974
- --uc-muted-foreground: var(--uc-muted-foreground-light);
2975
- --uc-destructive: var(--uc-destructive-light);
2976
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
2977
- --uc-border: var(--uc-border-light);
2978
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
2979
- --uc-simple-btn: var(--uc-simple-btn-light);
2980
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
2981
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
2982
- }
2983
- }
2984
-
2985
- @media (prefers-color-scheme: dark) {
2986
- :where([uc-wgt-common]) {
2987
- --uc-background: var(--uc-background-dark);
2988
- --uc-foreground: var(--uc-foreground-dark);
2989
- --uc-primary: var(--uc-primary-dark);
2990
- --uc-primary-hover: var(--uc-primary-hover-dark);
2991
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
2992
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
2993
- --uc-secondary: var(--uc-secondary-dark);
2994
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
2995
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
2996
- --uc-muted: var(--uc-muted-dark);
2997
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
2998
- --uc-destructive: var(--uc-destructive-dark);
2999
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
3000
- --uc-border: var(--uc-border-dark);
3001
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
3002
- --uc-simple-btn: var(--uc-simple-btn-dark);
3003
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
3004
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
3005
- }
3006
- }
3007
-
3008
- :where(.uc-light) {
3009
- --uc-background: var(--uc-background-light);
3010
- --uc-foreground: var(--uc-foreground-light);
3011
- --uc-primary: var(--uc-primary-light);
3012
- --uc-primary-hover: var(--uc-primary-hover-light);
3013
- --uc-primary-transparent: var(--uc-primary-transparent-light);
3014
- --uc-primary-foreground: var(--uc-primary-foreground-light);
3015
- --uc-secondary: var(--uc-secondary-light);
3016
- --uc-secondary-hover: var(--uc-secondary-hover-light);
3017
- --uc-secondary-foreground: var(--uc-secondary-foreground-light);
3018
- --uc-muted: var(--uc-muted-light);
3019
- --uc-muted-foreground: var(--uc-muted-foreground-light);
3020
- --uc-destructive: var(--uc-destructive-light);
3021
- --uc-destructive-foreground: var(--uc-destructive-foreground-light);
3022
- --uc-border: var(--uc-border-light);
3023
- --uc-dialog-shadow: var(--uc-dialog-shadow-light);
3024
- --uc-simple-btn: var(--uc-simple-btn-light);
3025
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
3026
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
3027
- }
3028
-
3029
- :where(.uc-dark) {
3030
- --uc-background: var(--uc-background-dark);
3031
- --uc-foreground: var(--uc-foreground-dark);
3032
- --uc-primary: var(--uc-primary-dark);
3033
- --uc-primary-hover: var(--uc-primary-hover-dark);
3034
- --uc-primary-transparent: var(--uc-primary-transparent-dark);
3035
- --uc-primary-foreground: var(--uc-primary-foreground-dark);
3036
- --uc-secondary: var(--uc-secondary-dark);
3037
- --uc-secondary-hover: var(--uc-secondary-hover-dark);
3038
- --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
3039
- --uc-muted: var(--uc-muted-dark);
3040
- --uc-muted-foreground: var(--uc-muted-foreground-dark);
3041
- --uc-destructive: var(--uc-destructive-dark);
3042
- --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
3043
- --uc-border: var(--uc-border-dark);
3044
- --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
3045
- --uc-simple-btn: var(--uc-simple-btn-dark);
3046
- --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
3047
- --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
3048
- }
3049
-
3050
- :where(.uc-purple) {
3051
- --uc-primary-oklch-light: 47% 0.22 300;
3052
- --uc-primary-oklch-dark: 69% 0.1768 300;
3053
- }
3054
-
3055
- :where(.uc-red) {
3056
- --uc-primary-oklch-light: 47% 0.21 21;
3057
- --uc-primary-oklch-dark: 71% 0.1768 21;
3058
- }
3059
-
3060
- :where(.uc-orange) {
3061
- --uc-primary-oklch-light: 47% 0.1376 51.88;
3062
- --uc-primary-oklch-dark: 69% 0.1768 51.88;
3063
- }
3064
-
3065
- :where(.uc-green) {
3066
- --uc-primary-oklch-light: 45% 0.14 130;
3067
- --uc-primary-oklch-dark: 69% 0.1768 130;
3068
- }
3069
-
3070
- :where(.uc-turquoise) {
3071
- --uc-primary-oklch-light: 45% 0.0854 174;
3072
- --uc-primary-oklch-dark: 69% 0.1768 174;
3073
- }
3074
-
3075
- :where(.uc-gray) {
3076
- --uc-primary-oklch-light: 10% 0 0;
3077
- --uc-primary-oklch-dark: 97% 0 0;
3078
- }
3079
-
3080
- :where(.uc-contrast) {
3081
- --uc-border-light: oklch(50% 0 0);
3082
- --uc-border-dark: oklch(50% 0 0);
3083
-
3084
- --uc-muted-light: oklch(98% 0 0);
3085
- --uc-muted-dark: oklch(16% 0 0);
3086
-
3087
- --uc-muted-foreground-light: oklch(20% 0 0);
3088
- --uc-muted-foreground-dark: oklch(80% 0 0);
3089
-
3090
- --uc-background-light: oklch(100% 0 0);
3091
- --uc-foreground-light: oklch(0% 0 0);
3092
-
3093
- --uc-background-dark: oklch(10% 0 0);
3094
- --uc-foreground-dark: oklch(100% 0 0);
3095
- }
3096
- }
3097
- /** biome-ignore-all lint/complexity/noImportantStyles: TODO: Refactor styles to get rid of !important rules */
3098
- @layer uc.solutions {
3099
- /* TODO: we should use basic theme there */
3100
-
3101
- [uc-cloud-image-editor] {
3102
- --color-primary-accent: var(--uc-primary);
3103
- --color-text-base: var(--uc-foreground);
3104
- --color-text-accent-contrast: var(--uc-background);
3105
- --color-fill-contrast: var(--uc-background);
3106
- --color-modal-backdrop: oklch(0% 0 0 / 0.1);
3107
- --color-image-background: var(--uc-muted);
3108
- --color-focus-ring: var(--color-primary-accent);
3109
- --color-crop-guides: var(--uc-foreground);
3110
-
3111
- --font-size-ui: var(--uc-font-size);
3112
-
3113
- --size-touch-area: var(--uc-button-size);
3114
- --size-panel-heading: calc(var(--uc-button-size) + var(--uc-padding) * 2);
3115
- --size-ui-min-width: 130px;
3116
- --size-line-width: 1px;
3117
- --size-modal-width: 650px;
3118
- --size-icon: calc(var(--uc-button-size) / 2);
3119
-
3120
- /* TODO: remove icon size overrides */
3121
-
3122
- --border-radius-editor: var(--uc-radius);
3123
- --border-radius-thumb: var(--uc-radius);
3124
- --border-radius-ui: var(--uc-radius);
3125
- --border-radius-base: var(--uc-radius);
3126
-
3127
- --cldtr-gap-min: 5px;
3128
- --cldtr-gap-mid-1: 10px;
3129
- --cldtr-gap-mid-2: 15px;
3130
- --cldtr-gap-max: 20px;
3131
-
3132
- --transition-duration-2: var(--transition-duration-all, 0.2s);
3133
- --transition-duration-3: var(--transition-duration-all, 0.3s);
3134
- --transition-duration-4: var(--transition-duration-all, 0.4s);
3135
- --transition-duration-5: var(--transition-duration-all, 0.5s);
3136
-
3137
- --modal-header-opacity: 1;
3138
- --modal-header-height: var(--size-panel-heading);
3139
- --modal-toolbar-height: var(--size-panel-heading);
3140
-
3141
- --transparent-pixel: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=");
3142
-
3143
- display: block;
3144
- width: 100%;
3145
- height: 100%;
3146
- max-height: 100%;
3147
- }
3148
-
3149
- [uc-cloud-image-editor] :is([can-handle-paste]:hover, [can-handle-paste]:focus) {
3150
- --can-handle-paste: "true";
3151
- }
3152
-
3153
- [uc-cloud-image-editor]
3154
- :is([tabindex]:focus-visible, [tabindex]:hover, [with-effects]:focus-visible, [with-effects]:hover) {
3155
- --filter-effect: var(--hover-filter) !important;
3156
- --opacity-effect: var(--hover-opacity) !important;
3157
- --color-effect: var(--hover-color-rgb) !important;
3158
- --background-effect: var(--hover-background) !important;
3159
- }
3160
-
3161
- [uc-cloud-image-editor] :is([tabindex]:active, [with-effects]:active) {
3162
- --filter-effect: var(--down-filter) !important;
3163
- --opacity-effect: var(--down-opacity) !important;
3164
- --color-effect: var(--down-color-rgb) !important;
3165
- --background-effect: var(--down-background) !important;
3166
- }
3167
-
3168
- [uc-cloud-image-editor] :is([tabindex][active], [with-effects][active]) {
3169
- --filter-effect: var(--active-filter) !important;
3170
- --opacity-effect: var(--active-opacity) !important;
3171
- --color-effect: var(--active-color-rgb) !important;
3172
- --background-effect: var(--active-background) !important;
3173
- }
3174
-
3175
- [uc-cloud-image-editor] [hidden-scrollbar]::-webkit-scrollbar {
3176
- display: none;
3177
- }
3178
-
3179
- [uc-cloud-image-editor] [hidden-scrollbar] {
3180
- -ms-overflow-style: none;
3181
- scrollbar-width: none;
3182
- }
3183
-
3184
- [uc-cloud-image-editor].uc-editor_ON {
3185
- --modal-header-opacity: 0;
3186
- --modal-header-height: 0px;
3187
- --modal-toolbar-height: calc(var(--size-panel-heading) * 2);
3188
- }
3189
-
3190
- [uc-cloud-image-editor].uc-editor_OFF {
3191
- --modal-header-opacity: 1;
3192
- --modal-header-height: var(--size-panel-heading);
3193
- --modal-toolbar-height: var(--size-panel-heading);
3194
- }
3195
-
3196
- [uc-cloud-image-editor] > .uc-wrapper {
3197
- --l-min-img-height: var(--modal-toolbar-height);
3198
- --l-max-img-height: 100%;
3199
- --l-edit-button-width: 120px;
3200
- --l-toolbar-horizontal-padding: var(--cldtr-gap-mid-1);
3201
-
3202
- position: relative;
3203
- display: grid;
3204
- grid-template-rows: minmax(var(--l-min-img-height), var(--l-max-img-height)) minmax(
3205
- var(--modal-toolbar-height),
3206
- auto
3207
- );
3208
- height: 100%;
3209
- overflow: hidden;
3210
- overflow-y: auto;
3211
- }
3212
-
3213
- @media only screen and (max-width: 800px) {
3214
- [uc-cloud-image-editor] > .uc-wrapper {
3215
- --l-edit-button-width: 70px;
3216
- --l-toolbar-horizontal-padding: var(--cldtr-gap-min);
3217
- }
3218
- }
3219
-
3220
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport {
3221
- display: flex;
3222
- align-items: center;
3223
- justify-content: center;
3224
- overflow: hidden;
3225
- }
3226
-
3227
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image {
3228
- --viewer-image-opacity: 1;
3229
-
3230
- position: absolute;
3231
- top: 0px;
3232
- left: 0px;
3233
- z-index: 10;
3234
- display: block;
3235
- box-sizing: border-box;
3236
- width: 100%;
3237
- height: 100%;
3238
- object-fit: scale-down;
3239
- background-color: var(--color-image-background);
3240
- transform: scale(1);
3241
- opacity: var(--viewer-image-opacity);
3242
- user-select: none;
3243
- pointer-events: auto;
3244
- }
3245
-
3246
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_visible_viewer {
3247
- transition:
3248
- opacity var(--transition-duration-3) ease-in-out,
3249
- transform var(--transition-duration-4);
3250
- }
3251
-
3252
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_hidden_to_cropper {
3253
- --viewer-image-opacity: 0;
3254
-
3255
- background-image: var(--transparent-pixel);
3256
- transform: scale(1);
3257
- transition:
3258
- transform var(--transition-duration-4),
3259
- opacity var(--transition-duration-3) steps(1, jump-end);
3260
- pointer-events: none;
3261
- }
3262
-
3263
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_hidden_effects {
3264
- --viewer-image-opacity: 0;
3265
-
3266
- transform: scale(1);
3267
- transition:
3268
- opacity var(--transition-duration-3) cubic-bezier(0.5, 0, 1, 1),
3269
- transform var(--transition-duration-4);
3270
- pointer-events: none;
3271
- }
3272
-
3273
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container {
3274
- position: relative;
3275
- display: block;
3276
- width: 100%;
3277
- height: 100%;
3278
- background-color: var(--color-image-background);
3279
- transition: var(--transition-duration-3);
3280
- }
3281
-
3282
- [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar {
3283
- position: relative;
3284
- transition: 0.3s;
3285
- }
3286
-
3287
- [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content {
3288
- position: absolute;
3289
- bottom: 0px;
3290
- left: 0px;
3291
- box-sizing: border-box;
3292
- width: 100%;
3293
- height: var(--modal-toolbar-height);
3294
- min-height: var(--size-panel-heading);
3295
- background-color: var(--color-fill-contrast);
3296
- }
3297
-
3298
- [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content.uc-toolbar_content__viewer {
3299
- display: flex;
3300
- align-items: center;
3301
- justify-content: space-between;
3302
- height: var(--size-panel-heading);
3303
- padding-right: var(--l-toolbar-horizontal-padding);
3304
- padding-left: var(--l-toolbar-horizontal-padding);
3305
- }
3306
-
3307
- [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content.uc-toolbar_content__editor {
3308
- display: flex;
3309
- }
3310
-
3311
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-info_pan {
3312
- position: absolute;
3313
- user-select: none;
3314
- }
3315
-
3316
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-file_type_outer {
3317
- position: absolute;
3318
- z-index: 2;
3319
- display: flex;
3320
- max-width: 120px;
3321
- transform: translateX(-40px);
3322
- user-select: none;
3323
- }
3324
-
3325
- [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-file_type_outer > .uc-file_type {
3326
- padding: 4px 0.8em;
3327
- }
3328
-
3329
- [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash {
3330
- position: absolute;
3331
- z-index: 999;
3332
- display: flex;
3333
- flex-direction: column;
3334
- width: 100%;
3335
- height: 100%;
3336
- background-color: var(--color-fill-contrast);
3337
- }
3338
-
3339
- [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_content {
3340
- display: flex;
3341
- flex: 1;
3342
- flex-direction: column;
3343
- align-items: center;
3344
- justify-content: center;
3345
- }
3346
-
3347
- [uc-cloud-image-editor]
3348
- > .uc-wrapper
3349
- > .uc-network_problems_splash
3350
- > .uc-network_problems_content
3351
- > .uc-network_problems_icon {
3352
- display: flex;
3353
- align-items: center;
3354
- justify-content: center;
3355
- width: 40px;
3356
- height: 40px;
3357
- color: var(--uc-foreground);
3358
- background-color: var(--uc-muted);
3359
- border-radius: 50%;
3360
- }
3361
-
3362
- [uc-cloud-image-editor]
3363
- > .uc-wrapper
3364
- > .uc-network_problems_splash
3365
- > .uc-network_problems_content
3366
- > .uc-network_problems_text {
3367
- margin-top: var(--cldtr-gap-max);
3368
- font-size: var(--font-size-ui);
3369
- color: var(--uc-foreground);
3370
- }
3371
-
3372
- [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_footer {
3373
- display: flex;
3374
- align-items: center;
3375
- justify-content: center;
3376
- height: var(--size-panel-heading);
3377
- }
3378
-
3379
- uc-crop-frame > .uc-svg {
3380
- position: absolute;
3381
- top: 0px;
3382
- left: 0px;
3383
- z-index: 2;
3384
- width: 100%;
3385
- height: 100%;
3386
- border-top-left-radius: var(--border-radius-base);
3387
- border-top-right-radius: var(--border-radius-base);
3388
- opacity: inherit;
3389
- transition: var(--transition-duration-3);
3390
- }
3391
-
3392
- uc-crop-frame > .uc-thumb {
3393
- --idle-color-rgb: var(--color-text-base);
3394
- --hover-color-rgb: var(--color-primary-accent);
3395
- --focus-color-rgb: var(--color-primary-accent);
3396
- --down-color-rgb: var(--color-primary-accent);
3397
- --color-effect: var(--idle-color-rgb);
3398
-
3399
- color: var(--color-effect);
3400
- transition:
3401
- color var(--transition-duration-3),
3402
- opacity var(--transition-duration-3);
3403
- }
3404
-
3405
- uc-crop-frame .uc-thumb--visible {
3406
- opacity: 1;
3407
- pointer-events: auto;
3408
- }
3409
-
3410
- uc-crop-frame .uc-thumb--hidden {
3411
- opacity: 0;
3412
- pointer-events: none;
3413
- }
3414
-
3415
- uc-crop-frame .uc-guides {
3416
- transition: var(--transition-duration-3);
3417
- }
3418
-
3419
- uc-crop-frame .uc-guides--hidden {
3420
- opacity: 0;
3421
- }
3422
-
3423
- uc-crop-frame .uc-guides--semi-hidden {
3424
- opacity: 0.2;
3425
- }
3426
-
3427
- uc-crop-frame .uc-guides--visible {
3428
- opacity: 1;
3429
- }
3430
-
3431
- uc-editor-button-control,
3432
- uc-editor-crop-button-control,
3433
- uc-editor-aspect-ratio-button-control,
3434
- uc-editor-freeform-button-control,
3435
- uc-editor-filter-control,
3436
- uc-editor-operation-control {
3437
- --l-base-min-width: var(--uc-button-size);
3438
- --l-base-height: var(--uc-button-size);
3439
- --opacity-effect: var(--idle-opacity);
3440
- --color-effect: var(--idle-color-rgb);
3441
- --background-effect: var(--idle-background);
3442
- --filter-effect: var(--idle-filter);
3443
-
3444
- --idle-color-rgb: var(--uc-secondary-foreground);
3445
- --idle-opacity: 1;
3446
- --idle-filter: 1;
3447
- --idle-background: var(--uc-secondary);
3448
- --hover-color-rgb: var(--uc-secondary-foreground);
3449
- --hover-opacity: 1;
3450
- --hover-filter: 0.8;
3451
- --hover-background: var(--uc-secondary-hover);
3452
- --down-color-rgb: var(--hover-color-rgb);
3453
- --down-opacity: 1;
3454
- --down-filter: 0.6;
3455
- --down-background: var(--uc-secondary);
3456
-
3457
- border-radius: var(--uc-radius);
3458
- }
3459
-
3460
- uc-editor-button-control > button,
3461
- uc-editor-crop-button-control > button,
3462
- uc-editor-aspect-ratio-button-control > button,
3463
- uc-editor-freeform-button-control > button,
3464
- uc-editor-filter-control > button,
3465
- uc-editor-operation-control > button {
3466
- all: unset;
3467
- position: relative;
3468
- display: grid;
3469
- grid-template-columns: var(--l-base-min-width) auto;
3470
- grid-template-rows: 100%;
3471
- align-items: center;
3472
- height: var(--l-base-height);
3473
- color: var(--color-effect);
3474
- opacity: var(--opacity-effect);
3475
- cursor: pointer;
3476
- transition: var(--l-width-transition);
3477
- }
3478
-
3479
- uc-editor-freeform-button-control > button {
3480
- grid-template-columns: auto var(--l-base-min-width);
3481
- }
3482
-
3483
- uc-editor-freeform-button-control > button > uc-icon {
3484
- margin-left: var(--cldtr-gap-mid-1);
3485
- width: 10px;
3486
- }
3487
-
3488
- :where(
3489
- uc-editor-button-control,
3490
- uc-editor-crop-button-control,
3491
- uc-editor-aspect-ratio-button-control,
3492
- uc-editor-freeform-button-control,
3493
- uc-editor-filter-control,
3494
- uc-editor-operation-control
3495
- )
3496
- > uc-icon
3497
- > svg {
3498
- width: var(--size-icon);
3499
- height: var(--size-icon);
3500
- }
3501
-
3502
- uc-editor-filter-control > uc-icon.uc-original-icon > svg {
3503
- width: 100%;
3504
- height: 100%;
3505
- }
3506
-
3507
- uc-editor-button-control.uc-active,
3508
- uc-editor-operation-control.uc-active,
3509
- uc-editor-crop-button-control.uc-active,
3510
- uc-editor-aspect-ratio-button-control.uc-active,
3511
- uc-editor-freeform-button-control.uc-active,
3512
- uc-editor-filter-control.uc-active {
3513
- --idle-color-rgb: var(--uc-primary-foreground);
3514
- --idle-background: var(--uc-primary);
3515
- --idle-opacity: 1;
3516
- --hover-color-rgb: var(--uc-primary-foreground);
3517
- --hover-background: var(--uc-primary);
3518
- --hover-opacity: 1;
3519
- }
3520
-
3521
- uc-editor-button-control.uc-not_active,
3522
- uc-editor-operation-control.uc-not_active,
3523
- uc-editor-crop-button-control.uc-not_active,
3524
- uc-editor-aspect-ratio-button-control.uc-not_active,
3525
- uc-editor-freeform-button-control.uc-not_active,
3526
- uc-editor-filter-control.uc-not_active {
3527
- --idle-color-rgb: var(--uc-secondary-foreground);
3528
- }
3529
-
3530
- :where(.uc-contrast) uc-editor-button-control.uc-not_active,
3531
- :where(.uc-contrast) uc-editor-operation-control.uc-not_active,
3532
- :where(.uc-contrast) uc-editor-crop-button-control.uc-not_active,
3533
- :where(.uc-contrast) uc-editor-freeform-button-control.uc-not_active,
3534
- :where(.uc-contrast) uc-editor-aspect-ratio-button-control.uc-not_active,
3535
- :where(.uc-contrast) uc-editor-filter-control.uc-not_active {
3536
- --idle-background: transparent;
3537
- --hover-background: var(--uc-secondary);
3538
-
3539
- outline: 1px solid var(--uc-border);
3540
- outline-offset: -1px;
3541
- }
3542
-
3543
- uc-editor-button-control > button::before,
3544
- uc-editor-operation-control > button::before,
3545
- uc-editor-crop-button-control > button::before,
3546
- uc-editor-freeform-button-control > button::before,
3547
- uc-editor-aspect-ratio-button-control > button::before,
3548
- uc-editor-filter-control > button::before {
3549
- position: absolute;
3550
- content: "";
3551
- right: 0;
3552
- left: 0;
3553
- z-index: -1;
3554
- width: 100%;
3555
- height: 100%;
3556
- background-color: var(--background-effect);
3557
- border-radius: var(--border-radius-editor);
3558
- transition: var(--transition-duration-3);
3559
- }
3560
-
3561
- uc-editor-button-control > button .uc-title,
3562
- uc-editor-operation-control > button .uc-title,
3563
- uc-editor-crop-button-control > button .uc-title,
3564
- uc-editor-aspect-ratio-button-control > button .uc-title,
3565
- uc-editor-freeform-button-control > button .uc-title,
3566
- uc-editor-filter-control > button .uc-title {
3567
- padding-right: var(--cldtr-gap-mid-1);
3568
- font-size: 0.7em;
3569
- letter-spacing: 1.004px;
3570
- text-transform: uppercase;
3571
- }
3572
-
3573
- uc-editor-freeform-button-control > button .uc-title {
3574
- padding-left: var(--cldtr-gap-mid-1);
3575
- padding-right: 0;
3576
- }
3577
-
3578
- uc-editor-button-control > button uc-icon,
3579
- uc-editor-operation-control > button uc-icon,
3580
- uc-editor-crop-button-control > button uc-icon,
3581
- uc-editor-aspect-ratio-button-control > button uc-icon,
3582
- uc-editor-freeform-button-control > button uc-icon,
3583
- uc-editor-filter-control > button uc-icon {
3584
- pointer-events: none;
3585
- }
3586
-
3587
- uc-editor-filter-control > button .uc-preview {
3588
- position: absolute;
3589
- right: 0;
3590
- left: 0;
3591
- z-index: -1;
3592
- width: 100%;
3593
- height: var(--l-base-height);
3594
- background-repeat: no-repeat;
3595
- background-size: contain;
3596
- border-radius: var(--border-radius-editor);
3597
- opacity: 0;
3598
- filter: brightness(var(--filter-effect));
3599
- transition: var(--transition-duration-3);
3600
- }
3601
-
3602
- uc-editor-filter-control.uc-not_active .uc-preview[data-loaded] {
3603
- opacity: 1;
3604
- }
3605
-
3606
- uc-editor-filter-control.uc-active .uc-preview {
3607
- opacity: 0;
3608
- }
3609
-
3610
- uc-editor-filter-control > .uc-original-icon {
3611
- color: var(--color-effect);
3612
- opacity: 0.3;
3613
- }
3614
-
3615
- uc-editor-image-cropper {
3616
- position: absolute;
3617
- top: 0px;
3618
- left: 0px;
3619
- z-index: 10;
3620
- display: block;
3621
- width: 100%;
3622
- height: 100%;
3623
- opacity: 0;
3624
- pointer-events: none;
3625
- touch-action: none;
3626
- color: var(--color-crop-guides);
3627
- }
3628
-
3629
- uc-editor-image-cropper.uc-active_from_editor {
3630
- transform: scale(1) translate(0px, 0px);
3631
- opacity: 1;
3632
- transition:
3633
- transform var(--transition-duration-4) cubic-bezier(0.37, 0, 0.63, 1) 0.4s,
3634
- opacity var(--transition-duration-3);
3635
- pointer-events: auto;
3636
- }
3637
-
3638
- uc-editor-image-cropper.uc-active_from_viewer {
3639
- transform: scale(1) translate(0px, 0px);
3640
- opacity: 1;
3641
- transition:
3642
- transform var(--transition-duration-4) cubic-bezier(0.37, 0, 0.63, 1) 0.4s,
3643
- opacity var(--transition-duration-3);
3644
- pointer-events: auto;
3645
- }
3646
-
3647
- uc-editor-image-cropper.uc-inactive_to_editor {
3648
- opacity: 0;
3649
- transition:
3650
- transform var(--transition-duration-4) cubic-bezier(0.37, 0, 0.63, 1),
3651
- opacity var(--transition-duration-3) calc(var(--transition-duration-3) + 0.05s);
3652
- pointer-events: none;
3653
- }
3654
-
3655
- uc-editor-image-cropper > .uc-canvas {
3656
- position: absolute;
3657
- top: 0px;
3658
- left: 0px;
3659
- z-index: 1;
3660
- display: block;
3661
- width: 100%;
3662
- height: 100%;
3663
- }
3664
-
3665
- uc-editor-image-fader {
3666
- position: absolute;
3667
- top: 0px;
3668
- left: 0px;
3669
- display: block;
3670
- width: 100%;
3671
- height: 100%;
3672
- }
3673
-
3674
- uc-editor-image-fader.uc-active_from_viewer {
3675
- z-index: 3;
3676
- transform: scale(1);
3677
- opacity: 1;
3678
- transition:
3679
- transform var(--transition-duration-4),
3680
- opacity var(--transition-duration-3) steps(1, jump-start);
3681
- pointer-events: auto;
3682
- }
3683
-
3684
- uc-editor-image-fader.uc-active_from_cropper {
3685
- z-index: 3;
3686
- transform: scale(1);
3687
- opacity: 1;
3688
- transition:
3689
- transform var(--transition-duration-4),
3690
- opacity var(--transition-duration-3) steps(1, jump-end);
3691
- pointer-events: auto;
3692
- }
3693
-
3694
- uc-editor-image-fader.uc-inactive_to_cropper {
3695
- z-index: 3;
3696
- transform: scale(1);
3697
- opacity: 0;
3698
- transition:
3699
- transform var(--transition-duration-4),
3700
- opacity var(--transition-duration-3) steps(1, jump-end);
3701
- pointer-events: none;
3702
- }
3703
-
3704
- uc-editor-image-fader .uc-fader-image {
3705
- position: absolute;
3706
- top: 0px;
3707
- left: 0px;
3708
- display: block;
3709
- width: 100%;
3710
- height: 100%;
3711
- object-fit: scale-down;
3712
- transform: scale(1);
3713
- user-select: none;
3714
- content-visibility: auto;
3715
- }
3716
-
3717
- uc-editor-image-fader .uc-fader-image--preview {
3718
- background-color: var(--color-image-background);
3719
- border-top-left-radius: var(--border-radius-base);
3720
- border-top-right-radius: var(--border-radius-base);
3721
- transform: scale(1);
3722
- opacity: 0;
3723
- transition: var(--transition-duration-3);
3724
- }
3725
-
3726
- uc-editor-scroller {
3727
- display: flex;
3728
- align-items: center;
3729
- width: 100%;
3730
- height: 100%;
3731
- overflow-x: scroll;
3732
- }
3733
-
3734
- uc-editor-slider {
3735
- display: flex;
3736
- align-items: center;
3737
- justify-content: center;
3738
- width: 100%;
3739
- height: var(--size-panel-heading);
3740
- }
3741
-
3742
- uc-editor-toolbar {
3743
- position: relative;
3744
- width: 100%;
3745
- height: 100%;
3746
- }
3747
-
3748
- @media only screen and (max-width: 600px) {
3749
- uc-editor-toolbar {
3750
- --l-tab-gap: var(--cldtr-gap-mid-1);
3751
- --l-slider-padding: var(--uc-padding);
3752
- --l-controls-padding: var(--uc-padding);
3753
- }
3754
- }
3755
-
3756
- @media only screen and (min-width: 601px) {
3757
- uc-editor-toolbar {
3758
- --l-tab-gap: var(--cldtr-gap-max);
3759
- --l-slider-padding: var(--uc-padding);
3760
- --l-controls-padding: var(--uc-padding);
3761
- }
3762
- }
3763
-
3764
- uc-editor-toolbar > .uc-toolbar-container {
3765
- position: relative;
3766
- width: 100%;
3767
- height: 100%;
3768
- overflow: hidden;
3769
- }
3770
-
3771
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar {
3772
- position: absolute;
3773
- display: grid;
3774
- grid-template-rows: 1fr 1fr;
3775
- width: 100%;
3776
- height: 100%;
3777
- background-color: var(--color-fill-contrast);
3778
- transition:
3779
- opacity var(--transition-duration-3) ease-in-out,
3780
- transform var(--transition-duration-3) ease-in-out,
3781
- visibility var(--transition-duration-3) ease-in-out;
3782
- }
3783
-
3784
- .uc-sub-toolbar > .uc-list-aspect-ratio-container > .uc-list-aspect-ratio {
3785
- display: grid;
3786
- grid-auto-flow: column;
3787
- justify-content: center;
3788
- align-items: center;
3789
- gap: 6px;
3790
- height: var(--size-panel-heading);
3791
- }
3792
-
3793
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--visible {
3794
- transform: translateY(0px);
3795
- opacity: 1;
3796
- pointer-events: auto;
3797
- }
3798
-
3799
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--top-hidden {
3800
- transform: translateY(100%);
3801
- opacity: 0;
3802
- pointer-events: none;
3803
- }
3804
-
3805
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--bottom-hidden {
3806
- transform: translateY(-100%);
3807
- opacity: 0;
3808
- pointer-events: none;
3809
- }
3810
-
3811
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row {
3812
- display: flex;
3813
- align-items: center;
3814
- justify-content: space-between;
3815
- padding-right: var(--l-controls-padding);
3816
- padding-left: var(--l-controls-padding);
3817
- }
3818
-
3819
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles {
3820
- position: relative;
3821
- display: grid;
3822
- grid-auto-flow: column;
3823
- gap: 0px var(--l-tab-gap);
3824
- align-items: center;
3825
- height: 100%;
3826
- }
3827
-
3828
- uc-editor-toolbar
3829
- > .uc-toolbar-container
3830
- > .uc-sub-toolbar
3831
- > .uc-controls-row
3832
- > .uc-tab-toggles
3833
- > .uc-tab-toggles_indicator {
3834
- position: absolute;
3835
- bottom: 0px;
3836
- left: 0px;
3837
- width: var(--size-touch-area);
3838
- height: 2px;
3839
- background-color: var(--uc-secondary-foreground);
3840
- transform: translateX(0px);
3841
- transition: transform var(--transition-duration-3);
3842
- }
3843
-
3844
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row {
3845
- position: relative;
3846
- }
3847
-
3848
- uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row > .uc-tab-content {
3849
- position: absolute;
3850
- top: 0px;
3851
- left: 0px;
3852
- display: flex;
3853
- width: 100%;
3854
- height: 100%;
3855
- overflow: hidden;
3856
- content-visibility: auto;
3857
- }
3858
-
3859
- uc-editor-toolbar
3860
- > .uc-toolbar-container
3861
- > .uc-sub-toolbar
3862
- > .uc-controls-row
3863
- > .uc-tab-toggles
3864
- > .uc-tab-toggle.uc-tab-toggle--visible {
3865
- display: contents;
3866
- }
3867
-
3868
- uc-editor-toolbar
3869
- > .uc-toolbar-container
3870
- > .uc-sub-toolbar
3871
- > .uc-controls-row
3872
- > .uc-tab-toggles
3873
- > .uc-tab-toggle.uc-tab-toggle--hidden {
3874
- display: none;
3875
- }
3876
-
3877
- uc-editor-toolbar
3878
- > .uc-toolbar-container
3879
- > .uc-sub-toolbar
3880
- > .uc-controls-row
3881
- > .uc-tab-toggles.uc-tab-toggles--hidden {
3882
- display: none;
3883
- }
3884
-
3885
- uc-editor-toolbar
3886
- > .uc-toolbar-container
3887
- > .uc-sub-toolbar
3888
- > .uc-controls-row
3889
- > .uc-tab-toggles
3890
- > .uc-tab-toggle
3891
- > uc-btn-ui {
3892
- width: var(--uc-button-size);
3893
- }
3894
-
3895
- uc-editor-toolbar
3896
- > .uc-toolbar-container
3897
- > .uc-sub-toolbar
3898
- > .uc-controls-row
3899
- > .uc-tab-toggles
3900
- > .uc-tab-toggle
3901
- > uc-btn-ui
3902
- > uc-icon
3903
- > svg {
3904
- width: var(--size-icon);
3905
- height: var(--size-icon);
3906
- }
3907
-
3908
- uc-editor-toolbar
3909
- > .uc-toolbar-container
3910
- > .uc-sub-toolbar
3911
- > .uc-tab-content-row
3912
- > .uc-tab-content
3913
- .uc-controls-list_align {
3914
- display: grid;
3915
- grid-template-areas: ". inner .";
3916
- grid-template-columns: 1fr auto 1fr;
3917
- box-sizing: border-box;
3918
- min-width: 100%;
3919
- padding-left: var(--uc-padding);
3920
- }
3921
-
3922
- uc-editor-toolbar
3923
- > .uc-toolbar-container
3924
- > .uc-sub-toolbar
3925
- > .uc-tab-content-row
3926
- > .uc-tab-content
3927
- .uc-controls-list_inner {
3928
- display: grid;
3929
- grid-area: inner;
3930
- grid-auto-flow: column;
3931
- gap: 6px;
3932
- }
3933
-
3934
- uc-editor-toolbar
3935
- > .uc-toolbar-container
3936
- > .uc-sub-toolbar
3937
- > .uc-tab-content-row
3938
- > .uc-tab-content
3939
- .uc-controls-list_inner:last-child {
3940
- padding-right: var(--uc-padding);
3941
- }
3942
-
3943
- uc-editor-toolbar .uc-info-tooltip_container {
3944
- position: absolute;
3945
- display: flex;
3946
- align-items: flex-start;
3947
- justify-content: center;
3948
- width: 100%;
3949
- height: 100%;
3950
- }
3951
-
3952
- uc-editor-toolbar .uc-info-tooltip_wrapper {
3953
- position: absolute;
3954
- top: calc(-100% - var(--cldtr-gap-mid-2));
3955
- display: flex;
3956
- flex-direction: column;
3957
- justify-content: flex-end;
3958
- height: 100%;
3959
- pointer-events: none;
3960
- }
3961
-
3962
- uc-editor-toolbar .uc-info-tooltip {
3963
- z-index: 10;
3964
- padding: 3px 6px;
3965
- color: var(--color-text-base);
3966
- font-size: 0.7em;
3967
- letter-spacing: 1px;
3968
- text-transform: uppercase;
3969
- background-color: var(--color-text-accent-contrast);
3970
- border-radius: var(--border-radius-editor);
3971
- transform: translateY(100%);
3972
- opacity: 0;
3973
- transition: var(--transition-duration-3);
3974
- }
3975
-
3976
- uc-editor-toolbar .uc-info-tooltip_visible {
3977
- transform: translateY(0px);
3978
- opacity: 1;
3979
- }
3980
-
3981
- uc-editor-toolbar .uc-slider {
3982
- padding-right: var(--l-slider-padding);
3983
- padding-left: var(--l-slider-padding);
3984
- }
3985
-
3986
- uc-btn-ui > button {
3987
- --filter-effect: var(--idle-brightness);
3988
- --opacity-effect: var(--idle-opacity);
3989
- --color-effect: var(--idle-color-rgb);
3990
- --background-effect: var(--idle-background);
3991
- --l-transition-effect: var(
3992
- --css-transition,
3993
- color var(--transition-duration-2),
3994
- background-color var(--transition-duration-2),
3995
- filter var(--transition-duration-2)
3996
- );
3997
-
3998
- all: unset;
3999
- display: inline-flex;
4000
- align-items: center;
4001
- box-sizing: var(--css-box-sizing, border-box);
4002
- height: var(--css-height, var(--uc-button-size));
4003
- padding-right: var(--css-padding-right, 14px);
4004
- padding-left: var(--css-padding-left, 14px);
4005
- font-size: 1em;
4006
- color: var(--color-effect);
4007
- background-color: var(--background-effect);
4008
- border-radius: var(--uc-radius);
4009
- opacity: var(--opacity-effect);
4010
- cursor: pointer;
4011
- filter: brightness(var(--filter-effect));
4012
- transition: var(--l-transition-effect);
4013
- user-select: none;
4014
- }
4015
-
4016
- uc-btn-ui > button > uc-icon {
4017
- pointer-events: none;
4018
- }
4019
-
4020
- uc-btn-ui .uc-text {
4021
- white-space: nowrap;
4022
- }
4023
-
4024
- uc-btn-ui .uc-icon {
4025
- display: flex;
4026
- align-items: center;
4027
- justify-content: center;
4028
- color: var(--color-effect);
4029
- filter: brightness(var(--filter-effect));
4030
- transition: var(--l-transition-effect);
4031
- }
4032
-
4033
- uc-btn-ui .uc-icon_left {
4034
- margin-right: var(--cldtr-gap-mid-1);
4035
- margin-left: 0px;
4036
- }
4037
-
4038
- uc-btn-ui .uc-icon_right {
4039
- margin-right: 0px;
4040
- margin-left: var(--cldtr-gap-mid-1);
4041
- }
4042
-
4043
- uc-btn-ui .uc-icon_single {
4044
- margin-right: 0px;
4045
- margin-left: 0px;
4046
- }
4047
-
4048
- uc-btn-ui .uc-icon_hidden {
4049
- display: none;
4050
- margin: 0;
4051
- }
4052
-
4053
- uc-btn-ui.uc-primary > button {
4054
- --idle-color-rgb: var(--uc-primary-foreground);
4055
- --idle-brightness: 1;
4056
- --idle-opacity: 1;
4057
- --idle-background: var(--uc-primary);
4058
- --hover-color-rgb: var(--uc-primary-foreground);
4059
- --hover-brightness: 1;
4060
- --hover-opacity: 1;
4061
- --hover-background: var(--uc-primary-hover);
4062
- --down-color-rgb: var(--uc-primary-foreground);
4063
- --down-brightness: 0.75;
4064
- --down-opacity: 1;
4065
- --down-background: var(--uc-primary);
4066
- --active-color-rgb: var(--uc-primary-foreground);
4067
- --active-brightness: 1;
4068
- --active-opacity: 1;
4069
- --active-background: var(--uc-primary);
4070
- }
4071
-
4072
- uc-btn-ui.uc-primary-icon > button {
4073
- --idle-color-rgb: var(--uc-primary);
4074
- --idle-brightness: 1;
4075
- --idle-opacity: 1;
4076
- --idle-background: transparent;
4077
- --hover-color-rgb: var(--uc-primary);
4078
- --hover-brightness: 1;
4079
- --hover-opacity: 1;
4080
- --hover-background: var(--uc-primary-transparent);
4081
- --down-color-rgb: var(--uc-primary);
4082
- --down-brightness: 0.75;
4083
- --down-opacity: 1;
4084
- --down-background: var(--uc-primary-transparent);
4085
- --active-color-rgb: var(--uc-primary-foreground);
4086
- --active-brightness: 1;
4087
- --active-opacity: 1;
4088
- --active-background: var(--uc-primary);
4089
-
4090
- padding: 0;
4091
- width: var(--uc-button-size);
4092
- }
4093
-
4094
- uc-btn-ui.uc-secondary > button {
4095
- --idle-color-rgb: var(--uc-secondary-foreground);
4096
- --idle-brightness: 1;
4097
- --idle-opacity: 1;
4098
- --idle-background: var(--uc-secondary);
4099
- --hover-color-rgb: var(--uc-secondary-foreground);
4100
- --hover-brightness: 1;
4101
- --hover-opacity: 1;
4102
- --hover-background: var(--uc-secondary-hover);
4103
- --down-color-rgb: var(--uc-secondary-foreground);
4104
- --down-brightness: 1;
4105
- --down-opacity: 1;
4106
- --down-background: var(--uc-secondary-hover);
4107
- --active-color-rgb: var(--uc-secondary-foreground);
4108
- --active-brightness: 1;
4109
- --active-opacity: 1;
4110
- --active-background: transparent;
4111
- }
4112
-
4113
- :where(.uc-contrast) uc-btn-ui.uc-secondary > button {
4114
- border: 1px solid var(--uc-border);
4115
- }
4116
-
4117
- uc-btn-ui.uc-secondary-icon > button {
4118
- --idle-color-rgb: var(--uc-secondary-foreground);
4119
- --idle-brightness: 1;
4120
- --idle-opacity: 1;
4121
- --idle-background: transparent;
4122
- --hover-color-rgb: var(--uc-secondary-foreground);
4123
- --hover-brightness: 1;
4124
- --hover-opacity: 1;
4125
- --hover-background: var(--uc-secondary);
4126
- --down-color-rgb: var(--uc-secondary-foreground);
4127
- --down-brightness: 1;
4128
- --down-opacity: 1;
4129
- --down-background: var(--uc-secondary);
4130
- --active-color-rgb: var(--uc-secondary-foreground);
4131
- --active-brightness: 1;
4132
- --active-opacity: 1;
4133
- --active-background: transparent;
4134
-
4135
- padding: 0;
4136
- width: var(--uc-button-size);
4137
- }
4138
-
4139
- uc-btn-ui.uc-tab > button {
4140
- --idle-color-rgb: var(--uc-secondary-foreground);
4141
- --idle-brightness: 1;
4142
- --idle-opacity: 1;
4143
- --idle-background: transparent;
4144
- --hover-color-rgb: var(--uc-secondary-foreground);
4145
- --hover-brightness: 1;
4146
- --hover-opacity: 1;
4147
- --hover-background: var(--uc-secondary);
4148
- --down-color-rgb: var(--uc-secondary-foreground);
4149
- --down-brightness: 1;
4150
- --down-opacity: 1;
4151
- --down-background: var(--uc-secondary);
4152
- --active-color-rgb: var(--uc-secondary-foreground);
4153
- --active-brightness: 1;
4154
- --active-opacity: 1;
4155
- --active-background: transparent;
4156
-
4157
- padding: 0;
4158
- width: var(--uc-button-size);
4159
- }
4160
-
4161
- uc-btn-ui.uc-default > button {
4162
- --idle-color-rgb: var(--uc-secondary-foreground);
4163
- --idle-brightness: 1;
4164
- --idle-opacity: 1;
4165
- --idle-background: var(--uc-secondary);
4166
- --hover-color-rgb: var(--uc-secondary-foreground);
4167
- --hover-brightness: 1;
4168
- --hover-opacity: 1;
4169
- --hover-background: var(--uc-secondary-hover);
4170
- --down-color-rgb: var(--uc-secondary-foreground);
4171
- --down-brightness: 0.75;
4172
- --down-opacity: 1;
4173
- --down-background: var(--uc-secondary);
4174
- --active-color-rgb: var(--uc-primary);
4175
- --active-brightness: 1;
4176
- --active-opacity: 1;
4177
- --active-background: var(--uc-primary-transparent);
4178
- }
4179
-
4180
- :where(.uc-contrast) uc-btn-ui.uc-default > button {
4181
- --idle-background: transparent;
4182
- --hover-background: var(--uc-secondary);
4183
- --active-background: var(--uc-foreground);
4184
- --active-color-rgb: var(--uc-background);
4185
- }
4186
-
4187
- uc-line-loader-ui {
4188
- position: absolute;
4189
- top: 0px;
4190
- left: 0px;
4191
- z-index: 9999;
4192
- width: 100%;
4193
- height: 2px;
4194
- opacity: 0.5;
4195
- }
4196
-
4197
- uc-line-loader-ui .uc-inner {
4198
- width: 25%;
4199
- max-width: 200px;
4200
- height: 100%;
4201
- }
4202
-
4203
- uc-line-loader-ui .uc-line {
4204
- width: 100%;
4205
- height: 100%;
4206
- background-color: var(--uc-primary);
4207
- transform: translateX(-101%);
4208
- transition: transform 1s;
4209
- }
4210
-
4211
- uc-slider-ui {
4212
- --l-thumb-size: 24px;
4213
- --l-zero-dot-size: 5px;
4214
- --l-zero-dot-offset: 2px;
4215
- --idle-color-rgb: var(--uc-foreground);
4216
- --hover-color-rgb: var(--uc-primary);
4217
- --down-color-rgb: var(--uc-primary);
4218
- --color-effect: var(--idle-color-rgb);
4219
- --l-color: var(--color-effect);
4220
-
4221
- position: relative;
4222
- display: flex;
4223
- align-items: center;
4224
- justify-content: center;
4225
- width: 100%;
4226
- height: calc(var(--l-thumb-size) + (var(--l-zero-dot-size) + var(--l-zero-dot-offset)) * 2);
4227
- }
4228
-
4229
- uc-slider-ui .uc-thumb {
4230
- position: absolute;
4231
- left: 0px;
4232
- width: var(--l-thumb-size);
4233
- height: var(--l-thumb-size);
4234
- background-color: var(--l-color);
4235
- border-radius: 50%;
4236
- transform: translateX(0px);
4237
- opacity: 1;
4238
- transition:
4239
- opacity var(--transition-duration-2),
4240
- background-color var(--transition-duration-2);
4241
- }
4242
-
4243
- uc-slider-ui .uc-steps {
4244
- position: absolute;
4245
- display: flex;
4246
- align-items: center;
4247
- justify-content: space-between;
4248
- box-sizing: border-box;
4249
- width: 100%;
4250
- height: 100%;
4251
- padding-right: calc(var(--l-thumb-size) / 2);
4252
- padding-left: calc(var(--l-thumb-size) / 2);
4253
- }
4254
-
4255
- uc-slider-ui .uc-border-step {
4256
- width: 0px;
4257
- height: 10px;
4258
- border-right: 1px solid var(--uc-foreground);
4259
- opacity: 1;
4260
- transition: border-color var(--transition-duration-2);
4261
- }
4262
-
4263
- uc-slider-ui .uc-minor-step {
4264
- width: 0px;
4265
- height: 4px;
4266
- border-right: 1px solid var(--uc-foreground);
4267
- opacity: 0.6;
4268
- transition: border-color var(--transition-duration-2);
4269
- }
4270
-
4271
- uc-slider-ui .uc-zero-dot {
4272
- position: absolute;
4273
- top: calc(100% - var(--l-zero-dot-offset) * 2);
4274
- left: calc(var(--l-thumb-size) / 2 - var(--l-zero-dot-size) / 2);
4275
- width: var(--l-zero-dot-size);
4276
- height: var(--l-zero-dot-size);
4277
- background-color: var(--color-primary-accent);
4278
- border-radius: 50%;
4279
- opacity: 0;
4280
- transition: var(--transition-duration-3);
4281
- }
4282
-
4283
- uc-slider-ui .uc-input {
4284
- position: absolute;
4285
- width: calc(100% - 10px);
4286
- height: 100%;
4287
- margin: 0;
4288
- cursor: pointer;
4289
- opacity: 0;
4290
- }
4291
-
4292
- uc-presence-toggle.uc-transition {
4293
- transition:
4294
- opacity var(--transition-duration-3),
4295
- visibility var(--transition-duration-3);
4296
- }
4297
-
4298
- uc-presence-toggle.uc-visible {
4299
- opacity: 1;
4300
- pointer-events: inherit;
4301
- }
4302
-
4303
- uc-presence-toggle.uc-hidden {
4304
- opacity: 0;
4305
- pointer-events: none;
4306
- }
4307
-
4308
- uc-presence-toggle.uc-initial {
4309
- display: none !important;
4310
- transition: none !important;
4311
- }
4312
-
4313
- [uc-cloud-image-editor] [role="button"]:focus-visible,
4314
- [uc-cloud-image-editor] button:focus-visible {
4315
- outline: 1px auto Highlight;
4316
- outline: 1px auto -webkit-focus-ring-color;
4317
- }
4318
-
4319
- [uc-cloud-image-editor] .uc-cloud-mask {
4320
- pointer-events: none;
4321
- }
4322
-
4323
- [uc-aspect-ratio-freeform] button {
4324
- display: flex;
4325
- }
4326
-
4327
- [uc-aspect-ratio-freeform] uc-icon {
4328
- display: none;
4329
- }
4330
-
4331
- [uc-aspect-ratio-freeform] .uc-title {
4332
- padding-left: var(--cldtr-gap-mid-1);
4333
- }
4334
-
4335
- :where(uc-editor-freeform-button-control, uc-editor-aspect-ratio-button-control:last-of-type) {
4336
- margin-right: calc(3 * var(--cldtr-gap-mid-1));
4337
- }
4338
- }
4339
- @layer uc.solutions {
4340
- :where([uc-cloud-image-editor]) uc-icon {
4341
- display: flex;
4342
- justify-content: center;
4343
- width: 100%;
4344
- height: 100%;
4345
- }
4346
-
4347
- :where([uc-cloud-image-editor]) uc-icon svg {
4348
- width: calc(var(--uc-button-size) / 2);
4349
- height: calc(var(--uc-button-size) / 2);
4350
- }
4351
- }
4352
- /*$vite$:1*/
1
+ /**
2
+ * @license
3
+ * Package: @uploadcare/file-uploader@1.28.0-alpha.666 (MIT)
4
+ * License: https://github.com/uploadcare/blob/main/LICENSE
5
+ * Built: 2026-03-12T12:26:12.132Z
6
+ */
7
+ @layer uc,uc.base,uc.components,uc.rules,uc.solutions,uc.post-reset,uc.base,uc.rules,uc.post-reset;@layer uc.components{uc-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--uc-button-size);height:var(--uc-button-size)}uc-icon svg{width:calc(var(--uc-button-size) / 2);height:calc(var(--uc-button-size) / 2);overflow:visible}}@layer uc.components{@supports selector(dialog::backdrop){:where([uc-modal])>dialog::backdrop{background-color:#0000001a}:where([uc-modal])[strokes]>dialog::backdrop{background-image:var(--modal-backdrop-background-image)}}:where([uc-modal])>dialog[open]{transform:translateY(0);visibility:visible;opacity:1}:where([uc-modal])>dialog:not([open]){transform:translateY(20px);visibility:hidden;opacity:0}:where([uc-modal])>dialog{display:flex;flex-direction:column;width:min(var(--uc-dialog-width),100%);max-width:min(calc(100% - var(--uc-padding) * 2),var(--uc-dialog-max-width));min-height:var(--uc-button-size);max-height:min(calc(100% - var(--uc-padding) * 2),var(--uc-dialog-max-height));margin:auto;padding:0;overflow:hidden;background-color:var(--uc-background);border:0;border-radius:calc(var(--uc-radius) * 1.75);box-shadow:var(--uc-dialog-shadow);transition:transform .4s ease,opacity .4s ease}:where(.uc-contrast) :where([uc-modal])>dialog{outline:1px solid var(--uc-border)}}@layer uc.components{uc-copyright{display:flex;width:100%;justify-content:center}uc-copyright .uc-credits{all:unset;position:absolute;bottom:12px;background-color:var(--uc-background);padding:2px 5px;border-radius:6px;color:var(--uc-muted-foreground);font-weight:400;font-size:12px;opacity:.9;cursor:pointer;transition:opacity var(--uc-transition),background-color var(--uc-transition)}uc-copyright .uc-credits:focus-visible{outline:1px auto Highlight;outline:1px auto -webkit-focus-ring-color}uc-copyright .uc-credits:hover{opacity:1;background-color:var(--uc-muted)}}@layer uc.components{uc-progress-bar{--visible-opacity: 1;--l-progress-value: 0;position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none;transition:opacity .3s;opacity:1}uc-progress-bar.uc-progress-bar--hidden{opacity:0}uc-progress-bar .uc-progress{position:absolute;width:calc(var(--l-progress-value) * 1%);height:100%;background-color:var(--uc-primary);transform:translate(0);opacity:var(--visible-opacity);transition:width .6s,opacity .3s}uc-progress-bar .uc-progress--hidden{opacity:0;transition:opacity .3s}uc-progress-bar .uc-fake-progress{--l-fake-progress-width: 30;position:absolute;width:calc(var(--l-fake-progress-width) * 1%);height:100%;background-color:var(--uc-primary);animation:fake-progress-animation 1s ease-in-out infinite;opacity:var(--visible-opacity);transition:opacity .3s;z-index:1}uc-progress-bar .uc-fake-progress--hidden{opacity:0;animation:none}@keyframes fake-progress-animation{0%{transform:translate(-100%)}to{transform:translate(calc(100 / var(--l-fake-progress-width) * 100 * 1%))}}}@layer uc.components{uc-progress-bar-common{position:fixed;right:0;bottom:0;left:0;z-index:10000;display:block;height:10px;background-color:var(--uc-background);transition:opacity .3s}uc-progress-bar-common:not([active]){opacity:0;pointer-events:none}}@layer uc.components{uc-select{display:inline-flex}uc-select select{position:relative;display:inline-flex;align-items:center;justify-content:center;height:var(--uc-button-size);padding:0 14px;font-size:1em;font-family:inherit;white-space:nowrap;border:none;border-radius:var(--uc-radius);cursor:pointer;user-select:none;transition:background-color var(--uc-transition);color:var(--uc-secondary-foreground);background-color:var(--uc-secondary)}}@layer uc.components{uc-source-btn>button{display:flex;align-items:center;margin-bottom:2px;padding:2px var(--uc-padding);color:var(--uc-foreground);border-radius:var(--uc-radius);cursor:pointer;transition:background-color var(--uc-transition),color var(--uc-transition);user-select:none;width:100%;background-color:unset;height:unset}uc-source-btn:last-child>button{margin-bottom:0}uc-source-btn>button:hover{background-color:var(--uc-primary-transparent)}:where(.uc-contrast) uc-source-btn>button:hover{background-color:var(--uc-secondary);color:var(--uc-foreground)}uc-source-btn uc-icon{display:inline-flex;flex-grow:1;justify-content:center;min-width:var(--uc-button-size);margin-right:var(--uc-padding);opacity:.8}:where(.uc-contrast) uc-source-btn uc-icon{opacity:1}uc-source-btn .uc-txt{display:flex;align-items:center;box-sizing:border-box;width:100%;height:var(--uc-button-size);padding:0;white-space:nowrap;border:none}}@layer uc.components{@keyframes uc-spinner-keyframes{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.uc-spinner{width:1em;height:1em;border:solid 2px transparent;border-top-color:currentColor;border-left-color:currentColor;border-radius:50%;animation:uc-spinner-keyframes .4s linear infinite}}@layer uc.components{uc-thumb{width:100%;height:100%}.uc-thumb{position:relative;overflow:hidden;width:100%;height:100%}.uc-thumb__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}}@layer uc.components{:is(uc-activity-header,.uc-ui-activity-header){display:flex;justify-content:space-between;gap:var(--uc-padding);padding:var(--uc-padding);color:var(--uc-foreground);font-weight:500;font-size:1em}:is(uc-activity-header,.uc-ui-activity-header)>*{display:flex;align-items:center}:is(uc-activity-header,.uc-ui-activity-header)>div>uc-icon{width:auto}:is(uc-activity-header,.uc-ui-activity-header)>div{gap:var(--uc-padding)}}@layer uc.components{uc-start-from{display:block;overflow-y:auto}uc-start-from .uc-content{display:grid;grid-auto-flow:row;gap:calc(var(--uc-padding) * 2);width:100%;height:100%;padding:calc(var(--uc-padding) * 2);background-color:var(--uc-background)}[uc-modal]>dialog:has(uc-start-from[active]){width:var(--uc-dialog-width)}[uc-modal] uc-start-from uc-drop-area{border-radius:var(--uc-radius)}@media only screen and (max-width:430px){[uc-modal] uc-start-from uc-drop-area{display:none}}}@layer uc.components{uc-upload-list{position:relative;display:flex;flex-direction:column;width:100%;height:max-content;overflow:hidden;background-color:var(--uc-background);transition:opacity var(--uc-transition)}uc-upload-list .uc-no-files{height:32px;padding:20px}uc-upload-list .uc-files{display:block;flex:1;min-height:32px;padding:0 var(--uc-padding);overflow:auto}uc-upload-list .uc-files-wrapper{display:contents}uc-upload-list .uc-toolbar{display:flex;gap:4px;justify-content:space-between;padding:var(--uc-padding);background-color:var(--uc-background)}uc-upload-list .uc-toolbar-spacer{flex:1}uc-upload-list uc-drop-area{position:absolute;top:0;left:0;width:calc(100% - var(--uc-padding) * 2);height:calc(100% - var(--uc-padding) * 2);margin:var(--uc-padding);border-radius:var(--uc-radius)}uc-upload-list uc-activity-header>.uc-header-text{padding:0 var(--uc-padding)}uc-upload-list .uc-common-error{border-radius:var(--uc-radius);color:var(--uc-destructive-foreground);background-color:var(--uc-destructive);display:flex;align-items:center;justify-content:center;padding:var(--uc-padding);margin:4px var(--uc-padding) 0 var(--uc-padding);font-size:.925em}uc-upload-list .uc-add-more-btn uc-icon{display:none}uc-upload-list[mode=grid] .uc-files{display:flex;flex-wrap:wrap;gap:var(--uc-grid-gap)}uc-upload-list .uc-files .uc-add-more-btn,uc-upload-list[mode=grid] uc-file-item{flex:0 0 calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));max-width:calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));height:var(--uc-grid-preview-image-height);aspect-ratio:var(--uc-grid-aspect-ratio)}uc-upload-list .uc-files .uc-add-more-btn{display:none}}@layer uc.components{uc-file-item{--uc-file-item-gap: 4px;--uc-file-item-height: calc(var(--uc-preview-size) + var(--uc-padding) * 2 + var(--uc-file-item-gap));display:block;overflow:hidden;min-height:var(--uc-file-item-height)}uc-file-item:last-of-type{--uc-file-item-gap: 0}uc-file-item>.uc-inner{position:relative;display:grid;grid-template-columns:var(--uc-preview-size) 1fr max-content;gap:2px;align-items:center;margin-bottom:var(--uc-file-item-gap);padding:var(--uc-padding);overflow:hidden;font-size:.925em;background-color:var(--uc-muted);border-radius:var(--uc-radius);transition:background-color var(--uc-transition)}uc-file-item>.uc-inner[data-focused]{background-color:transparent}uc-file-item>.uc-inner[data-uploading] .uc-edit-btn{display:none}uc-file-item>:where(.uc-inner[data-failed],.uc-inner[data-limit-overflow]){background-color:var(--uc-destructive)}uc-file-item .uc-thumb{position:relative;display:inline-flex;width:var(--uc-preview-size);height:var(--uc-preview-size);background-color:var(--uc-secondary);background-position:center center;background-repeat:no-repeat;background-size:cover;border-radius:var(--uc-radius)}uc-file-item .uc-file-name-wrapper{text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;max-width:100%;padding-right:var(--uc-padding);padding-left:var(--uc-padding);overflow:hidden;color:var(--uc-muted-foreground)}uc-file-item .uc-file-name{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}uc-file-item .uc-file-error{display:none;color:var(--uc-destructive-foreground);font-size:.85em;z-index:2}uc-file-item button.uc-remove-btn,uc-file-item button.uc-edit-btn{color:var(--uc-muted-foreground)}uc-file-item button svg{pointer-events:none}uc-file-item button.uc-upload-btn{display:none}uc-file-item .uc-badge{position:absolute;bottom:2px;right:2px;width:14px;height:14px;color:var(--uc-background);background-color:var(--uc-foreground);border-radius:50%;transform:scale(.3);opacity:0;transition:opacity var(--uc-transition),transform var(--uc-transition);display:flex;justify-content:center;align-items:center}uc-file-item>.uc-inner:where([data-failed],[data-limit-overflow],[data-finished]) .uc-badge{transform:scale(1);opacity:1}uc-file-item>.uc-inner:where([data-failed],[data-limit-overflow]) .uc-badge{background-color:var(--uc-destructive-foreground)}uc-file-item>.uc-inner:where([data-failed],[data-limit-overflow]) .uc-file-error{display:block}uc-file-item .uc-badge uc-icon,uc-file-item .uc-badge uc-icon svg{width:100%;height:100%}uc-file-item .uc-progress-bar{--visible-opacity: .7;top:calc(100% - 2px);height:2px}:where(.uc-contrast) uc-file-item .uc-progress-bar{--visible-opacity: 1}uc-file-item .uc-file-actions{display:flex;gap:2px;align-items:center;justify-content:center}uc-file-item[mode=grid]{overflow:visible;min-height:initial}uc-file-item[mode=grid] .uc-inner{height:100%;grid-template-columns:1fr;grid-template-rows:1fr max-content;padding:0;background-color:transparent;margin-bottom:0;border-radius:0}uc-file-item[mode=grid] .uc-inner[data-failed] .uc-badge{display:none}uc-file-item[mode=grid] .uc-thumb{width:100%;height:100%}uc-file-item[mode=grid] .uc-badge{right:var(--uc-padding);bottom:var(--uc-padding)}uc-file-item[mode=grid] .uc-file-name-wrapper{padding:0}uc-file-item[mode=grid] .uc-file-name:not([hidden])+.uc-file-error{bottom:calc(var(--uc-padding) + var(--uc-font-size))}uc-file-item[mode=grid] .uc-file-error{position:absolute;background-color:var(--uc-destructive-foreground);border-radius:var(--uc-radius);color:var(--uc-background);bottom:var(--uc-padding);left:var(--uc-padding);right:var(--uc-padding);padding:calc(var(--uc-padding) / 2) var(--uc-padding)}uc-file-item[mode=grid] .uc-file-hint{position:absolute;background-color:var(--uc-background);border-radius:var(--uc-radius);color:var(--uc-foreground);bottom:calc(var(--uc-padding) * 2);left:var(--uc-padding);right:var(--uc-padding);padding:calc(var(--uc-padding) / 2) var(--uc-padding)}uc-file-item[mode=grid] .uc-file-actions{position:absolute;top:var(--uc-padding);right:var(--uc-padding)}uc-file-item[mode=grid] button{background-color:var(--uc-background)}uc-file-item[mode=grid] button:hover{background-color:var(--uc-muted)}uc-file-item[mode=grid] .uc-progress-bar{width:initial;height:4px;top:initial;bottom:var(--uc-padding);left:var(--uc-padding);right:var(--uc-padding);border-radius:var(--uc-radius);z-index:1;transition:background-color .3s,opacity .3s;background-color:var(--uc-background)}uc-file-item[mode=grid] .uc-progress-bar :is(.uc-fake-progress,.uc-progress){background-color:var(--uc-primary)}uc-file-item[mode=grid] .uc-progress-bar[hasfilename]{bottom:calc(var(--uc-padding) + var(--uc-font-size))}}@layer uc.components{:where([uc-drop-area]){padding:2px;overflow:hidden;border:1px dashed var(--uc-border);border-radius:calc(var(--uc-radius) * 1.75);transition:border var(--uc-transition),border-radius var(--uc-transition)}:where([uc-drop-area]),:where([uc-drop-area]) .uc-content-wrapper{display:flex;align-items:center;justify-content:center;width:100%;height:100%}:where([uc-drop-area]) .uc-text{position:relative;margin:var(--uc-padding);color:var(--uc-muted-foreground);transition:color var(--uc-transition)}:where([uc-drop-area])[ghost][drag-state=inactive]{display:none}:where([uc-drop-area])[ghost]:not([fullscreen]):is([drag-state=active],[drag-state=near],[drag-state=over]){background:var(--uc-background)}:where([uc-drop-area]):is([drag-state=active],[drag-state=near],[drag-state=over],:hover){background:var(--uc-primary-transparent);border-color:var(--uc-primary-transparent)}:where(.uc-contrast) :where([uc-drop-area]):is([drag-state=active],[drag-state=near],[drag-state=over],:hover){color:var(--uc-foreground);background:transparent;border-color:var(--uc-foreground);border-width:2px;border-style:solid}:where([uc-drop-area]):is([drag-state=active],[drag-state=near]){opacity:1}:where([uc-drop-area])[drag-state=over]{border-color:var(--uc-primary);opacity:1}:where([uc-drop-area])[with-icon]{min-height:180px}:where([uc-drop-area])[with-icon] .uc-content-wrapper{display:flex;flex-direction:column}:where([uc-drop-area])[with-icon] .uc-text{color:var(--uc-foreground);font-weight:500;font-size:1.1em}:where([uc-drop-area])[with-icon] .uc-icon-container{position:relative;width:64px;height:64px;margin:var(--uc-padding);overflow:hidden;color:var(--uc-foreground);background-color:var(--uc-muted);border-radius:50%;transition:color var(--uc-transition),background-color var(--uc-transition)}:where([uc-drop-area])[with-icon] uc-icon{position:absolute;width:32px;height:32px;top:calc(50% - 16px);left:calc(50% - 16px);transition:transform var(--uc-transition)}:where([uc-drop-area])[with-icon] uc-icon:last-child{transform:translateY(48px)}:where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container,:where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-text{color:var(--uc-foreground)}:where([uc-drop-area])[with-icon]:hover .uc-icon-container{background-color:var(--uc-primary-transparent)}:where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container{background-color:var(--uc-muted)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper:is([drag-state=active],[drag-state=near],[drag-state=over]) .uc-icon-container{color:var(--uc-primary-foreground);background-color:var(--uc-primary)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper:is([drag-state=active],[drag-state=near],[drag-state=over]) .uc-text{color:var(--uc-foreground)}:where(.uc-contrast) :where([uc-drop-area])[with-icon]>.uc-content-wrapper:is([drag-state=active],[drag-state=near],[drag-state=over]) .uc-text{color:var(--uc-foreground)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper:is([drag-state=active],[drag-state=near],[drag-state=over]) uc-icon:first-child{transform:translateY(-48px)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper:is([drag-state=active],[drag-state=near],[drag-state=over]) uc-icon:last-child{transform:translateY(0)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper[drag-state=near] uc-icon:last-child{transform:scale(1.3)}:where([uc-drop-area])[with-icon]>.uc-content-wrapper[drag-state=over] uc-icon:last-child{transform:scale(1.5)}:where([uc-drop-area])[fullscreen]{position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;width:calc(100vw - var(--uc-padding) * 2);height:calc(100vh - var(--uc-padding) * 2);margin:var(--uc-padding)}:where([uc-drop-area])[fullscreen] .uc-content-wrapper{width:100%;max-width:calc(var(--uc-dialog-width) * .8);height:180px;color:var(--uc-foreground);background-color:var(--uc-background);border-radius:calc(var(--uc-radius) * 1.75);box-shadow:var(--uc-dialog-shadow);transition:color var(--uc-transition),background-color var(--uc-transition),box-shadow var(--uc-transition),border-radius var(--uc-transition),transform var(--uc-transition)}:where([uc-drop-area])[with-icon][fullscreen][drag-state=active]>.uc-content-wrapper,:where([uc-drop-area])[with-icon][fullscreen][drag-state=near]>.uc-content-wrapper{transform:translateY(10px);opacity:0}:where([uc-drop-area])[with-icon][fullscreen][drag-state=over]>.uc-content-wrapper{transform:translateY(0);opacity:1}:is(:where([uc-drop-area])[with-icon][fullscreen])>.uc-content-wrapper uc-icon:first-child{transform:translateY(-48px)}:where([uc-drop-area])[clickable]{cursor:pointer}}@layer uc.components{uc-config{display:none}}@layer uc.components{:where([uc-simple-btn]){position:relative;display:inline-flex}:where([uc-simple-btn]) button{height:auto;gap:.5em;padding:var(--uc-simple-btn-padding);background-color:var(--uc-simple-btn);color:var(--uc-simple-btn-foreground);font-size:var(--uc-simple-btn-font-size);font-family:var(--uc-simple-btn-font-family)}:where([uc-simple-btn]) button uc-icon{width:auto;height:auto}:where([uc-simple-btn]) button uc-icon svg{width:.9em;height:.9em}:where([uc-simple-btn]) button:hover{background-color:var(--uc-simple-btn-hover)}:where([uc-simple-btn])>uc-drop-area{display:contents}:where([uc-simple-btn]) .uc-visual-drop-area{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:var(--uc-simple-btn-padding);background-color:transparent;color:transparent;font-size:var(--uc-simple-btn-font-size);border:1px dashed var(--uc-simple-btn-foreground);border-radius:inherit;opacity:0;transition:opacity var(--uc-transition)}:where([uc-simple-btn])>uc-drop-area[drag-state=active] .uc-visual-drop-area{opacity:1}:where([uc-simple-btn])>uc-drop-area[drag-state=inactive] .uc-visual-drop-area{opacity:0}:where([uc-simple-btn])>uc-drop-area[drag-state=near] .uc-visual-drop-area{opacity:1}:where([uc-simple-btn])>uc-drop-area[drag-state=over] .uc-visual-drop-area{opacity:1}}@layer uc.components{uc-plugin-activity-host{position:relative;display:flex;width:100%;height:100%;overflow:hidden}}@layer uc.solutions;@layer uc.components{uc-cloud-image-editor-activity{position:relative;display:flex;width:100%;height:100%;overflow:hidden;background-color:var(--uc-background)}[uc-modal]>dialog:has([activity=cloud-image-edit][active]){width:100%;height:100%}}@layer uc.components{uc-url-source{display:block;background-color:var(--uc-background)}uc-url-source>.uc-content{display:grid;gap:4px;grid-template-columns:1fr min-content;padding:var(--uc-padding);padding-top:0}uc-url-source .uc-url-input{display:flex}}@layer uc.components{uc-external-source{display:flex;flex-direction:column;width:100%;height:100%;background-color:var(--uc-background);overflow:hidden;position:relative}[uc-modal]>dialog:has([activity=external][active]){width:100%;height:100%}uc-external-source>.uc-content{position:relative;display:grid;flex:1;grid-template-rows:1fr min-content}uc-external-source iframe{display:block;width:100%;height:100%;border:none}uc-external-source .uc-iframe-wrapper{overflow:hidden}uc-external-source .uc-toolbar{display:flex;width:100%;gap:var(--uc-padding);align-items:center;justify-content:space-between;padding:var(--uc-padding);border-top:1px solid var(--uc-border)}uc-external-source .uc-back-btn{padding-left:0}uc-external-source .uc-selection-status-box{color:var(--uc-foreground);display:flex;flex-direction:column;align-items:center;justify-content:center}uc-external-source .uc-selection-status-box button{color:var(--uc-primary);height:auto;padding:0;background:none}uc-external-source .uc-selection-status-box button:hover{text-decoration:underline}uc-external-source uc-activity-header{position:absolute;width:100%;justify-content:flex-end;z-index:1;left:0;top:0;right:0;pointer-events:none}uc-external-source uc-activity-header .uc-close-btn{pointer-events:auto}uc-external-source .uc-done-btn>span.uc-hidden{visibility:hidden;pointer-events:none}uc-external-source .uc-done-btn>uc-spinner{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center}}@layer uc.components{uc-camera-source{position:relative;display:flex;flex-direction:column;width:100%;height:100%;max-height:100%;overflow:hidden;background-color:var(--uc-background);border-radius:var(--uc-radius)}[uc-modal]>dialog:has([activity=camera][active]){width:100%;height:100%}uc-camera-source video{display:block;width:100%;max-height:100%;object-fit:contain;object-position:center center;background-color:var(--uc-muted);border-radius:var(--uc-radius)}uc-camera-source .uc-toolbar{position:absolute;bottom:0;display:flex;justify-content:space-between;width:100%;padding:var(--uc-padding);background-color:var(--uc-background)}uc-camera-source .uc-content{display:flex;flex:1;justify-content:center;width:100%;height:100%;padding:var(--uc-padding);padding-top:0;overflow:hidden}uc-camera-source .uc-message-box{display:flex;flex-direction:column;gap:40px;align-items:center;justify-content:center;padding:40px 40px 0;color:var(--uc-foreground)}uc-camera-source .uc-message-box button{color:var(--uc-primary-foreground);background-color:var(--uc-primary)}uc-camera-source .uc-shot-btn{width:58px;height:58px;color:var(--uc-background);background-color:var(--uc-primary-light);border-radius:50%;opacity:.85;transition:bottom var(--uc-transition),opacity var(--uc-transition),transform var(--uc-transition)}uc-camera-source .uc-shot-btn:hover{transform:scale(1.05);opacity:1}uc-camera-source .uc-shot-btn:active{transform:scale(1);opacity:1}uc-camera-source .uc-shot-btn[disabled]{bottom:-80px}uc-camera-source .uc-shot-btn uc-icon svg{width:20px;height:20px}uc-camera-source .uc-controls{position:relative;display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;padding:0 var(--uc-padding) var(--uc-padding);min-height:74px}uc-camera-source:not(.uc-initialized) .uc-controls{display:none}uc-camera-source .uc-switcher{display:flex;gap:calc(var(--uc-padding) / 2)}uc-camera-source .uc-switch.uc-active{background-color:var(--uc-secondary)}uc-camera-source .uc-camera-actions{display:flex;justify-content:center;align-items:center;gap:5px}uc-camera-source .uc-stop-record{background-color:var(--uc-destructive-foreground-light);opacity:1}:where(uc-camera-source:is(.uc-recording)) .uc-recording-timer uc-icon{display:none}:where(uc-camera-source:is(.uc-recording)) .uc-recording-timer{pointer-events:none}uc-camera-source .uc-recording-timer{z-index:1;position:relative;overflow:hidden}:where(uc-camera-source) .uc-recording-timer uc-icon{width:10px;height:10px;margin-right:10px}uc-camera-source .uc-recording-timer .uc-line{position:absolute;content:"";bottom:0;left:0;right:0;height:2px;background-color:var(--uc-foreground-light);transform:scaleX(0);transform-origin:left;transition:transform var(--uc-transition)}uc-camera-source .uc-btn-microphone{z-index:1}uc-camera-source .uc-select{display:flex}uc-camera-source .uc-audio-select{width:98px}uc-camera-source .uc-audio-select select{width:100%}uc-camera-source .uc-camera-action{position:absolute;inset:0 var(--uc-padding) var(--uc-padding);margin:0 auto}}@layer uc.solutions{[uc-cloud-image-editor]{--color-primary-accent: var(--uc-primary);--color-text-base: var(--uc-foreground);--color-text-accent-contrast: var(--uc-background);--color-fill-contrast: var(--uc-background);--color-modal-backdrop: oklch(0% 0 0 / .1);--color-image-background: var(--uc-muted);--color-focus-ring: var(--color-primary-accent);--color-crop-guides: var(--uc-foreground);--font-size-ui: var(--uc-font-size);--size-touch-area: var(--uc-button-size);--size-panel-heading: calc(var(--uc-button-size) + var(--uc-padding) * 2);--size-ui-min-width: 130px;--size-line-width: 1px;--size-modal-width: 650px;--size-icon: calc(var(--uc-button-size) / 2);--border-radius-editor: var(--uc-radius);--border-radius-thumb: var(--uc-radius);--border-radius-ui: var(--uc-radius);--border-radius-base: var(--uc-radius);--cldtr-gap-min: 5px;--cldtr-gap-mid-1: 10px;--cldtr-gap-mid-2: 15px;--cldtr-gap-max: 20px;--transition-duration-2: var(--transition-duration-all, .2s);--transition-duration-3: var(--transition-duration-all, .3s);--transition-duration-4: var(--transition-duration-all, .4s);--transition-duration-5: var(--transition-duration-all, .5s);--modal-header-opacity: 1;--modal-header-height: var(--size-panel-heading);--modal-toolbar-height: var(--size-panel-heading);--transparent-pixel: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=);display:block;width:100%;height:100%;max-height:100%}[uc-cloud-image-editor] :is([can-handle-paste]:hover,[can-handle-paste]:focus){--can-handle-paste: "true"}[uc-cloud-image-editor] :is([tabindex]:focus-visible,[tabindex]:hover,[with-effects]:focus-visible,[with-effects]:hover){--filter-effect: var(--hover-filter) !important;--opacity-effect: var(--hover-opacity) !important;--color-effect: var(--hover-color-rgb) !important;--background-effect: var(--hover-background) !important}[uc-cloud-image-editor] :is([tabindex]:active,[with-effects]:active){--filter-effect: var(--down-filter) !important;--opacity-effect: var(--down-opacity) !important;--color-effect: var(--down-color-rgb) !important;--background-effect: var(--down-background) !important}[uc-cloud-image-editor] :is([tabindex][active],[with-effects][active]){--filter-effect: var(--active-filter) !important;--opacity-effect: var(--active-opacity) !important;--color-effect: var(--active-color-rgb) !important;--background-effect: var(--active-background) !important}[uc-cloud-image-editor] [hidden-scrollbar]::-webkit-scrollbar{display:none}[uc-cloud-image-editor] [hidden-scrollbar]{-ms-overflow-style:none;scrollbar-width:none}[uc-cloud-image-editor].uc-editor_ON{--modal-header-opacity: 0;--modal-header-height: 0px;--modal-toolbar-height: calc(var(--size-panel-heading) * 2)}[uc-cloud-image-editor].uc-editor_OFF{--modal-header-opacity: 1;--modal-header-height: var(--size-panel-heading);--modal-toolbar-height: var(--size-panel-heading)}[uc-cloud-image-editor]>.uc-wrapper{--l-min-img-height: var(--modal-toolbar-height);--l-max-img-height: 100%;--l-edit-button-width: 120px;--l-toolbar-horizontal-padding: var(--cldtr-gap-mid-1);position:relative;display:grid;grid-template-rows:minmax(var(--l-min-img-height),var(--l-max-img-height)) minmax(var(--modal-toolbar-height),auto);height:100%;overflow:hidden;overflow-y:auto}@media only screen and (max-width:800px){[uc-cloud-image-editor]>.uc-wrapper{--l-edit-button-width: 70px;--l-toolbar-horizontal-padding: var(--cldtr-gap-min)}}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport{display:flex;align-items:center;justify-content:center;overflow:hidden}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-image_container>.uc-image{--viewer-image-opacity: 1;position:absolute;top:0;left:0;z-index:10;display:block;box-sizing:border-box;width:100%;height:100%;object-fit:scale-down;background-color:var(--color-image-background);transform:scale(1);opacity:var(--viewer-image-opacity);user-select:none;pointer-events:auto}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-image_container>.uc-image.uc-image_visible_viewer{transition:opacity var(--transition-duration-3) ease-in-out,transform var(--transition-duration-4)}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-image_container>.uc-image.uc-image_hidden_to_cropper{--viewer-image-opacity: 0;background-image:var(--transparent-pixel);transform:scale(1);transition:transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);pointer-events:none}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-image_container>.uc-image.uc-image_hidden_effects{--viewer-image-opacity: 0;transform:scale(1);transition:opacity var(--transition-duration-3) cubic-bezier(.5,0,1,1),transform var(--transition-duration-4);pointer-events:none}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-image_container{position:relative;display:block;width:100%;height:100%;background-color:var(--color-image-background);transition:var(--transition-duration-3)}[uc-cloud-image-editor]>.uc-wrapper>.uc-toolbar{position:relative;transition:.3s}[uc-cloud-image-editor]>.uc-wrapper>.uc-toolbar>.uc-toolbar_content{position:absolute;bottom:0;left:0;box-sizing:border-box;width:100%;height:var(--modal-toolbar-height);min-height:var(--size-panel-heading);background-color:var(--color-fill-contrast)}[uc-cloud-image-editor]>.uc-wrapper>.uc-toolbar>.uc-toolbar_content.uc-toolbar_content__viewer{display:flex;align-items:center;justify-content:space-between;height:var(--size-panel-heading);padding-right:var(--l-toolbar-horizontal-padding);padding-left:var(--l-toolbar-horizontal-padding)}[uc-cloud-image-editor]>.uc-wrapper>.uc-toolbar>.uc-toolbar_content.uc-toolbar_content__editor{display:flex}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-info_pan{position:absolute;user-select:none}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-file_type_outer{position:absolute;z-index:2;display:flex;max-width:120px;transform:translate(-40px);user-select:none}[uc-cloud-image-editor]>.uc-wrapper>.uc-viewport>.uc-file_type_outer>.uc-file_type{padding:4px .8em}[uc-cloud-image-editor]>.uc-wrapper>.uc-network_problems_splash{position:absolute;z-index:999;display:flex;flex-direction:column;width:100%;height:100%;background-color:var(--color-fill-contrast)}[uc-cloud-image-editor]>.uc-wrapper>.uc-network_problems_splash>.uc-network_problems_content{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center}[uc-cloud-image-editor]>.uc-wrapper>.uc-network_problems_splash>.uc-network_problems_content>.uc-network_problems_icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--uc-foreground);background-color:var(--uc-muted);border-radius:50%}[uc-cloud-image-editor]>.uc-wrapper>.uc-network_problems_splash>.uc-network_problems_content>.uc-network_problems_text{margin-top:var(--cldtr-gap-max);font-size:var(--font-size-ui);color:var(--uc-foreground)}[uc-cloud-image-editor]>.uc-wrapper>.uc-network_problems_splash>.uc-network_problems_footer{display:flex;align-items:center;justify-content:center;height:var(--size-panel-heading)}uc-crop-frame>.uc-svg{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;border-top-left-radius:var(--border-radius-base);border-top-right-radius:var(--border-radius-base);opacity:inherit;transition:var(--transition-duration-3)}uc-crop-frame>.uc-thumb{--idle-color-rgb: var(--color-text-base);--hover-color-rgb: var(--color-primary-accent);--focus-color-rgb: var(--color-primary-accent);--down-color-rgb: var(--color-primary-accent);--color-effect: var(--idle-color-rgb);color:var(--color-effect);transition:color var(--transition-duration-3),opacity var(--transition-duration-3)}uc-crop-frame .uc-thumb--visible{opacity:1;pointer-events:auto}uc-crop-frame .uc-thumb--hidden{opacity:0;pointer-events:none}uc-crop-frame .uc-guides{transition:var(--transition-duration-3)}uc-crop-frame .uc-guides--hidden{opacity:0}uc-crop-frame .uc-guides--semi-hidden{opacity:.2}uc-crop-frame .uc-guides--visible{opacity:1}uc-editor-button-control,uc-editor-crop-button-control,uc-editor-aspect-ratio-button-control,uc-editor-freeform-button-control,uc-editor-filter-control,uc-editor-operation-control{--l-base-min-width: var(--uc-button-size);--l-base-height: var(--uc-button-size);--opacity-effect: var(--idle-opacity);--color-effect: var(--idle-color-rgb);--background-effect: var(--idle-background);--filter-effect: var(--idle-filter);--idle-color-rgb: var(--uc-secondary-foreground);--idle-opacity: 1;--idle-filter: 1;--idle-background: var(--uc-secondary);--hover-color-rgb: var(--uc-secondary-foreground);--hover-opacity: 1;--hover-filter: .8;--hover-background: var(--uc-secondary-hover);--down-color-rgb: var(--hover-color-rgb);--down-opacity: 1;--down-filter: .6;--down-background: var(--uc-secondary);border-radius:var(--uc-radius)}uc-editor-button-control>button,uc-editor-crop-button-control>button,uc-editor-aspect-ratio-button-control>button,uc-editor-freeform-button-control>button,uc-editor-filter-control>button,uc-editor-operation-control>button{all:unset;position:relative;display:grid;grid-template-columns:var(--l-base-min-width) auto;grid-template-rows:100%;align-items:center;height:var(--l-base-height);color:var(--color-effect);opacity:var(--opacity-effect);cursor:pointer;transition:var(--l-width-transition)}uc-editor-freeform-button-control>button{grid-template-columns:auto var(--l-base-min-width)}uc-editor-freeform-button-control>button>uc-icon{margin-left:var(--cldtr-gap-mid-1);width:10px}:where(uc-editor-button-control,uc-editor-crop-button-control,uc-editor-aspect-ratio-button-control,uc-editor-freeform-button-control,uc-editor-filter-control,uc-editor-operation-control)>uc-icon>svg{width:var(--size-icon);height:var(--size-icon)}uc-editor-filter-control>uc-icon.uc-original-icon>svg{width:100%;height:100%}uc-editor-button-control.uc-active,uc-editor-operation-control.uc-active,uc-editor-crop-button-control.uc-active,uc-editor-aspect-ratio-button-control.uc-active,uc-editor-freeform-button-control.uc-active,uc-editor-filter-control.uc-active{--idle-color-rgb: var(--uc-primary-foreground);--idle-background: var(--uc-primary);--idle-opacity: 1;--hover-color-rgb: var(--uc-primary-foreground);--hover-background: var(--uc-primary);--hover-opacity: 1}uc-editor-button-control.uc-not_active,uc-editor-operation-control.uc-not_active,uc-editor-crop-button-control.uc-not_active,uc-editor-aspect-ratio-button-control.uc-not_active,uc-editor-freeform-button-control.uc-not_active,uc-editor-filter-control.uc-not_active{--idle-color-rgb: var(--uc-secondary-foreground)}:where(.uc-contrast) uc-editor-button-control.uc-not_active,:where(.uc-contrast) uc-editor-operation-control.uc-not_active,:where(.uc-contrast) uc-editor-crop-button-control.uc-not_active,:where(.uc-contrast) uc-editor-freeform-button-control.uc-not_active,:where(.uc-contrast) uc-editor-aspect-ratio-button-control.uc-not_active,:where(.uc-contrast) uc-editor-filter-control.uc-not_active{--idle-background: transparent;--hover-background: var(--uc-secondary);outline:1px solid var(--uc-border);outline-offset:-1px}uc-editor-button-control>button:before,uc-editor-operation-control>button:before,uc-editor-crop-button-control>button:before,uc-editor-freeform-button-control>button:before,uc-editor-aspect-ratio-button-control>button:before,uc-editor-filter-control>button:before{position:absolute;content:"";right:0;left:0;z-index:-1;width:100%;height:100%;background-color:var(--background-effect);border-radius:var(--border-radius-editor);transition:var(--transition-duration-3)}uc-editor-button-control>button .uc-title,uc-editor-operation-control>button .uc-title,uc-editor-crop-button-control>button .uc-title,uc-editor-aspect-ratio-button-control>button .uc-title,uc-editor-freeform-button-control>button .uc-title,uc-editor-filter-control>button .uc-title{padding-right:var(--cldtr-gap-mid-1);font-size:.7em;letter-spacing:1.004px;text-transform:uppercase}uc-editor-freeform-button-control>button .uc-title{padding-left:var(--cldtr-gap-mid-1);padding-right:0}uc-editor-button-control>button uc-icon,uc-editor-operation-control>button uc-icon,uc-editor-crop-button-control>button uc-icon,uc-editor-aspect-ratio-button-control>button uc-icon,uc-editor-freeform-button-control>button uc-icon,uc-editor-filter-control>button uc-icon{pointer-events:none}uc-editor-filter-control>button .uc-preview{position:absolute;right:0;left:0;z-index:-1;width:100%;height:var(--l-base-height);background-repeat:no-repeat;background-size:contain;border-radius:var(--border-radius-editor);opacity:0;filter:brightness(var(--filter-effect));transition:var(--transition-duration-3)}uc-editor-filter-control.uc-not_active .uc-preview[data-loaded]{opacity:1}uc-editor-filter-control.uc-active .uc-preview{opacity:0}uc-editor-filter-control>.uc-original-icon{color:var(--color-effect);opacity:.3}uc-editor-image-cropper{position:absolute;top:0;left:0;z-index:10;display:block;width:100%;height:100%;opacity:0;pointer-events:none;touch-action:none;color:var(--color-crop-guides)}uc-editor-image-cropper.uc-active_from_editor{transform:scale(1) translate(0);opacity:1;transition:transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1) .4s,opacity var(--transition-duration-3);pointer-events:auto}uc-editor-image-cropper.uc-active_from_viewer{transform:scale(1) translate(0);opacity:1;transition:transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1) .4s,opacity var(--transition-duration-3);pointer-events:auto}uc-editor-image-cropper.uc-inactive_to_editor{opacity:0;transition:transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1),opacity var(--transition-duration-3) calc(var(--transition-duration-3) + .05s);pointer-events:none}uc-editor-image-cropper>.uc-canvas{position:absolute;top:0;left:0;z-index:1;display:block;width:100%;height:100%}uc-editor-image-fader{position:absolute;top:0;left:0;display:block;width:100%;height:100%}uc-editor-image-fader.uc-active_from_viewer{z-index:3;transform:scale(1);opacity:1;transition:transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-start);pointer-events:auto}uc-editor-image-fader.uc-active_from_cropper{z-index:3;transform:scale(1);opacity:1;transition:transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);pointer-events:auto}uc-editor-image-fader.uc-inactive_to_cropper{z-index:3;transform:scale(1);opacity:0;transition:transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);pointer-events:none}uc-editor-image-fader .uc-fader-image{position:absolute;top:0;left:0;display:block;width:100%;height:100%;object-fit:scale-down;transform:scale(1);user-select:none;content-visibility:auto}uc-editor-image-fader .uc-fader-image--preview{background-color:var(--color-image-background);border-top-left-radius:var(--border-radius-base);border-top-right-radius:var(--border-radius-base);transform:scale(1);opacity:0;transition:var(--transition-duration-3)}uc-editor-scroller{display:flex;align-items:center;width:100%;height:100%;overflow-x:scroll}uc-editor-slider{display:flex;align-items:center;justify-content:center;width:100%;height:var(--size-panel-heading)}uc-editor-toolbar{position:relative;width:100%;height:100%}@media only screen and (max-width:600px){uc-editor-toolbar{--l-tab-gap: var(--cldtr-gap-mid-1);--l-slider-padding: var(--uc-padding);--l-controls-padding: var(--uc-padding)}}@media only screen and (min-width:601px){uc-editor-toolbar{--l-tab-gap: var(--cldtr-gap-max);--l-slider-padding: var(--uc-padding);--l-controls-padding: var(--uc-padding)}}uc-editor-toolbar>.uc-toolbar-container{position:relative;width:100%;height:100%;overflow:hidden}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar{position:absolute;display:grid;grid-template-rows:1fr 1fr;width:100%;height:100%;background-color:var(--color-fill-contrast);transition:opacity var(--transition-duration-3) ease-in-out,transform var(--transition-duration-3) ease-in-out,visibility var(--transition-duration-3) ease-in-out}.uc-sub-toolbar>.uc-list-aspect-ratio-container>.uc-list-aspect-ratio{display:grid;grid-auto-flow:column;justify-content:center;align-items:center;gap:6px;height:var(--size-panel-heading)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar.uc-sub-toolbar--visible{transform:translateY(0);opacity:1;pointer-events:auto}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar.uc-sub-toolbar--top-hidden{transform:translateY(100%);opacity:0;pointer-events:none}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar.uc-sub-toolbar--bottom-hidden{transform:translateY(-100%);opacity:0;pointer-events:none}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row{display:flex;align-items:center;justify-content:space-between;padding-right:var(--l-controls-padding);padding-left:var(--l-controls-padding)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles{position:relative;display:grid;grid-auto-flow:column;gap:0px var(--l-tab-gap);align-items:center;height:100%}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles>.uc-tab-toggles_indicator{position:absolute;bottom:0;left:0;width:var(--size-touch-area);height:2px;background-color:var(--uc-secondary-foreground);transform:translate(0);transition:transform var(--transition-duration-3)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-tab-content-row{position:relative}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-tab-content-row>.uc-tab-content{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;overflow:hidden;content-visibility:auto}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles>.uc-tab-toggle.uc-tab-toggle--visible{display:contents}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles>.uc-tab-toggle.uc-tab-toggle--hidden{display:none}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles.uc-tab-toggles--hidden{display:none}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles>.uc-tab-toggle>uc-btn-ui{width:var(--uc-button-size)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-controls-row>.uc-tab-toggles>.uc-tab-toggle>uc-btn-ui>uc-icon>svg{width:var(--size-icon);height:var(--size-icon)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-tab-content-row>.uc-tab-content .uc-controls-list_align{display:grid;grid-template-areas:". inner .";grid-template-columns:1fr auto 1fr;box-sizing:border-box;min-width:100%;padding-left:var(--uc-padding)}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-tab-content-row>.uc-tab-content .uc-controls-list_inner{display:grid;grid-area:inner;grid-auto-flow:column;gap:6px}uc-editor-toolbar>.uc-toolbar-container>.uc-sub-toolbar>.uc-tab-content-row>.uc-tab-content .uc-controls-list_inner:last-child{padding-right:var(--uc-padding)}uc-editor-toolbar .uc-info-tooltip_container{position:absolute;display:flex;align-items:flex-start;justify-content:center;width:100%;height:100%}uc-editor-toolbar .uc-info-tooltip_wrapper{position:absolute;top:calc(-100% - var(--cldtr-gap-mid-2));display:flex;flex-direction:column;justify-content:flex-end;height:100%;pointer-events:none}uc-editor-toolbar .uc-info-tooltip{z-index:10;padding:3px 6px;color:var(--color-text-base);font-size:.7em;letter-spacing:1px;text-transform:uppercase;background-color:var(--color-text-accent-contrast);border-radius:var(--border-radius-editor);transform:translateY(100%);opacity:0;transition:var(--transition-duration-3)}uc-editor-toolbar .uc-info-tooltip_visible{transform:translateY(0);opacity:1}uc-editor-toolbar .uc-slider{padding-right:var(--l-slider-padding);padding-left:var(--l-slider-padding)}uc-btn-ui>button{--filter-effect: var(--idle-brightness);--opacity-effect: var(--idle-opacity);--color-effect: var(--idle-color-rgb);--background-effect: var(--idle-background);--l-transition-effect: var( --css-transition, color var(--transition-duration-2), background-color var(--transition-duration-2), filter var(--transition-duration-2) );all:unset;display:inline-flex;align-items:center;box-sizing:var(--css-box-sizing, border-box);height:var(--css-height, var(--uc-button-size));padding-right:var(--css-padding-right, 14px);padding-left:var(--css-padding-left, 14px);font-size:1em;color:var(--color-effect);background-color:var(--background-effect);border-radius:var(--uc-radius);opacity:var(--opacity-effect);cursor:pointer;filter:brightness(var(--filter-effect));transition:var(--l-transition-effect);user-select:none}uc-btn-ui>button>uc-icon{pointer-events:none}uc-btn-ui .uc-text{white-space:nowrap}uc-btn-ui .uc-icon{display:flex;align-items:center;justify-content:center;color:var(--color-effect);filter:brightness(var(--filter-effect));transition:var(--l-transition-effect)}uc-btn-ui .uc-icon_left{margin-right:var(--cldtr-gap-mid-1);margin-left:0}uc-btn-ui .uc-icon_right{margin-right:0;margin-left:var(--cldtr-gap-mid-1)}uc-btn-ui .uc-icon_single{margin-right:0;margin-left:0}uc-btn-ui .uc-icon_hidden{display:none;margin:0}uc-btn-ui.uc-primary>button{--idle-color-rgb: var(--uc-primary-foreground);--idle-brightness: 1;--idle-opacity: 1;--idle-background: var(--uc-primary);--hover-color-rgb: var(--uc-primary-foreground);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-primary-hover);--down-color-rgb: var(--uc-primary-foreground);--down-brightness: .75;--down-opacity: 1;--down-background: var(--uc-primary);--active-color-rgb: var(--uc-primary-foreground);--active-brightness: 1;--active-opacity: 1;--active-background: var(--uc-primary)}uc-btn-ui.uc-primary-icon>button{--idle-color-rgb: var(--uc-primary);--idle-brightness: 1;--idle-opacity: 1;--idle-background: transparent;--hover-color-rgb: var(--uc-primary);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-primary-transparent);--down-color-rgb: var(--uc-primary);--down-brightness: .75;--down-opacity: 1;--down-background: var(--uc-primary-transparent);--active-color-rgb: var(--uc-primary-foreground);--active-brightness: 1;--active-opacity: 1;--active-background: var(--uc-primary);padding:0;width:var(--uc-button-size)}uc-btn-ui.uc-secondary>button{--idle-color-rgb: var(--uc-secondary-foreground);--idle-brightness: 1;--idle-opacity: 1;--idle-background: var(--uc-secondary);--hover-color-rgb: var(--uc-secondary-foreground);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-secondary-hover);--down-color-rgb: var(--uc-secondary-foreground);--down-brightness: 1;--down-opacity: 1;--down-background: var(--uc-secondary-hover);--active-color-rgb: var(--uc-secondary-foreground);--active-brightness: 1;--active-opacity: 1;--active-background: transparent}:where(.uc-contrast) uc-btn-ui.uc-secondary>button{border:1px solid var(--uc-border)}uc-btn-ui.uc-secondary-icon>button{--idle-color-rgb: var(--uc-secondary-foreground);--idle-brightness: 1;--idle-opacity: 1;--idle-background: transparent;--hover-color-rgb: var(--uc-secondary-foreground);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-secondary);--down-color-rgb: var(--uc-secondary-foreground);--down-brightness: 1;--down-opacity: 1;--down-background: var(--uc-secondary);--active-color-rgb: var(--uc-secondary-foreground);--active-brightness: 1;--active-opacity: 1;--active-background: transparent;padding:0;width:var(--uc-button-size)}uc-btn-ui.uc-tab>button{--idle-color-rgb: var(--uc-secondary-foreground);--idle-brightness: 1;--idle-opacity: 1;--idle-background: transparent;--hover-color-rgb: var(--uc-secondary-foreground);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-secondary);--down-color-rgb: var(--uc-secondary-foreground);--down-brightness: 1;--down-opacity: 1;--down-background: var(--uc-secondary);--active-color-rgb: var(--uc-secondary-foreground);--active-brightness: 1;--active-opacity: 1;--active-background: transparent;padding:0;width:var(--uc-button-size)}uc-btn-ui.uc-default>button{--idle-color-rgb: var(--uc-secondary-foreground);--idle-brightness: 1;--idle-opacity: 1;--idle-background: var(--uc-secondary);--hover-color-rgb: var(--uc-secondary-foreground);--hover-brightness: 1;--hover-opacity: 1;--hover-background: var(--uc-secondary-hover);--down-color-rgb: var(--uc-secondary-foreground);--down-brightness: .75;--down-opacity: 1;--down-background: var(--uc-secondary);--active-color-rgb: var(--uc-primary);--active-brightness: 1;--active-opacity: 1;--active-background: var(--uc-primary-transparent)}:where(.uc-contrast) uc-btn-ui.uc-default>button{--idle-background: transparent;--hover-background: var(--uc-secondary);--active-background: var(--uc-foreground);--active-color-rgb: var(--uc-background)}uc-line-loader-ui{position:absolute;top:0;left:0;z-index:9999;width:100%;height:2px;opacity:.5}uc-line-loader-ui .uc-inner{width:25%;max-width:200px;height:100%}uc-line-loader-ui .uc-line{width:100%;height:100%;background-color:var(--uc-primary);transform:translate(-101%);transition:transform 1s}uc-slider-ui{--l-thumb-size: 24px;--l-zero-dot-size: 5px;--l-zero-dot-offset: 2px;--idle-color-rgb: var(--uc-foreground);--hover-color-rgb: var(--uc-primary);--down-color-rgb: var(--uc-primary);--color-effect: var(--idle-color-rgb);--l-color: var(--color-effect);position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:calc(var(--l-thumb-size) + (var(--l-zero-dot-size) + var(--l-zero-dot-offset)) * 2)}uc-slider-ui .uc-thumb{position:absolute;left:0;width:var(--l-thumb-size);height:var(--l-thumb-size);background-color:var(--l-color);border-radius:50%;transform:translate(0);opacity:1;transition:opacity var(--transition-duration-2),background-color var(--transition-duration-2)}uc-slider-ui .uc-steps{position:absolute;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;width:100%;height:100%;padding-right:calc(var(--l-thumb-size) / 2);padding-left:calc(var(--l-thumb-size) / 2)}uc-slider-ui .uc-border-step{width:0px;height:10px;border-right:1px solid var(--uc-foreground);opacity:1;transition:border-color var(--transition-duration-2)}uc-slider-ui .uc-minor-step{width:0px;height:4px;border-right:1px solid var(--uc-foreground);opacity:.6;transition:border-color var(--transition-duration-2)}uc-slider-ui .uc-zero-dot{position:absolute;top:calc(100% - var(--l-zero-dot-offset) * 2);left:calc(var(--l-thumb-size) / 2 - var(--l-zero-dot-size) / 2);width:var(--l-zero-dot-size);height:var(--l-zero-dot-size);background-color:var(--color-primary-accent);border-radius:50%;opacity:0;transition:var(--transition-duration-3)}uc-slider-ui .uc-input{position:absolute;width:calc(100% - 10px);height:100%;margin:0;cursor:pointer;opacity:0}uc-presence-toggle.uc-transition{transition:opacity var(--transition-duration-3),visibility var(--transition-duration-3)}uc-presence-toggle.uc-visible{opacity:1;pointer-events:inherit}uc-presence-toggle.uc-hidden{opacity:0;pointer-events:none}uc-presence-toggle.uc-initial{display:none!important;transition:none!important}[uc-cloud-image-editor] [role=button]:focus-visible,[uc-cloud-image-editor] button:focus-visible{outline:1px auto Highlight;outline:1px auto -webkit-focus-ring-color}[uc-cloud-image-editor] .uc-cloud-mask{pointer-events:none}[uc-aspect-ratio-freeform] button{display:flex}[uc-aspect-ratio-freeform] uc-icon{display:none}[uc-aspect-ratio-freeform] .uc-title{padding-left:var(--cldtr-gap-mid-1)}:where(uc-editor-freeform-button-control,uc-editor-aspect-ratio-button-control:last-of-type){margin-right:calc(3 * var(--cldtr-gap-mid-1))}}@layer uc.solutions{:where([uc-cloud-image-editor]) uc-icon{display:flex;justify-content:center;width:100%;height:100%}:where([uc-cloud-image-editor]) uc-icon svg{width:calc(var(--uc-button-size) / 2);height:calc(var(--uc-button-size) / 2)}}@layer uc.solutions{[uc-file-uploader-inline] uc-start-from{height:100%;container-type:inline-size}[uc-file-uploader-inline]{--cfg-done-activity: "start-from";--cfg-init-activity: "start-from";flex:1}[uc-file-uploader-inline] uc-activity-header:after{width:var(--uc-button-size);height:var(--uc-button-size);content:""}[uc-file-uploader-inline] uc-activity-header .uc-close-btn{display:none}[uc-file-uploader-inline] uc-copyright .uc-credits{position:static}@container (min-width: 500px){[uc-file-uploader-inline] uc-start-from .uc-content{grid-template-columns:1fr max-content;grid-template-rows:1fr max-content;height:100%}[uc-file-uploader-inline] uc-start-from uc-copyright{grid-column:2}[uc-file-uploader-inline] uc-start-from uc-drop-area{grid-row:span 3}[uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]) uc-drop-area{grid-row:span 2}[uc-file-uploader-inline] uc-start-from:has(.uc-cancel-btn[hidden]) uc-drop-area{grid-row:span 2}[uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]):has(.uc-cancel-btn[hidden]) uc-drop-area{grid-row:span 1}}}@layer uc,uc.base,uc.components,uc.rules,uc.solutions,uc.post-reset;@layer uc.base{:where([uc-wgt-common]){--cfg-init-activity: "start-from";--cfg-done-activity: ""}}@layer uc.base{:where([uc-wgt-common]){--uc-font-family: system-ui;--uc-font-size: 14px;--uc-line-height: normal;--uc-simple-btn-font-family: system-ui;--uc-simple-btn-font-size: 14px;--uc-button-size: 32px;--uc-preview-size: 32px;--uc-padding: 10px;--uc-radius: 8px;--uc-transition: .2s ease;--uc-dialog-width: 430px;--uc-dialog-max-width: 920px;--uc-dialog-max-height: 675px;--uc-simple-btn-padding: 7px 14px;--uc-grid-col: 3;--uc-grid-preview-image-height: auto;--uc-grid-gap: calc(var(--uc-padding) / 2);--uc-grid-aspect-ratio: 1 / 1;--uc-background: var(--uc-background-light);--uc-foreground: var(--uc-foreground-light);--uc-primary: var(--uc-primary-light);--uc-primary-hover: var(--uc-primary-hover-light);--uc-primary-transparent: var(--uc-primary-transparent-light);--uc-primary-foreground: var(--uc-primary-foreground-light);--uc-secondary: var(--uc-secondary-light);--uc-secondary-hover: var(--uc-secondary-hover-light);--uc-secondary-foreground: var(--uc-secondary-foreground-light);--uc-muted: var(--uc-muted-light);--uc-muted-foreground: var(--uc-muted-foreground-light);--uc-destructive: var(--uc-destructive-light);--uc-destructive-foreground: var(--uc-destructive-foreground-light);--uc-border: var(--uc-border-light);--uc-dialog-shadow: var(--uc-dialog-shadow-light);--uc-simple-btn: var(--uc-simple-btn-light);--uc-simple-btn-hover: var(--uc-simple-btn-hover-light);--uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light)}@supports not (color: oklch(0% 0 0)){:where([uc-wgt-common]){--uc-primary-rgb-light: 23 75 215;--uc-primary-light: rgb(var(--uc-primary-rgb-light));--uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);--uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);--uc-background-light: rgb(255 255 255);--uc-foreground-light: rgb(24 24 24);--uc-primary-foreground-light: #fff;--uc-secondary-light: rgb(24 24 24 / 5%);--uc-secondary-hover-light: rgb(24 24 24 / 8%);--uc-secondary-foreground-light: rgb(24 24 24);--uc-muted-light: rgb(245 245 245);--uc-muted-foreground-light: rgb(113 113 113);--uc-destructive-light: rgb(232 19 20 / 5%);--uc-destructive-foreground-light: rgb(232 19 20);--uc-border-light: rgb(228 228 232);--uc-dialog-shadow-light: 0px 6px 20px rgb(0 0 0 / 10%);--uc-simple-btn-light: rgb(235 235 235);--uc-simple-btn-hover-light: rgb(228 228 228);--uc-simple-btn-foreground-light: rgb(24 24 24);--uc-primary-rgb-dark: 87 154 255;--uc-primary-dark: rgb(var(--uc-primary-rgb-dark));--uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);--uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);--uc-background-dark: rgb(27 27 27);--uc-foreground-dark: rgb(225 225 225);--uc-primary-foreground-dark: rgb(0 0 0);--uc-secondary-dark: rgb(225 225 225 / 7%);--uc-secondary-hover-dark: rgb(225 225 225 / 10%);--uc-secondary-foreground-dark: rgb(225 225 225);--uc-muted-dark: rgb(36 36 36);--uc-muted-foreground-dark: rgb(152 152 152);--uc-destructive-dark: rgb(244 90 79 / 10%);--uc-destructive-foreground-dark: rgb(244 90 79);--uc-border-dark: rgb(61 61 61);--uc-dialog-shadow-dark: 0px 6px 20px rgb(0 0 0 / 25%);--uc-simple-btn-dark: rgb(36 36 36);--uc-simple-btn-hover-dark: rgb(43 43 43);--uc-simple-btn-foreground-dark: rgb(255 255 255)}}@supports (color: oklch(0% 0 0)){:where([uc-wgt-common]){--uc-primary-oklch-light: 47% .22 264;--uc-primary-light: oklch(var(--uc-primary-oklch-light));--uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);--uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);--uc-background-light: oklch(100% 0 0);--uc-foreground-light: oklch(21% 0 0);--uc-primary-foreground-light: oklch(100% 0 0);--uc-secondary-light: oklch(21% 0 0 / .05);--uc-secondary-hover-light: oklch(21% 0 0 / .08);--uc-secondary-foreground-light: oklch(21% 0 0);--uc-muted-light: oklch(97% 0 0);--uc-muted-foreground-light: oklch(40% 0 0);--uc-destructive-light: oklch(59% .235 28.5 / .05);--uc-destructive-foreground-light: oklch(59% .235 28.5);--uc-border-light: oklch(92% 0 0);--uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / .1);--uc-simple-btn-light: oklch(94% 0 0);--uc-simple-btn-hover-light: oklch(92% 0 0);--uc-simple-btn-foreground-light: oklch(20% 0 0);--uc-primary-oklch-dark: 69% .1768 258.4;--uc-primary-dark: oklch(var(--uc-primary-oklch-dark));--uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);--uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);--uc-background-dark: oklch(22% 0 0);--uc-foreground-dark: oklch(91% 0 0);--uc-primary-foreground-dark: oklch(0% 0 0);--uc-secondary-dark: oklch(91% 0 0 / .07);--uc-secondary-hover-dark: oklch(91% 0 0 / .1);--uc-secondary-foreground-dark: oklch(91% 0 0);--uc-muted-dark: oklch(26% 0 0);--uc-muted-foreground-dark: oklch(68% 0 0);--uc-destructive-dark: oklch(67% .191 27.5 / .1);--uc-destructive-foreground-dark: oklch(67% .191 27.5);--uc-border-dark: oklch(36% 0 0);--uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / .25);--uc-simple-btn-dark: oklch(26% 0 0);--uc-simple-btn-hover-dark: oklch(29% 0 0);--uc-simple-btn-foreground-dark: oklch(100% 0 0)}}@media only screen and (max-height:600px){:where([uc-wgt-common]){--uc-dialog-max-height: 100%}}@media only screen and (max-width:680px){:where([uc-wgt-common]){--uc-grid-col: 2}}@media only screen and (max-width:430px){:where([uc-wgt-common]){--uc-dialog-max-width: 100vw;--uc-dialog-max-height: var(--uploadcare-blocks-window-height);--uc-grid-col: 1}}@media(prefers-color-scheme:light){:where([uc-wgt-common]){--uc-background: var(--uc-background-light);--uc-foreground: var(--uc-foreground-light);--uc-primary: var(--uc-primary-light);--uc-primary-hover: var(--uc-primary-hover-light);--uc-primary-transparent: var(--uc-primary-transparent-light);--uc-primary-foreground: var(--uc-primary-foreground-light);--uc-secondary: var(--uc-secondary-light);--uc-secondary-hover: var(--uc-secondary-hover-light);--uc-secondary-foreground: var(--uc-secondary-foreground-light);--uc-muted: var(--uc-muted-light);--uc-muted-foreground: var(--uc-muted-foreground-light);--uc-destructive: var(--uc-destructive-light);--uc-destructive-foreground: var(--uc-destructive-foreground-light);--uc-border: var(--uc-border-light);--uc-dialog-shadow: var(--uc-dialog-shadow-light);--uc-simple-btn: var(--uc-simple-btn-light);--uc-simple-btn-hover: var(--uc-simple-btn-hover-light);--uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light)}}@media(prefers-color-scheme:dark){:where([uc-wgt-common]){--uc-background: var(--uc-background-dark);--uc-foreground: var(--uc-foreground-dark);--uc-primary: var(--uc-primary-dark);--uc-primary-hover: var(--uc-primary-hover-dark);--uc-primary-transparent: var(--uc-primary-transparent-dark);--uc-primary-foreground: var(--uc-primary-foreground-dark);--uc-secondary: var(--uc-secondary-dark);--uc-secondary-hover: var(--uc-secondary-hover-dark);--uc-secondary-foreground: var(--uc-secondary-foreground-dark);--uc-muted: var(--uc-muted-dark);--uc-muted-foreground: var(--uc-muted-foreground-dark);--uc-destructive: var(--uc-destructive-dark);--uc-destructive-foreground: var(--uc-destructive-foreground-dark);--uc-border: var(--uc-border-dark);--uc-dialog-shadow: var(--uc-dialog-shadow-dark);--uc-simple-btn: var(--uc-simple-btn-dark);--uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);--uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark)}}:where(.uc-light){--uc-background: var(--uc-background-light);--uc-foreground: var(--uc-foreground-light);--uc-primary: var(--uc-primary-light);--uc-primary-hover: var(--uc-primary-hover-light);--uc-primary-transparent: var(--uc-primary-transparent-light);--uc-primary-foreground: var(--uc-primary-foreground-light);--uc-secondary: var(--uc-secondary-light);--uc-secondary-hover: var(--uc-secondary-hover-light);--uc-secondary-foreground: var(--uc-secondary-foreground-light);--uc-muted: var(--uc-muted-light);--uc-muted-foreground: var(--uc-muted-foreground-light);--uc-destructive: var(--uc-destructive-light);--uc-destructive-foreground: var(--uc-destructive-foreground-light);--uc-border: var(--uc-border-light);--uc-dialog-shadow: var(--uc-dialog-shadow-light);--uc-simple-btn: var(--uc-simple-btn-light);--uc-simple-btn-hover: var(--uc-simple-btn-hover-light);--uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light)}:where(.uc-dark){--uc-background: var(--uc-background-dark);--uc-foreground: var(--uc-foreground-dark);--uc-primary: var(--uc-primary-dark);--uc-primary-hover: var(--uc-primary-hover-dark);--uc-primary-transparent: var(--uc-primary-transparent-dark);--uc-primary-foreground: var(--uc-primary-foreground-dark);--uc-secondary: var(--uc-secondary-dark);--uc-secondary-hover: var(--uc-secondary-hover-dark);--uc-secondary-foreground: var(--uc-secondary-foreground-dark);--uc-muted: var(--uc-muted-dark);--uc-muted-foreground: var(--uc-muted-foreground-dark);--uc-destructive: var(--uc-destructive-dark);--uc-destructive-foreground: var(--uc-destructive-foreground-dark);--uc-border: var(--uc-border-dark);--uc-dialog-shadow: var(--uc-dialog-shadow-dark);--uc-simple-btn: var(--uc-simple-btn-dark);--uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);--uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark)}:where(.uc-purple){--uc-primary-oklch-light: 47% .22 300;--uc-primary-oklch-dark: 69% .1768 300}:where(.uc-red){--uc-primary-oklch-light: 47% .21 21;--uc-primary-oklch-dark: 71% .1768 21}:where(.uc-orange){--uc-primary-oklch-light: 47% .1376 51.88;--uc-primary-oklch-dark: 69% .1768 51.88}:where(.uc-green){--uc-primary-oklch-light: 45% .14 130;--uc-primary-oklch-dark: 69% .1768 130}:where(.uc-turquoise){--uc-primary-oklch-light: 45% .0854 174;--uc-primary-oklch-dark: 69% .1768 174}:where(.uc-gray){--uc-primary-oklch-light: 10% 0 0;--uc-primary-oklch-dark: 97% 0 0}:where(.uc-contrast){--uc-border-light: oklch(50% 0 0);--uc-border-dark: oklch(50% 0 0);--uc-muted-light: oklch(98% 0 0);--uc-muted-dark: oklch(16% 0 0);--uc-muted-foreground-light: oklch(20% 0 0);--uc-muted-foreground-dark: oklch(80% 0 0);--uc-background-light: oklch(100% 0 0);--uc-foreground-light: oklch(0% 0 0);--uc-background-dark: oklch(10% 0 0);--uc-foreground-dark: oklch(100% 0 0)}}@layer uc.base{:where([uc-wgt-common]){color:var(--uc-foreground);font-size:var(--uc-font-size);line-height:var(--uc-line-height);font-family:var(--uc-font-family)}:where([uc-wgt-common]) *{box-sizing:border-box}:where([uc-wgt-common]) button{display:flex;align-items:center;justify-content:center;height:var(--uc-button-size);padding-right:14px;padding-left:14px;font-size:1em;font-family:inherit;white-space:nowrap;border:none;border-radius:var(--uc-radius);cursor:pointer;user-select:none;transition:background-color var(--uc-transition)}:where([uc-wgt-common]) button:focus-visible{outline-offset:2px}:where([uc-wgt-common]) :is(button.uc-primary-btn,button.uc-ui-primary-btn){color:var(--uc-primary-foreground);background-color:var(--uc-primary)}:where([uc-wgt-common]) :is(button.uc-primary-btn,button.uc-ui-primary-btn):hover{background-color:var(--uc-primary-hover)}:where([uc-wgt-common]) :is(button.uc-secondary-btn,button.uc-ui-secondary-btn){color:var(--uc-secondary-foreground);background-color:var(--uc-secondary)}:where([uc-wgt-common]) :is(button.uc-secondary-btn,button.uc-ui-secondary-btn):hover{background-color:var(--uc-secondary-hover)}:where([uc-wgt-common].uc-contrast) :is(button.uc-secondary-btn,button.uc-ui-secondary-btn){border:1px solid var(--uc-border)}:where([uc-wgt-common]) :is(button.uc-mini-btn,button.uc-ui-icon-btn){height:var(--uc-button-size);padding:0;background-color:transparent;color:var(--uc-secondary-foreground)}:where([uc-wgt-common]) :is(button.uc-mini-btn,button.uc-ui-icon-btn):hover{background-color:var(--uc-secondary)}:where([uc-wgt-common]) :is(button[disabled],button.uc-primary-btn[disabled],button.uc-secondary-btn[disabled],button.uc-ui-primary-btn[disabled],button.uc-ui-secondary-btn[disabled],button.uc-ui-icon-btn[disabled]){opacity:.5;pointer-events:none}:where([uc-wgt-common]) a{color:var(--uc-primary);text-decoration:none}:where([uc-wgt-common]) a[disabled]{pointer-events:none}:where([uc-wgt-common]) input[type=text]{display:flex;width:100%;height:var(--uc-button-size);padding-right:10px;padding-left:10px;color:var(--uc-foreground);font-size:1em;font-family:inherit;background-color:var(--uc-background);border:1px solid var(--uc-border);outline:1px solid transparent;border-radius:var(--uc-radius);transition:border-color var(--uc-transition),outline-color var(--uc-transition)}:where([uc-wgt-common]) input[type=text]::placeholder{color:var(--uc-muted-foreground)}:where([uc-wgt-common]) input[type=text]:focus{outline-color:var(--uc-primary-hover);border-color:var(--uc-primary-hover)}:where([uc-wgt-common]) input[disabled]{opacity:.6;pointer-events:none}:where([uc-wgt-common]) uc-select[disabled],:where([uc-wgt-common]) select[disabled]{opacity:.6;pointer-events:none}:where([uc-wgt-common]) .uc-ui-toolbar{display:flex;gap:4px;align-items:center;padding:var(--uc-padding);background-color:var(--uc-background)}:where([uc-wgt-common]) .uc-ui-toolbar-spacer{flex:1}}@layer uc.rules{:where([uc-wgt-common]) [hidden]{display:none}:where([uc-wgt-common]) [activity]:not([active],.active){display:none}:where([uc-wgt-common]) dialog:not([open]) [activity]{display:none}}@layer uc.post-reset{:where([uc-wgt-common]) uc-source-btn[type]{all:unset}}@layer uc.solutions{:where([uc-file-uploader-minimal]){--cfg-init-activity: "start-from";--cfg-done-activity: "upload-list";position:relative;display:block}[uc-file-uploader-minimal]>uc-start-from .uc-content{display:flex;flex-direction:column;gap:4px;padding:0;overflow:hidden;align-items:center;background-color:transparent}:where([uc-file-uploader-minimal]>uc-start-from uc-drop-area){display:flex;position:relative;align-items:center;justify-content:center;width:100%;min-height:calc(var(--uc-preview-size) + var(--uc-padding) * 2 + 8px);padding:0;text-align:center;background-color:var(--uc-muted);border-radius:calc(var(--uc-radius) * 1.75)}:where(.uc-contrast) :where([uc-file-uploader-minimal]>uc-start-from uc-drop-area){background-color:transparent}:where([uc-file-uploader-minimal]>uc-start-from uc-drop-area):before{content:"";z-index:-1;width:100%;height:100%;position:absolute;background-color:var(--uc-background)}:where([uc-file-uploader-minimal]:has([single])>uc-start-from uc-drop-area){aspect-ratio:var(--uc-grid-aspect-ratio)}[uc-file-uploader-minimal] uc-upload-list uc-activity-header{display:none}[uc-file-uploader-minimal] uc-upload-list>.uc-toolbar{background-color:transparent}[uc-file-uploader-minimal] uc-upload-list{width:100%;height:unset;padding:4px;background-color:var(--uc-background);border:1px dashed var(--uc-border);border-radius:calc(var(--uc-radius) * 1.75)}[uc-file-uploader-minimal] uc-upload-list .uc-files{padding:0}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar{display:block;padding:0}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-cancel-btn,[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-upload-btn,[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-done-btn{display:none}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn{width:100%;height:calc(var(--uc-preview-size) + var(--uc-padding) * 2);margin-top:4px}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn[disabled]{display:none}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn>span{display:none}[uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn>uc-icon{display:flex}[uc-file-uploader-minimal][mode=list] uc-file-item uc-progress-bar{top:0;height:100%}[uc-file-uploader-minimal][mode=list] uc-file-item uc-progress-bar .uc-progress{background-color:var(--uc-primary-transparent);border-radius:var(--uc-radius)}[uc-file-uploader-minimal][mode=list] uc-file-item uc-progress-bar .uc-fake-progress{background-color:var(--uc-primary-transparent);border-radius:var(--uc-radius)}[uc-file-uploader-minimal] uc-upload-list uc-drop-area{width:100%;height:100%;margin:0;border-radius:calc(var(--uc-radius) * 1.75)}[uc-file-uploader-minimal] uc-upload-list .uc-common-error{margin:4px 0 0}[uc-file-uploader-minimal] uc-copyright .uc-credits{position:static}[uc-file-uploader-minimal][mode=grid] uc-upload-list .uc-toolbar .uc-add-more-btn{display:none}[uc-file-uploader-minimal][mode=grid] uc-upload-list .uc-files .uc-add-more-btn{display:flex}[uc-file-uploader-minimal][mode=grid] uc-upload-list .uc-files .uc-add-more-btn>span{display:none}[uc-file-uploader-minimal][mode=grid] uc-upload-list .uc-files .uc-add-more-btn>uc-icon{display:flex}}