@epam/assets 5.11.0-rc.0 → 5.11.0

package/css/theme/theme_vanilla_thunder.css

@@ -281,9 +281,16 @@
   --uui-line-height:18px;
   --uui-font-size:14px;
 }
+.uui-theme-vanilla_thunder .uui-tab-button.uui-vertical-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60){
+  --uui-horizontal-padding:12px;
+  --uui-horizontal-gap:6px;
+}
 .uui-theme-vanilla_thunder .uui-tag.uui-size-18{
   --uui-font-size:12px;
 }
+.uui-theme-vanilla_thunder .uui-tag.uui-size-18 .uui-caption{
+  --uui-tag-horizontal-gap:0;
+}
 .uui-theme-vanilla_thunder .uui-tag.uui-size-24{
   --uui-icon-size:18px;
 }
@@ -329,9 +336,11 @@
 }
 .uui-theme-vanilla_thunder .uui-badge.uui-size-18{
   --uui-font-size:12px;
+  --uui-horizontal-padding:6px;
+  --uui-badge-caption-horizontal-padding:0;
+  --uui-badge-indicator-padding:3px;
 }
 .uui-theme-vanilla_thunder .uui-badge.uui-size-24{
-  --uui-horizontal-padding:3px;
   --uui-icon-size:18px;
   --uui-line-height:12px;
 }
