{"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 *;\r\n\r\n/*  Name convention  */\r\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\r\n.uui-theme-vanilla_thunder {\r\n    --uui-font: var(--font-inter);\r\n    --uui-font-mono: 'Roboto Mono', monospace;\r\n\r\n    --blue-0: #F0F7FC;\r\n    --blue-50: #E1F4FA;\r\n    --blue-100: #D4F0FE;\r\n    --blue-200: #76CDD8;\r\n    --blue-300: #2BC1F0;\r\n    --blue-400: #1CA5D3;\r\n    --blue-500: #008ACE;\r\n\r\n    --grass-25: #EBFCC7;\r\n    --grass-50: #E4ED94;\r\n    --grass-100: #CEDB56;\r\n    --grass-200: #91C229;\r\n    --grass-300: #4FA762;\r\n    --grass-400: #329247;\r\n    --grass-500: #157D2C;\r\n\r\n    --sun-50: #FFF1A7;\r\n    --sun-100: #FFD602;\r\n    --sun-200: #F7A02C;\r\n    --sun-250: #F67E00;\r\n    --sun-300: #F2682A;\r\n\r\n    --chromatic-0: #FFFFFF;\r\n    --chromatic-100: #F7F7FD;\r\n    --chromatic-150: #E5E5EE;\r\n    --chromatic-200: #CDCDD9;\r\n    --chromatic-300: #8D8D9C;\r\n    --chromatic-400: #34384A;\r\n    --chromatic-500: #191F3D;\r\n\r\n    /* start Loveship colors for controllers */\r\n\r\n    --fire-5: #FEF6F6;\r\n    --fire-10: #FDE1E1;\r\n    --fire-20: #FCC8C8;\r\n    --fire-50: #FA4B4B;\r\n    --fire-60: #CC2929;\r\n    --fire-70: #B32424;\r\n\r\n    --white: #FFFFFF;\r\n\r\n    --night50: #FAFAFC;\r\n    --night100: #F5F6FA;\r\n    --night200: #EBEDF5;\r\n    --night300: #E1E3EB;\r\n    --night400: #CED0DB;\r\n    --night500: #ACAFBF;\r\n    --night600: #6C6F80;\r\n    --night700: #474A59;\r\n    --night800: #303240;\r\n    --night900: #1D1E26;\r\n\r\n    /* end Loveship colors for controllers */\r\n\r\n    /* core variables start */\r\n\r\n    --uui-accent-5: var(--grass-50);\r\n    --uui-accent-10: var(--grass-100);\r\n    --uui-accent-20: var(--grass-200);\r\n    --uui-accent-50: var(--grass-300);\r\n    --uui-accent-60: var(--grass-400);\r\n    --uui-accent-70: var(--grass-500);\r\n    --uui-accent-contrast: var(--white);\r\n\r\n    --uui-primary-5: var(--blue-50);\r\n    --uui-primary-10: var(--blue-100);\r\n    --uui-primary-20: var(--blue-200);\r\n    --uui-primary-50: var(--blue-300);\r\n    --uui-primary-60: var(--blue-400);\r\n    --uui-primary-70: var(--blue-500);\r\n    --uui-primary-contrast: var(--white);\r\n\r\n    --uui-secondary-5: var(--night100);\r\n    --uui-secondary-10: var(--night200);\r\n    --uui-secondary-20: var(--night300);\r\n    --uui-secondary-50: var(--night500);\r\n    --uui-secondary-60: var(--night600);\r\n    --uui-secondary-70: var(--night700);\r\n    --uui-secondary-contrast: var(--white);\r\n\r\n    --uui-critical-5: var(--fire-5);\r\n    --uui-critical-10: var(--fire-10);\r\n    --uui-critical-20: var(--fire-20);\r\n    --uui-critical-50: var(--fire-50);\r\n    --uui-critical-60: var(--fire-60);\r\n    --uui-critical-70: var(--fire-70);\r\n    --uui-critical-contrast: var(--white);\r\n\r\n\r\n    --uui-info-5: var(--blue-0);\r\n    --uui-info-10: var(--blue-0);\r\n    --uui-info-20: var(--blue-100);\r\n    --uui-info-50: var(--blue-300);\r\n    --uui-info-60: var(--blue-400);\r\n    --uui-info-70: var(--blue-500);\r\n    --uui-info-contrast: var(--white);\r\n\r\n    --uui-success-5: var(--grass-25);\r\n    --uui-success-10: var(--grass-100);\r\n    --uui-success-20: var(--grass-200);\r\n    --uui-success-50: var(--grass-300);\r\n    --uui-success-60: var(--grass-400);\r\n    --uui-success-70: var(--grass-500);\r\n    --uui-success-contrast: var(--white);\r\n\r\n    --uui-warning-5: var(--sun-50);\r\n    --uui-warning-10: var(--sun-50);\r\n    --uui-warning-20: var(--sun-100);\r\n    --uui-warning-50: var(--sun-200);\r\n    --uui-warning-60: var(--sun-250);\r\n    --uui-warning-70: var(--sun-300);\r\n    --uui-warning-contrast: var(--white);\r\n\r\n    --uui-error-5: var(--fire-5);\r\n    --uui-error-10: var(--fire-10);\r\n    --uui-error-20: var(--fire-20);\r\n    --uui-error-50: var(--fire-50);\r\n    --uui-error-60: var(--fire-60);\r\n    --uui-error-70: var(--fire-70);\r\n    --uui-error-contrast: var(--white);\r\n\r\n    --uui-neutral-0: #FFFFFF;\r\n    --uui-neutral-5: var(--night50);\r\n    --uui-neutral-10: var(--night100);\r\n    --uui-neutral-20: var(--night200);\r\n    --uui-neutral-30: var(--night300);\r\n    --uui-neutral-40: var(--night400);\r\n    --uui-neutral-50: var(--night500);\r\n    --uui-neutral-60: var(--night600);\r\n    --uui-neutral-70: var(--night700);\r\n    --uui-neutral-80: var(--night800);\r\n    --uui-neutral-90: var(--night900);\r\n    --uui-neutral-100: #000000;\r\n\r\n    /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\r\n\r\n    --uui-app-bg: var(--chromatic-100);\r\n    --uui-overlay: rgba(29, 30, 38, 0.8);\r\n\r\n    --uui-surface-sunken: var(--night50);\r\n    --uui-surface-main: var(--chromatic-0);\r\n    --uui-surface-higher: var(--night100);\r\n    --uui-surface-highest: var(--night200);\r\n\r\n    --uui-divider: var(--chromatic-200);\r\n    --uui-divider-light: var(--chromatic-150);\r\n\r\n    --uui-text-primary: var(--chromatic-500);\r\n    --uui-text-secondary: var(--chromatic-300);\r\n    --uui-text-tertiary: var(--chromatic-300);\r\n    --uui-text-disabled: var(--chromatic-200);\r\n\r\n    --uui-text-info: var(--uui-info-50);\r\n    --uui-text-warning: var(--uui-warning-50);\r\n    --uui-text-critical: var(--uui-critical-50);\r\n    --uui-text-success: var(--uui-success-50);\r\n    --uui-text-bg-highlight: var(--uui-warning-10);\r\n\r\n    /* not accepted part */\r\n\r\n    /* control specific */\r\n\r\n    --uui-link: var(--blue-300);\r\n    --uui-link-hover: var(--blue-400);\r\n    --uui-link-visited: #8018A0;\r\n    --uui-link-visited-hover: #601278;\r\n    --uui-link-disabled: var(--chromatic-200);\r\n\r\n    --uui-icon: var(--chromatic-300);\r\n    --uui-icon-hover: var(--chromatic-400);\r\n    --uui-icon-active: var(--chromatic-500);\r\n    --uui-icon-disabled: var(--chromatic-200);\r\n\r\n    --uui-control-bg: var(--chromatic-0);\r\n    --uui-control-bg-hover: var(--chromatic-300);\r\n    --uui-control-bg-disabled: var(--chromatic-100);\r\n\r\n    --uui-control-border: var(--chromatic-200);\r\n    --uui-control-border-hover: var(--chromatic-300);\r\n    --uui-control-border-focus: var(--uui-primary-50);\r\n    --uui-control-border-disabled: var(--chromatic-150);\r\n\r\n    --uui-control-placeholder: var(--night600);\r\n    --uui-control-placeholder-disabled: var(--night600);\r\n\r\n    --uui-control-text: var(--chromatic-500);\r\n    --uui-control-text-disabled: var(--chromatic-300);\r\n\r\n    --uui-control-icon: var(--chromatic-200);\r\n    --uui-control-icon-disabled: var(--chromatic-200);\r\n\r\n    --uui-outline-focus: #008ACE80;\r\n\r\n    --uui-skeleton: var(--chromatic-200);\r\n\r\n    --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\r\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%);\r\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%);\r\n\r\n    --uui-border-radius: 3px;\r\n\r\n    /* core variables end */\r\n\r\n    /* size theme start */\r\n\r\n    @include uui-6px-grid();\r\n\r\n    /* size theme end */\r\n\r\n    /* begin color classes */\r\n\r\n    .uui-color-accent,\r\n    .uui-color-grass,\r\n    .uui-color-success {\r\n        --uui-color-5: var(--uui-accent-5);\r\n        --uui-color-10: var(--uui-accent-10);\r\n        --uui-color-20: var(--uui-accent-20);\r\n        --uui-color-50: var(--uui-accent-50);\r\n        --uui-color-60: var(--uui-accent-60);\r\n        --uui-color-70: var(--uui-accent-70);\r\n        --uui-color-contrast: var(--uui-accent-contrast);\r\n    }\r\n\r\n    .uui-color-primary,\r\n    .uui-color-blue,\r\n    .uui-color-info {\r\n        --uui-color-5: var(--uui-primary-5);\r\n        --uui-color-10: var(--uui-primary-10);\r\n        --uui-color-20: var(--uui-primary-20);\r\n        --uui-color-50: var(--uui-primary-50);\r\n        --uui-color-60: var(--uui-primary-60);\r\n        --uui-color-70: var(--uui-primary-70);\r\n        --uui-color-contrast: var(--uui-primary-contrast);\r\n    }\r\n\r\n    .uui-color-fire,\r\n    .uui-color-critical {\r\n        --uui-color-5: var(--uui-critical-5);\r\n        --uui-color-10: var(--uui-critical-10);\r\n        --uui-color-20: var(--uui-critical-20);\r\n        --uui-color-50: var(--uui-critical-50);\r\n        --uui-color-60: var(--uui-critical-60);\r\n        --uui-color-70: var(--uui-critical-70);\r\n        --uui-color-contrast: var(--uui-critical-contrast);\r\n    }\r\n\r\n    .uui-color-error {\r\n        --uui-color-5: var(--uui-error-5);\r\n        --uui-color-10: var(--uui-error-10);\r\n        --uui-color-20: var(--uui-error-20);\r\n        --uui-color-50: var(--uui-error-50);\r\n        --uui-color-60: var(--uui-error-60);\r\n        --uui-color-70: var(--uui-error-70);\r\n        --uui-color-contrast: var(--uui-error-contrast);\r\n    }\r\n\r\n    .uui-color-warning,\r\n    .uui-color-sun {\r\n        --uui-color-5: var(--uui-warning-5);\r\n        --uui-color-10: var(--uui-warning-10);\r\n        --uui-color-20: var(--uui-warning-20);\r\n        --uui-color-50: var(--uui-warning-50);\r\n        --uui-color-60: var(--uui-warning-60);\r\n        --uui-color-70: var(--uui-warning-70);\r\n        --uui-color-contrast: var(--uui-warning-contrast);\r\n    }\r\n\r\n    .uui-color-neutral,\r\n    .uui-color-secondary {\r\n        --uui-color-5: var(--uui-secondary-5);\r\n        --uui-color-10: var(--uui-secondary-10);\r\n        --uui-color-20: var(--uui-secondary-20);\r\n        --uui-color-50: var(--uui-secondary-50);\r\n        --uui-color-60: var(--uui-secondary-60);\r\n        --uui-color-70: var(--uui-secondary-70);\r\n        --uui-color-contrast: var(--uui-secondary-contrast);\r\n    }\r\n\r\n    .uui-button {\r\n        --uui-border-radius: 8px;\r\n        --uui-btn-font: var(--font-museo-sans);\r\n        --uui-btn-font-weight: 700;\r\n\r\n        &.uui-color-gray {\r\n            --uui-color-5: var(--white);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-5);\r\n            --uui-color-50: var(--chromatic-100);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n            --uui-color-contrast: var(--uui-text-primary);\r\n        }\r\n\r\n        &.uui-color-white {\r\n            --uui-color-5: var(--chromatic-0);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-10);\r\n            --uui-color-50: var(--white);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n            --uui-color-contrast: var(--uui-text-primary);\r\n        }\r\n    }\r\n\r\n    .uui-filters-panel-item-toggler.uui-input-box {\r\n        --uui-filters_toggler-border: var(--uui-surface-main);\r\n        --uui-filters_toggler-border-hover: var(--blue-0);\r\n        --uui-filters_toggler-border-radius: 8px;\r\n        --uui-filters_toggler-bg: var(--uui-surface-main);\r\n        --uui-filters_toggler-bg-hover: var(--blue-0);\r\n        --uui-filters_toggler-text: var(--uui-text-secondary);\r\n        --uui-filters_toggler-label: var(--chromatic-500);\r\n        --uui-filters_toggler-icon: var(--uui-icon);\r\n        --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\r\n\r\n        --uui-filters_toggler-font: var(--uui-font);\r\n        --uui-filters_toggler-font-weight: 400;\r\n    }\r\n\r\n    /* MainMenu */\r\n\r\n    .uui-main_menu {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-hover: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--uui-info-50);\r\n        --uui-main_menu-bg: var(--uui-info-5);\r\n        --uui-main_menu-hover: var(--uui-neutral-0);\r\n        --uui-main_menu-active: var(--uui-neutral-0);\r\n        --uui-main_menu-border-active: var(--uui-neutral-0);\r\n\r\n        --uui-main_menu-search-bg: var(--uui-neutral-5);\r\n        --uui-main_menu-search-border: var(--uui-neutral-40);\r\n        --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\r\n        --uui-main_menu-search-text: var(--uui-text-primary);\r\n        --uui-main_menu-search-icon: var(--uui-neutral-70);\r\n\r\n        --uui-main_menu-icon: var(--chromatic-500);\r\n        --uui-main_menu-icon-hover: var(--chromatic-500);\r\n        --uui-main_menu-icon-active: var(--chromatic-500);\r\n    }\r\n\r\n    .uui-main_menu-dropdown {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--chromatic-500);\r\n        --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\r\n    }\r\n\r\n    /* BurgerMenu */\r\n\r\n    .uui-burger {\r\n        --uui-burger_menu-bg: var(--uui-info-5);\r\n        --uui-burger_menu-bg-hover: var(--uui-neutral-0);\r\n        --uui-burger_menu-caption: var(--chromatic-500);\r\n        --uui-burger_menu-icon: var(--chromatic-500);\r\n        --uui-burger_menu-item: var(--uui-info-5);\r\n    }\r\n\r\n    /* BurgerButton */\r\n    .uui-main_menu-burger-button {\r\n        --uui-burger_btn_caption: var(--chromatic-500);\r\n        --uui-burger_btn_caption-hover: var(--uui-primary-50);\r\n        --uui-burger_btn_caption-active: var(--uui-primary-50);\r\n        --uui-burger_btn-border: var(--uui-neutral-40);\r\n    }\r\n\r\n    /* BurgerSearch */\r\n\r\n    .uui-main_menu-burger-search {\r\n        --uui-burger_search: var(--chromatic-500);\r\n        --uui-burger_search-fill: var(--uui-neutral-70);\r\n        --uui-burger_search-bg: var(--uui-neutral-40);\r\n        --uui-burger_search-placeholder: var(--uui-text-tertiary);\r\n    }\r\n\r\n    .uui-main_menu-dropdown {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--chromatic-500);\r\n\r\n        --uui-main_menu-dropdown-bg: var(--chromatic-0);\r\n        --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\r\n        --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\r\n        --uui-main_menu-dropdown-border-radius: 8px;\r\n    }\r\n\r\n    .uui-scroll-bars {\r\n        --uui-scroll_bars-bg: var(--chromatic-200);\r\n        --uui-scroll_bars-bg-active: var(--chromatic-300);\r\n    }\r\n\r\n    .uui-text-placeholder {\r\n        --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\r\n    }\r\n\r\n    /* Tooltip */\r\n\r\n    .uui-tooltip-container.uui-color-neutral {\r\n        --uui-tooltip-bg: var(--uui-neutral-0);\r\n        --uui-tooltip-text: var(--uui-text-primary);\r\n    }\r\n\r\n    .uui-tooltip-container.uui-color-critical {\r\n        --uui-tooltip-bg: var(--uui-critical-60);\r\n    }\r\n\r\n    .uui-tooltip-container.uui-color-inverted {\r\n        --uui-tooltip-bg: var(--uui-neutral-80);\r\n        --uui-tooltip-text: var(--uui-neutral-5);\r\n    }\r\n\r\n    /* Tag */\r\n\r\n    .uui-tag {\r\n        &.uui-color-warning, &.uui-color-sun {\r\n            --uui-tag-caption: var(--uui-text-primary);\r\n            --uui-tag-fill: var(--uui-neutral-90);\r\n\r\n            .uui-count_indicator {\r\n                --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\r\n                --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\r\n            }\r\n\r\n            &.uui-fill-outline .uui-count_indicator {\r\n                --uui-count_indicator-bg: var(--uui-neutral-0);\r\n                --uui-count_indicator-border: var(--uui-neutral-40);\r\n            }\r\n\r\n        }\r\n\r\n        &.uui-color-neutral, &.uui-color-night300 {\r\n            --uui-tag-bg: var(--uui-neutral-30);\r\n            --uui-tag-bg-hover: var(--uui-neutral-40);\r\n            --uui-tag-border: var(--uui-neutral-30);\r\n            --uui-tag-border-hover: var(--uui-neutral-40);\r\n            --uui-tag-caption: var(--uui-text-primary);\r\n            --uui-tag-fill: var(--uui-neutral-60);\r\n\r\n            .uui-count_indicator {\r\n                --uui-count_indicator-bg: var(--uui-neutral-0);\r\n                --uui-count_indicator-border: var(--uui-neutral-0);\r\n            }\r\n\r\n            &.uui-fill-outline {\r\n                --uui-tag-bg: var(--uui-neutral-20);\r\n                --uui-tag-bg-hover: var(--uui-neutral-30);\r\n                --uui-tag-border: var(--uui-neutral-40);\r\n                --uui-tag-border-hover: var(--uui-neutral-40);\r\n\r\n                .uui-count_indicator {\r\n                    --uui-count_indicator-bg: var(--uui-neutral-30);\r\n                    --uui-count_indicator-border: var(--uui-neutral-30);\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    /* CountIndicator */\r\n\r\n    .uui-count_indicator {\r\n        &.uui-color-white {\r\n            --uui-color-5: var(--chromatic-0);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-10);\r\n            --uui-color-50: var(--white);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n        }\r\n\r\n        &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\r\n            --uui-count_indicator-caption: var(--uui-neutral-70);\r\n        }\r\n    }\r\n\r\n    .uui-button {\r\n        &.uui-size-42, &.uui-size-48 {\r\n            :global(.uui-caption) {\r\n                font-family: var(--font-museo-sans);\r\n            }\r\n        }\r\n    }\r\n}\r\n","@use './variables/6px_grid' as *;\r\n\r\n/*  Name convention  */\r\n/* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */\r\n.uui-theme-vanilla_thunder {\r\n    --uui-font: var(--font-inter);\r\n    --uui-font-mono: 'Roboto Mono', monospace;\r\n\r\n    --blue-0: #F0F7FC;\r\n    --blue-50: #E1F4FA;\r\n    --blue-100: #D4F0FE;\r\n    --blue-200: #76CDD8;\r\n    --blue-300: #2BC1F0;\r\n    --blue-400: #1CA5D3;\r\n    --blue-500: #008ACE;\r\n\r\n    --grass-25: #EBFCC7;\r\n    --grass-50: #E4ED94;\r\n    --grass-100: #CEDB56;\r\n    --grass-200: #91C229;\r\n    --grass-300: #4FA762;\r\n    --grass-400: #329247;\r\n    --grass-500: #157D2C;\r\n\r\n    --sun-50: #FFF1A7;\r\n    --sun-100: #FFD602;\r\n    --sun-200: #F7A02C;\r\n    --sun-250: #F67E00;\r\n    --sun-300: #F2682A;\r\n\r\n    --chromatic-0: #FFFFFF;\r\n    --chromatic-100: #F7F7FD;\r\n    --chromatic-150: #E5E5EE;\r\n    --chromatic-200: #CDCDD9;\r\n    --chromatic-300: #8D8D9C;\r\n    --chromatic-400: #34384A;\r\n    --chromatic-500: #191F3D;\r\n\r\n    /* start Loveship colors for controllers */\r\n\r\n    --fire-5: #FEF6F6;\r\n    --fire-10: #FDE1E1;\r\n    --fire-20: #FCC8C8;\r\n    --fire-50: #FA4B4B;\r\n    --fire-60: #CC2929;\r\n    --fire-70: #B32424;\r\n\r\n    --white: #FFFFFF;\r\n\r\n    --night50: #FAFAFC;\r\n    --night100: #F5F6FA;\r\n    --night200: #EBEDF5;\r\n    --night300: #E1E3EB;\r\n    --night400: #CED0DB;\r\n    --night500: #ACAFBF;\r\n    --night600: #6C6F80;\r\n    --night700: #474A59;\r\n    --night800: #303240;\r\n    --night900: #1D1E26;\r\n\r\n    /* end Loveship colors for controllers */\r\n\r\n    /* core variables start */\r\n\r\n    --uui-accent-5: var(--grass-50);\r\n    --uui-accent-10: var(--grass-100);\r\n    --uui-accent-20: var(--grass-200);\r\n    --uui-accent-50: var(--grass-300);\r\n    --uui-accent-60: var(--grass-400);\r\n    --uui-accent-70: var(--grass-500);\r\n    --uui-accent-contrast: var(--white);\r\n\r\n    --uui-primary-5: var(--blue-50);\r\n    --uui-primary-10: var(--blue-100);\r\n    --uui-primary-20: var(--blue-200);\r\n    --uui-primary-50: var(--blue-300);\r\n    --uui-primary-60: var(--blue-400);\r\n    --uui-primary-70: var(--blue-500);\r\n    --uui-primary-contrast: var(--white);\r\n\r\n    --uui-secondary-5: var(--night100);\r\n    --uui-secondary-10: var(--night200);\r\n    --uui-secondary-20: var(--night300);\r\n    --uui-secondary-50: var(--night500);\r\n    --uui-secondary-60: var(--night600);\r\n    --uui-secondary-70: var(--night700);\r\n    --uui-secondary-contrast: var(--white);\r\n\r\n    --uui-critical-5: var(--fire-5);\r\n    --uui-critical-10: var(--fire-10);\r\n    --uui-critical-20: var(--fire-20);\r\n    --uui-critical-50: var(--fire-50);\r\n    --uui-critical-60: var(--fire-60);\r\n    --uui-critical-70: var(--fire-70);\r\n    --uui-critical-contrast: var(--white);\r\n\r\n\r\n    --uui-info-5: var(--blue-0);\r\n    --uui-info-10: var(--blue-0);\r\n    --uui-info-20: var(--blue-100);\r\n    --uui-info-50: var(--blue-300);\r\n    --uui-info-60: var(--blue-400);\r\n    --uui-info-70: var(--blue-500);\r\n    --uui-info-contrast: var(--white);\r\n\r\n    --uui-success-5: var(--grass-25);\r\n    --uui-success-10: var(--grass-100);\r\n    --uui-success-20: var(--grass-200);\r\n    --uui-success-50: var(--grass-300);\r\n    --uui-success-60: var(--grass-400);\r\n    --uui-success-70: var(--grass-500);\r\n    --uui-success-contrast: var(--white);\r\n\r\n    --uui-warning-5: var(--sun-50);\r\n    --uui-warning-10: var(--sun-50);\r\n    --uui-warning-20: var(--sun-100);\r\n    --uui-warning-50: var(--sun-200);\r\n    --uui-warning-60: var(--sun-250);\r\n    --uui-warning-70: var(--sun-300);\r\n    --uui-warning-contrast: var(--white);\r\n\r\n    --uui-error-5: var(--fire-5);\r\n    --uui-error-10: var(--fire-10);\r\n    --uui-error-20: var(--fire-20);\r\n    --uui-error-50: var(--fire-50);\r\n    --uui-error-60: var(--fire-60);\r\n    --uui-error-70: var(--fire-70);\r\n    --uui-error-contrast: var(--white);\r\n\r\n    --uui-neutral-0: #FFFFFF;\r\n    --uui-neutral-5: var(--night50);\r\n    --uui-neutral-10: var(--night100);\r\n    --uui-neutral-20: var(--night200);\r\n    --uui-neutral-30: var(--night300);\r\n    --uui-neutral-40: var(--night400);\r\n    --uui-neutral-50: var(--night500);\r\n    --uui-neutral-60: var(--night600);\r\n    --uui-neutral-70: var(--night700);\r\n    --uui-neutral-80: var(--night800);\r\n    --uui-neutral-90: var(--night900);\r\n    --uui-neutral-100: #000000;\r\n\r\n    /* Surfaces Figma - https://www.figma.com/file/M5Njgc6SQJ3TPUccp5XHQx/Loveship-aka-UUI3-(Components)?type=design&node-id=20044%3A300925&mode=design&t=R433dqGrpXDGoFli-1 */\r\n\r\n    --uui-app-bg: var(--chromatic-100);\r\n    --uui-overlay: rgba(29, 30, 38, 0.8);\r\n\r\n    --uui-surface-sunken: var(--night50);\r\n    --uui-surface-main: var(--chromatic-0);\r\n    --uui-surface-higher: var(--night100);\r\n    --uui-surface-highest: var(--night200);\r\n\r\n    --uui-divider: var(--chromatic-200);\r\n    --uui-divider-light: var(--chromatic-150);\r\n\r\n    --uui-text-primary: var(--chromatic-500);\r\n    --uui-text-secondary: var(--chromatic-300);\r\n    --uui-text-tertiary: var(--chromatic-300);\r\n    --uui-text-disabled: var(--chromatic-200);\r\n\r\n    --uui-text-info: var(--uui-info-50);\r\n    --uui-text-warning: var(--uui-warning-50);\r\n    --uui-text-critical: var(--uui-critical-50);\r\n    --uui-text-success: var(--uui-success-50);\r\n    --uui-text-bg-highlight: var(--uui-warning-10);\r\n\r\n    /* not accepted part */\r\n\r\n    /* control specific */\r\n\r\n    --uui-link: var(--blue-300);\r\n    --uui-link-hover: var(--blue-400);\r\n    --uui-link-visited: #8018A0;\r\n    --uui-link-visited-hover: #601278;\r\n    --uui-link-disabled: var(--chromatic-200);\r\n\r\n    --uui-icon: var(--chromatic-300);\r\n    --uui-icon-hover: var(--chromatic-400);\r\n    --uui-icon-active: var(--chromatic-500);\r\n    --uui-icon-disabled: var(--chromatic-200);\r\n\r\n    --uui-control-bg: var(--chromatic-0);\r\n    --uui-control-bg-hover: var(--chromatic-300);\r\n    --uui-control-bg-disabled: var(--chromatic-100);\r\n\r\n    --uui-control-border: var(--chromatic-200);\r\n    --uui-control-border-hover: var(--chromatic-300);\r\n    --uui-control-border-focus: var(--uui-primary-50);\r\n    --uui-control-border-disabled: var(--chromatic-150);\r\n\r\n    --uui-control-placeholder: var(--night600);\r\n    --uui-control-placeholder-disabled: var(--night600);\r\n\r\n    --uui-control-text: var(--chromatic-500);\r\n    --uui-control-text-disabled: var(--chromatic-300);\r\n\r\n    --uui-control-icon: var(--chromatic-200);\r\n    --uui-control-icon-disabled: var(--chromatic-200);\r\n\r\n    --uui-outline-focus: #008ACE80;\r\n\r\n    --uui-skeleton: var(--chromatic-200);\r\n\r\n    --uui-shadow-level-1: 0 0 3px rgb(29 30 38 / 15%), 0 3px 6px rgb(29 30 38 / 10%);\r\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%);\r\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%);\r\n\r\n    --uui-border-radius: 3px;\r\n\r\n    /* core variables end */\r\n\r\n    /* size theme start */\r\n\r\n    @include uui-6px-grid();\r\n\r\n    /* size theme end */\r\n\r\n    /* begin color classes */\r\n\r\n    .uui-color-accent,\r\n    .uui-color-grass,\r\n    .uui-color-success {\r\n        --uui-color-5: var(--uui-accent-5);\r\n        --uui-color-10: var(--uui-accent-10);\r\n        --uui-color-20: var(--uui-accent-20);\r\n        --uui-color-50: var(--uui-accent-50);\r\n        --uui-color-60: var(--uui-accent-60);\r\n        --uui-color-70: var(--uui-accent-70);\r\n        --uui-color-contrast: var(--uui-accent-contrast);\r\n    }\r\n\r\n    .uui-color-primary,\r\n    .uui-color-blue,\r\n    .uui-color-info {\r\n        --uui-color-5: var(--uui-primary-5);\r\n        --uui-color-10: var(--uui-primary-10);\r\n        --uui-color-20: var(--uui-primary-20);\r\n        --uui-color-50: var(--uui-primary-50);\r\n        --uui-color-60: var(--uui-primary-60);\r\n        --uui-color-70: var(--uui-primary-70);\r\n        --uui-color-contrast: var(--uui-primary-contrast);\r\n    }\r\n\r\n    .uui-color-fire,\r\n    .uui-color-critical {\r\n        --uui-color-5: var(--uui-critical-5);\r\n        --uui-color-10: var(--uui-critical-10);\r\n        --uui-color-20: var(--uui-critical-20);\r\n        --uui-color-50: var(--uui-critical-50);\r\n        --uui-color-60: var(--uui-critical-60);\r\n        --uui-color-70: var(--uui-critical-70);\r\n        --uui-color-contrast: var(--uui-critical-contrast);\r\n    }\r\n\r\n    .uui-color-error {\r\n        --uui-color-5: var(--uui-error-5);\r\n        --uui-color-10: var(--uui-error-10);\r\n        --uui-color-20: var(--uui-error-20);\r\n        --uui-color-50: var(--uui-error-50);\r\n        --uui-color-60: var(--uui-error-60);\r\n        --uui-color-70: var(--uui-error-70);\r\n        --uui-color-contrast: var(--uui-error-contrast);\r\n    }\r\n\r\n    .uui-color-warning,\r\n    .uui-color-sun {\r\n        --uui-color-5: var(--uui-warning-5);\r\n        --uui-color-10: var(--uui-warning-10);\r\n        --uui-color-20: var(--uui-warning-20);\r\n        --uui-color-50: var(--uui-warning-50);\r\n        --uui-color-60: var(--uui-warning-60);\r\n        --uui-color-70: var(--uui-warning-70);\r\n        --uui-color-contrast: var(--uui-warning-contrast);\r\n    }\r\n\r\n    .uui-color-neutral,\r\n    .uui-color-secondary {\r\n        --uui-color-5: var(--uui-secondary-5);\r\n        --uui-color-10: var(--uui-secondary-10);\r\n        --uui-color-20: var(--uui-secondary-20);\r\n        --uui-color-50: var(--uui-secondary-50);\r\n        --uui-color-60: var(--uui-secondary-60);\r\n        --uui-color-70: var(--uui-secondary-70);\r\n        --uui-color-contrast: var(--uui-secondary-contrast);\r\n    }\r\n\r\n    .uui-button {\r\n        --uui-border-radius: 8px;\r\n        --uui-btn-font: var(--font-museo-sans);\r\n        --uui-btn-font-weight: 700;\r\n\r\n        &.uui-color-gray {\r\n            --uui-color-5: var(--white);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-5);\r\n            --uui-color-50: var(--chromatic-100);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n            --uui-color-contrast: var(--uui-text-primary);\r\n        }\r\n\r\n        &.uui-color-white {\r\n            --uui-color-5: var(--chromatic-0);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-10);\r\n            --uui-color-50: var(--white);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n            --uui-color-contrast: var(--uui-text-primary);\r\n        }\r\n    }\r\n\r\n    .uui-filters-panel-item-toggler.uui-input-box {\r\n        --uui-filters_toggler-border: var(--uui-surface-main);\r\n        --uui-filters_toggler-border-hover: var(--blue-0);\r\n        --uui-filters_toggler-border-radius: 8px;\r\n        --uui-filters_toggler-bg: var(--uui-surface-main);\r\n        --uui-filters_toggler-bg-hover: var(--blue-0);\r\n        --uui-filters_toggler-text: var(--uui-text-secondary);\r\n        --uui-filters_toggler-label: var(--chromatic-500);\r\n        --uui-filters_toggler-icon: var(--uui-icon);\r\n        --uui-filters_toggler-shadow: var(--uui-shadow-level-1);\r\n\r\n        --uui-filters_toggler-font: var(--uui-font);\r\n        --uui-filters_toggler-font-weight: 400;\r\n    }\r\n\r\n    /* MainMenu */\r\n\r\n    .uui-main_menu {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-hover: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--uui-info-50);\r\n        --uui-main_menu-bg: var(--uui-info-5);\r\n        --uui-main_menu-hover: var(--uui-neutral-0);\r\n        --uui-main_menu-active: var(--uui-neutral-0);\r\n        --uui-main_menu-border-active: var(--uui-neutral-0);\r\n\r\n        --uui-main_menu-search-bg: var(--uui-neutral-5);\r\n        --uui-main_menu-search-border: var(--uui-neutral-40);\r\n        --uui-main_menu-search-placeholder: var(--uui-text-tertiary);\r\n        --uui-main_menu-search-text: var(--uui-text-primary);\r\n        --uui-main_menu-search-icon: var(--uui-neutral-70);\r\n\r\n        --uui-main_menu-icon: var(--chromatic-500);\r\n        --uui-main_menu-icon-hover: var(--chromatic-500);\r\n        --uui-main_menu-icon-active: var(--chromatic-500);\r\n    }\r\n\r\n    .uui-main_menu-dropdown {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--chromatic-500);\r\n        --uui-main_menu-dropdown-bg-hover: var(--uui-neutral-70);\r\n    }\r\n\r\n    /* BurgerMenu */\r\n\r\n    .uui-burger {\r\n        --uui-burger_menu-bg: var(--uui-info-5);\r\n        --uui-burger_menu-bg-hover: var(--uui-neutral-0);\r\n        --uui-burger_menu-caption: var(--chromatic-500);\r\n        --uui-burger_menu-icon: var(--chromatic-500);\r\n        --uui-burger_menu-item: var(--uui-info-5);\r\n    }\r\n\r\n    /* BurgerButton */\r\n    .uui-main_menu-burger-button {\r\n        --uui-burger_btn_caption: var(--chromatic-500);\r\n        --uui-burger_btn_caption-hover: var(--uui-primary-50);\r\n        --uui-burger_btn_caption-active: var(--uui-primary-50);\r\n        --uui-burger_btn-border: var(--uui-neutral-40);\r\n    }\r\n\r\n    /* BurgerSearch */\r\n\r\n    .uui-main_menu-burger-search {\r\n        --uui-burger_search: var(--chromatic-500);\r\n        --uui-burger_search-fill: var(--uui-neutral-70);\r\n        --uui-burger_search-bg: var(--uui-neutral-40);\r\n        --uui-burger_search-placeholder: var(--uui-text-tertiary);\r\n    }\r\n\r\n    .uui-main_menu-dropdown {\r\n        --uui-main_menu-text: var(--chromatic-500);\r\n        --uui-main_menu-text-active: var(--chromatic-500);\r\n\r\n        --uui-main_menu-dropdown-bg: var(--chromatic-0);\r\n        --uui-main_menu-dropdown-bg-hover: var(--chromatic-150);\r\n        --uui-main_menu-dropdown-shadow: var(--uui-shadow-level-2);\r\n        --uui-main_menu-dropdown-border-radius: 8px;\r\n    }\r\n\r\n    .uui-scroll-bars {\r\n        --uui-scroll_bars-bg: var(--chromatic-200);\r\n        --uui-scroll_bars-bg-active: var(--chromatic-300);\r\n    }\r\n\r\n    .uui-text-placeholder {\r\n        --uui-text_placeholder-gradient: repeating-linear-gradient(90deg, var(--chromatic-200) 0, var(--chromatic-100) 150px, var(--chromatic-200) 300px);\r\n    }\r\n\r\n    /* Tooltip */\r\n\r\n    .uui-tooltip-container.uui-color-neutral {\r\n        --uui-tooltip-bg: var(--uui-neutral-0);\r\n        --uui-tooltip-text: var(--uui-text-primary);\r\n    }\r\n\r\n    .uui-tooltip-container.uui-color-critical {\r\n        --uui-tooltip-bg: var(--uui-critical-60);\r\n    }\r\n\r\n    .uui-tooltip-container.uui-color-inverted {\r\n        --uui-tooltip-bg: var(--uui-neutral-80);\r\n        --uui-tooltip-text: var(--uui-neutral-5);\r\n    }\r\n\r\n    /* Tag */\r\n\r\n    .uui-tag {\r\n        &.uui-color-warning, &.uui-color-sun {\r\n            --uui-tag-caption: var(--uui-text-primary);\r\n            --uui-tag-fill: var(--uui-neutral-90);\r\n\r\n            .uui-count_indicator {\r\n                --uui-count_indicator-bg: color-mix(in srgb, var(--uui-neutral-90) 5%, transparent);\r\n                --uui-count_indicator-border: color-mix(in srgb, var(--uui-neutral-90) 30%, transparent);\r\n            }\r\n\r\n            &.uui-fill-outline .uui-count_indicator {\r\n                --uui-count_indicator-bg: var(--uui-neutral-0);\r\n                --uui-count_indicator-border: var(--uui-neutral-40);\r\n            }\r\n\r\n        }\r\n\r\n        &.uui-color-neutral, &.uui-color-night300 {\r\n            --uui-tag-bg: var(--uui-neutral-30);\r\n            --uui-tag-bg-hover: var(--uui-neutral-40);\r\n            --uui-tag-border: var(--uui-neutral-30);\r\n            --uui-tag-border-hover: var(--uui-neutral-40);\r\n            --uui-tag-caption: var(--uui-text-primary);\r\n            --uui-tag-fill: var(--uui-neutral-60);\r\n\r\n            .uui-count_indicator {\r\n                --uui-count_indicator-bg: var(--uui-neutral-0);\r\n                --uui-count_indicator-border: var(--uui-neutral-0);\r\n            }\r\n\r\n            &.uui-fill-outline {\r\n                --uui-tag-bg: var(--uui-neutral-20);\r\n                --uui-tag-bg-hover: var(--uui-neutral-30);\r\n                --uui-tag-border: var(--uui-neutral-40);\r\n                --uui-tag-border-hover: var(--uui-neutral-40);\r\n\r\n                .uui-count_indicator {\r\n                    --uui-count_indicator-bg: var(--uui-neutral-30);\r\n                    --uui-count_indicator-border: var(--uui-neutral-30);\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    /* CountIndicator */\r\n\r\n    .uui-count_indicator {\r\n        &.uui-color-white {\r\n            --uui-color-5: var(--chromatic-0);\r\n            --uui-color-10: var(--blue-50);\r\n            --uui-color-20: var(--uui-primary-10);\r\n            --uui-color-50: var(--white);\r\n            --uui-color-60: var(--blue-50);\r\n            --uui-color-70: var(--blue-100);\r\n        }\r\n\r\n        &:is(.uui-color-gray, .uui-color-neutral, .uui-color-white, .uui-color-amber, .uui-color-warning) {\r\n            --uui-count_indicator-caption: var(--uui-neutral-70);\r\n        }\r\n    }\r\n\r\n    .uui-button {\r\n        &.uui-size-42, &.uui-size-48 {\r\n            :global(.uui-caption) {\r\n                font-family: var(--font-museo-sans);\r\n            }\r\n        }\r\n    }\r\n}\r\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  --uui-resize-marker-width: 12px;\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-vertical-tab-button.uui-size-30 {\n  --uui-horizontal-padding: 12px;\n  --uui-icon-size: 12px;\n}\n.uui-theme-vanilla_thunder .uui-vertical-tab-button.uui-size-36 {\n  --uui-horizontal-padding: 18px;\n}\n.uui-theme-vanilla_thunder .uui-vertical-tab-button.uui-size-48 {\n  --uui-horizontal-padding: 18px;\n  --uui-font-size: 14px;\n  --uui-icon-size: 18px;\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-caption-horizontal-padding: 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: 10px;\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-alert.uui-size-36 {\n  --uui-alert-indicator-border-width: 3px;\n  --uui-alert-gap-h: 12px;\n  --uui-alert-gap-v: 3px;\n  --uui-alert-padding-h: 9px;\n  --uui-alert-padding-v: 3px;\n  --uui-alert-caption-gap-h: 9px;\n}\n.uui-theme-vanilla_thunder .uui-filters-panel-item-toggler.uui-size-24 {\n  --uui-horizontal-padding: 3px;\n  --uui-horizontal-gap: 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        --uui-resize-marker-width: 12px;\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; // remove - discuss\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-vertical-tab-button {\n        &.uui-size-30 {\n            --uui-horizontal-padding: 12px;\n            --uui-icon-size: 12px;\n        }\n\n        &.uui-size-36 {\n            --uui-horizontal-padding: 18px;\n        }\n\n        &.uui-size-48 {\n            --uui-horizontal-padding: 18px;\n            --uui-font-size: 14px;\n            --uui-icon-size: 18px;\n        }\n    }\n\n    .uui-tag {\n        &.uui-size-18 {\n            --uui-font-size: 12px;\n\n            .uui-caption {\n                --uui-tag-caption-horizontal-padding: 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: 10px;\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    .uui-alert {\n        &.uui-size-36 {\n            --uui-alert-indicator-border-width: 3px;\n            --uui-alert-gap-h: 12px;\n            --uui-alert-gap-v: 3px;\n            --uui-alert-padding-h: 9px;\n            --uui-alert-padding-v: 3px;\n            --uui-alert-caption-gap-h: 9px;\n        }\n    }\n\n    .uui-filters-panel-item-toggler {\n        &.uui-size-24 {\n            --uui-horizontal-padding: 3px;\n            --uui-horizontal-gap: 3px;\n        }\n    }\n}\n"]}