@epam/assets 5.8.1-beta.0 → 5.8.1-y.0
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.
- package/css/theme/theme_electric.css +69 -1
- package/css/theme/theme_electric.css.map +1 -1
- package/css/theme/theme_loveship.css +69 -1
- package/css/theme/theme_loveship.css.map +1 -1
- package/css/theme/theme_loveship_dark.css +75 -7
- package/css/theme/theme_loveship_dark.css.map +1 -1
- package/css/theme/theme_promo.css +69 -1
- package/css/theme/theme_promo.css.map +1 -1
- package/css/theme/theme_vanilla_thunder.css +68 -0
- package/css/theme/theme_vanilla_thunder.css.map +1 -1
- package/package.json +2 -2
- package/readme.md +2 -2
- package/theme/theme_6px.scss +91 -2
- package/theme/theme_electric.scss +1 -1
- package/theme/theme_loveship.scss +1 -1
- package/theme/theme_loveship_dark.scss +5 -5
- package/theme/theme_promo.scss +1 -1
|
@@ -173,6 +173,7 @@
|
|
|
173
173
|
--uui-icon-size:12px;
|
|
174
174
|
--uui-line-height:12px;
|
|
175
175
|
--uui-font-size:12px;
|
|
176
|
+
--uui-dot-size:6px;
|
|
176
177
|
}
|
|
177
178
|
.uui-theme-vanilla_thunder .uui-size-18{
|
|
178
179
|
--uui-size:18px;
|
|
@@ -184,6 +185,7 @@
|
|
|
184
185
|
--uui-icon-size:12px;
|
|
185
186
|
--uui-line-height:12px;
|
|
186
187
|
--uui-font-size:10px;
|
|
188
|
+
--uui-dot-size:6px;
|
|
187
189
|
}
|
|
188
190
|
.uui-theme-vanilla_thunder .uui-size-24{
|
|
189
191
|
--uui-size:24px;
|
|
@@ -195,6 +197,7 @@
|
|
|
195
197
|
--uui-icon-size:12px;
|
|
196
198
|
--uui-line-height:18px;
|
|
197
199
|
--uui-font-size:12px;
|
|
200
|
+
--uui-dot-size:8px;
|
|
198
201
|
}
|
|
199
202
|
.uui-theme-vanilla_thunder .uui-size-30{
|
|
200
203
|
--uui-size:30px;
|
|
@@ -206,6 +209,7 @@
|
|
|
206
209
|
--uui-icon-size:18px;
|
|
207
210
|
--uui-line-height:18px;
|
|
208
211
|
--uui-font-size:14px;
|
|
212
|
+
--uui-dot-size:8px;
|
|
209
213
|
}
|
|
210
214
|
.uui-theme-vanilla_thunder .uui-size-36{
|
|
211
215
|
--uui-size:36px;
|
|
@@ -217,6 +221,7 @@
|
|
|
217
221
|
--uui-icon-size:18px;
|
|
218
222
|
--uui-line-height:18px;
|
|
219
223
|
--uui-font-size:14px;
|
|
224
|
+
--uui-dot-size:8px;
|
|
220
225
|
}
|
|
221
226
|
.uui-theme-vanilla_thunder .uui-size-42{
|
|
222
227
|
--uui-size:42px;
|
|
@@ -228,6 +233,7 @@
|
|
|
228
233
|
--uui-icon-size:18px;
|
|
229
234
|
--uui-line-height:24px;
|
|
230
235
|
--uui-font-size:16px;
|
|
236
|
+
--uui-dot-size:10px;
|
|
231
237
|
}
|
|
232
238
|
.uui-theme-vanilla_thunder .uui-size-48{
|
|
233
239
|
--uui-size:48px;
|
|
@@ -239,6 +245,7 @@
|
|
|
239
245
|
--uui-icon-size:24px;
|
|
240
246
|
--uui-line-height:24px;
|
|
241
247
|
--uui-font-size:16px;
|
|
248
|
+
--uui-dot-size:12px;
|
|
242
249
|
}
|
|
243
250
|
.uui-theme-vanilla_thunder .uui-size-60{
|
|
244
251
|
--uui-size:60px;
|
|
@@ -250,6 +257,7 @@
|
|
|
250
257
|
--uui-icon-size:24px;
|
|
251
258
|
--uui-line-height:24px;
|
|
252
259
|
--uui-font-size:20px;
|
|
260
|
+
--uui-dot-size:12px;
|
|
253
261
|
}
|
|
254
262
|
.uui-theme-vanilla_thunder .uui-input-box.uui-size-42{
|
|
255
263
|
--uui-horizontal-padding:6px;
|
|
@@ -257,6 +265,12 @@
|
|
|
257
265
|
.uui-theme-vanilla_thunder .uui-input-box.uui-size-48{
|
|
258
266
|
--uui-horizontal-padding:6px;
|
|
259
267
|
}
|
|
268
|
+
.uui-theme-vanilla_thunder .uui-input-box.uui-textarea{
|
|
269
|
+
--uui-horizontal-padding:12px;
|
|
270
|
+
}
|
|
271
|
+
.uui-theme-vanilla_thunder .uui-input-box.uui-textarea.uui-size-24{
|
|
272
|
+
--uui-line-height:12px;
|
|
273
|
+
}
|
|
260
274
|
.uui-theme-vanilla_thunder .uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60){
|
|
261
275
|
--uui-horizontal-padding:12px;
|
|
262
276
|
--uui-horizontal-gap:6px;
|
|
@@ -320,6 +334,60 @@
|
|
|
320
334
|
--uui-line-height:24px;
|
|
321
335
|
--uui-font-size:16px;
|
|
322
336
|
}
|
|
337
|
+
.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-30{
|
|
338
|
+
--uui-icon-size:12px;
|
|
339
|
+
--uui-font-size:12px;
|
|
340
|
+
}
|
|
341
|
+
.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-42{
|
|
342
|
+
--uui-line-height:18px;
|
|
343
|
+
--uui-font-size:14px;
|
|
344
|
+
}
|
|
345
|
+
.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-48{
|
|
346
|
+
--uui-icon-size:18px;
|
|
347
|
+
--uui-line-height:18px;
|
|
348
|
+
--uui-font-size:14px;
|
|
349
|
+
}
|
|
350
|
+
.uui-theme-vanilla_thunder .uui-badge.uui-size-18{
|
|
351
|
+
--uui-font-size:12px;
|
|
352
|
+
}
|
|
353
|
+
.uui-theme-vanilla_thunder .uui-badge.uui-size-24{
|
|
354
|
+
--uui-horizontal-padding:3px;
|
|
355
|
+
--uui-icon-size:18px;
|
|
356
|
+
--uui-line-height:12px;
|
|
357
|
+
}
|
|
358
|
+
.uui-theme-vanilla_thunder .uui-badge.uui-size-36{
|
|
359
|
+
--uui-horizontal-padding:9px;
|
|
360
|
+
}
|
|
361
|
+
.uui-theme-vanilla_thunder .uui-badge.uui-size-42{
|
|
362
|
+
--uui-icon-size:24px;
|
|
363
|
+
}
|
|
364
|
+
.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-12{
|
|
365
|
+
--uui-horizontal-gap:4px;
|
|
366
|
+
}
|
|
367
|
+
.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-18{
|
|
368
|
+
--uui-horizontal-gap:6px;
|
|
369
|
+
--uui-line-height:18px;
|
|
370
|
+
--uui-font-size:14px;
|
|
371
|
+
--uui-dot-size:8px;
|
|
372
|
+
}
|
|
373
|
+
.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-24{
|
|
374
|
+
--uui-font-size:14px;
|
|
375
|
+
--uui-dot-size:10px;
|
|
376
|
+
}
|
|
377
|
+
.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-12{
|
|
378
|
+
--uui-horizontal-padding:3px;
|
|
379
|
+
--uui-line-height:10px;
|
|
380
|
+
--uui-font-size:8px;
|
|
381
|
+
}
|
|
382
|
+
.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-18{
|
|
383
|
+
--uui-horizontal-padding:6px;
|
|
384
|
+
--uui-line-height:16px;
|
|
385
|
+
--uui-font-size:12px;
|
|
386
|
+
}
|
|
387
|
+
.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-24{
|
|
388
|
+
--uui-line-height:22px;
|
|
389
|
+
--uui-font-size:14px;
|
|
390
|
+
}
|
|
323
391
|
.uui-theme-vanilla_thunder .uui-color-accent,
|
|
324
392
|
.uui-theme-vanilla_thunder .uui-color-grass,
|
|
325
393
|
.uui-theme-vanilla_thunder .uui-color-success{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../theme/theme_vanilla_thunder.scss%23sass","../../../../../theme/theme_vanilla_thunder.scss","../../../theme/theme_6px.scss","../../../theme/theme_vanilla_thunder.scss"],"names":[],"mappings":"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","file":"theme_vanilla_thunder.css","sourcesContent":["@use './theme_6px' as *;\n\n/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n @include uui-6px-grid();\n --uui-font: var(--font-inter);\n --uui-font-mono: 'Roboto Mono', monospace;\n\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n\n /* start Loveship colors for controllers */\n\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n\n --white: #FFFFFF;\n\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n\n /* end Loveship colors for controllers */\n\n /* core variables start */\n\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n\n\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n\n /* not accepted part */\n\n /* control specific */\n\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n\n --uui-outline-focus: #008ACE80;\n\n --uui-skeleton: var(--chromatic-200);\n\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n\n --uui-border-radius: 3px;\n\n /* core variables end */\n\n /* ------------------------------------ */\n\n /* begin color classes */\n\n .uui-color-accent,\n .uui-color-grass,\n .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n }\n\n .uui-color-primary,\n .uui-color-blue,\n .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n }\n\n .uui-color-fire,\n .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n }\n\n .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n }\n\n .uui-color-warning,\n .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n }\n\n .uui-color-neutral,\n .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n }\n\n .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n\n &.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n }\n\n .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n }\n\n /* MainMenu */\n\n .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n }\n\n /* BurgerMenu */\n\n .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n }\n\n /* BurgerButton */\n .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n }\n\n /* BurgerSearch */\n\n .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n }\n\n .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n }\n\n .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n }\n\n /* Tooltip */\n\n .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n }\n\n .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n }\n\n .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n }\n\n /* Tag */\n\n .uui-tag {\n &.uui-color-warning, &.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n }\n\n &.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n }\n\n }\n\n &.uui-color-neutral, &.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n }\n\n &.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n }\n }\n }\n }\n\n /* CountIndicator */\n\n .uui-count_indicator {\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n }\n\n &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n }\n }\n\n .uui-button {\n &.uui-size-42, &.uui-size-48 {\n :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n }\n }\n }\n}\n","@use './theme_6px' as *;\n\n/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n @include uui-6px-grid();\n --uui-font: var(--font-inter);\n --uui-font-mono: 'Roboto Mono', monospace;\n\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n\n /* start Loveship colors for controllers */\n\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n\n --white: #FFFFFF;\n\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n\n /* end Loveship colors for controllers */\n\n /* core variables start */\n\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n\n\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n\n /* not accepted part */\n\n /* control specific */\n\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n\n --uui-outline-focus: #008ACE80;\n\n --uui-skeleton: var(--chromatic-200);\n\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n\n --uui-border-radius: 3px;\n\n /* core variables end */\n\n /* ------------------------------------ */\n\n /* begin color classes */\n\n .uui-color-accent,\n .uui-color-grass,\n .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n }\n\n .uui-color-primary,\n .uui-color-blue,\n .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n }\n\n .uui-color-fire,\n .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n }\n\n .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n }\n\n .uui-color-warning,\n .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n }\n\n .uui-color-neutral,\n .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n }\n\n .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n\n &.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n }\n\n .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n }\n\n /* MainMenu */\n\n .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n }\n\n /* BurgerMenu */\n\n .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n }\n\n /* BurgerButton */\n .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n }\n\n /* BurgerSearch */\n\n .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n }\n\n .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n }\n\n .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n }\n\n /* Tooltip */\n\n .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n }\n\n .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n }\n\n .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n }\n\n /* Tag */\n\n .uui-tag {\n &.uui-color-warning, &.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n }\n\n &.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n }\n\n }\n\n &.uui-color-neutral, &.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n }\n\n &.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n }\n }\n }\n }\n\n /* CountIndicator */\n\n .uui-count_indicator {\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n }\n\n &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n }\n }\n\n .uui-button {\n &.uui-size-42, &.uui-size-48 {\n :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n }\n }\n }\n}\n","@mixin uui-6px-grid {\n --uui-focus-outline-width: 2px;\n --uui-focus-outline-offset: 2px;\n --uui-focus-radius: 2px;\n //--uui-border-radius: 3px; // TODO: ?????\n --uui-tab-line-width: 3px;\n --uui-notify-size: 6px;\n\n\n .uui-size-12 {\n --uui-size: 12px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 12px;\n\n }\n\n .uui-size-18 {\n --uui-size: 18px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 3px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 3px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 10px;\n\n }\n\n .uui-size-24 {\n --uui-size: 24px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 12px;\n }\n\n .uui-size-30 {\n --uui-size: 30px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n .uui-size-36 {\n --uui-size: 36px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n .uui-size-42 {\n --uui-size: 42px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n\n .uui-size-48 {\n --uui-size: 48px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n\n .uui-size-60 {\n --uui-size: 60px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 20px;\n }\n\n .uui-input-box {\n &.uui-size-42 {\n --uui-horizontal-padding: 6px;\n }\n\n &.uui-size-48 {\n --uui-horizontal-padding: 6px;\n }\n }\n\n .uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n --uui-horizontal-padding: 12px;\n --uui-horizontal-gap: 6px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n .uui-tag {\n &.uui-size-18 {\n --uui-font-size: 12px;\n --uui-line-height: 14px;\n }\n\n &.uui-size-24 {\n --uui-icon-size: 18px;\n }\n\n &.uui-size-42 {\n --uui-icon-size: 24px;\n }\n\n &.uui-size-42,\n &.uui-size-48 {\n --uui-tag-count_indicator-margin-end: 3px;\n }\n\n &.uui-size-18,\n &.uui-size-24,\n &.uui-size-30,\n &.uui-size-36 {\n --uui-horizontal-gap: 3px;\n }\n\n &.uui-size-18,\n &.uui-size-24,\n &.uui-size-30 {\n --uui-horizontal-padding: 3px;\n }\n\n &.uui-size-42,\n &.uui-size-48 {\n --uui-horizontal-padding: 6px;\n }\n }\n\n .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36, .uui-size-42) {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-gap: 3px;\n }\n }\n\n .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36) {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 3px;\n }\n }\n\n .uui-size-48.uui-picker_toggler {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 6px;\n }\n }\n\n .uui-checkbox-container, .uui-radio-input-container {\n &.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n }\n\n .uui-switch {\n &.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n &.uui-size-24 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n }\n\n .uui-picker-body:is(.uui-size-30, .uui-size-36) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n\n }\n\n .uui-picker-body:is(.uui-size-42, .uui-size-48) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n}\n","/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n --uui-focus-outline-width: 2px;\n --uui-focus-outline-offset: 2px;\n --uui-focus-radius: 2px;\n --uui-tab-line-width: 3px;\n --uui-notify-size: 6px;\n --uui-font: var(--font-inter);\n --uui-font-mono: \"Roboto Mono\", monospace;\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n /* start Loveship colors for controllers */\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n --white: #FFFFFF;\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n /* end Loveship colors for controllers */\n /* core variables start */\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n /* not accepted part */\n /* control specific */\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n --uui-outline-focus: #008ACE80;\n --uui-skeleton: var(--chromatic-200);\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n --uui-border-radius: 3px;\n /* core variables end */\n /* ------------------------------------ */\n /* begin color classes */\n /* MainMenu */\n /* BurgerMenu */\n /* BurgerButton */\n /* BurgerSearch */\n /* Tooltip */\n /* Tag */\n /* CountIndicator */\n}\n.uui-theme-vanilla_thunder .uui-size-12 {\n --uui-size: 12px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-size-18 {\n --uui-size: 18px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 3px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 3px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 10px;\n}\n.uui-theme-vanilla_thunder .uui-size-24 {\n --uui-size: 24px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-size-30 {\n --uui-size: 30px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-size-36 {\n --uui-size: 36px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-size-42 {\n --uui-size: 42px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-size-48 {\n --uui-size: 48px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-size-60 {\n --uui-size: 60px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 20px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-size-42 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-size-48 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n --uui-horizontal-padding: 12px;\n --uui-horizontal-gap: 6px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18 {\n --uui-font-size: 12px;\n --uui-line-height: 14px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-24 {\n --uui-icon-size: 18px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42 {\n --uui-icon-size: 24px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42, .uui-theme-vanilla_thunder .uui-tag.uui-size-48 {\n --uui-tag-count_indicator-margin-end: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18, .uui-theme-vanilla_thunder .uui-tag.uui-size-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30, .uui-theme-vanilla_thunder .uui-tag.uui-size-36 {\n --uui-horizontal-gap: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18, .uui-theme-vanilla_thunder .uui-tag.uui-size-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30 {\n --uui-horizontal-padding: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42, .uui-theme-vanilla_thunder .uui-tag.uui-size-48 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36, .uui-size-42) .uui-tag.uui-size-inherit {\n --uui-horizontal-gap: 3px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36) .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 3px;\n}\n.uui-theme-vanilla_thunder .uui-size-48.uui-picker_toggler .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-checkbox-container.uui-size-18, .uui-theme-vanilla_thunder .uui-radio-input-container.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-switch.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-switch.uui-size-24 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-picker-body:is(.uui-size-30, .uui-size-36) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-picker-body:is(.uui-size-42, .uui-size-48) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-color-accent,\n.uui-theme-vanilla_thunder .uui-color-grass,\n.uui-theme-vanilla_thunder .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-primary,\n.uui-theme-vanilla_thunder .uui-color-blue,\n.uui-theme-vanilla_thunder .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-fire,\n.uui-theme-vanilla_thunder .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-warning,\n.uui-theme-vanilla_thunder .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-neutral,\n.uui-theme-vanilla_thunder .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n}\n.uui-theme-vanilla_thunder .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n}\n.uui-theme-vanilla_thunder .uui-button.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-button.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n}\n.uui-theme-vanilla_thunder .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n}\n.uui-theme-vanilla_thunder .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n}\n.uui-theme-vanilla_thunder .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n}\n.uui-theme-vanilla_thunder .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning.uui-fill-outline .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300 .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral.uui-fill-outline, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral.uui-fill-outline .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n}\n.uui-theme-vanilla_thunder .uui-count_indicator.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n}\n.uui-theme-vanilla_thunder .uui-count_indicator:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n}\n.uui-theme-vanilla_thunder .uui-button.uui-size-42 :global(.uui-caption), .uui-theme-vanilla_thunder .uui-button.uui-size-48 :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n}"]}
|
|
1
|
+
{"version":3,"sources":["../../../theme/theme_vanilla_thunder.scss%23sass","../../../../../theme/theme_vanilla_thunder.scss","../../../theme/theme_6px.scss","../../../theme/theme_vanilla_thunder.scss"],"names":[],"mappings":"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","file":"theme_vanilla_thunder.css","sourcesContent":["@use './theme_6px' as *;\n\n/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n @include uui-6px-grid();\n --uui-font: var(--font-inter);\n --uui-font-mono: 'Roboto Mono', monospace;\n\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n\n /* start Loveship colors for controllers */\n\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n\n --white: #FFFFFF;\n\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n\n /* end Loveship colors for controllers */\n\n /* core variables start */\n\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n\n\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n\n /* not accepted part */\n\n /* control specific */\n\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n\n --uui-outline-focus: #008ACE80;\n\n --uui-skeleton: var(--chromatic-200);\n\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n\n --uui-border-radius: 3px;\n\n /* core variables end */\n\n /* ------------------------------------ */\n\n /* begin color classes */\n\n .uui-color-accent,\n .uui-color-grass,\n .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n }\n\n .uui-color-primary,\n .uui-color-blue,\n .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n }\n\n .uui-color-fire,\n .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n }\n\n .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n }\n\n .uui-color-warning,\n .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n }\n\n .uui-color-neutral,\n .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n }\n\n .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n\n &.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n }\n\n .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n }\n\n /* MainMenu */\n\n .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n }\n\n /* BurgerMenu */\n\n .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n }\n\n /* BurgerButton */\n .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n }\n\n /* BurgerSearch */\n\n .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n }\n\n .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n }\n\n .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n }\n\n /* Tooltip */\n\n .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n }\n\n .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n }\n\n .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n }\n\n /* Tag */\n\n .uui-tag {\n &.uui-color-warning, &.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n }\n\n &.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n }\n\n }\n\n &.uui-color-neutral, &.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n }\n\n &.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n }\n }\n }\n }\n\n /* CountIndicator */\n\n .uui-count_indicator {\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n }\n\n &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n }\n }\n\n .uui-button {\n &.uui-size-42, &.uui-size-48 {\n :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n }\n }\n }\n}\n","@use './theme_6px' as *;\n\n/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n @include uui-6px-grid();\n --uui-font: var(--font-inter);\n --uui-font-mono: 'Roboto Mono', monospace;\n\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n\n /* start Loveship colors for controllers */\n\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n\n --white: #FFFFFF;\n\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n\n /* end Loveship colors for controllers */\n\n /* core variables start */\n\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n\n\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n\n /* not accepted part */\n\n /* control specific */\n\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n\n --uui-outline-focus: #008ACE80;\n\n --uui-skeleton: var(--chromatic-200);\n\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n\n --uui-border-radius: 3px;\n\n /* core variables end */\n\n /* ------------------------------------ */\n\n /* begin color classes */\n\n .uui-color-accent,\n .uui-color-grass,\n .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n }\n\n .uui-color-primary,\n .uui-color-blue,\n .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n }\n\n .uui-color-fire,\n .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n }\n\n .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n }\n\n .uui-color-warning,\n .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n }\n\n .uui-color-neutral,\n .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n }\n\n .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n\n &.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n }\n }\n\n .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n }\n\n /* MainMenu */\n\n .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n }\n\n /* BurgerMenu */\n\n .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n }\n\n /* BurgerButton */\n .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n }\n\n /* BurgerSearch */\n\n .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n }\n\n .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n }\n\n .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n }\n\n .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n }\n\n /* Tooltip */\n\n .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n }\n\n .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n }\n\n .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n }\n\n /* Tag */\n\n .uui-tag {\n &.uui-color-warning, &.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n }\n\n &.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n }\n\n }\n\n &.uui-color-neutral, &.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n }\n\n &.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n\n .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n }\n }\n }\n }\n\n /* CountIndicator */\n\n .uui-count_indicator {\n &.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n }\n\n &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n }\n }\n\n .uui-button {\n &.uui-size-42, &.uui-size-48 {\n :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n }\n }\n }\n}\n","@mixin uui-6px-grid {\n --uui-focus-outline-width: 2px;\n --uui-focus-outline-offset: 2px;\n --uui-focus-radius: 2px;\n //--uui-border-radius: 3px; // TODO: ?????\n --uui-tab-line-width: 3px;\n --uui-notify-size: 6px;\n\n\n .uui-size-12 {\n --uui-size: 12px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 12px;\n --uui-dot-size: 6px;\n }\n\n .uui-size-18 {\n --uui-size: 18px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 3px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 3px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 10px;\n --uui-dot-size: 6px;\n }\n\n .uui-size-24 {\n --uui-size: 24px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 12px;\n --uui-dot-size: 8px;\n }\n\n .uui-size-30 {\n --uui-size: 30px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n }\n\n .uui-size-36 {\n --uui-size: 36px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n }\n\n .uui-size-42 {\n --uui-size: 42px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n --uui-dot-size: 10px;\n }\n\n .uui-size-48 {\n --uui-size: 48px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n --uui-dot-size: 12px;\n }\n\n .uui-size-60 {\n --uui-size: 60px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 20px;\n --uui-dot-size: 12px;\n }\n\n .uui-input-box {\n &.uui-size-42 {\n --uui-horizontal-padding: 6px;\n }\n\n &.uui-size-48 {\n --uui-horizontal-padding: 6px;\n }\n\n &.uui-textarea {\n --uui-horizontal-padding: 12px;\n\n &.uui-size-24 {\n --uui-line-height: 12px;\n }\n }\n }\n\n .uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n --uui-horizontal-padding: 12px;\n --uui-horizontal-gap: 6px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n .uui-tag {\n &.uui-size-18 {\n --uui-font-size: 12px;\n --uui-line-height: 14px;\n }\n\n &.uui-size-24 {\n --uui-icon-size: 18px;\n }\n\n &.uui-size-42 {\n --uui-icon-size: 24px;\n }\n\n &.uui-size-42,\n &.uui-size-48 {\n --uui-tag-count_indicator-margin-end: 3px;\n }\n\n &.uui-size-18,\n &.uui-size-24,\n &.uui-size-30,\n &.uui-size-36 {\n --uui-horizontal-gap: 3px;\n }\n\n &.uui-size-18,\n &.uui-size-24,\n &.uui-size-30 {\n --uui-horizontal-padding: 3px;\n }\n\n &.uui-size-42,\n &.uui-size-48 {\n --uui-horizontal-padding: 6px;\n }\n }\n\n .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36, .uui-size-42) {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-gap: 3px;\n }\n }\n\n .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36) {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 3px;\n }\n }\n\n .uui-size-48.uui-picker_toggler {\n .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 6px;\n }\n }\n\n .uui-checkbox-container, .uui-radio-input-container {\n &.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n }\n\n .uui-switch {\n &.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n &.uui-size-24 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n }\n\n .uui-picker-body:is(.uui-size-30, .uui-size-36) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n\n }\n\n .uui-picker-body:is(.uui-size-42, .uui-size-48) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n }\n\n .uui-labeled-input {\n &.uui-size-30 {\n --uui-icon-size: 12px;\n --uui-font-size: 12px;\n }\n\n &.uui-size-42 {\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n\n &.uui-size-48 {\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n }\n }\n\n .uui-badge {\n &.uui-size-18 {\n --uui-font-size: 12px;\n }\n\n &.uui-size-24 {\n --uui-horizontal-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 12px;\n }\n\n &.uui-size-36 {\n --uui-horizontal-padding: 9px;\n }\n\n &.uui-size-42 {\n --uui-icon-size: 24px;\n }\n }\n\n .uui-status_indicator {\n &.uui-size-12 {\n --uui-horizontal-gap: 4px;\n }\n\n &.uui-size-18 {\n --uui-horizontal-gap: 6px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n }\n\n &.uui-size-24 {\n --uui-font-size: 14px;\n --uui-dot-size: 10px;\n }\n }\n\n .uui-count_indicator {\n &.uui-size-12 {\n --uui-horizontal-padding: 3px;\n --uui-line-height: 10px;\n --uui-font-size: 8px;\n }\n\n &.uui-size-18 {\n --uui-horizontal-padding: 6px;\n --uui-line-height: 16px;\n --uui-font-size: 12px;\n }\n\n &.uui-size-24 {\n --uui-line-height: 22px;\n --uui-font-size: 14px;\n }\n }\n}\n","/* Name convention */\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\n.uui-theme-vanilla_thunder {\n --uui-focus-outline-width: 2px;\n --uui-focus-outline-offset: 2px;\n --uui-focus-radius: 2px;\n --uui-tab-line-width: 3px;\n --uui-notify-size: 6px;\n --uui-font: var(--font-inter);\n --uui-font-mono: \"Roboto Mono\", monospace;\n --blue-0: #F0F7FC;\n --blue-50: #E1F4FA;\n --blue-100: #D4F0FE;\n --blue-200: #76CDD8;\n --blue-300: #2BC1F0;\n --blue-400: #1CA5D3;\n --blue-500: #008ACE;\n --grass-25: #EBFCC7;\n --grass-50: #E4ED94;\n --grass-100: #CEDB56;\n --grass-200: #91C229;\n --grass-300: #4FA762;\n --grass-400: #329247;\n --grass-500: #157D2C;\n --sun-50: #FFF1A7;\n --sun-100: #FFD602;\n --sun-200: #F7A02C;\n --sun-250: #F67E00;\n --sun-300: #F2682A;\n --chromatic-0: #FFFFFF;\n --chromatic-100: #F7F7FD;\n --chromatic-150: #E5E5EE;\n --chromatic-200: #CDCDD9;\n --chromatic-300: #8D8D9C;\n --chromatic-400: #34384A;\n --chromatic-500: #191F3D;\n /* start Loveship colors for controllers */\n --fire-5: #FEF6F6;\n --fire-10: #FDE1E1;\n --fire-20: #FCC8C8;\n --fire-50: #FA4B4B;\n --fire-60: #CC2929;\n --fire-70: #B32424;\n --white: #FFFFFF;\n --night50: #FAFAFC;\n --night100: #F5F6FA;\n --night200: #EBEDF5;\n --night300: #E1E3EB;\n --night400: #CED0DB;\n --night500: #ACAFBF;\n --night600: #6C6F80;\n --night700: #474A59;\n --night800: #303240;\n --night900: #1D1E26;\n /* end Loveship colors for controllers */\n /* core variables start */\n --uui-accent-5: var(--grass-50);\n --uui-accent-10: var(--grass-100);\n --uui-accent-20: var(--grass-200);\n --uui-accent-50: var(--grass-300);\n --uui-accent-60: var(--grass-400);\n --uui-accent-70: var(--grass-500);\n --uui-accent-contrast: var(--white);\n --uui-primary-5: var(--blue-50);\n --uui-primary-10: var(--blue-100);\n --uui-primary-20: var(--blue-200);\n --uui-primary-50: var(--blue-300);\n --uui-primary-60: var(--blue-400);\n --uui-primary-70: var(--blue-500);\n --uui-primary-contrast: var(--white);\n --uui-secondary-5: var(--night100);\n --uui-secondary-10: var(--night200);\n --uui-secondary-20: var(--night300);\n --uui-secondary-50: var(--night500);\n --uui-secondary-60: var(--night600);\n --uui-secondary-70: var(--night700);\n --uui-secondary-contrast: var(--white);\n --uui-critical-5: var(--fire-5);\n --uui-critical-10: var(--fire-10);\n --uui-critical-20: var(--fire-20);\n --uui-critical-50: var(--fire-50);\n --uui-critical-60: var(--fire-60);\n --uui-critical-70: var(--fire-70);\n --uui-critical-contrast: var(--white);\n --uui-info-5: var(--blue-0);\n --uui-info-10: var(--blue-0);\n --uui-info-20: var(--blue-100);\n --uui-info-50: var(--blue-300);\n --uui-info-60: var(--blue-400);\n --uui-info-70: var(--blue-500);\n --uui-info-contrast: var(--white);\n --uui-success-5: var(--grass-25);\n --uui-success-10: var(--grass-100);\n --uui-success-20: var(--grass-200);\n --uui-success-50: var(--grass-300);\n --uui-success-60: var(--grass-400);\n --uui-success-70: var(--grass-500);\n --uui-success-contrast: var(--white);\n --uui-warning-5: var(--sun-50);\n --uui-warning-10: var(--sun-50);\n --uui-warning-20: var(--sun-100);\n --uui-warning-50: var(--sun-200);\n --uui-warning-60: var(--sun-250);\n --uui-warning-70: var(--sun-300);\n --uui-warning-contrast: var(--white);\n --uui-error-5: var(--fire-5);\n --uui-error-10: var(--fire-10);\n --uui-error-20: var(--fire-20);\n --uui-error-50: var(--fire-50);\n --uui-error-60: var(--fire-60);\n --uui-error-70: var(--fire-70);\n --uui-error-contrast: var(--white);\n --uui-neutral-0: #FFFFFF;\n --uui-neutral-5: var(--night50);\n --uui-neutral-10: var(--night100);\n --uui-neutral-20: var(--night200);\n --uui-neutral-30: var(--night300);\n --uui-neutral-40: var(--night400);\n --uui-neutral-50: var(--night500);\n --uui-neutral-60: var(--night600);\n --uui-neutral-70: var(--night700);\n --uui-neutral-80: var(--night800);\n --uui-neutral-90: var(--night900);\n --uui-neutral-100: #000000;\n /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\n --uui-app-bg: var(--chromatic-100);\n --uui-overlay: rgba(29, 30, 38, 0.8);\n --uui-surface-sunken: var(--night50);\n --uui-surface-main: var(--chromatic-0);\n --uui-surface-higher: var(--night100);\n --uui-surface-highest: var(--night200);\n --uui-divider: var(--chromatic-200);\n --uui-divider-light: var(--chromatic-150);\n --uui-text-primary: var(--chromatic-500);\n --uui-text-secondary: var(--chromatic-300);\n --uui-text-tertiary: var(--chromatic-300);\n --uui-text-disabled: var(--chromatic-200);\n --uui-text-info: var(--uui-info-50);\n --uui-text-warning: var(--uui-warning-50);\n --uui-text-critical: var(--uui-critical-50);\n --uui-text-success: var(--uui-success-50);\n --uui-text-bg-highlight: var(--uui-warning-10);\n /* not accepted part */\n /* control specific */\n --uui-link: var(--blue-300);\n --uui-link-hover: var(--blue-400);\n --uui-link-visited: #8018A0;\n --uui-link-visited-hover: #601278;\n --uui-link-disabled: var(--chromatic-200);\n --uui-icon: var(--chromatic-300);\n --uui-icon-hover: var(--chromatic-400);\n --uui-icon-active: var(--chromatic-500);\n --uui-icon-disabled: var(--chromatic-200);\n --uui-control-bg: var(--chromatic-0);\n --uui-control-bg-hover: var(--chromatic-300);\n --uui-control-bg-disabled: var(--chromatic-100);\n --uui-control-border: var(--chromatic-200);\n --uui-control-border-hover: var(--chromatic-300);\n --uui-control-border-focus: var(--uui-primary-50);\n --uui-control-border-disabled: var(--chromatic-150);\n --uui-control-placeholder: var(--night600);\n --uui-control-placeholder-disabled: var(--night600);\n --uui-control-text: var(--chromatic-500);\n --uui-control-text-disabled: var(--chromatic-300);\n --uui-control-icon: var(--chromatic-200);\n --uui-control-icon-disabled: var(--chromatic-200);\n --uui-outline-focus: #008ACE80;\n --uui-skeleton: var(--chromatic-200);\n --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\n --uui-shadow-level-2: 0 6px 12px rgb(29 30 38 / 10%), 0 3px 12px rgb(29 30 38 / 10%), 0 0 6px rgb(29 30 38 / 5%);\n --uui-shadow-level-3: 0 0 10px rgb(29 30 38 / 5%), 0 6px 24px rgb(29 30 38 / 12%), 0 9px 15px rgb(29 30 38 / 10%);\n --uui-border-radius: 3px;\n /* core variables end */\n /* ------------------------------------ */\n /* begin color classes */\n /* MainMenu */\n /* BurgerMenu */\n /* BurgerButton */\n /* BurgerSearch */\n /* Tooltip */\n /* Tag */\n /* CountIndicator */\n}\n.uui-theme-vanilla_thunder .uui-size-12 {\n --uui-size: 12px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 12px;\n --uui-dot-size: 6px;\n}\n.uui-theme-vanilla_thunder .uui-size-18 {\n --uui-size: 18px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 3px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 3px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 12px;\n --uui-font-size: 10px;\n --uui-dot-size: 6px;\n}\n.uui-theme-vanilla_thunder .uui-size-24 {\n --uui-size: 24px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 12px;\n --uui-dot-size: 8px;\n}\n.uui-theme-vanilla_thunder .uui-size-30 {\n --uui-size: 30px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n}\n.uui-theme-vanilla_thunder .uui-size-36 {\n --uui-size: 36px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 6px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n}\n.uui-theme-vanilla_thunder .uui-size-42 {\n --uui-size: 42px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n --uui-dot-size: 10px;\n}\n.uui-theme-vanilla_thunder .uui-size-48 {\n --uui-size: 48px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n --uui-dot-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-size-60 {\n --uui-size: 60px;\n --uui-border-width: 1px;\n --uui-horizontal-gap: 6px;\n --uui-vertical-gap: 3px;\n --uui-horizontal-padding: 12px;\n --uui-vertical-padding: 3px;\n --uui-icon-size: 24px;\n --uui-line-height: 24px;\n --uui-font-size: 20px;\n --uui-dot-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-size-42 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-size-48 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-textarea {\n --uui-horizontal-padding: 12px;\n}\n.uui-theme-vanilla_thunder .uui-input-box.uui-textarea.uui-size-24 {\n --uui-line-height: 12px;\n}\n.uui-theme-vanilla_thunder .uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n --uui-horizontal-padding: 12px;\n --uui-horizontal-gap: 6px;\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18 {\n --uui-font-size: 12px;\n --uui-line-height: 14px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-24 {\n --uui-icon-size: 18px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42 {\n --uui-icon-size: 24px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42, .uui-theme-vanilla_thunder .uui-tag.uui-size-48 {\n --uui-tag-count_indicator-margin-end: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18, .uui-theme-vanilla_thunder .uui-tag.uui-size-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30, .uui-theme-vanilla_thunder .uui-tag.uui-size-36 {\n --uui-horizontal-gap: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18, .uui-theme-vanilla_thunder .uui-tag.uui-size-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30 {\n --uui-horizontal-padding: 3px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-42, .uui-theme-vanilla_thunder .uui-tag.uui-size-48 {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36, .uui-size-42) .uui-tag.uui-size-inherit {\n --uui-horizontal-gap: 3px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler:is(.uui-size-24, .uui-size-30, .uui-size-36) .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 3px;\n}\n.uui-theme-vanilla_thunder .uui-size-48.uui-picker_toggler .uui-tag.uui-size-inherit {\n --uui-horizontal-padding: 6px;\n}\n.uui-theme-vanilla_thunder .uui-checkbox-container.uui-size-18, .uui-theme-vanilla_thunder .uui-radio-input-container.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-switch.uui-size-18 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-switch.uui-size-24 {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-picker-body:is(.uui-size-30, .uui-size-36) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-picker-body:is(.uui-size-42, .uui-size-48) .uui-switch.uui-size-inherit {\n --uui-horizontal-gap: 12px;\n --uui-line-height: 24px;\n --uui-font-size: 16px;\n}\n.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-30 {\n --uui-icon-size: 12px;\n --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-42 {\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-labeled-input.uui-size-48 {\n --uui-icon-size: 18px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-18 {\n --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-24 {\n --uui-horizontal-padding: 3px;\n --uui-icon-size: 18px;\n --uui-line-height: 12px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-36 {\n --uui-horizontal-padding: 9px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-42 {\n --uui-icon-size: 24px;\n}\n.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-12 {\n --uui-horizontal-gap: 4px;\n}\n.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-18 {\n --uui-horizontal-gap: 6px;\n --uui-line-height: 18px;\n --uui-font-size: 14px;\n --uui-dot-size: 8px;\n}\n.uui-theme-vanilla_thunder .uui-status_indicator.uui-size-24 {\n --uui-font-size: 14px;\n --uui-dot-size: 10px;\n}\n.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-12 {\n --uui-horizontal-padding: 3px;\n --uui-line-height: 10px;\n --uui-font-size: 8px;\n}\n.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-18 {\n --uui-horizontal-padding: 6px;\n --uui-line-height: 16px;\n --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-count_indicator.uui-size-24 {\n --uui-line-height: 22px;\n --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-color-accent,\n.uui-theme-vanilla_thunder .uui-color-grass,\n.uui-theme-vanilla_thunder .uui-color-success {\n --uui-color-5: var(--uui-accent-5);\n --uui-color-10: var(--uui-accent-10);\n --uui-color-20: var(--uui-accent-20);\n --uui-color-50: var(--uui-accent-50);\n --uui-color-60: var(--uui-accent-60);\n --uui-color-70: var(--uui-accent-70);\n --uui-color-contrast: var(--uui-accent-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-primary,\n.uui-theme-vanilla_thunder .uui-color-blue,\n.uui-theme-vanilla_thunder .uui-color-info {\n --uui-color-5: var(--uui-primary-5);\n --uui-color-10: var(--uui-primary-10);\n --uui-color-20: var(--uui-primary-20);\n --uui-color-50: var(--uui-primary-50);\n --uui-color-60: var(--uui-primary-60);\n --uui-color-70: var(--uui-primary-70);\n --uui-color-contrast: var(--uui-primary-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-fire,\n.uui-theme-vanilla_thunder .uui-color-critical {\n --uui-color-5: var(--uui-critical-5);\n --uui-color-10: var(--uui-critical-10);\n --uui-color-20: var(--uui-critical-20);\n --uui-color-50: var(--uui-critical-50);\n --uui-color-60: var(--uui-critical-60);\n --uui-color-70: var(--uui-critical-70);\n --uui-color-contrast: var(--uui-critical-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-error {\n --uui-color-5: var(--uui-error-5);\n --uui-color-10: var(--uui-error-10);\n --uui-color-20: var(--uui-error-20);\n --uui-color-50: var(--uui-error-50);\n --uui-color-60: var(--uui-error-60);\n --uui-color-70: var(--uui-error-70);\n --uui-color-contrast: var(--uui-error-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-warning,\n.uui-theme-vanilla_thunder .uui-color-sun {\n --uui-color-5: var(--uui-warning-5);\n --uui-color-10: var(--uui-warning-10);\n --uui-color-20: var(--uui-warning-20);\n --uui-color-50: var(--uui-warning-50);\n --uui-color-60: var(--uui-warning-60);\n --uui-color-70: var(--uui-warning-70);\n --uui-color-contrast: var(--uui-warning-contrast);\n}\n.uui-theme-vanilla_thunder .uui-color-neutral,\n.uui-theme-vanilla_thunder .uui-color-secondary {\n --uui-color-5: var(--uui-secondary-5);\n --uui-color-10: var(--uui-secondary-10);\n --uui-color-20: var(--uui-secondary-20);\n --uui-color-50: var(--uui-secondary-50);\n --uui-color-60: var(--uui-secondary-60);\n --uui-color-70: var(--uui-secondary-70);\n --uui-color-contrast: var(--uui-secondary-contrast);\n}\n.uui-theme-vanilla_thunder .uui-button {\n --uui-border-radius: 8px;\n --uui-btn-font: var(--font-museo-sans);\n --uui-btn-font-weight: 700;\n}\n.uui-theme-vanilla_thunder .uui-button.uui-color-gray {\n --uui-color-5: var(--white);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-5);\n --uui-color-50: var(--chromatic-100);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-button.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n --uui-color-contrast: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-filters-panel-item-toggler.uui-input-box {\n --uui-filters_toggler-border: var(--uui-surface-main);\n --uui-filters_toggler-border-hover: var(--blue-0);\n --uui-filters_toggler-border-radius: 8px;\n --uui-filters_toggler-bg: var(--uui-surface-main);\n --uui-filters_toggler-bg-hover: var(--blue-0);\n --uui-filters_toggler-text: var(--uui-text-secondary);\n --uui-filters_toggler-label: var(--chromatic-500);\n --uui-filters_toggler-icon: var(--uui-icon);\n --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\n --uui-filters_toggler-font: var(--uui-font);\n --uui-filters_toggler-font-weight: 400;\n}\n.uui-theme-vanilla_thunder .uui-main_menu {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--uui-info-50);\n --uui-main_menu-bg: var(--uui-info-5);\n --uui-main_menu-hover: var(--uui-neutral-0);\n --uui-main_menu-active: var(--uui-neutral-0);\n --uui-main_menu-border-active: var(--uui-neutral-0);\n --uui-main_menu-search-bg: var(--uui-neutral-5);\n --uui-main_menu-search-border: var(--uui-neutral-40);\n --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\n --uui-main_menu-search-text: var(--uui-text-primary);\n --uui-main_menu-search-icon: var(--uui-neutral-70);\n --uui-main_menu-icon: var(--chromatic-500);\n --uui-main_menu-icon-hover: var(--chromatic-500);\n --uui-main_menu-icon-active: var(--chromatic-500);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\n}\n.uui-theme-vanilla_thunder .uui-burger {\n --uui-burger_menu-bg: var(--uui-info-5);\n --uui-burger_menu-bg-hover: var(--uui-neutral-0);\n --uui-burger_menu-caption: var(--chromatic-500);\n --uui-burger_menu-icon: var(--chromatic-500);\n --uui-burger_menu-item: var(--uui-info-5);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-burger-button {\n --uui-burger_btn_caption: var(--chromatic-500);\n --uui-burger_btn_caption-hover: var(--uui-primary-50);\n --uui-burger_btn_caption-active: var(--uui-primary-50);\n --uui-burger_btn-border: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-burger-search {\n --uui-burger_search: var(--chromatic-500);\n --uui-burger_search-fill: var(--uui-neutral-70);\n --uui-burger_search-bg: var(--uui-neutral-40);\n --uui-burger_search-placeholder: var(--uui-text-tertiary);\n}\n.uui-theme-vanilla_thunder .uui-main_menu-dropdown {\n --uui-main_menu-text: var(--chromatic-500);\n --uui-main_menu-text-active: var(--chromatic-500);\n --uui-main_menu-dropdown-bg: var(--chromatic-0);\n --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\n --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\n --uui-main_menu-dropdown-border-radius: 8px;\n}\n.uui-theme-vanilla_thunder .uui-scroll-bars {\n --uui-scroll_bars-bg: var(--chromatic-200);\n --uui-scroll_bars-bg-active: var(--chromatic-300);\n}\n.uui-theme-vanilla_thunder .uui-text-placeholder {\n --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-neutral {\n --uui-tooltip-bg: var(--uui-neutral-0);\n --uui-tooltip-text: var(--uui-text-primary);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-critical {\n --uui-tooltip-bg: var(--uui-critical-60);\n}\n.uui-theme-vanilla_thunder .uui-tooltip-container.uui-color-inverted {\n --uui-tooltip-bg: var(--uui-neutral-80);\n --uui-tooltip-text: var(--uui-neutral-5);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun {\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-90);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun .uui-count_indicator {\n --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\n --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-warning.uui-fill-outline .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-sun.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300 {\n --uui-tag-bg: var(--uui-neutral-30);\n --uui-tag-bg-hover: var(--uui-neutral-40);\n --uui-tag-border: var(--uui-neutral-30);\n --uui-tag-border-hover: var(--uui-neutral-40);\n --uui-tag-caption: var(--uui-text-primary);\n --uui-tag-fill: var(--uui-neutral-60);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300 .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-0);\n --uui-count_indicator-border: var(--uui-neutral-0);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral.uui-fill-outline, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300.uui-fill-outline {\n --uui-tag-bg: var(--uui-neutral-20);\n --uui-tag-bg-hover: var(--uui-neutral-30);\n --uui-tag-border: var(--uui-neutral-40);\n --uui-tag-border-hover: var(--uui-neutral-40);\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-color-neutral.uui-fill-outline .uui-count_indicator, .uui-theme-vanilla_thunder .uui-tag.uui-color-night300.uui-fill-outline .uui-count_indicator {\n --uui-count_indicator-bg: var(--uui-neutral-30);\n --uui-count_indicator-border: var(--uui-neutral-30);\n}\n.uui-theme-vanilla_thunder .uui-count_indicator.uui-color-white {\n --uui-color-5: var(--chromatic-0);\n --uui-color-10: var(--blue-50);\n --uui-color-20: var(--uui-primary-10);\n --uui-color-50: var(--white);\n --uui-color-60: var(--blue-50);\n --uui-color-70: var(--blue-100);\n}\n.uui-theme-vanilla_thunder .uui-count_indicator:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\n --uui-count_indicator-caption: var(--uui-neutral-70);\n}\n.uui-theme-vanilla_thunder .uui-button.uui-size-42 :global(.uui-caption), .uui-theme-vanilla_thunder .uui-button.uui-size-48 :global(.uui-caption) {\n font-family: var(--font-museo-sans);\n}"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/assets",
|
|
3
|
-
"version": "5.8.1-
|
|
3
|
+
"version": "5.8.1-y.0",
|
|
4
4
|
"description": "EPAM Assets Library",
|
|
5
5
|
"author": "EPAM",
|
|
6
6
|
"license": "MIT",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"type": "git",
|
|
14
14
|
"url": "https://github.com/epam/UUI"
|
|
15
15
|
},
|
|
16
|
-
"gitHead": "
|
|
16
|
+
"gitHead": "3c47b0dca160ce83a68693fbb8c7bb6b5068ac56",
|
|
17
17
|
"publishConfig": {
|
|
18
18
|
"directory": "build"
|
|
19
19
|
}
|
package/readme.md
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
This package is a part of [EPAM UUI](https://github.com/epam/UUI) library.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
`@epam/assets` contains UUI assets, such as:
|
|
6
6
|
- icons set
|
|
7
|
-
-
|
|
7
|
+
- themes and their fonts
|
package/theme/theme_6px.scss
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
--uui-icon-size: 12px;
|
|
18
18
|
--uui-line-height: 12px;
|
|
19
19
|
--uui-font-size: 12px;
|
|
20
|
-
|
|
20
|
+
--uui-dot-size: 6px;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
.uui-size-18 {
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
--uui-icon-size: 12px;
|
|
31
31
|
--uui-line-height: 12px;
|
|
32
32
|
--uui-font-size: 10px;
|
|
33
|
-
|
|
33
|
+
--uui-dot-size: 6px;
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
.uui-size-24 {
|
|
@@ -43,6 +43,7 @@
|
|
|
43
43
|
--uui-icon-size: 12px;
|
|
44
44
|
--uui-line-height: 18px;
|
|
45
45
|
--uui-font-size: 12px;
|
|
46
|
+
--uui-dot-size: 8px;
|
|
46
47
|
}
|
|
47
48
|
|
|
48
49
|
.uui-size-30 {
|
|
@@ -55,6 +56,7 @@
|
|
|
55
56
|
--uui-icon-size: 18px;
|
|
56
57
|
--uui-line-height: 18px;
|
|
57
58
|
--uui-font-size: 14px;
|
|
59
|
+
--uui-dot-size: 8px;
|
|
58
60
|
}
|
|
59
61
|
|
|
60
62
|
.uui-size-36 {
|
|
@@ -67,6 +69,7 @@
|
|
|
67
69
|
--uui-icon-size: 18px;
|
|
68
70
|
--uui-line-height: 18px;
|
|
69
71
|
--uui-font-size: 14px;
|
|
72
|
+
--uui-dot-size: 8px;
|
|
70
73
|
}
|
|
71
74
|
|
|
72
75
|
.uui-size-42 {
|
|
@@ -79,6 +82,7 @@
|
|
|
79
82
|
--uui-icon-size: 18px;
|
|
80
83
|
--uui-line-height: 24px;
|
|
81
84
|
--uui-font-size: 16px;
|
|
85
|
+
--uui-dot-size: 10px;
|
|
82
86
|
}
|
|
83
87
|
|
|
84
88
|
.uui-size-48 {
|
|
@@ -91,6 +95,7 @@
|
|
|
91
95
|
--uui-icon-size: 24px;
|
|
92
96
|
--uui-line-height: 24px;
|
|
93
97
|
--uui-font-size: 16px;
|
|
98
|
+
--uui-dot-size: 12px;
|
|
94
99
|
}
|
|
95
100
|
|
|
96
101
|
.uui-size-60 {
|
|
@@ -103,6 +108,7 @@
|
|
|
103
108
|
--uui-icon-size: 24px;
|
|
104
109
|
--uui-line-height: 24px;
|
|
105
110
|
--uui-font-size: 20px;
|
|
111
|
+
--uui-dot-size: 12px;
|
|
106
112
|
}
|
|
107
113
|
|
|
108
114
|
.uui-input-box {
|
|
@@ -113,6 +119,14 @@
|
|
|
113
119
|
&.uui-size-48 {
|
|
114
120
|
--uui-horizontal-padding: 6px;
|
|
115
121
|
}
|
|
122
|
+
|
|
123
|
+
&.uui-textarea {
|
|
124
|
+
--uui-horizontal-padding: 12px;
|
|
125
|
+
|
|
126
|
+
&.uui-size-24 {
|
|
127
|
+
--uui-line-height: 12px;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
116
130
|
}
|
|
117
131
|
|
|
118
132
|
.uui-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {
|
|
@@ -213,4 +227,79 @@
|
|
|
213
227
|
--uui-line-height: 24px;
|
|
214
228
|
--uui-font-size: 16px;
|
|
215
229
|
}
|
|
230
|
+
|
|
231
|
+
.uui-labeled-input {
|
|
232
|
+
&.uui-size-30 {
|
|
233
|
+
--uui-icon-size: 12px;
|
|
234
|
+
--uui-font-size: 12px;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
&.uui-size-42 {
|
|
238
|
+
--uui-line-height: 18px;
|
|
239
|
+
--uui-font-size: 14px;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
&.uui-size-48 {
|
|
243
|
+
--uui-icon-size: 18px;
|
|
244
|
+
--uui-line-height: 18px;
|
|
245
|
+
--uui-font-size: 14px;
|
|
246
|
+
}
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
.uui-badge {
|
|
250
|
+
&.uui-size-18 {
|
|
251
|
+
--uui-font-size: 12px;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
&.uui-size-24 {
|
|
255
|
+
--uui-horizontal-padding: 3px;
|
|
256
|
+
--uui-icon-size: 18px;
|
|
257
|
+
--uui-line-height: 12px;
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
&.uui-size-36 {
|
|
261
|
+
--uui-horizontal-padding: 9px;
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
&.uui-size-42 {
|
|
265
|
+
--uui-icon-size: 24px;
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
.uui-status_indicator {
|
|
270
|
+
&.uui-size-12 {
|
|
271
|
+
--uui-horizontal-gap: 4px;
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
&.uui-size-18 {
|
|
275
|
+
--uui-horizontal-gap: 6px;
|
|
276
|
+
--uui-line-height: 18px;
|
|
277
|
+
--uui-font-size: 14px;
|
|
278
|
+
--uui-dot-size: 8px;
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
&.uui-size-24 {
|
|
282
|
+
--uui-font-size: 14px;
|
|
283
|
+
--uui-dot-size: 10px;
|
|
284
|
+
}
|
|
285
|
+
}
|
|
286
|
+
|
|
287
|
+
.uui-count_indicator {
|
|
288
|
+
&.uui-size-12 {
|
|
289
|
+
--uui-horizontal-padding: 3px;
|
|
290
|
+
--uui-line-height: 10px;
|
|
291
|
+
--uui-font-size: 8px;
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
&.uui-size-18 {
|
|
295
|
+
--uui-horizontal-padding: 6px;
|
|
296
|
+
--uui-line-height: 16px;
|
|
297
|
+
--uui-font-size: 12px;
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
&.uui-size-24 {
|
|
301
|
+
--uui-line-height: 22px;
|
|
302
|
+
--uui-font-size: 14px;
|
|
303
|
+
}
|
|
304
|
+
}
|
|
216
305
|
}
|