@@ -340,6 +349,13 @@
 }
 .uui-theme-vanilla_thunder .uui-badge.uui-size-42{
   --uui-icon-size:24px;
+  --uui-horizontal-padding:15px;
+}
+.uui-theme-vanilla_thunder .uui-badge.uui-size-48{
+  --uui-horizontal-padding:15px;
+}
+.uui-theme-vanilla_thunder .uui-badge.uui-size-24, .uui-theme-vanilla_thunder .uui-badge.uui-size-30, .uui-theme-vanilla_thunder .uui-badge.uui-size-36, .uui-theme-vanilla_thunder .uui-badge.uui-size-42, .uui-theme-vanilla_thunder .uui-badge.uui-size-48{
+  --uui-horizontal-gap:3px;
 }
 .uui-theme-vanilla_thunder .uui-status_indicator.uui-size-12{
   --uui-horizontal-gap:4px;

package/css/theme/theme_vanilla_thunder.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../theme/theme_vanilla_thunder.scss%23sass","../../../../../theme/theme_vanilla_thunder.scss","../../../theme/theme_vanilla_thunder.scss","../../../theme/variables/6px_grid.scss"],"names":[],"mappings":"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","file":"theme_vanilla_thunder.css","sourcesContent":["@use './variables/6px_grid' 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    --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    /* size theme start */\n\n    @include uui-6px-grid();\n\n    /* size theme end */\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-hover: 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 './variables/6px_grid' 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    --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    /* size theme start */\n\n    @include uui-6px-grid();\n\n    /* size theme end */\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-hover: 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","/*  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-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  /* size theme start */\n  /* size theme end */\n  /* begin color classes */\n  /* MainMenu */\n  /* BurgerMenu */\n  /* BurgerButton */\n  /* BurgerSearch */\n  /* Tooltip */\n  /* Tag */\n  /* CountIndicator */\n}\n.uui-theme-vanilla_thunder {\n  --uui-grid-unit: 6px;\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}\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: 6px;\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: 9px;\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: 9px;\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: 12px;\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: 18px;\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: 6px;\n  --uui-horizontal-gap: 3px;\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}\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-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30, .uui-theme-vanilla_thunder .uui-tag.uui-size-36, .uui-theme-vanilla_thunder .uui-tag.uui-size-42 {\n  --uui-horizontal-gap: 3px;\n}\n.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: 9px;\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-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-table-header-cell.uui-size-36 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-table-header-cell.uui-size-48 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-table-header-cell.uui-size-60 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-30, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-36, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-42, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-48 {\n  --uui-vertical-padding: 3px;\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-hover: 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}","@mixin uui-6px-grid {\n    & {\n        --uui-grid-unit: 6px;\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: 6px;\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: 9px;\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: 9px;\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: 12px;\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: 18px;\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: 6px;\n        --uui-horizontal-gap: 3px;\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        }\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-24,\n        &.uui-size-30,\n        &.uui-size-36,\n        &.uui-size-42 {\n            --uui-horizontal-gap: 3px;\n        }\n\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: 9px;\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-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    .uui-table-header-cell {\n        &.uui-size-36 {\n            --uui-horizontal-gap: 12px;\n        }\n\n        &.uui-size-48 {\n            --uui-horizontal-gap: 12px;\n        }\n\n        &.uui-size-60 {\n            --uui-horizontal-gap: 12px;\n        }\n    }\n\n    .uui-picker_toggler {\n        &.uui-size-30,\n        &.uui-size-36,\n        &.uui-size-42,\n        &.uui-size-48 {\n            --uui-vertical-padding: 3px;\n        }\n    }\n}\n"]}
+{"version":3,"sources":["../../../theme/theme_vanilla_thunder.scss%23sass","../../../../../theme/theme_vanilla_thunder.scss","../../../theme/theme_vanilla_thunder.scss","../../../theme/variables/6px_grid.scss"],"names":[],"mappings":"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","file":"theme_vanilla_thunder.css","sourcesContent":["@use './variables/6px_grid' 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    --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    /* size theme start */\n\n    @include uui-6px-grid();\n\n    /* size theme end */\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-hover: 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 './variables/6px_grid' 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    --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    /* size theme start */\n\n    @include uui-6px-grid();\n\n    /* size theme end */\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-hover: 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","/*  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-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  /* size theme start */\n  /* size theme end */\n  /* begin color classes */\n  /* MainMenu */\n  /* BurgerMenu */\n  /* BurgerButton */\n  /* BurgerSearch */\n  /* Tooltip */\n  /* Tag */\n  /* CountIndicator */\n}\n.uui-theme-vanilla_thunder {\n  --uui-grid-unit: 6px;\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}\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: 6px;\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: 9px;\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: 9px;\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: 12px;\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: 18px;\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: 6px;\n  --uui-horizontal-gap: 3px;\n  --uui-icon-size: 18px;\n  --uui-line-height: 18px;\n  --uui-font-size: 14px;\n}\n.uui-theme-vanilla_thunder .uui-tab-button.uui-vertical-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n  --uui-horizontal-padding: 12px;\n  --uui-horizontal-gap: 6px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18 {\n  --uui-font-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-tag.uui-size-18 .uui-caption {\n  --uui-tag-horizontal-gap: 0;\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-24, .uui-theme-vanilla_thunder .uui-tag.uui-size-30, .uui-theme-vanilla_thunder .uui-tag.uui-size-36, .uui-theme-vanilla_thunder .uui-tag.uui-size-42 {\n  --uui-horizontal-gap: 3px;\n}\n.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: 9px;\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-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  --uui-horizontal-padding: 6px;\n  --uui-badge-caption-horizontal-padding: 0;\n  --uui-badge-indicator-padding: 3px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-24 {\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  --uui-horizontal-padding: 15px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-48 {\n  --uui-horizontal-padding: 15px;\n}\n.uui-theme-vanilla_thunder .uui-badge.uui-size-24, .uui-theme-vanilla_thunder .uui-badge.uui-size-30, .uui-theme-vanilla_thunder .uui-badge.uui-size-36, .uui-theme-vanilla_thunder .uui-badge.uui-size-42, .uui-theme-vanilla_thunder .uui-badge.uui-size-48 {\n  --uui-horizontal-gap: 3px;\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-table-header-cell.uui-size-36 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-table-header-cell.uui-size-48 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-table-header-cell.uui-size-60 {\n  --uui-horizontal-gap: 12px;\n}\n.uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-30, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-36, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-42, .uui-theme-vanilla_thunder .uui-picker_toggler.uui-size-48 {\n  --uui-vertical-padding: 3px;\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-hover: 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}","@mixin uui-6px-grid {\n    & {\n        --uui-grid-unit: 6px;\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: 6px;\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: 9px;\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: 9px;\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: 12px;\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: 18px;\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: 6px;\n        --uui-horizontal-gap: 3px;\n        --uui-icon-size: 18px;\n        --uui-line-height: 18px;\n        --uui-font-size: 14px;\n    }\n\n    .uui-tab-button.uui-vertical-tab-button:is(.uui-size-36, .uui-size-48, .uui-size-60) {\n        --uui-horizontal-padding: 12px;\n        --uui-horizontal-gap: 6px;\n    }\n\n    .uui-tag {\n        &.uui-size-18 {\n            --uui-font-size: 12px;\n\n            .uui-caption {\n                --uui-tag-horizontal-gap: 0;\n            }\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-24,\n        &.uui-size-30,\n        &.uui-size-36,\n        &.uui-size-42 {\n            --uui-horizontal-gap: 3px;\n        }\n\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: 9px;\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-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            --uui-horizontal-padding: 6px;\n            --uui-badge-caption-horizontal-padding: 0;\n            --uui-badge-indicator-padding: 3px;\n        }\n\n        &.uui-size-24 {\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            --uui-horizontal-padding: 15px;\n        }\n\n        &.uui-size-48 {\n            --uui-horizontal-padding: 15px;\n        }\n\n        &.uui-size-24,\n        &.uui-size-30,\n        &.uui-size-36,\n        &.uui-size-42,\n        &.uui-size-48 {\n            --uui-horizontal-gap: 3px;\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    .uui-table-header-cell {\n        &.uui-size-36 {\n            --uui-horizontal-gap: 12px;\n        }\n\n        &.uui-size-48 {\n            --uui-horizontal-gap: 12px;\n        }\n\n        &.uui-size-60 {\n            --uui-horizontal-gap: 12px;\n        }\n    }\n\n    .uui-picker_toggler {\n        &.uui-size-30,\n        &.uui-size-36,\n        &.uui-size-42,\n        &.uui-size-48 {\n            --uui-vertical-padding: 3px;\n        }\n    }\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/assets",
-  "version": "5.11.0-rc.0",
+  "version": "5.11.0",
   "description": "EPAM Assets Library",
   "author": "EPAM",
   "license": "MIT",
@@ -13,7 +13,7 @@
     "type": "git",
     "url": "https://github.com/epam/UUI"
   },
-  "gitHead": "319d7057eb4420450bc232a35fd51e9b3c7e9688",
+  "gitHead": "ea91ba96447229b7e128992c33c0f1086887c64c",
   "publishConfig": {
     "directory": "build"
   }

package/theme/theme_eduverse_dark.scss

@@ -9,6 +9,7 @@
 @mixin theme-eduverse_dark {
     --uui-font: 'Inter', sans-serif;
     --uui-font-mono: 'Roboto Mono', monospace;
+    --font-museo-sans: 'Museo Sans', 'Source Sans Pro', Arial, sans-serif;
 
     /* shadows */
     --uui-shadow-level-1: 0 0 4px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
@@ -175,6 +176,20 @@
         --uui-accordion-toggler-border: var(--uui-divider-light);
     }
 
+    .uui-accordion-toggler {
+        --uui-accordion-toggler-font: var(--font-museo-sans);
+        --uui-accordion-toggler-font-weight: 500;
+    }
+
+    /* Modals */
+
+    .uui-modal-title {
+        --uui-modals-title-font: var(--font-museo-sans);
+        --uui-modals-title-font-weight: 500;
+        --uui-modals-title-font-size: 28px;
+        --uui-modals-title-line-height: 36px;
+    }
+
     /* FileCard */
 
     .uui-file_card {
@@ -424,6 +439,11 @@
     .uui-tab-button {
         --uui-tab_btn-text-hover: var(--uui-primary-60);
         --uui-tab_btn-text-active: var(--uui-primary-60);
+        --uui-tab_btn-font-weight: 400;
+
+        .uui-count_indicator {
+            --uui-count_indicator-font-weight: 400;
+        }
     }
 
     /* MainMenu */
@@ -805,25 +825,44 @@
     /* Typography */
 
     .uui-typography {
-        .uui-highlight {
-            background-color: var(--uui-warning-20);
+        h1, h2, h3, h4, h5, h6 {
+            font-family: var(--font-museo-sans);
+            letter-spacing: unset;
         }
 
         h1 {
-            font-weight: 600;
+            font-size: 64px;
+            line-height: 72px;
+            font-weight: 700;
         }
 
         h2 {
+            font-size: 36px;
+            line-height: 42px;
             font-weight: 700;
         }
 
         h3 {
-            font-weight: 600;
+            font-size: 32px;
+            line-height: 36px;
+            font-weight: 700;
         }
 
-        .hero-header {
-            font-size: 72px;
-            line-height: 72px;
+        h4 {
+            font-size: 28px;
+            line-height: 36px;
+            font-weight: 500;
+        }
+
+        h5 {
+            font-size: 24px;
+            line-height: 32px;
+            font-weight: 700;
+        }
+
+        h6 {
+            font-size: 14px;
+            line-height: 24px;
             font-weight: 700;
         }
     }

package/theme/theme_eduverse_light.scss

@@ -10,6 +10,7 @@
 @mixin theme-eduverse_light {
     --uui-font: 'Inter', sans-serif;
     --uui-font-mono: 'Roboto Mono', monospace;
+    --font-museo-sans: 'Museo Sans', 'Source Sans Pro', Arial, sans-serif;
 
     --gradient-1: linear-gradient(90deg, #00FFD3 0%, #00F6FF 44.22%, #B896FF 90%);
     --gradient-2: linear-gradient(152deg, #0078C2 8.13%, #0047FF 59.98%, #8453D2 91.87%);
@@ -175,6 +176,20 @@
         --uui-accordion-border-radius: 6px;
     }
 
+    .uui-accordion-toggler {
+        --uui-accordion-toggler-font: var(--font-museo-sans);
+        --uui-accordion-toggler-font-weight: 500;
+    }
+
+    /* Modals */
+
+    .uui-modal-title {
+        --uui-modals-title-font: var(--font-museo-sans);
+        --uui-modals-title-font-weight: 500;
+        --uui-modals-title-font-size: 28px;
+        --uui-modals-title-line-height: 36px;
+    }
+
     /* FileCard */
 
     .uui-file_card {
@@ -473,45 +488,58 @@
         }
     }
 
-    /* Typography */
+    /*  TubButton */
 
-    .uui-typography {
-        h1 {
-            font-weight: 400;
-        }
+    .uui-tab-button {
+        --uui-tab_btn-font-weight: 400;
 
-        h2, h3, h4, h5 {
-            font-weight: 600;
+        .uui-count_indicator {
+            --uui-count_indicator-font-weight: 400;
         }
+    }
 
-        .promo-header:is(h1, h2, h3, h4, h5, h6) {
-            font-family: var(--uui-font);
-        }
+    /* Typography */
 
-        h1.promo-header {
-            font-size: 72px;
-            font-weight: 400;
+    .uui-typography {
+        h1, h2, h3, h4, h5, h6 {
+            font-family: var(--font-museo-sans);
+            letter-spacing: unset;
         }
 
-        h2.promo-header {
-            font-size: 44px;
-            font-weight: 600;
+        h1 {
+            font-size: 64px;
+            line-height: 72px;
+            font-weight: 700;
         }
 
-        h3.promo-header {
+        h2 {
             font-size: 36px;
+            line-height: 42px;
+            font-weight: 700;
+        }
+
+        h3 {
+            font-size: 32px;
+            line-height: 36px;
+            font-weight: 700;
         }
 
-        h4.promo-header {
-            font-size: 30px;
+        h4 {
+            font-size: 28px;
+            line-height: 36px;
+            font-weight: 500;
         }
 
-        h5.promo-header {
+        h5 {
             font-size: 24px;
+            line-height: 32px;
+            font-weight: 700;
         }
 
-        h6.promo-header {
-            font-size: 18px;
+        h6 {
+            font-size: 14px;
+            line-height: 24px;
+            font-weight: 700;
         }
     }
 }