From cd932519b342631b389877c6958cc6820e7d3eca Mon Sep 17 00:00:00 2001 From: NFish Date: Wed, 5 Feb 2025 15:49:50 +0800 Subject: [PATCH] fix: add icon to user profile dropdown menu item --- .../header/account-dropdown/compliance.tsx | 94 ++ .../header/account-dropdown/index.tsx | 124 +- .../header/account-dropdown/support.tsx | 94 ++ .../workplace-selector/index.tsx | 21 +- .../components/header/github-star/index.tsx | 47 +- web/app/components/header/index.tsx | 8 +- web/i18n/en-US/common.ts | 5 +- web/i18n/zh-Hans/common.ts | 3 + web/themes/dark.css | 1178 ++++++++-------- web/themes/light.css | 1186 +++++++++-------- web/themes/tailwind-theme-var-define.ts | 3 +- 11 files changed, 1462 insertions(+), 1301 deletions(-) create mode 100644 web/app/components/header/account-dropdown/compliance.tsx create mode 100644 web/app/components/header/account-dropdown/support.tsx diff --git a/web/app/components/header/account-dropdown/compliance.tsx b/web/app/components/header/account-dropdown/compliance.tsx new file mode 100644 index 0000000000..eeae0c7d30 --- /dev/null +++ b/web/app/components/header/account-dropdown/compliance.tsx @@ -0,0 +1,94 @@ +import { Menu, Transition } from '@headlessui/react' +import { RiArrowRightSLine, RiArrowRightUpLine, RiDiscordLine, RiFeedbackLine, RiMailSendLine, RiVerifiedBadgeLine } from '@remixicon/react' +import { Fragment } from 'react' +import Link from 'next/link' +import { useTranslation } from 'react-i18next' +import { mailToSupport } from '../utils/util' +import cn from '@/utils/classnames' +import { useProviderContext } from '@/context/provider-context' +import { Plan } from '@/app/components/billing/type' +import { useAppContext } from '@/context/app-context' + +export default function Compliance() { + const itemClassName = ` + flex items-center w-full h-9 pl-3 pr-2 text-text-secondary system-md-regular + rounded-lg hover:bg-state-base-hover cursor-pointer gap-1 +` + const { t } = useTranslation() + const { plan } = useProviderContext() + const { userProfile, langeniusVersionInfo } = useAppContext() + const canEmailSupport = plan.type === Plan.professional || plan.type === Plan.team || plan.type === Plan.enterprise + + return + { + ({ open }) => ( + <> + + +
{t('common.userProfile.compliance')}
+ +
+ + +
+ {!canEmailSupport && + {({ active }) => + +
{t('common.userProfile.emailSupport')}
+ +
} +
} + + {({ active }) => + +
{t('common.userProfile.communityFeedback')}
+ + } +
+ + {({ active }) => + +
{t('common.userProfile.community')}
+ + } +
+
+
+
+ + ) + } +
+} diff --git a/web/app/components/header/account-dropdown/index.tsx b/web/app/components/header/account-dropdown/index.tsx index d9065f3141..f5998dbd0f 100644 --- a/web/app/components/header/account-dropdown/index.tsx +++ b/web/app/components/header/account-dropdown/index.tsx @@ -2,24 +2,24 @@ import { useTranslation } from 'react-i18next' import { Fragment, useState } from 'react' import { useRouter } from 'next/navigation' -import { useContext } from 'use-context-selector' -import { RiArrowDownSLine, RiLogoutBoxRLine } from '@remixicon/react' +import { useContext, useContextSelector } from 'use-context-selector' +import { RiAccountCircleLine, RiArrowDownSLine, RiArrowRightUpLine, RiBookOpenLine, RiGithubLine, RiInformation2Line, RiLogoutBoxRLine, RiMap2Line, RiSettings3Line, RiStarLine } from '@remixicon/react' import Link from 'next/link' import { Menu, Transition } from '@headlessui/react' import Indicator from '../indicator' import AccountAbout from '../account-about' -import { mailToSupport } from '../utils/util' +import GithubStar from '../github-star' import WorkplaceSelector from './workplace-selector' +import Support from './support' +import Compliance from './compliance' import classNames from '@/utils/classnames' import I18n from '@/context/i18n' import Avatar from '@/app/components/base/avatar' import { logout } from '@/service/common' -import { useAppContext } from '@/context/app-context' -import { ArrowUpRight } from '@/app/components/base/icons/src/vender/line/arrows' +import AppContext, { useAppContext } from '@/context/app-context' import { useModalContext } from '@/context/modal-context' import { LanguagesSupported } from '@/i18n/language' -import { useProviderContext } from '@/context/provider-context' -import { Plan } from '@/app/components/billing/type' +import { LicenseStatus } from '@/types/feature' export type IAppSelector = { isMobile: boolean @@ -27,18 +27,17 @@ export type IAppSelector = { export default function AppSelector({ isMobile }: IAppSelector) { const itemClassName = ` - flex items-center w-full h-9 px-3 text-text-secondary system-md-regular - rounded-lg hover:bg-state-base-hover cursor-pointer + flex items-center w-full h-9 pl-3 pr-2 text-text-secondary system-md-regular + rounded-lg hover:bg-state-base-hover cursor-pointer gap-1 ` const router = useRouter() const [aboutVisible, setAboutVisible] = useState(false) + const systemFeatures = useContextSelector(AppContext, v => v.systemFeatures) const { locale } = useContext(I18n) const { t } = useTranslation() const { userProfile, langeniusVersionInfo } = useAppContext() const { setShowAccountSettingModal } = useModalContext() - const { plan } = useProviderContext() - const canEmailSupport = plan.type === Plan.professional || plan.type === Plan.team || plan.type === Plan.enterprise const handleLogout = async () => { await logout({ @@ -63,15 +62,15 @@ export default function AppSelector({ isMobile }: IAppSelector) { className={` inline-flex items-center rounded-[20px] py-1 pr-2.5 pl-1 text-sm - text-gray-700 hover:bg-gray-200 + text-text-secondary hover:bg-state-base-hover mobile:px-1 - ${open && 'bg-gray-200'} + ${open && 'bg-state-base-hover'} `} > {!isMobile && <> {userProfile.name} - + } -
- +
{userProfile.name}
{userProfile.email}
+
-
+
{t('common.userProfile.workspace')}
-
+
{({ active }) => -
{t('common.account.account')}
- + +
{t('common.account.account')}
+ }
{({ active }) =>
setShowAccountSettingModal({ payload: 'members' })}> -
{t('common.userProfile.settings')}
+ +
{t('common.userProfile.settings')}
}
- {canEmailSupport && - {({ active }) => -
{t('common.userProfile.emailSupport')}
- -
} -
} - - {({ active }) => -
{t('common.userProfile.communityFeedback')}
- - } -
- - {({ active }) => -
{t('common.userProfile.community')}
- - } -
+
+
{({ active }) => -
{t('common.userProfile.helpCenter')}
- + +
{t('common.userProfile.helpCenter')}
+ }
+ + +
+
{({ active }) => -
{t('common.userProfile.roadmap')}
- + +
{t('common.userProfile.roadmap')}
+ }
+ {systemFeatures.license.status !== LicenseStatus.NONE && + {({ active }) => + +
{t('common.userProfile.github')}
+
+ + +
+ } +
} { document?.body?.getAttribute('data-public-site-about') !== 'hide' && ( {({ active }) =>
setAboutVisible(true)}> -
{t('common.userProfile.about')}
-
+ +
{t('common.userProfile.about')}
+
{langeniusVersionInfo.current_version}
@@ -198,12 +190,12 @@ export default function AppSelector({ isMobile }: IAppSelector) { {({ active }) =>
handleLogout()}>
-
{t('common.userProfile.logout')}
- + +
{t('common.userProfile.logout')}
}
diff --git a/web/app/components/header/account-dropdown/support.tsx b/web/app/components/header/account-dropdown/support.tsx new file mode 100644 index 0000000000..ad787f211f --- /dev/null +++ b/web/app/components/header/account-dropdown/support.tsx @@ -0,0 +1,94 @@ +import { Menu, Transition } from '@headlessui/react' +import { RiArrowRightSLine, RiArrowRightUpLine, RiDiscordLine, RiFeedbackLine, RiMailSendLine, RiQuestionLine } from '@remixicon/react' +import { Fragment } from 'react' +import Link from 'next/link' +import { useTranslation } from 'react-i18next' +import { mailToSupport } from '../utils/util' +import cn from '@/utils/classnames' +import { useProviderContext } from '@/context/provider-context' +import { Plan } from '@/app/components/billing/type' +import { useAppContext } from '@/context/app-context' + +export default function Support() { + const itemClassName = ` + flex items-center w-full h-9 pl-3 pr-2 text-text-secondary system-md-regular + rounded-lg hover:bg-state-base-hover cursor-pointer gap-1 +` + const { t } = useTranslation() + const { plan } = useProviderContext() + const { userProfile, langeniusVersionInfo } = useAppContext() + const canEmailSupport = plan.type === Plan.professional || plan.type === Plan.team || plan.type === Plan.enterprise + + return + { + ({ open }) => ( + <> + + +
{t('common.userProfile.support')}
+ +
+ + +
+ {canEmailSupport && + {({ active }) => + +
{t('common.userProfile.emailSupport')}
+ +
} +
} + + {({ active }) => + +
{t('common.userProfile.communityFeedback')}
+ + } +
+ + {({ active }) => + +
{t('common.userProfile.community')}
+ + } +
+
+
+
+ + ) + } +
+} diff --git a/web/app/components/header/account-dropdown/workplace-selector/index.tsx b/web/app/components/header/account-dropdown/workplace-selector/index.tsx index bcc72a7bb3..ab2e6ca346 100644 --- a/web/app/components/header/account-dropdown/workplace-selector/index.tsx +++ b/web/app/components/header/account-dropdown/workplace-selector/index.tsx @@ -9,19 +9,18 @@ import { useWorkspacesContext } from '@/context/workspace-context' import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows' import { Check } from '@/app/components/base/icons/src/vender/line/general' import { ToastContext } from '@/app/components/base/toast' -import classNames from '@/utils/classnames' const itemClassName = ` - flex items-center px-3 py-2 h-10 cursor-pointer + flex items-center px-3 py-2 h-9 cursor-pointer rounded-lg ` const itemIconClassName = ` - shrink-0 mr-2 flex items-center justify-center w-6 h-6 bg-[#EFF4FF] rounded-md text-xs font-medium text-primary-600 + shrink-0 mr-2 flex items-center justify-center w-6 h-6 bg-[#EFF4FF] rounded-md text-xs font-medium text-text-accent ` const itemNameClassName = ` grow mr-2 text-sm text-gray-700 text-left ` const itemCheckClassName = ` - shrink-0 w-4 h-4 text-primary-600 + shrink-0 w-4 h-4 text-text-accent ` const WorkplaceSelector = () => { @@ -48,15 +47,15 @@ const WorkplaceSelector = () => { { ({ open }) => ( <> -
{currentWorkspace?.name[0].toLocaleUpperCase()}
{currentWorkspace?.name}
- +
{ { { workspaces.map(workspace => ( - {({ active }) =>
handleSwitchWorkspace(workspace.id)}>
{workspace.name[0].toLocaleUpperCase()}
diff --git a/web/app/components/header/github-star/index.tsx b/web/app/components/header/github-star/index.tsx index 75af9907d6..328fa8ec7c 100644 --- a/web/app/components/header/github-star/index.tsx +++ b/web/app/components/header/github-star/index.tsx @@ -1,50 +1,27 @@ 'use client' -import React, { useEffect, useState } from 'react' -import { Github } from '@/app/components/base/icons/src/public/common' +import { useQuery } from '@tanstack/react-query' +import type { FC } from 'react' import type { GithubRepo } from '@/models/common' const getStar = async () => { const res = await fetch('https://api.github.com/repos/langgenius/dify') if (!res.ok) - throw new Error('Failed to fetch data') + throw new Error('Failed to fetch github star') return res.json() } -const GithubStar = () => { - const [githubRepo, setGithubRepo] = useState({ stargazers_count: 6000 }) - const [isFetched, setIsFetched] = useState(false) - useEffect(() => { - (async () => { - try { - if (process.env.NODE_ENV === 'development') - return - - await setGithubRepo(await getStar()) - setIsFetched(true) - } - catch (e) { - - } - })() - }, []) - - if (!isFetched) +const GithubStar: FC<{ className: string }> = (props) => { + const { isFetching, data } = useQuery({ + queryKey: ['github-star'], + queryFn: getStar, + enabled: process.env.NODE_ENV !== 'development', + initialData: { stargazers_count: 6000 }, + }) + if (isFetching) return null - - return ( - -
- - Star -
-
{`${githubRepo.stargazers_count}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
-
- ) + return {data.stargazers_count.toLocaleString()} } export default GithubStar diff --git a/web/app/components/header/index.tsx b/web/app/components/header/index.tsx index 9a32bbb37a..2c7c64cf63 100644 --- a/web/app/components/header/index.tsx +++ b/web/app/components/header/index.tsx @@ -4,7 +4,6 @@ import Link from 'next/link' import { useBoolean } from 'ahooks' import { useSelectedLayoutSegment } from 'next/navigation' import { Bars3Icon } from '@heroicons/react/20/solid' -import { useContextSelector } from 'use-context-selector' import HeaderBillingBtn from '../billing/header-billing-btn' import AccountDropdown from './account-dropdown' import AppNav from './app-nav' @@ -12,15 +11,13 @@ import DatasetNav from './dataset-nav' import EnvNav from './env-nav' import ExploreNav from './explore-nav' import ToolsNav from './tools-nav' -import GithubStar from './github-star' import LicenseNav from './license-env' import { WorkspaceProvider } from '@/context/workspace-context' -import AppContext, { useAppContext } from '@/context/app-context' +import { useAppContext } from '@/context/app-context' import LogoSite from '@/app/components/base/logo/logo-site' import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints' import { useProviderContext } from '@/context/provider-context' import { useModalContext } from '@/context/modal-context' -import { LicenseStatus } from '@/types/feature' const navClassName = ` flex items-center relative mr-0 sm:mr-3 px-3 h-8 rounded-xl @@ -30,7 +27,6 @@ const navClassName = ` const Header = () => { const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator } = useAppContext() - const systemFeatures = useContextSelector(AppContext, v => v.systemFeatures) const selectedSegment = useSelectedLayoutSegment() const media = useBreakpoints() const isMobile = media === MediaType.mobile @@ -62,7 +58,6 @@ const Header = () => { - {systemFeatures.license.status === LicenseStatus.NONE && } }
{isMobile && ( @@ -70,7 +65,6 @@ const Header = () => { - {systemFeatures.license.status === LicenseStatus.NONE && }
)} {!isMobile && ( diff --git a/web/i18n/en-US/common.ts b/web/i18n/en-US/common.ts index c116e080b4..4091d07fa9 100644 --- a/web/i18n/en-US/common.ts +++ b/web/i18n/en-US/common.ts @@ -144,9 +144,12 @@ const translation = { emailSupport: 'Email Support', workspace: 'Workspace', createWorkspace: 'Create Workspace', - helpCenter: 'Help', + helpCenter: 'Docs', + support: 'Support', + compliance: 'Compliance', communityFeedback: 'Feedback', roadmap: 'Roadmap', + github: 'GitHub', community: 'Community', about: 'About', logout: 'Log out', diff --git a/web/i18n/zh-Hans/common.ts b/web/i18n/zh-Hans/common.ts index 53c5337cab..29c263066c 100644 --- a/web/i18n/zh-Hans/common.ts +++ b/web/i18n/zh-Hans/common.ts @@ -145,8 +145,11 @@ const translation = { workspace: '工作空间', createWorkspace: '创建工作空间', helpCenter: '帮助文档', + support: '支持', + compliance: '合规报告', communityFeedback: '用户反馈', roadmap: '路线图', + github: 'GitHub', community: '社区', about: '关于', logout: '登出', diff --git a/web/themes/dark.css b/web/themes/dark.css index 892f48fa48..5b191d1a3d 100644 --- a/web/themes/dark.css +++ b/web/themes/dark.css @@ -1,737 +1,739 @@ /* Attention: Generate by code. Don't update by hand!!! */ html[data-theme="dark"] { - --color-components-input-bg-normal: #FFFFFF14; - --color-components-input-text-placeholder: #C8CEDA4D; - --color-components-input-bg-hover: #FFFFFF08; - --color-components-input-bg-active: #FFFFFF0D; + --color-components-input-bg-normal: #ffffff14; + --color-components-input-text-placeholder: #c8ceda4d; + --color-components-input-bg-hover: #ffffff08; + --color-components-input-bg-active: #ffffff0d; --color-components-input-border-active: #747481; - --color-components-input-border-destructive: #F97066; - --color-components-input-text-filled: #F4F4F5; - --color-components-input-bg-destructive: #FFFFFF03; - --color-components-input-bg-disabled: #FFFFFF08; - --color-components-input-text-disabled: #C8CEDA4D; - --color-components-input-text-filled-disabled: #C8CEDA99; - --color-components-input-border-hover: #3A3A40; - --color-components-input-border-active-prompt-1: #36BFFA; - --color-components-input-border-active-prompt-2: #296DFF; + --color-components-input-border-destructive: #f97066; + --color-components-input-text-filled: #f4f4f5; + --color-components-input-bg-destructive: #ffffff03; + --color-components-input-bg-disabled: #ffffff08; + --color-components-input-text-disabled: #c8ceda4d; + --color-components-input-text-filled-disabled: #c8ceda99; + --color-components-input-border-hover: #3a3a40; + --color-components-input-border-active-prompt-1: #36bffa; + --color-components-input-border-active-prompt-2: #296dff; - --color-components-kbd-bg-gray: #FFFFFF08; - --color-components-kbd-bg-white: #FFFFFF1F; + --color-components-kbd-bg-gray: #ffffff08; + --color-components-kbd-bg-white: #ffffff1f; - --color-components-tooltip-bg: #18181BF2; + --color-components-tooltip-bg: #18181bf2; - --color-components-button-primary-text: #FFFFFFF2; - --color-components-button-primary-bg: #155AEF; - --color-components-button-primary-border: #FFFFFF1F; - --color-components-button-primary-bg-hover: #296DFF; - --color-components-button-primary-border-hover: #FFFFFF33; - --color-components-button-primary-bg-disabled: #FFFFFF08; - --color-components-button-primary-border-disabled: #FFFFFF14; - --color-components-button-primary-text-disabled: #FFFFFF33; + --color-components-button-primary-text: #fffffff2; + --color-components-button-primary-bg: #155aef; + --color-components-button-primary-border: #ffffff1f; + --color-components-button-primary-bg-hover: #296dff; + --color-components-button-primary-border-hover: #ffffff33; + --color-components-button-primary-bg-disabled: #ffffff08; + --color-components-button-primary-border-disabled: #ffffff14; + --color-components-button-primary-text-disabled: #ffffff33; - --color-components-button-secondary-text: #FFFFFFCC; - --color-components-button-secondary-text-disabled: #FFFFFF33; - --color-components-button-secondary-bg: #FFFFFF1F; - --color-components-button-secondary-bg-hover: #FFFFFF33; - --color-components-button-secondary-bg-disabled: #FFFFFF08; - --color-components-button-secondary-border: #FFFFFF14; - --color-components-button-secondary-border-hover: #FFFFFF1F; - --color-components-button-secondary-border-disabled: #FFFFFF0D; + --color-components-button-secondary-text: #ffffffcc; + --color-components-button-secondary-text-disabled: #ffffff33; + --color-components-button-secondary-bg: #ffffff1f; + --color-components-button-secondary-bg-hover: #ffffff33; + --color-components-button-secondary-bg-disabled: #ffffff08; + --color-components-button-secondary-border: #ffffff14; + --color-components-button-secondary-border-hover: #ffffff1f; + --color-components-button-secondary-border-disabled: #ffffff0d; - --color-components-button-tertiary-text: #D9D9DE; - --color-components-button-tertiary-text-disabled: #FFFFFF33; - --color-components-button-tertiary-bg: #FFFFFF14; - --color-components-button-tertiary-bg-hover: #FFFFFF1F; - --color-components-button-tertiary-bg-disabled: #FFFFFF08; + --color-components-button-tertiary-text: #d9d9de; + --color-components-button-tertiary-text-disabled: #ffffff33; + --color-components-button-tertiary-bg: #ffffff14; + --color-components-button-tertiary-bg-hover: #ffffff1f; + --color-components-button-tertiary-bg-disabled: #ffffff08; - --color-components-button-ghost-text: #D9D9DE; - --color-components-button-ghost-text-disabled: #FFFFFF33; - --color-components-button-ghost-bg-hover: #C8CEDA14; + --color-components-button-ghost-text: #d9d9de; + --color-components-button-ghost-text-disabled: #ffffff33; + --color-components-button-ghost-bg-hover: #c8ceda14; - --color-components-button-destructive-primary-text: #FFFFFFF2; - --color-components-button-destructive-primary-text-disabled: #FFFFFF33; - --color-components-button-destructive-primary-bg: #D92D20; - --color-components-button-destructive-primary-bg-hover: #F04438; - --color-components-button-destructive-primary-bg-disabled: #F0443824; - --color-components-button-destructive-primary-border: #FFFFFF1F; - --color-components-button-destructive-primary-border-hover: #FFFFFF33; - --color-components-button-destructive-primary-border-disabled: #FFFFFF14; + --color-components-button-destructive-primary-text: #fffffff2; + --color-components-button-destructive-primary-text-disabled: #ffffff33; + --color-components-button-destructive-primary-bg: #d92d20; + --color-components-button-destructive-primary-bg-hover: #f04438; + --color-components-button-destructive-primary-bg-disabled: #f0443824; + --color-components-button-destructive-primary-border: #ffffff1f; + --color-components-button-destructive-primary-border-hover: #ffffff33; + --color-components-button-destructive-primary-border-disabled: #ffffff14; - --color-components-button-destructive-secondary-text: #F97066; - --color-components-button-destructive-secondary-text-disabled: #F0443833; - --color-components-button-destructive-secondary-bg: #FFFFFF1F; - --color-components-button-destructive-secondary-bg-hover: #F0443824; - --color-components-button-destructive-secondary-bg-disabled: #F0443814; - --color-components-button-destructive-secondary-border: #FFFFFF14; - --color-components-button-destructive-secondary-border-hover: #FFFFFF1F; - --color-components-button-destructive-secondary-border-disabled: #F0443814; + --color-components-button-destructive-secondary-text: #f97066; + --color-components-button-destructive-secondary-text-disabled: #f0443833; + --color-components-button-destructive-secondary-bg: #ffffff1f; + --color-components-button-destructive-secondary-bg-hover: #f0443824; + --color-components-button-destructive-secondary-bg-disabled: #f0443814; + --color-components-button-destructive-secondary-border: #ffffff14; + --color-components-button-destructive-secondary-border-hover: #ffffff1f; + --color-components-button-destructive-secondary-border-disabled: #f0443814; - --color-components-button-destructive-tertiary-text: #F97066; - --color-components-button-destructive-tertiary-text-disabled: #F0443833; - --color-components-button-destructive-tertiary-bg: #F0443824; - --color-components-button-destructive-tertiary-bg-hover: #F0443840; - --color-components-button-destructive-tertiary-bg-disabled: #F0443814; + --color-components-button-destructive-tertiary-text: #f97066; + --color-components-button-destructive-tertiary-text-disabled: #f0443833; + --color-components-button-destructive-tertiary-bg: #f0443824; + --color-components-button-destructive-tertiary-bg-hover: #f0443840; + --color-components-button-destructive-tertiary-bg-disabled: #f0443814; - --color-components-button-destructive-ghost-text: #F97066; - --color-components-button-destructive-ghost-text-disabled: #F0443833; - --color-components-button-destructive-ghost-bg-hover: #F0443824; + --color-components-button-destructive-ghost-text: #f97066; + --color-components-button-destructive-ghost-text-disabled: #f0443833; + --color-components-button-destructive-ghost-bg-hover: #f0443824; - --color-components-button-secondary-accent-text: #FFFFFFCC; - --color-components-button-secondary-accent-text-disabled: #FFFFFF33; - --color-components-button-secondary-accent-bg: #FFFFFF0D; - --color-components-button-secondary-accent-bg-hover: #FFFFFF14; - --color-components-button-secondary-accent-bg-disabled: #FFFFFF08; - --color-components-button-secondary-accent-border: #FFFFFF14; - --color-components-button-secondary-accent-border-hover: #FFFFFF1F; - --color-components-button-secondary-accent-border-disabled: #FFFFFF0D; + --color-components-button-secondary-accent-text: #ffffffcc; + --color-components-button-secondary-accent-text-disabled: #ffffff33; + --color-components-button-secondary-accent-bg: #ffffff0d; + --color-components-button-secondary-accent-bg-hover: #ffffff14; + --color-components-button-secondary-accent-bg-disabled: #ffffff08; + --color-components-button-secondary-accent-border: #ffffff14; + --color-components-button-secondary-accent-border-hover: #ffffff1f; + --color-components-button-secondary-accent-border-disabled: #ffffff0d; - --color-components-button-indigo-bg: #444CE7; - --color-components-button-indigo-bg-hover: #6172F3; - --color-components-button-indigo-bg-disabled: #FFFFFF08; + --color-components-button-indigo-bg: #444ce7; + --color-components-button-indigo-bg-hover: #6172f3; + --color-components-button-indigo-bg-disabled: #ffffff08; - --color-components-checkbox-icon: #FFFFFFF2; - --color-components-checkbox-icon-disabled: #FFFFFF33; - --color-components-checkbox-bg: #296DFF; - --color-components-checkbox-bg-hover: #5289FF; - --color-components-checkbox-bg-disabled: #FFFFFF08; - --color-components-checkbox-border: #FFFFFF66; - --color-components-checkbox-border-hover: #FFFFFF99; - --color-components-checkbox-border-disabled: #FFFFFF03; - --color-components-checkbox-bg-unchecked: #FFFFFF08; - --color-components-checkbox-bg-unchecked-hover: #FFFFFF0D; - --color-components-checkbox-bg-disabled-checked: #155AEF33; + --color-components-checkbox-icon: #fffffff2; + --color-components-checkbox-icon-disabled: #ffffff33; + --color-components-checkbox-bg: #296dff; + --color-components-checkbox-bg-hover: #5289ff; + --color-components-checkbox-bg-disabled: #ffffff08; + --color-components-checkbox-border: #ffffff66; + --color-components-checkbox-border-hover: #ffffff99; + --color-components-checkbox-border-disabled: #ffffff03; + --color-components-checkbox-bg-unchecked: #ffffff08; + --color-components-checkbox-bg-unchecked-hover: #ffffff0d; + --color-components-checkbox-bg-disabled-checked: #155aef33; - --color-components-radio-border-checked: #296DFF; - --color-components-radio-border-checked-hover: #5289FF; - --color-components-radio-border-checked-disabled: #155AEF33; - --color-components-radio-bg-disabled: #FFFFFF08; - --color-components-radio-border: #FFFFFF66; - --color-components-radio-border-hover: #FFFFFF99; - --color-components-radio-border-disabled: #FFFFFF03; - --color-components-radio-bg: #FFFFFF00; - --color-components-radio-bg-hover: #FFFFFF0D; + --color-components-radio-border-checked: #296dff; + --color-components-radio-border-checked-hover: #5289ff; + --color-components-radio-border-checked-disabled: #155aef33; + --color-components-radio-bg-disabled: #ffffff08; + --color-components-radio-border: #ffffff66; + --color-components-radio-border-hover: #ffffff99; + --color-components-radio-border-disabled: #ffffff03; + --color-components-radio-bg: #ffffff00; + --color-components-radio-bg-hover: #ffffff0d; - --color-components-toggle-knob: #F4F4F5; - --color-components-toggle-knob-disabled: #FFFFFF33; - --color-components-toggle-bg: #296DFF; - --color-components-toggle-bg-hover: #5289FF; - --color-components-toggle-bg-disabled: #FFFFFF14; - --color-components-toggle-bg-unchecked: #FFFFFF33; - --color-components-toggle-bg-unchecked-hover: #FFFFFF4D; - --color-components-toggle-bg-unchecked-disabled: #FFFFFF14; - --color-components-toggle-knob-hover: #FEFEFE; + --color-components-toggle-knob: #f4f4f5; + --color-components-toggle-knob-disabled: #ffffff33; + --color-components-toggle-bg: #296dff; + --color-components-toggle-bg-hover: #5289ff; + --color-components-toggle-bg-disabled: #ffffff14; + --color-components-toggle-bg-unchecked: #ffffff33; + --color-components-toggle-bg-unchecked-hover: #ffffff4d; + --color-components-toggle-bg-unchecked-disabled: #ffffff14; + --color-components-toggle-knob-hover: #fefefe; --color-components-card-bg: #222225; - --color-components-card-border: #FFFFFF08; - --color-components-card-bg-alt: #27272B; + --color-components-card-border: #ffffff08; + --color-components-card-bg-alt: #27272b; - --color-components-menu-item-text: #C8CEDA99; - --color-components-menu-item-text-active: #FFFFFFF2; - --color-components-menu-item-text-hover: #C8CEDACC; - --color-components-menu-item-text-active-accent: #FFFFFFF2; + --color-components-menu-item-text: #c8ceda99; + --color-components-menu-item-text-active: #fffffff2; + --color-components-menu-item-text-hover: #c8cedacc; + --color-components-menu-item-text-active-accent: #fffffff2; --color-components-panel-bg: #222225; - --color-components-panel-bg-blur: #2C2C30F2; - --color-components-panel-border: #C8CEDA24; - --color-components-panel-border-subtle: #C8CEDA14; + --color-components-panel-bg-blur: #2c2c30f2; + --color-components-panel-border: #c8ceda24; + --color-components-panel-border-subtle: #c8ceda14; --color-components-panel-gradient-2: #222225; - --color-components-panel-gradient-1: #27272B; + --color-components-panel-gradient-1: #27272b; --color-components-panel-bg-alt: #222225; - --color-components-panel-on-panel-item-bg: #27272B; - --color-components-panel-on-panel-item-bg-hover: #3A3A40; - --color-components-panel-on-panel-item-bg-alt: #3A3A40; - --color-components-panel-on-panel-item-bg-transparent: #2C2C30F2; - --color-components-panel-on-panel-item-bg-hover-transparent: #3A3A4000; - --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #FFFBFA00; + --color-components-panel-on-panel-item-bg: #27272b; + --color-components-panel-on-panel-item-bg-hover: #3a3a40; + --color-components-panel-on-panel-item-bg-alt: #3a3a40; + --color-components-panel-on-panel-item-bg-transparent: #2c2c30f2; + --color-components-panel-on-panel-item-bg-hover-transparent: #3a3a4000; + --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #fffbfa00; --color-components-panel-bg-transparent: #22222500; - --color-components-main-nav-nav-button-text: #C8CEDA99; - --color-components-main-nav-nav-button-text-active: #F4F4F5; - --color-components-main-nav-nav-button-bg: #FFFFFF00; - --color-components-main-nav-nav-button-bg-active: #C8CEDA24; - --color-components-main-nav-nav-button-border: #FFFFFF14; - --color-components-main-nav-nav-button-bg-hover: #C8CEDA0A; + --color-components-main-nav-nav-button-text: #c8ceda99; + --color-components-main-nav-nav-button-text-active: #f4f4f5; + --color-components-main-nav-nav-button-bg: #ffffff00; + --color-components-main-nav-nav-button-bg-active: #c8ceda24; + --color-components-main-nav-nav-button-border: #ffffff14; + --color-components-main-nav-nav-button-bg-hover: #c8ceda0a; - --color-components-main-nav-nav-user-border: #FFFFFF0D; + --color-components-main-nav-nav-user-border: #ffffff0d; - --color-components-slider-knob: #F4F4F5; - --color-components-slider-knob-hover: #FEFEFE; - --color-components-slider-knob-disabled: #FFFFFF33; - --color-components-slider-range: #296DFF; - --color-components-slider-track: #FFFFFF33; - --color-components-slider-knob-border-hover: #1018284D; + --color-components-slider-knob: #f4f4f5; + --color-components-slider-knob-hover: #fefefe; + --color-components-slider-knob-disabled: #ffffff33; + --color-components-slider-range: #296dff; + --color-components-slider-track: #ffffff33; + --color-components-slider-knob-border-hover: #1018284d; --color-components-slider-knob-border: #10182833; - --color-components-segmented-control-item-active-bg: #FFFFFF14; - --color-components-segmented-control-item-active-border: #C8CEDA14; - --color-components-segmented-control-bg-normal: #18181BB2; - --color-components-segmented-control-item-active-accent-bg: #155AEF33; - --color-components-segmented-control-item-active-accent-border: #155AEF4D; + --color-components-segmented-control-item-active-bg: #ffffff14; + --color-components-segmented-control-item-active-border: #c8ceda14; + --color-components-segmented-control-bg-normal: #18181bb3; + --color-components-segmented-control-item-active-accent-bg: #155aef33; + --color-components-segmented-control-item-active-accent-border: #155aef4d; - --color-components-option-card-option-bg: #C8CEDA0A; - --color-components-option-card-option-selected-bg: #FFFFFF0D; - --color-components-option-card-option-selected-border: #5289FF; - --color-components-option-card-option-border: #C8CEDA33; - --color-components-option-card-option-bg-hover: #C8CEDA24; - --color-components-option-card-option-border-hover: #C8CEDA4D; + --color-components-option-card-option-bg: #c8ceda0a; + --color-components-option-card-option-selected-bg: #ffffff0d; + --color-components-option-card-option-selected-border: #5289ff; + --color-components-option-card-option-border: #c8ceda33; + --color-components-option-card-option-bg-hover: #c8ceda24; + --color-components-option-card-option-border-hover: #c8ceda4d; - --color-components-tab-active: #296DFF; + --color-components-tab-active: #296dff; - --color-components-badge-white-to-dark: #18181BCC; - --color-components-badge-status-light-success-bg: #17B26A; - --color-components-badge-status-light-success-border-inner: #47CD89; - --color-components-badge-status-light-success-halo: #17B26A4D; + --color-components-badge-white-to-dark: #18181bcc; + --color-components-badge-status-light-success-bg: #17b26a; + --color-components-badge-status-light-success-border-inner: #47cd89; + --color-components-badge-status-light-success-halo: #17b26a4d; --color-components-badge-status-light-border-outer: #222225; - --color-components-badge-status-light-high-light: #FFFFFF4D; - --color-components-badge-status-light-warning-bg: #F79009; - --color-components-badge-status-light-warning-border-inner: #FDB022; - --color-components-badge-status-light-warning-halo: #F790094D; + --color-components-badge-status-light-high-light: #ffffff4d; + --color-components-badge-status-light-warning-bg: #f79009; + --color-components-badge-status-light-warning-border-inner: #fdb022; + --color-components-badge-status-light-warning-halo: #f790094d; - --color-components-badge-status-light-error-bg: #F04438; - --color-components-badge-status-light-error-border-inner: #F97066; - --color-components-badge-status-light-error-halo: #F044384D; + --color-components-badge-status-light-error-bg: #f04438; + --color-components-badge-status-light-error-border-inner: #f97066; + --color-components-badge-status-light-error-halo: #f044384d; - --color-components-badge-status-light-normal-bg: #0BA5EC; - --color-components-badge-status-light-normal-border-inner: #36BFFA; - --color-components-badge-status-light-normal-halo: #0BA5EC4D; + --color-components-badge-status-light-normal-bg: #0ba5ec; + --color-components-badge-status-light-normal-border-inner: #36bffa; + --color-components-badge-status-light-normal-halo: #0ba5ec4d; - --color-components-badge-status-light-disabled-bg: #676F83; - --color-components-badge-status-light-disabled-border-inner: #98A2B2; - --color-components-badge-status-light-disabled-halo: #C8CEDA14; + --color-components-badge-status-light-disabled-bg: #676f83; + --color-components-badge-status-light-disabled-border-inner: #98a2b2; + --color-components-badge-status-light-disabled-halo: #c8ceda14; - --color-components-badge-bg-green-soft: #17B26A24; - --color-components-badge-bg-orange-soft: #F7900924; - --color-components-badge-bg-red-soft: #F0443824; - --color-components-badge-bg-blue-light-soft: #0BA5EC24; - --color-components-badge-bg-gray-soft: #C8CEDA14; + --color-components-badge-bg-green-soft: #17b26a24; + --color-components-badge-bg-orange-soft: #f7900924; + --color-components-badge-bg-red-soft: #f0443824; + --color-components-badge-bg-blue-light-soft: #0ba5ec24; + --color-components-badge-bg-gray-soft: #c8ceda14; + --color-components-badge-bg-dimm: #ffffff08; - --color-components-chart-line: #5289FF; - --color-components-chart-area-1: #155AEF33; - --color-components-chart-area-2: #155AEF0A; - --color-components-chart-current-1: #5289FF; - --color-components-chart-current-2: #155AEF4D; - --color-components-chart-bg: #18181BF2; + --color-components-chart-line: #5289ff; + --color-components-chart-area-1: #155aef33; + --color-components-chart-area-2: #155aef0a; + --color-components-chart-current-1: #5289ff; + --color-components-chart-current-2: #155aef4d; + --color-components-chart-bg: #18181bf2; --color-components-actionbar-bg: #222225; - --color-components-actionbar-border: #C8CEDA14; - --color-components-actionbar-bg-accent: #27272B; - --color-components-actionbar-border-accent: #5289FF; + --color-components-actionbar-border: #c8ceda14; + --color-components-actionbar-bg-accent: #27272b; + --color-components-actionbar-border-accent: #5289ff; - --color-components-dropzone-bg-alt: #18181BCC; - --color-components-dropzone-bg: #18181B66; - --color-components-dropzone-bg-accent: #155AEF33; - --color-components-dropzone-border: #C8CEDA24; - --color-components-dropzone-border-alt: #C8CEDA33; - --color-components-dropzone-border-accent: #84ABFF; + --color-components-dropzone-bg-alt: #18181bcc; + --color-components-dropzone-bg: #18181b66; + --color-components-dropzone-bg-accent: #155aef33; + --color-components-dropzone-border: #c8ceda24; + --color-components-dropzone-border-alt: #c8ceda33; + --color-components-dropzone-border-accent: #84abff; - --color-components-progress-brand-progress: #5289FF; - --color-components-progress-brand-border: #5289FF; - --color-components-progress-brand-bg: #155AEF0A; + --color-components-progress-brand-progress: #5289ff; + --color-components-progress-brand-border: #5289ff; + --color-components-progress-brand-bg: #155aef0a; - --color-components-progress-white-progress: #FFFFFF; - --color-components-progress-white-border: #FFFFFFF2; - --color-components-progress-white-bg: #FFFFFF03; + --color-components-progress-white-progress: #ffffff; + --color-components-progress-white-border: #fffffff2; + --color-components-progress-white-bg: #ffffff03; - --color-components-progress-gray-progress: #98A2B2; - --color-components-progress-gray-border: #98A2B2; - --color-components-progress-gray-bg: #C8CEDA05; + --color-components-progress-gray-progress: #98a2b2; + --color-components-progress-gray-border: #98a2b2; + --color-components-progress-gray-bg: #c8ceda05; - --color-components-progress-warning-progress: #FDB022; - --color-components-progress-warning-border: #FDB022; - --color-components-progress-warning-bg: #F790090A; + --color-components-progress-warning-progress: #fdb022; + --color-components-progress-warning-border: #fdb022; + --color-components-progress-warning-bg: #f790090a; - --color-components-progress-error-progress: #F97066; - --color-components-progress-error-border: #F97066; - --color-components-progress-error-bg: #F044380A; + --color-components-progress-error-progress: #f97066; + --color-components-progress-error-border: #f97066; + --color-components-progress-error-bg: #f044380a; - --color-components-chat-input-audio-bg: #155AEF33; - --color-components-chat-input-audio-wave-default: #C8CEDA24; - --color-components-chat-input-bg-mask-1: #18181B0A; - --color-components-chat-input-bg-mask-2: #18181B99; - --color-components-chat-input-border: #C8CEDA33; - --color-components-chat-input-audio-wave-active: #84ABFF; - --color-components-chat-input-audio-bg-alt: #18181BE5; + --color-components-chat-input-audio-bg: #155aef33; + --color-components-chat-input-audio-wave-default: #c8ceda24; + --color-components-chat-input-bg-mask-1: #18181b0a; + --color-components-chat-input-bg-mask-2: #18181b99; + --color-components-chat-input-border: #c8ceda33; + --color-components-chat-input-audio-wave-active: #84abff; + --color-components-chat-input-audio-bg-alt: #18181be6; - --color-components-avatar-shape-fill-stop-0: #FFFFFFF2; - --color-components-avatar-shape-fill-stop-100: #FFFFFFCC; + --color-components-avatar-shape-fill-stop-0: #fffffff2; + --color-components-avatar-shape-fill-stop-100: #ffffffcc; - --color-components-avatar-bg-mask-stop-0: #FFFFFF33; - --color-components-avatar-bg-mask-stop-100: #FFFFFF08; + --color-components-avatar-bg-mask-stop-0: #ffffff33; + --color-components-avatar-bg-mask-stop-100: #ffffff08; --color-components-avatar-default-avatar-bg: #222225; - --color-components-avatar-mask-darkmode-dimmed: #0000001F; + --color-components-avatar-mask-darkmode-dimmed: #0000001f; - --color-components-label-gray: #C8CEDA24; + --color-components-label-gray: #c8ceda24; - --color-components-premium-badge-blue-bg-stop-0: #5289FF; - --color-components-premium-badge-blue-bg-stop-100: #296DFF; - --color-components-premium-badge-blue-stroke-stop-0: #FFFFFF33; - --color-components-premium-badge-blue-stroke-stop-100: #296DFF; - --color-components-premium-badge-blue-text-stop-0: #EFF4FF; - --color-components-premium-badge-blue-text-stop-100: #B2CAFF; - --color-components-premium-badge-blue-glow: #004AEB; - --color-components-premium-badge-blue-bg-stop-0-hover: #84ABFF; - --color-components-premium-badge-blue-bg-stop-100-hover: #004AEB; - --color-components-premium-badge-blue-glow-hover: #D1E0FF; - --color-components-premium-badge-blue-stroke-stop-0-hover: #FFFFFF80; - --color-components-premium-badge-blue-stroke-stop-100-hover: #296DFF; + --color-components-premium-badge-blue-bg-stop-0: #5289ff; + --color-components-premium-badge-blue-bg-stop-100: #296dff; + --color-components-premium-badge-blue-stroke-stop-0: #ffffff33; + --color-components-premium-badge-blue-stroke-stop-100: #296dff; + --color-components-premium-badge-blue-text-stop-0: #eff4ff; + --color-components-premium-badge-blue-text-stop-100: #b2caff; + --color-components-premium-badge-blue-glow: #004aeb; + --color-components-premium-badge-blue-bg-stop-0-hover: #84abff; + --color-components-premium-badge-blue-bg-stop-100-hover: #004aeb; + --color-components-premium-badge-blue-glow-hover: #d1e0ff; + --color-components-premium-badge-blue-stroke-stop-0-hover: #ffffff80; + --color-components-premium-badge-blue-stroke-stop-100-hover: #296dff; - --color-components-premium-badge-highlight-stop-0: #FFFFFF1F; - --color-components-premium-badge-highlight-stop-100: #FFFFFF33; - --color-components-premium-badge-indigo-bg-stop-0: #6172F3; - --color-components-premium-badge-indigo-bg-stop-100: #3538CD; - --color-components-premium-badge-indigo-stroke-stop-0: #FFFFFF33; - --color-components-premium-badge-indigo-stroke-stop-100: #444CE7; - --color-components-premium-badge-indigo-text-stop-0: #EEF4FF; - --color-components-premium-badge-indigo-text-stop-100: #C7D7FE; - --color-components-premium-badge-indigo-glow: #3538CD; - --color-components-premium-badge-indigo-glow-hover: #E0EAFF; - --color-components-premium-badge-indigo-bg-stop-0-hover: #A4BCFD; - --color-components-premium-badge-indigo-bg-stop-100-hover: #3538CD; - --color-components-premium-badge-indigo-stroke-stop-0-hover: #FFFFFF80; - --color-components-premium-badge-indigo-stroke-stop-100-hover: #444CE7; + --color-components-premium-badge-highlight-stop-0: #ffffff1f; + --color-components-premium-badge-highlight-stop-100: #ffffff33; + --color-components-premium-badge-indigo-bg-stop-0: #6172f3; + --color-components-premium-badge-indigo-bg-stop-100: #3538cd; + --color-components-premium-badge-indigo-stroke-stop-0: #ffffff33; + --color-components-premium-badge-indigo-stroke-stop-100: #444ce7; + --color-components-premium-badge-indigo-text-stop-0: #eef4ff; + --color-components-premium-badge-indigo-text-stop-100: #c7d7fe; + --color-components-premium-badge-indigo-glow: #3538cd; + --color-components-premium-badge-indigo-glow-hover: #e0eaff; + --color-components-premium-badge-indigo-bg-stop-0-hover: #a4bcfd; + --color-components-premium-badge-indigo-bg-stop-100-hover: #3538cd; + --color-components-premium-badge-indigo-stroke-stop-0-hover: #ffffff80; + --color-components-premium-badge-indigo-stroke-stop-100-hover: #444ce7; - --color-components-premium-badge-grey-bg-stop-0: #676F83; + --color-components-premium-badge-grey-bg-stop-0: #676f83; --color-components-premium-badge-grey-bg-stop-100: #495464; - --color-components-premium-badge-grey-stroke-stop-0: #FFFFFF1F; + --color-components-premium-badge-grey-stroke-stop-0: #ffffff1f; --color-components-premium-badge-grey-stroke-stop-100: #495464; - --color-components-premium-badge-grey-text-stop-0: #F9FAFB; - --color-components-premium-badge-grey-text-stop-100: #E9EBF0; + --color-components-premium-badge-grey-text-stop-0: #f9fafb; + --color-components-premium-badge-grey-text-stop-100: #e9ebf0; --color-components-premium-badge-grey-glow: #354052; - --color-components-premium-badge-grey-glow-hover: #F2F4F7; - --color-components-premium-badge-grey-bg-stop-0-hover: #98A2B2; + --color-components-premium-badge-grey-glow-hover: #f2f4f7; + --color-components-premium-badge-grey-bg-stop-0-hover: #98a2b2; --color-components-premium-badge-grey-bg-stop-100-hover: #354052; - --color-components-premium-badge-grey-stroke-stop-0-hover: #FFFFFF80; - --color-components-premium-badge-grey-stroke-stop-100-hover: #676F83; + --color-components-premium-badge-grey-stroke-stop-0-hover: #ffffff80; + --color-components-premium-badge-grey-stroke-stop-100-hover: #676f83; - --color-components-premium-badge-orange-bg-stop-0: #FF692E; - --color-components-premium-badge-orange-bg-stop-100: #E04F16; - --color-components-premium-badge-orange-stroke-stop-0: #FFFFFF33; - --color-components-premium-badge-orange-stroke-stop-100: #FF4405; - --color-components-premium-badge-orange-text-stop-0: #FEF6EE; - --color-components-premium-badge-orange-text-stop-100: #F9DBAF; - --color-components-premium-badge-orange-glow: #B93815; - --color-components-premium-badge-orange-glow-hover: #FDEAD7; - --color-components-premium-badge-orange-bg-stop-0-hover: #FF692E; - --color-components-premium-badge-orange-bg-stop-100-hover: #B93815; - --color-components-premium-badge-orange-stroke-stop-0-hover: #FFFFFF80; - --color-components-premium-badge-orange-stroke-stop-100-hover: #FF4405; + --color-components-premium-badge-orange-bg-stop-0: #ff692e; + --color-components-premium-badge-orange-bg-stop-100: #e04f16; + --color-components-premium-badge-orange-stroke-stop-0: #ffffff33; + --color-components-premium-badge-orange-stroke-stop-100: #ff4405; + --color-components-premium-badge-orange-text-stop-0: #fef6ee; + --color-components-premium-badge-orange-text-stop-100: #f9dbaf; + --color-components-premium-badge-orange-glow: #b93815; + --color-components-premium-badge-orange-glow-hover: #fdead7; + --color-components-premium-badge-orange-bg-stop-0-hover: #ff692e; + --color-components-premium-badge-orange-bg-stop-100-hover: #b93815; + --color-components-premium-badge-orange-stroke-stop-0-hover: #ffffff80; + --color-components-premium-badge-orange-stroke-stop-100-hover: #ff4405; - --color-components-progress-bar-bg: #C8CEDA14; - --color-components-progress-bar-progress: #C8CEDA24; - --color-components-progress-bar-border: #FFFFFF08; - --color-components-progress-bar-progress-solid: #FFFFFFF2; - --color-components-progress-bar-progress-highlight: #C8CEDA33; + --color-components-progress-bar-bg: #c8ceda14; + --color-components-progress-bar-progress: #c8ceda24; + --color-components-progress-bar-border: #ffffff08; + --color-components-progress-bar-progress-solid: #fffffff2; + --color-components-progress-bar-progress-highlight: #c8ceda33; - --color-components-icon-bg-red-solid: #D92D20; - --color-components-icon-bg-rose-solid: #E31B54; - --color-components-icon-bg-pink-solid: #DD2590; - --color-components-icon-bg-orange-dark-solid: #FF4405; - --color-components-icon-bg-yellow-solid: #EAAA08; - --color-components-icon-bg-green-solid: #4CA30D; - --color-components-icon-bg-teal-solid: #0E9384; - --color-components-icon-bg-blue-light-solid: #0BA5EC; - --color-components-icon-bg-blue-solid: #155AEF; - --color-components-icon-bg-indigo-solid: #444CE7; - --color-components-icon-bg-violet-solid: #7839EE; - --color-components-icon-bg-midnight-solid: #5D698D; - --color-components-icon-bg-rose-soft: #F63D6833; - --color-components-icon-bg-pink-soft: #EE46BC33; - --color-components-icon-bg-orange-dark-soft: #FF440533; - --color-components-icon-bg-yellow-soft: #EAAA0833; - --color-components-icon-bg-green-soft: #66C61C33; - --color-components-icon-bg-teal-soft: #15B79E33; - --color-components-icon-bg-blue-light-soft: #0BA5EC33; - --color-components-icon-bg-blue-soft: #155AEF33; - --color-components-icon-bg-indigo-soft: #6172F333; - --color-components-icon-bg-violet-soft: #875BF733; - --color-components-icon-bg-midnight-soft: #828DAD33; - --color-components-icon-bg-red-soft: #F0443833; - --color-components-icon-bg-orange-solid: #F79009; - --color-components-icon-bg-orange-soft: #F7900933; + --color-components-icon-bg-red-solid: #d92d20; + --color-components-icon-bg-rose-solid: #e31b54; + --color-components-icon-bg-pink-solid: #dd2590; + --color-components-icon-bg-orange-dark-solid: #ff4405; + --color-components-icon-bg-yellow-solid: #eaaa08; + --color-components-icon-bg-green-solid: #4ca30d; + --color-components-icon-bg-teal-solid: #0e9384; + --color-components-icon-bg-blue-light-solid: #0ba5ec; + --color-components-icon-bg-blue-solid: #155aef; + --color-components-icon-bg-indigo-solid: #444ce7; + --color-components-icon-bg-violet-solid: #7839ee; + --color-components-icon-bg-midnight-solid: #5d698d; + --color-components-icon-bg-rose-soft: #f63d6833; + --color-components-icon-bg-pink-soft: #ee46bc33; + --color-components-icon-bg-orange-dark-soft: #ff440533; + --color-components-icon-bg-yellow-soft: #eaaa0833; + --color-components-icon-bg-green-soft: #66c61c33; + --color-components-icon-bg-teal-soft: #15b79e33; + --color-components-icon-bg-blue-light-soft: #0ba5ec33; + --color-components-icon-bg-blue-soft: #155aef33; + --color-components-icon-bg-indigo-soft: #6172f333; + --color-components-icon-bg-violet-soft: #875bf733; + --color-components-icon-bg-midnight-soft: #828dad33; + --color-components-icon-bg-red-soft: #f0443833; + --color-components-icon-bg-orange-solid: #f79009; + --color-components-icon-bg-orange-soft: #f7900933; - --color-text-primary: #FBFBFC; - --color-text-secondary: #D9D9DE; - --color-text-tertiary: #C8CEDA99; - --color-text-quaternary: #C8CEDA66; - --color-text-destructive: #F97066; - --color-text-success: #17B26A; - --color-text-warning: #F79009; - --color-text-destructive-secondary: #F97066; - --color-text-success-secondary: #47CD89; - --color-text-warning-secondary: #FDB022; - --color-text-accent: #5289FF; - --color-text-primary-on-surface: #FFFFFFF2; - --color-text-placeholder: #C8CEDA4D; - --color-text-disabled: #C8CEDA4D; - --color-text-accent-secondary: #84ABFF; - --color-text-accent-light-mode-only: #D9D9DE; - --color-text-text-selected: #155AEF4D; - --color-text-secondary-on-surface: #FFFFFFE5; - --color-text-logo-text: #E9E9EC; - --color-text-empty-state-icon: #C8CEDA4D; - --color-text-inverted: #FFFFFF; - --color-text-inverted-dimmed: #FFFFFFCC; + --color-text-primary: #fbfbfc; + --color-text-secondary: #d9d9de; + --color-text-tertiary: #c8ceda99; + --color-text-quaternary: #c8ceda66; + --color-text-destructive: #f97066; + --color-text-success: #17b26a; + --color-text-warning: #f79009; + --color-text-destructive-secondary: #f97066; + --color-text-success-secondary: #47cd89; + --color-text-warning-secondary: #fdb022; + --color-text-accent: #5289ff; + --color-text-primary-on-surface: #fffffff2; + --color-text-placeholder: #c8ceda4d; + --color-text-disabled: #c8ceda4d; + --color-text-accent-secondary: #84abff; + --color-text-accent-light-mode-only: #d9d9de; + --color-text-text-selected: #155aef4d; + --color-text-secondary-on-surface: #ffffffe6; + --color-text-logo-text: #e9e9ec; + --color-text-empty-state-icon: #c8ceda4d; + --color-text-inverted: #ffffff; + --color-text-inverted-dimmed: #ffffffcc; - --color-background-body: #1D1D20; + --color-background-body: #1d1d20; --color-background-default-subtle: #222225; - --color-background-neutral-subtle: #1D1D20; - --color-background-sidenav-bg: #27272AEB; + --color-background-neutral-subtle: #1d1d20; + --color-background-sidenav-bg: #27272aeb; --color-background-default: #222225; - --color-background-soft: #18181B40; + --color-background-soft: #18181b40; --color-background-gradient-bg-fill-chat-bg-1: #222225; - --color-background-gradient-bg-fill-chat-bg-2: #1D1D20; - --color-background-gradient-bg-fill-chat-bubble-bg-1: #C8CEDA14; - --color-background-gradient-bg-fill-chat-bubble-bg-2: #C8CEDA05; - --color-background-gradient-bg-fill-debug-bg-1: #C8CEDA14; - --color-background-gradient-bg-fill-debug-bg-2: #18181B0A; + --color-background-gradient-bg-fill-chat-bg-2: #1d1d20; + --color-background-gradient-bg-fill-chat-bubble-bg-1: #c8ceda14; + --color-background-gradient-bg-fill-chat-bubble-bg-2: #c8ceda05; + --color-background-gradient-bg-fill-debug-bg-1: #c8ceda14; + --color-background-gradient-bg-fill-debug-bg-2: #18181b0a; - --color-background-gradient-mask-gray: #18181B14; + --color-background-gradient-mask-gray: #18181b14; --color-background-gradient-mask-transparent: #00000000; - --color-background-gradient-mask-input-clear-2: #393A3E00; - --color-background-gradient-mask-input-clear-1: #393A3E; + --color-background-gradient-mask-input-clear-2: #393a3e00; + --color-background-gradient-mask-input-clear-1: #393a3e; --color-background-gradient-mask-transparent-dark: #00000000; - --color-background-gradient-mask-side-panel-2: #18181BE5; - --color-background-gradient-mask-side-panel-1: #18181B0A; + --color-background-gradient-mask-side-panel-2: #18181be6; + --color-background-gradient-mask-side-panel-1: #18181b0a; - --color-background-default-burn: #1D1D20; - --color-background-overlay-fullscreen: #27272AF7; - --color-background-default-lighter: #C8CEDA0A; - --color-background-section: #18181B66; - --color-background-interaction-from-bg-1: #18181B66; - --color-background-interaction-from-bg-2: #18181B24; - --color-background-section-burn: #18181B99; - --color-background-default-dodge: #3A3A40; - --color-background-overlay: #18181BCC; - --color-background-default-dimmed: #27272B; - --color-background-default-hover: #27272B; - --color-background-overlay-alt: #18181B66; - --color-background-surface-white: #FFFFFFE5; - --color-background-overlay-destructive: #F044384D; - --color-background-overlay-backdrop: #18181BF2; + --color-background-default-burn: #1d1d20; + --color-background-overlay-fullscreen: #27272af7; + --color-background-default-lighter: #c8ceda0a; + --color-background-section: #18181b66; + --color-background-interaction-from-bg-1: #18181b66; + --color-background-interaction-from-bg-2: #18181b24; + --color-background-section-burn: #18181b99; + --color-background-default-dodge: #3a3a40; + --color-background-overlay: #18181bcc; + --color-background-default-dimmed: #27272b; + --color-background-default-hover: #27272b; + --color-background-overlay-alt: #18181b66; + --color-background-surface-white: #ffffffe6; + --color-background-overlay-destructive: #f044384d; + --color-background-overlay-backdrop: #18181bf2; - --color-shadow-shadow-1: #0000000D; - --color-shadow-shadow-3: #0000001A; - --color-shadow-shadow-4: #0000001F; + --color-shadow-shadow-1: #0000000d; + --color-shadow-shadow-3: #0000001a; + --color-shadow-shadow-4: #0000001f; --color-shadow-shadow-5: #00000029; --color-shadow-shadow-6: #00000033; - --color-shadow-shadow-7: #0000003D; + --color-shadow-shadow-7: #0000003d; --color-shadow-shadow-8: #00000047; - --color-shadow-shadow-9: #0000005C; + --color-shadow-shadow-9: #0000005c; --color-shadow-shadow-2: #00000014; --color-shadow-shadow-10: #00000066; - --color-workflow-block-border: #FFFFFF14; - --color-workflow-block-parma-bg: #FFFFFF0D; - --color-workflow-block-bg: #27272B; - --color-workflow-block-bg-transparent: #27272BF5; - --color-workflow-block-border-highlight: #C8CEDA33; + --color-workflow-block-border: #ffffff14; + --color-workflow-block-parma-bg: #ffffff0d; + --color-workflow-block-bg: #27272b; + --color-workflow-block-bg-transparent: #27272bf5; + --color-workflow-block-border-highlight: #c8ceda33; - --color-workflow-canvas-workflow-dot-color: #8585AD26; - --color-workflow-canvas-workflow-bg: #1D1D20; + --color-workflow-canvas-workflow-dot-color: #8585ad1c; + --color-workflow-canvas-workflow-bg: #1d1d20; - --color-workflow-link-line-active: #5289FF; - --color-workflow-link-line-normal: #676F83; - --color-workflow-link-line-handle: #5289FF; - --color-workflow-link-line-normal-transparent: #676F8333; - --color-workflow-link-line-failure-active: #FDB022; - --color-workflow-link-line-failure-handle: #FDB022; - --color-workflow-link-line-failure-button-bg: #F79009; - --color-workflow-link-line-failure-button-hover: #DC6803; + --color-workflow-link-line-active: #5289ff; + --color-workflow-link-line-normal: #676f83; + --color-workflow-link-line-handle: #5289ff; + --color-workflow-link-line-normal-transparent: #676f8333; + --color-workflow-link-line-failure-active: #fdb022; + --color-workflow-link-line-failure-handle: #fdb022; + --color-workflow-link-line-failure-button-bg: #f79009; + --color-workflow-link-line-failure-button-hover: #dc6803; - --color-workflow-link-line-success-active: #47CD89; - --color-workflow-link-line-success-handle: #47CD89; + --color-workflow-link-line-success-active: #47cd89; + --color-workflow-link-line-success-handle: #47cd89; - --color-workflow-link-line-error-active: #F97066; - --color-workflow-link-line-error-handle: #F97066; + --color-workflow-link-line-error-active: #f97066; + --color-workflow-link-line-error-handle: #f97066; - --color-workflow-minimap-bg: #27272B; - --color-workflow-minimap-block: #C8CEDA14; + --color-workflow-minimap-bg: #27272b; + --color-workflow-minimap-block: #c8ceda14; - --color-workflow-display-success-bg: #17B26A33; - --color-workflow-display-success-border-1: #17B26AE5; - --color-workflow-display-success-border-2: #17B26ACC; - --color-workflow-display-success-vignette-color: #17B26A40; - --color-workflow-display-success-bg-line-pattern: #18181BCC; + --color-workflow-display-success-bg: #17b26a33; + --color-workflow-display-success-border-1: #17b26ae6; + --color-workflow-display-success-border-2: #17b26acc; + --color-workflow-display-success-vignette-color: #17b26a40; + --color-workflow-display-success-bg-line-pattern: #18181bcc; - --color-workflow-display-glass-1: #FFFFFF08; - --color-workflow-display-glass-2: #FFFFFF0D; + --color-workflow-display-glass-1: #ffffff08; + --color-workflow-display-glass-2: #ffffff0d; --color-workflow-display-vignette-dark: #00000066; - --color-workflow-display-highlight: #FFFFFF1F; - --color-workflow-display-outline: #18181BF2; - --color-workflow-display-error-bg: #F0443833; - --color-workflow-display-error-bg-line-pattern: #18181BCC; - --color-workflow-display-error-border-1: #F04438E5; - --color-workflow-display-error-border-2: #F04438CC; - --color-workflow-display-error-vignette-color: #F0443840; + --color-workflow-display-highlight: #ffffff1f; + --color-workflow-display-outline: #18181bf2; + --color-workflow-display-error-bg: #f0443833; + --color-workflow-display-error-bg-line-pattern: #18181bcc; + --color-workflow-display-error-border-1: #f04438e6; + --color-workflow-display-error-border-2: #f04438cc; + --color-workflow-display-error-vignette-color: #f0443840; - --color-workflow-display-warning-bg: #F7900933; - --color-workflow-display-warning-bg-line-pattern: #18181BCC; - --color-workflow-display-warning-border-1: #F79009E5; - --color-workflow-display-warning-border-2: #F79009CC; - --color-workflow-display-warning-vignette-color: #F7900940; + --color-workflow-display-warning-bg: #f7900933; + --color-workflow-display-warning-bg-line-pattern: #18181bcc; + --color-workflow-display-warning-border-1: #f79009e6; + --color-workflow-display-warning-border-2: #f79009cc; + --color-workflow-display-warning-vignette-color: #f7900940; - --color-workflow-display-normal-bg: #0BA5EC33; - --color-workflow-display-normal-bg-line-pattern: #18181BCC; - --color-workflow-display-normal-border-1: #0BA5ECE5; - --color-workflow-display-normal-border-2: #0BA5ECCC; - --color-workflow-display-normal-vignette-color: #0BA5EC40; + --color-workflow-display-normal-bg: #0ba5ec33; + --color-workflow-display-normal-bg-line-pattern: #18181bcc; + --color-workflow-display-normal-border-1: #0ba5ece6; + --color-workflow-display-normal-border-2: #0ba5eccc; + --color-workflow-display-normal-vignette-color: #0ba5ec40; - --color-workflow-display-disabled-bg: #C8CEDA33; - --color-workflow-display-disabled-bg-line-pattern: #18181BCC; - --color-workflow-display-disabled-border-1: #C8CEDA99; - --color-workflow-display-disabled-border-2: #C8CEDA40; - --color-workflow-display-disabled-vignette-color: #C8CEDA40; - --color-workflow-display-disabled-outline: #18181BF2; + --color-workflow-display-disabled-bg: #c8ceda33; + --color-workflow-display-disabled-bg-line-pattern: #18181bcc; + --color-workflow-display-disabled-border-1: #c8ceda99; + --color-workflow-display-disabled-border-2: #c8ceda40; + --color-workflow-display-disabled-vignette-color: #c8ceda40; + --color-workflow-display-disabled-outline: #18181bf2; - --color-workflow-workflow-progress-bg-1: #18181B40; - --color-workflow-workflow-progress-bg-2: #18181B0A; + --color-workflow-workflow-progress-bg-1: #18181b40; + --color-workflow-workflow-progress-bg-2: #18181b0a; - --color-divider-subtle: #C8CEDA14; - --color-divider-regular: #C8CEDA24; - --color-divider-deep: #C8CEDA33; - --color-divider-burn: #18181BF2; - --color-divider-intense: #C8CEDA66; - --color-divider-solid: #3A3A40; + --color-divider-subtle: #c8ceda14; + --color-divider-regular: #c8ceda24; + --color-divider-deep: #c8ceda33; + --color-divider-burn: #18181bf2; + --color-divider-intense: #c8ceda66; + --color-divider-solid: #3a3a40; --color-divider-solid-alt: #747481; - --color-state-base-hover: #C8CEDA14; - --color-state-base-active: #C8CEDA33; - --color-state-base-hover-alt: #C8CEDA24; - --color-state-base-handle: #C8CEDA4D; - --color-state-base-handle-hover: #C8CEDA80; + --color-state-base-hover: #c8ceda14; + --color-state-base-active: #c8ceda33; + --color-state-base-hover-alt: #c8ceda24; + --color-state-base-handle: #c8ceda4d; + --color-state-base-handle-hover: #c8ceda80; + --color-state-base-hover-subtle: #c8ceda0a; - --color-state-accent-hover: #155AEF24; - --color-state-accent-active: #155AEF24; - --color-state-accent-hover-alt: #155AEF40; - --color-state-accent-solid: #5289FF; - --color-state-accent-active-alt: #155AEF33; + --color-state-accent-hover: #155aef24; + --color-state-accent-active: #155aef24; + --color-state-accent-hover-alt: #155aef40; + --color-state-accent-solid: #5289ff; + --color-state-accent-active-alt: #155aef33; - --color-state-destructive-hover: #F0443824; - --color-state-destructive-hover-alt: #F0443840; - --color-state-destructive-active: #F044384D; - --color-state-destructive-solid: #F97066; - --color-state-destructive-border: #F97066; + --color-state-destructive-hover: #f0443824; + --color-state-destructive-hover-alt: #f0443840; + --color-state-destructive-active: #f044384d; + --color-state-destructive-solid: #f97066; + --color-state-destructive-border: #f97066; - --color-state-success-hover: #17B26A24; - --color-state-success-hover-alt: #17B26A40; - --color-state-success-active: #17B26A4D; - --color-state-success-solid: #47CD89; + --color-state-success-hover: #17b26a24; + --color-state-success-hover-alt: #17b26a40; + --color-state-success-active: #17b26a4d; + --color-state-success-solid: #47cd89; - --color-state-warning-hover: #F7900924; - --color-state-warning-hover-alt: #F7900940; - --color-state-warning-active: #F790094D; - --color-state-warning-solid: #F79009; + --color-state-warning-hover: #f7900924; + --color-state-warning-hover-alt: #f7900940; + --color-state-warning-active: #f790094d; + --color-state-warning-solid: #f79009; - --color-effects-highlight: #C8CEDA14; - --color-effects-highlight-lightmode-off: #C8CEDA14; - --color-effects-image-frame: #FFFFFF; + --color-effects-highlight: #c8ceda14; + --color-effects-highlight-lightmode-off: #c8ceda14; + --color-effects-image-frame: #ffffff; - --color-util-colors-orange-dark-orange-dark-50: #57130A; - --color-util-colors-orange-dark-orange-dark-100: #771A0D; - --color-util-colors-orange-dark-orange-dark-200: #97180C; - --color-util-colors-orange-dark-orange-dark-300: #BC1B06; - --color-util-colors-orange-dark-orange-dark-400: #E62E05; - --color-util-colors-orange-dark-orange-dark-500: #FF4405; - --color-util-colors-orange-dark-orange-dark-600: #FF692E; - --color-util-colors-orange-dark-orange-dark-700: #FF9C66; + --color-util-colors-orange-dark-orange-dark-50: #57130a; + --color-util-colors-orange-dark-orange-dark-100: #771a0d; + --color-util-colors-orange-dark-orange-dark-200: #97180c; + --color-util-colors-orange-dark-orange-dark-300: #bc1b06; + --color-util-colors-orange-dark-orange-dark-400: #e62e05; + --color-util-colors-orange-dark-orange-dark-500: #ff4405; + --color-util-colors-orange-dark-orange-dark-600: #ff692e; + --color-util-colors-orange-dark-orange-dark-700: #ff9c66; - --color-util-colors-orange-orange-50: #511C10; + --color-util-colors-orange-orange-50: #511c10; --color-util-colors-orange-orange-100: #772917; - --color-util-colors-orange-orange-200: #932F19; - --color-util-colors-orange-orange-300: #B93815; - --color-util-colors-orange-orange-400: #E04F16; - --color-util-colors-orange-orange-500: #EF6820; - --color-util-colors-orange-orange-600: #F38744; - --color-util-colors-orange-orange-700: #F7B27A; + --color-util-colors-orange-orange-200: #932f19; + --color-util-colors-orange-orange-300: #b93815; + --color-util-colors-orange-orange-400: #e04f16; + --color-util-colors-orange-orange-500: #ef6820; + --color-util-colors-orange-orange-600: #f38744; + --color-util-colors-orange-orange-700: #f7b27a; --color-util-colors-orange-orange-100-transparent: #77291700; - --color-util-colors-pink-pink-50: #4E0D30; + --color-util-colors-pink-pink-50: #4e0d30; --color-util-colors-pink-pink-100: #851651; - --color-util-colors-pink-pink-200: #9E165F; - --color-util-colors-pink-pink-300: #C11574; - --color-util-colors-pink-pink-400: #DD2590; - --color-util-colors-pink-pink-500: #EE46BC; - --color-util-colors-pink-pink-600: #F670C7; - --color-util-colors-pink-pink-700: #FAA7E0; + --color-util-colors-pink-pink-200: #9e165f; + --color-util-colors-pink-pink-300: #c11574; + --color-util-colors-pink-pink-400: #dd2590; + --color-util-colors-pink-pink-500: #ee46bc; + --color-util-colors-pink-pink-600: #f670c7; + --color-util-colors-pink-pink-700: #faa7e0; - --color-util-colors-fuchsia-fuchsia-50: #47104C; - --color-util-colors-fuchsia-fuchsia-100: #6F1877; + --color-util-colors-fuchsia-fuchsia-50: #47104c; + --color-util-colors-fuchsia-fuchsia-100: #6f1877; --color-util-colors-fuchsia-fuchsia-200: #821890; - --color-util-colors-fuchsia-fuchsia-300: #9F1AB1; - --color-util-colors-fuchsia-fuchsia-400: #BA24D5; - --color-util-colors-fuchsia-fuchsia-500: #D444F1; - --color-util-colors-fuchsia-fuchsia-600: #E478FA; - --color-util-colors-fuchsia-fuchsia-700: #EEAAFD; + --color-util-colors-fuchsia-fuchsia-300: #9f1ab1; + --color-util-colors-fuchsia-fuchsia-400: #ba24d5; + --color-util-colors-fuchsia-fuchsia-500: #d444f1; + --color-util-colors-fuchsia-fuchsia-600: #e478fa; + --color-util-colors-fuchsia-fuchsia-700: #eeaafd; - --color-util-colors-purple-purple-50: #27115F; - --color-util-colors-purple-purple-100: #3E1C96; - --color-util-colors-purple-purple-200: #4A1FB8; - --color-util-colors-purple-purple-300: #5925DC; - --color-util-colors-purple-purple-400: #6938EF; - --color-util-colors-purple-purple-500: #7A5AF8; - --color-util-colors-purple-purple-600: #9B8AFB; - --color-util-colors-purple-purple-700: #BDB4FE; + --color-util-colors-purple-purple-50: #27115f; + --color-util-colors-purple-purple-100: #3e1c96; + --color-util-colors-purple-purple-200: #4a1fb8; + --color-util-colors-purple-purple-300: #5925dc; + --color-util-colors-purple-purple-400: #6938ef; + --color-util-colors-purple-purple-500: #7a5af8; + --color-util-colors-purple-purple-600: #9b8afb; + --color-util-colors-purple-purple-700: #bdb4fe; - --color-util-colors-indigo-indigo-50: #1F235B; - --color-util-colors-indigo-indigo-100: #2D3282; - --color-util-colors-indigo-indigo-200: #2D31A6; - --color-util-colors-indigo-indigo-300: #3538CD; - --color-util-colors-indigo-indigo-400: #444CE7; - --color-util-colors-indigo-indigo-500: #6172F3; - --color-util-colors-indigo-indigo-600: #8098F9; - --color-util-colors-indigo-indigo-700: #A4BCFD; + --color-util-colors-indigo-indigo-50: #1f235b; + --color-util-colors-indigo-indigo-100: #2d3282; + --color-util-colors-indigo-indigo-200: #2d31a6; + --color-util-colors-indigo-indigo-300: #3538cd; + --color-util-colors-indigo-indigo-400: #444ce7; + --color-util-colors-indigo-indigo-500: #6172f3; + --color-util-colors-indigo-indigo-600: #8098f9; + --color-util-colors-indigo-indigo-700: #a4bcfd; - --color-util-colors-blue-blue-50: #102A56; + --color-util-colors-blue-blue-50: #102a56; --color-util-colors-blue-blue-100: #194185; - --color-util-colors-blue-blue-200: #1849A9; - --color-util-colors-blue-blue-300: #175CD3; - --color-util-colors-blue-blue-400: #1570EF; - --color-util-colors-blue-blue-500: #2E90FA; - --color-util-colors-blue-blue-600: #53B1FD; - --color-util-colors-blue-blue-700: #84CAFF; + --color-util-colors-blue-blue-200: #1849a9; + --color-util-colors-blue-blue-300: #175cd3; + --color-util-colors-blue-blue-400: #1570ef; + --color-util-colors-blue-blue-500: #2e90fa; + --color-util-colors-blue-blue-600: #53b1fd; + --color-util-colors-blue-blue-700: #84caff; - --color-util-colors-blue-light-blue-light-50: #062C41; - --color-util-colors-blue-light-blue-light-100: #0B4A6F; + --color-util-colors-blue-light-blue-light-50: #062c41; + --color-util-colors-blue-light-blue-light-100: #0b4a6f; --color-util-colors-blue-light-blue-light-200: #065986; - --color-util-colors-blue-light-blue-light-300: #026AA2; - --color-util-colors-blue-light-blue-light-400: #0086C9; - --color-util-colors-blue-light-blue-light-500: #0BA5EC; - --color-util-colors-blue-light-blue-light-600: #36BFFA; - --color-util-colors-blue-light-blue-light-700: #7CD4FD; + --color-util-colors-blue-light-blue-light-300: #026aa2; + --color-util-colors-blue-light-blue-light-400: #0086c9; + --color-util-colors-blue-light-blue-light-500: #0ba5ec; + --color-util-colors-blue-light-blue-light-600: #36bffa; + --color-util-colors-blue-light-blue-light-700: #7cd4fd; - --color-util-colors-gray-blue-gray-blue-50: #0D0F1C; + --color-util-colors-gray-blue-gray-blue-50: #0d0f1c; --color-util-colors-gray-blue-gray-blue-100: #101323; --color-util-colors-gray-blue-gray-blue-200: #293056; - --color-util-colors-gray-blue-gray-blue-300: #363F72; - --color-util-colors-gray-blue-gray-blue-400: #3E4784; - --color-util-colors-gray-blue-gray-blue-500: #4E5BA6; - --color-util-colors-gray-blue-gray-blue-600: #717BBC; - --color-util-colors-gray-blue-gray-blue-700: #B3B8DB; + --color-util-colors-gray-blue-gray-blue-300: #363f72; + --color-util-colors-gray-blue-gray-blue-400: #3e4784; + --color-util-colors-gray-blue-gray-blue-500: #4e5ba6; + --color-util-colors-gray-blue-gray-blue-600: #717bbc; + --color-util-colors-gray-blue-gray-blue-700: #b3b8db; --color-util-colors-blue-brand-blue-brand-50: #002066; - --color-util-colors-blue-brand-blue-brand-100: #00329E; - --color-util-colors-blue-brand-blue-brand-200: #003DC1; - --color-util-colors-blue-brand-blue-brand-300: #004AEB; - --color-util-colors-blue-brand-blue-brand-400: #155AEF; - --color-util-colors-blue-brand-blue-brand-500: #296DFF; - --color-util-colors-blue-brand-blue-brand-600: #5289FF; - --color-util-colors-blue-brand-blue-brand-700: #84ABFF; + --color-util-colors-blue-brand-blue-brand-100: #00329e; + --color-util-colors-blue-brand-blue-brand-200: #003dc1; + --color-util-colors-blue-brand-blue-brand-300: #004aeb; + --color-util-colors-blue-brand-blue-brand-400: #155aef; + --color-util-colors-blue-brand-blue-brand-500: #296dff; + --color-util-colors-blue-brand-blue-brand-600: #5289ff; + --color-util-colors-blue-brand-blue-brand-700: #84abff; - --color-util-colors-red-red-50: #55160C; - --color-util-colors-red-red-100: #7A271A; + --color-util-colors-red-red-50: #55160c; + --color-util-colors-red-red-100: #7a271a; --color-util-colors-red-red-200: #912018; - --color-util-colors-red-red-300: #B42318; - --color-util-colors-red-red-400: #D92D20; - --color-util-colors-red-red-500: #F04438; - --color-util-colors-red-red-600: #F97066; - --color-util-colors-red-red-700: #FDA29B; + --color-util-colors-red-red-300: #b42318; + --color-util-colors-red-red-400: #d92d20; + --color-util-colors-red-red-500: #f04438; + --color-util-colors-red-red-600: #f97066; + --color-util-colors-red-red-700: #fda29b; --color-util-colors-green-green-50: #053321; - --color-util-colors-green-green-100: #074D31; - --color-util-colors-green-green-200: #085D3A; + --color-util-colors-green-green-100: #074d31; + --color-util-colors-green-green-200: #085d3a; --color-util-colors-green-green-300: #067647; --color-util-colors-green-green-400: #079455; - --color-util-colors-green-green-500: #17B26A; - --color-util-colors-green-green-600: #47CD89; - --color-util-colors-green-green-700: #75E0A7; + --color-util-colors-green-green-500: #17b26a; + --color-util-colors-green-green-600: #47cd89; + --color-util-colors-green-green-700: #75e0a7; - --color-util-colors-warning-warning-50: #4E1D09; - --color-util-colors-warning-warning-100: #7A2E0E; - --color-util-colors-warning-warning-200: #93370D; - --color-util-colors-warning-warning-300: #B54708; - --color-util-colors-warning-warning-400: #DC6803; - --color-util-colors-warning-warning-500: #F79009; - --color-util-colors-warning-warning-600: #FDB022; - --color-util-colors-warning-warning-700: #FEC84B; + --color-util-colors-warning-warning-50: #4e1d09; + --color-util-colors-warning-warning-100: #7a2e0e; + --color-util-colors-warning-warning-200: #93370d; + --color-util-colors-warning-warning-300: #b54708; + --color-util-colors-warning-warning-400: #dc6803; + --color-util-colors-warning-warning-500: #f79009; + --color-util-colors-warning-warning-600: #fdb022; + --color-util-colors-warning-warning-700: #fec84b; - --color-util-colors-yellow-yellow-50: #542C0D; - --color-util-colors-yellow-yellow-100: #713B12; - --color-util-colors-yellow-yellow-200: #854A0E; - --color-util-colors-yellow-yellow-300: #A15C07; - --color-util-colors-yellow-yellow-400: #CA8504; - --color-util-colors-yellow-yellow-500: #EAAA08; - --color-util-colors-yellow-yellow-600: #FAC515; - --color-util-colors-yellow-yellow-700: #FDE272; + --color-util-colors-yellow-yellow-50: #542c0d; + --color-util-colors-yellow-yellow-100: #713b12; + --color-util-colors-yellow-yellow-200: #854a0e; + --color-util-colors-yellow-yellow-300: #a15c07; + --color-util-colors-yellow-yellow-400: #ca8504; + --color-util-colors-yellow-yellow-500: #eaaa08; + --color-util-colors-yellow-yellow-600: #fac515; + --color-util-colors-yellow-yellow-700: #fde272; - --color-util-colors-teal-teal-50: #0A2926; - --color-util-colors-teal-teal-100: #134E48; - --color-util-colors-teal-teal-200: #125D56; + --color-util-colors-teal-teal-50: #0a2926; + --color-util-colors-teal-teal-100: #134e48; + --color-util-colors-teal-teal-200: #125d56; --color-util-colors-teal-teal-300: #107569; - --color-util-colors-teal-teal-400: #0E9384; - --color-util-colors-teal-teal-500: #15B79E; - --color-util-colors-teal-teal-600: #2ED3B7; - --color-util-colors-teal-teal-700: #5FE9D0; + --color-util-colors-teal-teal-400: #0e9384; + --color-util-colors-teal-teal-500: #15b79e; + --color-util-colors-teal-teal-600: #2ed3b7; + --color-util-colors-teal-teal-700: #5fe9d0; - --color-util-colors-cyan-cyan-50: #0D2D3A; - --color-util-colors-cyan-cyan-100: #164C63; - --color-util-colors-cyan-cyan-200: #155B75; - --color-util-colors-cyan-cyan-300: #0E7090; - --color-util-colors-cyan-cyan-400: #088AB2; - --color-util-colors-cyan-cyan-500: #06AED4; - --color-util-colors-cyan-cyan-600: #22CCEE; - --color-util-colors-cyan-cyan-700: #67E3F9; + --color-util-colors-cyan-cyan-50: #0d2d3a; + --color-util-colors-cyan-cyan-100: #164c63; + --color-util-colors-cyan-cyan-200: #155b75; + --color-util-colors-cyan-cyan-300: #0e7090; + --color-util-colors-cyan-cyan-400: #088ab2; + --color-util-colors-cyan-cyan-500: #06aed4; + --color-util-colors-cyan-cyan-600: #22ccee; + --color-util-colors-cyan-cyan-700: #67e3f9; - --color-util-colors-violet-violet-50: #2E125E; - --color-util-colors-violet-violet-100: #491C96; - --color-util-colors-violet-violet-200: #5720B7; - --color-util-colors-violet-violet-300: #6927DA; - --color-util-colors-violet-violet-400: #7839EE; - --color-util-colors-violet-violet-500: #875BF7; - --color-util-colors-violet-violet-600: #A48AFB; - --color-util-colors-violet-violet-700: #C3B5FD; + --color-util-colors-violet-violet-50: #2e125e; + --color-util-colors-violet-violet-100: #491c96; + --color-util-colors-violet-violet-200: #5720b7; + --color-util-colors-violet-violet-300: #6927da; + --color-util-colors-violet-violet-400: #7839ee; + --color-util-colors-violet-violet-500: #875bf7; + --color-util-colors-violet-violet-600: #a48afb; + --color-util-colors-violet-violet-700: #c3b5fd; - --color-util-colors-gray-gray-50: #0C111C; + --color-util-colors-gray-gray-50: #0c111c; --color-util-colors-gray-gray-100: #101828; - --color-util-colors-gray-gray-200: #18222F; + --color-util-colors-gray-gray-200: #18222f; --color-util-colors-gray-gray-300: #354052; --color-util-colors-gray-gray-400: #495464; - --color-util-colors-gray-gray-500: #676F83; - --color-util-colors-gray-gray-600: #98A2B2; - --color-util-colors-gray-gray-700: #D0D5DC; + --color-util-colors-gray-gray-500: #676f83; + --color-util-colors-gray-gray-600: #98a2b2; + --color-util-colors-gray-gray-700: #d0d5dc; - --color-util-colors-green-light-green-light-50: #15290A; - --color-util-colors-green-light-green-light-100: #2B5314; + --color-util-colors-green-light-green-light-50: #15290a; + --color-util-colors-green-light-green-light-100: #2b5314; --color-util-colors-green-light-green-light-200: #326212; - --color-util-colors-green-light-green-light-300: #3B7C0F; - --color-util-colors-green-light-green-light-500: #66C61C; - --color-util-colors-green-light-green-light-400: #4CA30D; - --color-util-colors-green-light-green-light-600: #85E13A; - --color-util-colors-green-light-green-light-700: #A6EF67; + --color-util-colors-green-light-green-light-300: #3b7c0f; + --color-util-colors-green-light-green-light-500: #66c61c; + --color-util-colors-green-light-green-light-400: #4ca30d; + --color-util-colors-green-light-green-light-600: #85e13a; + --color-util-colors-green-light-green-light-700: #a6ef67; - --color-util-colors-rose-rose-50: #510B24; - --color-util-colors-rose-rose-100: #89123E; - --color-util-colors-rose-rose-200: #A11043; - --color-util-colors-rose-rose-300: #C01048; - --color-util-colors-rose-rose-400: #E31B54; - --color-util-colors-rose-rose-500: #F63D68; - --color-util-colors-rose-rose-600: #FD6F8E; - --color-util-colors-rose-rose-700: #FEA3B4; + --color-util-colors-rose-rose-50: #510b24; + --color-util-colors-rose-rose-100: #89123e; + --color-util-colors-rose-rose-200: #a11043; + --color-util-colors-rose-rose-300: #c01048; + --color-util-colors-rose-rose-400: #e31b54; + --color-util-colors-rose-rose-500: #f63d68; + --color-util-colors-rose-rose-600: #fd6f8e; + --color-util-colors-rose-rose-700: #fea3b4; - --color-util-colors-midnight-midnight-50: #171C22; + --color-util-colors-midnight-midnight-50: #171c22; --color-util-colors-midnight-midnight-100: #202431; - --color-util-colors-midnight-midnight-200: #2F3648; - --color-util-colors-midnight-midnight-300: #3E465E; - --color-util-colors-midnight-midnight-400: #5D698D; - --color-util-colors-midnight-midnight-500: #828DAD; - --color-util-colors-midnight-midnight-600: #A7AEC5; - --color-util-colors-midnight-midnight-700: #C6CBD9; + --color-util-colors-midnight-midnight-200: #2f3648; + --color-util-colors-midnight-midnight-300: #3e465e; + --color-util-colors-midnight-midnight-400: #5d698d; + --color-util-colors-midnight-midnight-500: #828dad; + --color-util-colors-midnight-midnight-600: #a7aec5; + --color-util-colors-midnight-midnight-700: #c6cbd9; - --color-third-party-LangChain: #FFFFFF; - --color-third-party-Langfuse: #FFFFFF; - --color-third-party-Github: #FFFFFF; - --color-third-party-Github-tertiary: #C8CEDA99; - --color-third-party-Github-secondary: #D9D9DE; + --color-third-party-LangChain: #ffffff; + --color-third-party-Langfuse: #ffffff; + --color-third-party-Github: #ffffff; + --color-third-party-Github-tertiary: #c8ceda99; + --color-third-party-Github-secondary: #d9d9de; --color-third-party-model-bg-openai: #121212; - --color-third-party-model-bg-anthropic: #1D1917; - --color-third-party-model-bg-default: #0B0B0E; + --color-third-party-model-bg-anthropic: #1d1917; + --color-third-party-model-bg-default: #0b0b0e; - --color-third-party-aws: #141F2E; + --color-third-party-aws: #141f2e; --color-third-party-aws-alt: #192639; - --color-saas-background: #0B0B0E; - --color-saas-pricing-grid-bg: #C8CEDA33; + --color-saas-background: #0b0b0e; + --color-saas-pricing-grid-bg: #c8ceda33; } \ No newline at end of file diff --git a/web/themes/light.css b/web/themes/light.css index 6fb2a6b00c..9c0952433d 100644 --- a/web/themes/light.css +++ b/web/themes/light.css @@ -1,737 +1,739 @@ /* Attention: Generate by code. Don't update by hand!!! */ html[data-theme="light"] { - --color-components-input-bg-normal: #C8CEDA40; - --color-components-input-text-placeholder: #98A2B2; - --color-components-input-bg-hover: #C8CEDA24; - --color-components-input-bg-active: #F9FAFB; - --color-components-input-border-active: #D0D5DC; - --color-components-input-border-destructive: #FDA29B; + --color-components-input-bg-normal: #c8ceda40; + --color-components-input-text-placeholder: #98a2b2; + --color-components-input-bg-hover: #c8ceda24; + --color-components-input-bg-active: #f9fafb; + --color-components-input-border-active: #d0d5dc; + --color-components-input-border-destructive: #fda29b; --color-components-input-text-filled: #101828; - --color-components-input-bg-destructive: #FFFFFF; - --color-components-input-bg-disabled: #C8CEDA24; - --color-components-input-text-disabled: #D0D5DC; - --color-components-input-text-filled-disabled: #676F83; - --color-components-input-border-hover: #D0D5DC; - --color-components-input-border-active-prompt-1: #0BA5EC; - --color-components-input-border-active-prompt-2: #155AEF; + --color-components-input-bg-destructive: #ffffff; + --color-components-input-bg-disabled: #c8ceda24; + --color-components-input-text-disabled: #d0d5dc; + --color-components-input-text-filled-disabled: #676f83; + --color-components-input-border-hover: #d0d5dc; + --color-components-input-border-active-prompt-1: #0ba5ec; + --color-components-input-border-active-prompt-2: #155aef; - --color-components-kbd-bg-gray: #1018280A; - --color-components-kbd-bg-white: #FFFFFF1F; + --color-components-kbd-bg-gray: #1018280a; + --color-components-kbd-bg-white: #ffffff1f; - --color-components-tooltip-bg: #FFFFFFF2; + --color-components-tooltip-bg: #fffffff2; - --color-components-button-primary-text: #FFFFFF; - --color-components-button-primary-bg: #155AEF; - --color-components-button-primary-border: #1018280A; - --color-components-button-primary-bg-hover: #004AEB; + --color-components-button-primary-text: #ffffff; + --color-components-button-primary-bg: #155aef; + --color-components-button-primary-border: #1018280a; + --color-components-button-primary-bg-hover: #004aeb; --color-components-button-primary-border-hover: #10182814; - --color-components-button-primary-bg-disabled: #155AEF24; - --color-components-button-primary-border-disabled: #FFFFFF00; - --color-components-button-primary-text-disabled: #FFFFFF99; + --color-components-button-primary-bg-disabled: #155aef24; + --color-components-button-primary-border-disabled: #ffffff00; + --color-components-button-primary-text-disabled: #ffffff99; --color-components-button-secondary-text: #354052; --color-components-button-secondary-text-disabled: #10182840; - --color-components-button-secondary-bg: #FFFFFF; - --color-components-button-secondary-bg-hover: #F9FAFB; - --color-components-button-secondary-bg-disabled: #F9FAFB; + --color-components-button-secondary-bg: #ffffff; + --color-components-button-secondary-bg-hover: #f9fafb; + --color-components-button-secondary-bg-disabled: #f9fafb; --color-components-button-secondary-border: #10182824; --color-components-button-secondary-border-hover: #10182833; - --color-components-button-secondary-border-disabled: #1018280A; + --color-components-button-secondary-border-disabled: #1018280a; --color-components-button-tertiary-text: #354052; --color-components-button-tertiary-text-disabled: #10182840; - --color-components-button-tertiary-bg: #F2F4F7; - --color-components-button-tertiary-bg-hover: #E9EBF0; - --color-components-button-tertiary-bg-disabled: #F9FAFB; + --color-components-button-tertiary-bg: #f2f4f7; + --color-components-button-tertiary-bg-hover: #e9ebf0; + --color-components-button-tertiary-bg-disabled: #f9fafb; --color-components-button-ghost-text: #354052; --color-components-button-ghost-text-disabled: #10182840; - --color-components-button-ghost-bg-hover: #C8CEDA33; + --color-components-button-ghost-bg-hover: #c8ceda33; - --color-components-button-destructive-primary-text: #FFFFFF; - --color-components-button-destructive-primary-text-disabled: #FFFFFF99; - --color-components-button-destructive-primary-bg: #D92D20; - --color-components-button-destructive-primary-bg-hover: #B42318; - --color-components-button-destructive-primary-bg-disabled: #FEE4E2; - --color-components-button-destructive-primary-border: #18181B0A; - --color-components-button-destructive-primary-border-hover: #18181B14; - --color-components-button-destructive-primary-border-disabled: #FFFFFF00; + --color-components-button-destructive-primary-text: #ffffff; + --color-components-button-destructive-primary-text-disabled: #ffffff99; + --color-components-button-destructive-primary-bg: #d92d20; + --color-components-button-destructive-primary-bg-hover: #b42318; + --color-components-button-destructive-primary-bg-disabled: #fee4e2; + --color-components-button-destructive-primary-border: #18181b0a; + --color-components-button-destructive-primary-border-hover: #18181b14; + --color-components-button-destructive-primary-border-disabled: #ffffff00; - --color-components-button-destructive-secondary-text: #D92D20; - --color-components-button-destructive-secondary-text-disabled: #F0443833; - --color-components-button-destructive-secondary-bg: #FFFFFF; - --color-components-button-destructive-secondary-bg-hover: #FEF3F2; - --color-components-button-destructive-secondary-bg-disabled: #FEF3F2; - --color-components-button-destructive-secondary-border: #18181B14; - --color-components-button-destructive-secondary-border-hover: #F0443840; - --color-components-button-destructive-secondary-border-disabled: #F044380A; + --color-components-button-destructive-secondary-text: #d92d20; + --color-components-button-destructive-secondary-text-disabled: #f0443833; + --color-components-button-destructive-secondary-bg: #ffffff; + --color-components-button-destructive-secondary-bg-hover: #fef3f2; + --color-components-button-destructive-secondary-bg-disabled: #fef3f2; + --color-components-button-destructive-secondary-border: #18181b14; + --color-components-button-destructive-secondary-border-hover: #f0443840; + --color-components-button-destructive-secondary-border-disabled: #f044380a; - --color-components-button-destructive-tertiary-text: #D92D20; - --color-components-button-destructive-tertiary-text-disabled: #F0443833; - --color-components-button-destructive-tertiary-bg: #FEE4E2; - --color-components-button-destructive-tertiary-bg-hover: #FECDCA; - --color-components-button-destructive-tertiary-bg-disabled: #F044380A; + --color-components-button-destructive-tertiary-text: #d92d20; + --color-components-button-destructive-tertiary-text-disabled: #f0443833; + --color-components-button-destructive-tertiary-bg: #fee4e2; + --color-components-button-destructive-tertiary-bg-hover: #fecdca; + --color-components-button-destructive-tertiary-bg-disabled: #f044380a; - --color-components-button-destructive-ghost-text: #D92D20; - --color-components-button-destructive-ghost-text-disabled: #F0443833; - --color-components-button-destructive-ghost-bg-hover: #FEE4E2; + --color-components-button-destructive-ghost-text: #d92d20; + --color-components-button-destructive-ghost-text-disabled: #f0443833; + --color-components-button-destructive-ghost-bg-hover: #fee4e2; - --color-components-button-secondary-accent-text: #155AEF; - --color-components-button-secondary-accent-text-disabled: #B2CAFF; - --color-components-button-secondary-accent-bg: #FFFFFF; - --color-components-button-secondary-accent-bg-hover: #F2F4F7; - --color-components-button-secondary-accent-bg-disabled: #F9FAFB; + --color-components-button-secondary-accent-text: #155aef; + --color-components-button-secondary-accent-text-disabled: #b2caff; + --color-components-button-secondary-accent-bg: #ffffff; + --color-components-button-secondary-accent-bg-hover: #f2f4f7; + --color-components-button-secondary-accent-bg-disabled: #f9fafb; --color-components-button-secondary-accent-border: #10182824; --color-components-button-secondary-accent-border-hover: #10182824; - --color-components-button-secondary-accent-border-disabled: #1018280A; + --color-components-button-secondary-accent-border-disabled: #1018280a; - --color-components-button-indigo-bg: #444CE7; - --color-components-button-indigo-bg-hover: #3538CD; - --color-components-button-indigo-bg-disabled: #6172F324; + --color-components-button-indigo-bg: #444ce7; + --color-components-button-indigo-bg-hover: #3538cd; + --color-components-button-indigo-bg-disabled: #6172f324; - --color-components-checkbox-icon: #FFFFFF; - --color-components-checkbox-icon-disabled: #FFFFFF80; - --color-components-checkbox-bg: #155AEF; - --color-components-checkbox-bg-hover: #004AEB; - --color-components-checkbox-bg-disabled: #F2F4F7; - --color-components-checkbox-border: #D0D5DC; - --color-components-checkbox-border-hover: #98A2B2; - --color-components-checkbox-border-disabled: #18181B0A; - --color-components-checkbox-bg-unchecked: #FFFFFF; - --color-components-checkbox-bg-unchecked-hover: #FFFFFF; - --color-components-checkbox-bg-disabled-checked: #B2CAFF; + --color-components-checkbox-icon: #ffffff; + --color-components-checkbox-icon-disabled: #ffffff80; + --color-components-checkbox-bg: #155aef; + --color-components-checkbox-bg-hover: #004aeb; + --color-components-checkbox-bg-disabled: #f2f4f7; + --color-components-checkbox-border: #d0d5dc; + --color-components-checkbox-border-hover: #98a2b2; + --color-components-checkbox-border-disabled: #18181b0a; + --color-components-checkbox-bg-unchecked: #ffffff; + --color-components-checkbox-bg-unchecked-hover: #ffffff; + --color-components-checkbox-bg-disabled-checked: #b2caff; - --color-components-radio-border-checked: #155AEF; - --color-components-radio-border-checked-hover: #004AEB; - --color-components-radio-border-checked-disabled: #B2CAFF; - --color-components-radio-bg-disabled: #FFFFFF00; - --color-components-radio-border: #D0D5DC; - --color-components-radio-border-hover: #98A2B2; - --color-components-radio-border-disabled: #18181B0A; - --color-components-radio-bg: #FFFFFF00; - --color-components-radio-bg-hover: #FFFFFF00; + --color-components-radio-border-checked: #155aef; + --color-components-radio-border-checked-hover: #004aeb; + --color-components-radio-border-checked-disabled: #b2caff; + --color-components-radio-bg-disabled: #ffffff00; + --color-components-radio-border: #d0d5dc; + --color-components-radio-border-hover: #98a2b2; + --color-components-radio-border-disabled: #18181b0a; + --color-components-radio-bg: #ffffff00; + --color-components-radio-bg-hover: #ffffff00; - --color-components-toggle-knob: #FFFFFF; - --color-components-toggle-knob-disabled: #FFFFFFF2; - --color-components-toggle-bg: #155AEF; - --color-components-toggle-bg-hover: #004AEB; - --color-components-toggle-bg-disabled: #D1E0FF; - --color-components-toggle-bg-unchecked: #E9EBF0; - --color-components-toggle-bg-unchecked-hover: #D0D5DC; - --color-components-toggle-bg-unchecked-disabled: #F2F4F7; - --color-components-toggle-knob-hover: #FFFFFF; + --color-components-toggle-knob: #ffffff; + --color-components-toggle-knob-disabled: #fffffff2; + --color-components-toggle-bg: #155aef; + --color-components-toggle-bg-hover: #004aeb; + --color-components-toggle-bg-disabled: #d1e0ff; + --color-components-toggle-bg-unchecked: #e9ebf0; + --color-components-toggle-bg-unchecked-hover: #d0d5dc; + --color-components-toggle-bg-unchecked-disabled: #f2f4f7; + --color-components-toggle-knob-hover: #ffffff; - --color-components-card-bg: #FCFCFD; - --color-components-card-border: #FFFFFF; - --color-components-card-bg-alt: #FFFFFF; + --color-components-card-bg: #fcfcfd; + --color-components-card-border: #ffffff; + --color-components-card-bg-alt: #ffffff; --color-components-menu-item-text: #495464; - --color-components-menu-item-text-active: #18222F; + --color-components-menu-item-text-active: #18222f; --color-components-menu-item-text-hover: #354052; - --color-components-menu-item-text-active-accent: #18222F; + --color-components-menu-item-text-active-accent: #18222f; - --color-components-panel-bg: #FFFFFF; - --color-components-panel-bg-blur: #FFFFFFF2; + --color-components-panel-bg: #ffffff; + --color-components-panel-bg-blur: #fffffff2; --color-components-panel-border: #10182814; --color-components-panel-border-subtle: #10182814; - --color-components-panel-gradient-2: #F9FAFB; - --color-components-panel-gradient-1: #FFFFFF; - --color-components-panel-bg-alt: #F9FAFB; - --color-components-panel-on-panel-item-bg: #FFFFFF; - --color-components-panel-on-panel-item-bg-hover: #F9FAFB; - --color-components-panel-on-panel-item-bg-alt: #F9FAFB; - --color-components-panel-on-panel-item-bg-transparent: #FFFFFFF2; - --color-components-panel-on-panel-item-bg-hover-transparent: #F9FAFB00; - --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #FEF3F200; + --color-components-panel-gradient-2: #f9fafb; + --color-components-panel-gradient-1: #ffffff; + --color-components-panel-bg-alt: #f9fafb; + --color-components-panel-on-panel-item-bg: #ffffff; + --color-components-panel-on-panel-item-bg-hover: #f9fafb; + --color-components-panel-on-panel-item-bg-alt: #f9fafb; + --color-components-panel-on-panel-item-bg-transparent: #fffffff2; + --color-components-panel-on-panel-item-bg-hover-transparent: #f9fafb00; + --color-components-panel-on-panel-item-bg-destructive-hover-transparent: #fef3f200; - --color-components-panel-bg-transparent: #FFFFFF00; + --color-components-panel-bg-transparent: #ffffff00; --color-components-main-nav-nav-button-text: #495464; - --color-components-main-nav-nav-button-text-active: #155AEF; - --color-components-main-nav-nav-button-bg: #FFFFFF00; - --color-components-main-nav-nav-button-bg-active: #FCFCFD; - --color-components-main-nav-nav-button-border: #FFFFFFF2; - --color-components-main-nav-nav-button-bg-hover: #1018280A; + --color-components-main-nav-nav-button-text-active: #155aef; + --color-components-main-nav-nav-button-bg: #ffffff00; + --color-components-main-nav-nav-button-bg-active: #fcfcfd; + --color-components-main-nav-nav-button-border: #fffffff2; + --color-components-main-nav-nav-button-bg-hover: #1018280a; - --color-components-main-nav-nav-user-border: #FFFFFF; + --color-components-main-nav-nav-user-border: #ffffff; - --color-components-slider-knob: #FFFFFF; - --color-components-slider-knob-hover: #FFFFFF; - --color-components-slider-knob-disabled: #FFFFFFF2; - --color-components-slider-range: #296DFF; - --color-components-slider-track: #E9EBF0; + --color-components-slider-knob: #ffffff; + --color-components-slider-knob-hover: #ffffff; + --color-components-slider-knob-disabled: #fffffff2; + --color-components-slider-range: #296dff; + --color-components-slider-track: #e9ebf0; --color-components-slider-knob-border-hover: #10182833; --color-components-slider-knob-border: #10182824; - --color-components-segmented-control-item-active-bg: #FFFFFF; - --color-components-segmented-control-item-active-border: #FFFFFF; - --color-components-segmented-control-bg-normal: #C8CEDA33; - --color-components-segmented-control-item-active-accent-bg: #FFFFFF; - --color-components-segmented-control-item-active-accent-border: #FFFFFF; + --color-components-segmented-control-item-active-bg: #ffffff; + --color-components-segmented-control-item-active-border: #ffffff; + --color-components-segmented-control-bg-normal: #c8ceda33; + --color-components-segmented-control-item-active-accent-bg: #ffffff; + --color-components-segmented-control-item-active-accent-border: #ffffff; - --color-components-option-card-option-bg: #FCFCFD; - --color-components-option-card-option-selected-bg: #FFFFFF; - --color-components-option-card-option-selected-border: #296DFF; - --color-components-option-card-option-border: #E9EBF0; - --color-components-option-card-option-bg-hover: #FFFFFF; - --color-components-option-card-option-border-hover: #D0D5DC; + --color-components-option-card-option-bg: #fcfcfd; + --color-components-option-card-option-selected-bg: #ffffff; + --color-components-option-card-option-selected-border: #296dff; + --color-components-option-card-option-border: #e9ebf0; + --color-components-option-card-option-bg-hover: #ffffff; + --color-components-option-card-option-border-hover: #d0d5dc; - --color-components-tab-active: #155AEF; + --color-components-tab-active: #155aef; - --color-components-badge-white-to-dark: #FFFFFF; - --color-components-badge-status-light-success-bg: #47CD89; - --color-components-badge-status-light-success-border-inner: #17B26A; - --color-components-badge-status-light-success-halo: #17B26A40; + --color-components-badge-white-to-dark: #ffffff; + --color-components-badge-status-light-success-bg: #47cd89; + --color-components-badge-status-light-success-border-inner: #17b26a; + --color-components-badge-status-light-success-halo: #17b26a40; - --color-components-badge-status-light-border-outer: #FFFFFF; - --color-components-badge-status-light-high-light: #FFFFFF4D; - --color-components-badge-status-light-warning-bg: #FDB022; - --color-components-badge-status-light-warning-border-inner: #F79009; - --color-components-badge-status-light-warning-halo: #F7900940; + --color-components-badge-status-light-border-outer: #ffffff; + --color-components-badge-status-light-high-light: #ffffff4d; + --color-components-badge-status-light-warning-bg: #fdb022; + --color-components-badge-status-light-warning-border-inner: #f79009; + --color-components-badge-status-light-warning-halo: #f7900940; - --color-components-badge-status-light-error-bg: #F97066; - --color-components-badge-status-light-error-border-inner: #F04438; - --color-components-badge-status-light-error-halo: #F0443840; + --color-components-badge-status-light-error-bg: #f97066; + --color-components-badge-status-light-error-border-inner: #f04438; + --color-components-badge-status-light-error-halo: #f0443840; - --color-components-badge-status-light-normal-bg: #36BFFA; - --color-components-badge-status-light-normal-border-inner: #0BA5EC; - --color-components-badge-status-light-normal-halo: #0BA5EC40; + --color-components-badge-status-light-normal-bg: #36bffa; + --color-components-badge-status-light-normal-border-inner: #0ba5ec; + --color-components-badge-status-light-normal-halo: #0ba5ec40; - --color-components-badge-status-light-disabled-bg: #98A2B2; - --color-components-badge-status-light-disabled-border-inner: #676F83; - --color-components-badge-status-light-disabled-halo: #1018280A; + --color-components-badge-status-light-disabled-bg: #98a2b2; + --color-components-badge-status-light-disabled-border-inner: #676f83; + --color-components-badge-status-light-disabled-halo: #1018280a; - --color-components-badge-bg-green-soft: #17B26A14; - --color-components-badge-bg-orange-soft: #F7900914; - --color-components-badge-bg-red-soft: #F0443814; - --color-components-badge-bg-blue-light-soft: #0BA5EC14; - --color-components-badge-bg-gray-soft: #1018280A; + --color-components-badge-bg-green-soft: #17b26a14; + --color-components-badge-bg-orange-soft: #f7900914; + --color-components-badge-bg-red-soft: #f0443814; + --color-components-badge-bg-blue-light-soft: #0ba5ec14; + --color-components-badge-bg-gray-soft: #1018280a; + --color-components-badge-bg-dimm: #ffffff0d; - --color-components-chart-line: #296DFF; - --color-components-chart-area-1: #155AEF24; - --color-components-chart-area-2: #155AEF0A; - --color-components-chart-current-1: #155AEF; - --color-components-chart-current-2: #D1E0FF; - --color-components-chart-bg: #FFFFFF; + --color-components-chart-line: #296dff; + --color-components-chart-area-1: #155aef24; + --color-components-chart-area-2: #155aef0a; + --color-components-chart-current-1: #155aef; + --color-components-chart-current-2: #d1e0ff; + --color-components-chart-bg: #ffffff; - --color-components-actionbar-bg: #FFFFFFF2; - --color-components-actionbar-border: #1018280A; - --color-components-actionbar-bg-accent: #F5F7FF; - --color-components-actionbar-border-accent: #B2CAFF; + --color-components-actionbar-bg: #fffffff2; + --color-components-actionbar-border: #1018280a; + --color-components-actionbar-bg-accent: #f5f7ff; + --color-components-actionbar-border-accent: #b2caff; - --color-components-dropzone-bg-alt: #F2F4F7; - --color-components-dropzone-bg: #F9FAFB; - --color-components-dropzone-bg-accent: #155AEF24; + --color-components-dropzone-bg-alt: #f2f4f7; + --color-components-dropzone-bg: #f9fafb; + --color-components-dropzone-bg-accent: #155aef24; --color-components-dropzone-border: #10182814; --color-components-dropzone-border-alt: #10182833; - --color-components-dropzone-border-accent: #84ABFF; + --color-components-dropzone-border-accent: #84abff; - --color-components-progress-brand-progress: #296DFF; - --color-components-progress-brand-border: #296DFF; - --color-components-progress-brand-bg: #155AEF0A; + --color-components-progress-brand-progress: #296dff; + --color-components-progress-brand-border: #296dff; + --color-components-progress-brand-bg: #155aef0a; - --color-components-progress-white-progress: #FFFFFF; - --color-components-progress-white-border: #FFFFFFF2; - --color-components-progress-white-bg: #FFFFFF03; + --color-components-progress-white-progress: #ffffff; + --color-components-progress-white-border: #fffffff2; + --color-components-progress-white-bg: #ffffff03; - --color-components-progress-gray-progress: #98A2B2; - --color-components-progress-gray-border: #98A2B2; - --color-components-progress-gray-bg: #C8CEDA05; + --color-components-progress-gray-progress: #98a2b2; + --color-components-progress-gray-border: #98a2b2; + --color-components-progress-gray-bg: #c8ceda05; - --color-components-progress-warning-progress: #F79009; - --color-components-progress-warning-border: #F79009; - --color-components-progress-warning-bg: #F790090A; + --color-components-progress-warning-progress: #f79009; + --color-components-progress-warning-border: #f79009; + --color-components-progress-warning-bg: #f790090a; - --color-components-progress-error-progress: #F04438; - --color-components-progress-error-border: #F04438; - --color-components-progress-error-bg: #F044380A; + --color-components-progress-error-progress: #f04438; + --color-components-progress-error-border: #f04438; + --color-components-progress-error-bg: #f044380a; - --color-components-chat-input-audio-bg: #EFF4FF; - --color-components-chat-input-audio-wave-default: #155AEF33; - --color-components-chat-input-bg-mask-1: #FFFFFF03; - --color-components-chat-input-bg-mask-2: #F2F4F7; - --color-components-chat-input-border: #FFFFFF; - --color-components-chat-input-audio-wave-active: #296DFF; - --color-components-chat-input-audio-bg-alt: #FCFCFD; + --color-components-chat-input-audio-bg: #eff4ff; + --color-components-chat-input-audio-wave-default: #155aef33; + --color-components-chat-input-bg-mask-1: #ffffff03; + --color-components-chat-input-bg-mask-2: #f2f4f7; + --color-components-chat-input-border: #ffffff; + --color-components-chat-input-audio-wave-active: #296dff; + --color-components-chat-input-audio-bg-alt: #fcfcfd; - --color-components-avatar-shape-fill-stop-0: #FFFFFF; - --color-components-avatar-shape-fill-stop-100: #FFFFFFE5; + --color-components-avatar-shape-fill-stop-0: #ffffff; + --color-components-avatar-shape-fill-stop-100: #ffffffe6; - --color-components-avatar-bg-mask-stop-0: #FFFFFF1F; - --color-components-avatar-bg-mask-stop-100: #FFFFFF14; + --color-components-avatar-bg-mask-stop-0: #ffffff1f; + --color-components-avatar-bg-mask-stop-100: #ffffff14; - --color-components-avatar-default-avatar-bg: #D0D5DC; - --color-components-avatar-mask-darkmode-dimmed: #FFFFFF00; + --color-components-avatar-default-avatar-bg: #d0d5dc; + --color-components-avatar-mask-darkmode-dimmed: #ffffff00; - --color-components-label-gray: #F2F4F7; + --color-components-label-gray: #f2f4f7; - --color-components-premium-badge-blue-bg-stop-0: #5289FF; - --color-components-premium-badge-blue-bg-stop-100: #155AEF; - --color-components-premium-badge-blue-stroke-stop-0: #FFFFFFF2; - --color-components-premium-badge-blue-stroke-stop-100: #155AEF; - --color-components-premium-badge-blue-text-stop-0: #F5F7FF; - --color-components-premium-badge-blue-text-stop-100: #D1E0FF; - --color-components-premium-badge-blue-glow: #00329E; - --color-components-premium-badge-blue-bg-stop-0-hover: #296DFF; - --color-components-premium-badge-blue-bg-stop-100-hover: #004AEB; - --color-components-premium-badge-blue-glow-hover: #84ABFF; - --color-components-premium-badge-blue-stroke-stop-0-hover: #FFFFFFF2; - --color-components-premium-badge-blue-stroke-stop-100-hover: #00329E; + --color-components-premium-badge-blue-bg-stop-0: #5289ff; + --color-components-premium-badge-blue-bg-stop-100: #155aef; + --color-components-premium-badge-blue-stroke-stop-0: #fffffff2; + --color-components-premium-badge-blue-stroke-stop-100: #155aef; + --color-components-premium-badge-blue-text-stop-0: #f5f7ff; + --color-components-premium-badge-blue-text-stop-100: #d1e0ff; + --color-components-premium-badge-blue-glow: #00329e; + --color-components-premium-badge-blue-bg-stop-0-hover: #296dff; + --color-components-premium-badge-blue-bg-stop-100-hover: #004aeb; + --color-components-premium-badge-blue-glow-hover: #84abff; + --color-components-premium-badge-blue-stroke-stop-0-hover: #fffffff2; + --color-components-premium-badge-blue-stroke-stop-100-hover: #00329e; - --color-components-premium-badge-highlight-stop-0: #FFFFFF1F; - --color-components-premium-badge-highlight-stop-100: #FFFFFF4D; - --color-components-premium-badge-indigo-bg-stop-0: #8098F9; - --color-components-premium-badge-indigo-bg-stop-100: #444CE7; - --color-components-premium-badge-indigo-stroke-stop-0: #FFFFFFF2; - --color-components-premium-badge-indigo-stroke-stop-100: #6172F3; - --color-components-premium-badge-indigo-text-stop-0: #F5F8FF; - --color-components-premium-badge-indigo-text-stop-100: #E0EAFF; - --color-components-premium-badge-indigo-glow: #2D3282; - --color-components-premium-badge-indigo-glow-hover: #A4BCFD; - --color-components-premium-badge-indigo-bg-stop-0-hover: #6172F3; - --color-components-premium-badge-indigo-bg-stop-100-hover: #2D31A6; - --color-components-premium-badge-indigo-stroke-stop-0-hover: #FFFFFFF2; - --color-components-premium-badge-indigo-stroke-stop-100-hover: #2D31A6; + --color-components-premium-badge-highlight-stop-0: #ffffff1f; + --color-components-premium-badge-highlight-stop-100: #ffffff4d; + --color-components-premium-badge-indigo-bg-stop-0: #8098f9; + --color-components-premium-badge-indigo-bg-stop-100: #444ce7; + --color-components-premium-badge-indigo-stroke-stop-0: #fffffff2; + --color-components-premium-badge-indigo-stroke-stop-100: #6172f3; + --color-components-premium-badge-indigo-text-stop-0: #f5f8ff; + --color-components-premium-badge-indigo-text-stop-100: #e0eaff; + --color-components-premium-badge-indigo-glow: #2d3282; + --color-components-premium-badge-indigo-glow-hover: #a4bcfd; + --color-components-premium-badge-indigo-bg-stop-0-hover: #6172f3; + --color-components-premium-badge-indigo-bg-stop-100-hover: #2d31a6; + --color-components-premium-badge-indigo-stroke-stop-0-hover: #fffffff2; + --color-components-premium-badge-indigo-stroke-stop-100-hover: #2d31a6; - --color-components-premium-badge-grey-bg-stop-0: #98A2B2; - --color-components-premium-badge-grey-bg-stop-100: #676F83; - --color-components-premium-badge-grey-stroke-stop-0: #FFFFFFF2; - --color-components-premium-badge-grey-stroke-stop-100: #676F83; - --color-components-premium-badge-grey-text-stop-0: #FCFCFD; - --color-components-premium-badge-grey-text-stop-100: #F2F4F7; + --color-components-premium-badge-grey-bg-stop-0: #98a2b2; + --color-components-premium-badge-grey-bg-stop-100: #676f83; + --color-components-premium-badge-grey-stroke-stop-0: #fffffff2; + --color-components-premium-badge-grey-stroke-stop-100: #676f83; + --color-components-premium-badge-grey-text-stop-0: #fcfcfd; + --color-components-premium-badge-grey-text-stop-100: #f2f4f7; --color-components-premium-badge-grey-glow: #101828; - --color-components-premium-badge-grey-glow-hover: #D0D5DC; - --color-components-premium-badge-grey-bg-stop-0-hover: #676F83; + --color-components-premium-badge-grey-glow-hover: #d0d5dc; + --color-components-premium-badge-grey-bg-stop-0-hover: #676f83; --color-components-premium-badge-grey-bg-stop-100-hover: #354052; - --color-components-premium-badge-grey-stroke-stop-0-hover: #FFFFFFF2; + --color-components-premium-badge-grey-stroke-stop-0-hover: #fffffff2; --color-components-premium-badge-grey-stroke-stop-100-hover: #354052; - --color-components-premium-badge-orange-bg-stop-0: #FF692E; - --color-components-premium-badge-orange-bg-stop-100: #E04F16; - --color-components-premium-badge-orange-stroke-stop-0: #FFFFFFF2; - --color-components-premium-badge-orange-stroke-stop-100: #E62E05; - --color-components-premium-badge-orange-text-stop-0: #FEFAF5; - --color-components-premium-badge-orange-text-stop-100: #FDEAD7; + --color-components-premium-badge-orange-bg-stop-0: #ff692e; + --color-components-premium-badge-orange-bg-stop-100: #e04f16; + --color-components-premium-badge-orange-stroke-stop-0: #fffffff2; + --color-components-premium-badge-orange-stroke-stop-100: #e62e05; + --color-components-premium-badge-orange-text-stop-0: #fefaf5; + --color-components-premium-badge-orange-text-stop-100: #fdead7; --color-components-premium-badge-orange-glow: #772917; - --color-components-premium-badge-orange-glow-hover: #F7B27A; - --color-components-premium-badge-orange-bg-stop-0-hover: #FF4405; - --color-components-premium-badge-orange-bg-stop-100-hover: #B93815; - --color-components-premium-badge-orange-stroke-stop-0-hover: #FFFFFFF2; - --color-components-premium-badge-orange-stroke-stop-100-hover: #BC1B06; + --color-components-premium-badge-orange-glow-hover: #f7b27a; + --color-components-premium-badge-orange-bg-stop-0-hover: #ff4405; + --color-components-premium-badge-orange-bg-stop-100-hover: #b93815; + --color-components-premium-badge-orange-stroke-stop-0-hover: #fffffff2; + --color-components-premium-badge-orange-stroke-stop-100-hover: #bc1b06; - --color-components-progress-bar-bg: #155AEF0A; - --color-components-progress-bar-progress: #155AEF24; - --color-components-progress-bar-border: #1018280A; - --color-components-progress-bar-progress-solid: #296DFF; - --color-components-progress-bar-progress-highlight: #155AEF33; + --color-components-progress-bar-bg: #155aef0a; + --color-components-progress-bar-progress: #155aef24; + --color-components-progress-bar-border: #1018280a; + --color-components-progress-bar-progress-solid: #296dff; + --color-components-progress-bar-progress-highlight: #155aef33; - --color-components-icon-bg-red-solid: #D92D20; - --color-components-icon-bg-rose-solid: #E31B54; - --color-components-icon-bg-pink-solid: #DD2590; - --color-components-icon-bg-orange-dark-solid: #FF4405; - --color-components-icon-bg-yellow-solid: #EAAA08; - --color-components-icon-bg-green-solid: #4CA30D; - --color-components-icon-bg-teal-solid: #0E9384; - --color-components-icon-bg-blue-light-solid: #0BA5EC; - --color-components-icon-bg-blue-solid: #155AEF; - --color-components-icon-bg-indigo-solid: #444CE7; - --color-components-icon-bg-violet-solid: #7839EE; - --color-components-icon-bg-midnight-solid: #828DAD; - --color-components-icon-bg-rose-soft: #FFF1F3; - --color-components-icon-bg-pink-soft: #FDF2FA; - --color-components-icon-bg-orange-dark-soft: #FFF4ED; - --color-components-icon-bg-yellow-soft: #FEFBE8; - --color-components-icon-bg-green-soft: #F3FEE7; - --color-components-icon-bg-teal-soft: #F0FDF9; - --color-components-icon-bg-blue-light-soft: #F0F9FF; - --color-components-icon-bg-blue-soft: #EFF4FF; - --color-components-icon-bg-indigo-soft: #EEF4FF; - --color-components-icon-bg-violet-soft: #F5F3FF; - --color-components-icon-bg-midnight-soft: #F0F2F5; - --color-components-icon-bg-red-soft: #FEF3F2; - --color-components-icon-bg-orange-solid: #F79009; - --color-components-icon-bg-orange-soft: #FFFAEB; + --color-components-icon-bg-red-solid: #d92d20; + --color-components-icon-bg-rose-solid: #e31b54; + --color-components-icon-bg-pink-solid: #dd2590; + --color-components-icon-bg-orange-dark-solid: #ff4405; + --color-components-icon-bg-yellow-solid: #eaaa08; + --color-components-icon-bg-green-solid: #4ca30d; + --color-components-icon-bg-teal-solid: #0e9384; + --color-components-icon-bg-blue-light-solid: #0ba5ec; + --color-components-icon-bg-blue-solid: #155aef; + --color-components-icon-bg-indigo-solid: #444ce7; + --color-components-icon-bg-violet-solid: #7839ee; + --color-components-icon-bg-midnight-solid: #828dad; + --color-components-icon-bg-rose-soft: #fff1f3; + --color-components-icon-bg-pink-soft: #fdf2fa; + --color-components-icon-bg-orange-dark-soft: #fff4ed; + --color-components-icon-bg-yellow-soft: #fefbe8; + --color-components-icon-bg-green-soft: #f3fee7; + --color-components-icon-bg-teal-soft: #f0fdf9; + --color-components-icon-bg-blue-light-soft: #f0f9ff; + --color-components-icon-bg-blue-soft: #eff4ff; + --color-components-icon-bg-indigo-soft: #eef4ff; + --color-components-icon-bg-violet-soft: #f5f3ff; + --color-components-icon-bg-midnight-soft: #f0f2f5; + --color-components-icon-bg-red-soft: #fef3f2; + --color-components-icon-bg-orange-solid: #f79009; + --color-components-icon-bg-orange-soft: #fffaeb; --color-text-primary: #101828; --color-text-secondary: #354052; - --color-text-tertiary: #676F83; - --color-text-quaternary: #1018284D; - --color-text-destructive: #D92D20; + --color-text-tertiary: #676f83; + --color-text-quaternary: #1018284d; + --color-text-destructive: #d92d20; --color-text-success: #079455; - --color-text-warning: #DC6803; - --color-text-destructive-secondary: #F04438; - --color-text-success-secondary: #17B26A; - --color-text-warning-secondary: #F79009; - --color-text-accent: #155AEF; - --color-text-primary-on-surface: #FFFFFF; - --color-text-placeholder: #98A2B2; - --color-text-disabled: #D0D5DC; - --color-text-accent-secondary: #296DFF; - --color-text-accent-light-mode-only: #155AEF; - --color-text-text-selected: #155AEF24; - --color-text-secondary-on-surface: #FFFFFFE5; - --color-text-logo-text: #18222F; - --color-text-empty-state-icon: #D0D5DC; + --color-text-warning: #dc6803; + --color-text-destructive-secondary: #f04438; + --color-text-success-secondary: #17b26a; + --color-text-warning-secondary: #f79009; + --color-text-accent: #155aef; + --color-text-primary-on-surface: #ffffff; + --color-text-placeholder: #98a2b2; + --color-text-disabled: #d0d5dc; + --color-text-accent-secondary: #296dff; + --color-text-accent-light-mode-only: #155aef; + --color-text-text-selected: #155aef24; + --color-text-secondary-on-surface: #ffffffe6; + --color-text-logo-text: #18222f; + --color-text-empty-state-icon: #d0d5dc; --color-text-inverted: #000000; - --color-text-inverted-dimmed: #000000F2; + --color-text-inverted-dimmed: #000000f2; - --color-background-body: #F2F4F7; - --color-background-default-subtle: #FCFCFD; - --color-background-neutral-subtle: #F9FAFB; - --color-background-sidenav-bg: #FFFFFFCC; - --color-background-default: #FFFFFF; - --color-background-soft: #F9FAFB; - --color-background-gradient-bg-fill-chat-bg-1: #F9FAFB; - --color-background-gradient-bg-fill-chat-bg-2: #F2F4F7; - --color-background-gradient-bg-fill-chat-bubble-bg-1: #FFFFFF; - --color-background-gradient-bg-fill-chat-bubble-bg-2: #FFFFFF99; - --color-background-gradient-bg-fill-debug-bg-1: #FFFFFF00; - --color-background-gradient-bg-fill-debug-bg-2: #C8CEDA24; + --color-background-body: #f2f4f7; + --color-background-default-subtle: #fcfcfd; + --color-background-neutral-subtle: #f9fafb; + --color-background-sidenav-bg: #ffffffcc; + --color-background-default: #ffffff; + --color-background-soft: #f9fafb; + --color-background-gradient-bg-fill-chat-bg-1: #f9fafb; + --color-background-gradient-bg-fill-chat-bg-2: #f2f4f7; + --color-background-gradient-bg-fill-chat-bubble-bg-1: #ffffff; + --color-background-gradient-bg-fill-chat-bubble-bg-2: #ffffff99; + --color-background-gradient-bg-fill-debug-bg-1: #ffffff00; + --color-background-gradient-bg-fill-debug-bg-2: #c8ceda24; - --color-background-gradient-mask-gray: #C8CEDA33; - --color-background-gradient-mask-transparent: #FFFFFF00; - --color-background-gradient-mask-input-clear-2: #E9EBF000; - --color-background-gradient-mask-input-clear-1: #E9EBF0; + --color-background-gradient-mask-gray: #c8ceda33; + --color-background-gradient-mask-transparent: #ffffff00; + --color-background-gradient-mask-input-clear-2: #e9ebf000; + --color-background-gradient-mask-input-clear-1: #e9ebf0; --color-background-gradient-mask-transparent-dark: #00000000; - --color-background-gradient-mask-side-panel-2: #1018284D; + --color-background-gradient-mask-side-panel-2: #1018284d; --color-background-gradient-mask-side-panel-1: #10182805; - --color-background-default-burn: #E9EBF0; - --color-background-overlay-fullscreen: #F9FAFBF2; - --color-background-default-lighter: #FFFFFF80; - --color-background-section: #F9FAFB; - --color-background-interaction-from-bg-1: #C8CEDA33; - --color-background-interaction-from-bg-2: #C8CEDA24; - --color-background-section-burn: #F2F4F7; - --color-background-default-dodge: #FFFFFF; + --color-background-default-burn: #e9ebf0; + --color-background-overlay-fullscreen: #f9fafbf2; + --color-background-default-lighter: #ffffff80; + --color-background-section: #f9fafb; + --color-background-interaction-from-bg-1: #c8ceda33; + --color-background-interaction-from-bg-2: #c8ceda24; + --color-background-section-burn: #f2f4f7; + --color-background-default-dodge: #ffffff; --color-background-overlay: #10182899; - --color-background-default-dimmed: #E9EBF0; - --color-background-default-hover: #F9FAFB; + --color-background-default-dimmed: #e9ebf0; + --color-background-default-hover: #f9fafb; --color-background-overlay-alt: #10182866; - --color-background-surface-white: #FFFFFFF2; - --color-background-overlay-destructive: #F044384D; - --color-background-overlay-backdrop: #F2F4F7F2; + --color-background-surface-white: #fffffff2; + --color-background-overlay-destructive: #f044384d; + --color-background-overlay-backdrop: #f2f4f7f2; - --color-shadow-shadow-1: #09090B08; - --color-shadow-shadow-3: #09090B0D; - --color-shadow-shadow-4: #09090B0F; - --color-shadow-shadow-5: #09090B14; - --color-shadow-shadow-6: #09090B1A; - --color-shadow-shadow-7: #09090B1F; - --color-shadow-shadow-8: #09090B24; - --color-shadow-shadow-9: #09090B2E; - --color-shadow-shadow-2: #09090B0A; - --color-shadow-shadow-10: #09090B0D; + --color-shadow-shadow-1: #09090b08; + --color-shadow-shadow-3: #09090b0d; + --color-shadow-shadow-4: #09090b0f; + --color-shadow-shadow-5: #09090b14; + --color-shadow-shadow-6: #09090b1a; + --color-shadow-shadow-7: #09090b1f; + --color-shadow-shadow-8: #09090b24; + --color-shadow-shadow-9: #09090b2e; + --color-shadow-shadow-2: #09090b0a; + --color-shadow-shadow-10: #09090b0d; - --color-workflow-block-border: #FFFFFF; - --color-workflow-block-parma-bg: #F2F4F7; - --color-workflow-block-bg: #FCFCFD; - --color-workflow-block-bg-transparent: #FCFCFDE5; - --color-workflow-block-border-highlight: #155AEF24; + --color-workflow-block-border: #ffffff; + --color-workflow-block-parma-bg: #f2f4f7; + --color-workflow-block-bg: #fcfcfd; + --color-workflow-block-bg-transparent: #fcfcfde6; + --color-workflow-block-border-highlight: #155aef24; - --color-workflow-canvas-workflow-dot-color: #8585AD26; - --color-workflow-canvas-workflow-bg: #F2F4F7; + --color-workflow-canvas-workflow-dot-color: #8585ad26; + --color-workflow-canvas-workflow-bg: #f2f4f7; - --color-workflow-link-line-active: #296DFF; - --color-workflow-link-line-normal: #D0D5DC; - --color-workflow-link-line-handle: #296DFF; - --color-workflow-link-line-normal-transparent: #D0D5DC33; - --color-workflow-link-line-failure-active: #F79009; - --color-workflow-link-line-failure-handle: #F79009; - --color-workflow-link-line-failure-button-bg: #DC6803; - --color-workflow-link-line-failure-button-hover: #B54708; + --color-workflow-link-line-active: #296dff; + --color-workflow-link-line-normal: #d0d5dc; + --color-workflow-link-line-handle: #296dff; + --color-workflow-link-line-normal-transparent: #d0d5dc33; + --color-workflow-link-line-failure-active: #f79009; + --color-workflow-link-line-failure-handle: #f79009; + --color-workflow-link-line-failure-button-bg: #dc6803; + --color-workflow-link-line-failure-button-hover: #b54708; - --color-workflow-link-line-success-active: #17B26A; - --color-workflow-link-line-success-handle: #17B26A; + --color-workflow-link-line-success-active: #17b26a; + --color-workflow-link-line-success-handle: #17b26a; - --color-workflow-link-line-error-active: #F04438; - --color-workflow-link-line-error-handle: #F04438; + --color-workflow-link-line-error-active: #f04438; + --color-workflow-link-line-error-handle: #f04438; - --color-workflow-minimap-bg: #E9EBF0; - --color-workflow-minimap-block: #C8CEDA4D; + --color-workflow-minimap-bg: #e9ebf0; + --color-workflow-minimap-block: #c8ceda4d; - --color-workflow-display-success-bg: #ECFDF3; - --color-workflow-display-success-border-1: #17B26ACC; - --color-workflow-display-success-border-2: #17B26A80; - --color-workflow-display-success-vignette-color: #17B26A33; - --color-workflow-display-success-bg-line-pattern: #17B26A4D; + --color-workflow-display-success-bg: #ecfdf3; + --color-workflow-display-success-border-1: #17b26acc; + --color-workflow-display-success-border-2: #17b26a80; + --color-workflow-display-success-vignette-color: #17b26a33; + --color-workflow-display-success-bg-line-pattern: #17b26a4d; - --color-workflow-display-glass-1: #FFFFFF1F; - --color-workflow-display-glass-2: #FFFFFF80; - --color-workflow-display-vignette-dark: #0000001F; - --color-workflow-display-highlight: #FFFFFF80; - --color-workflow-display-outline: #0000000D; - --color-workflow-display-error-bg: #FEF3F2; - --color-workflow-display-error-bg-line-pattern: #F044384D; - --color-workflow-display-error-border-1: #F04438CC; - --color-workflow-display-error-border-2: #F0443880; - --color-workflow-display-error-vignette-color: #F0443833; + --color-workflow-display-glass-1: #ffffff1f; + --color-workflow-display-glass-2: #ffffff80; + --color-workflow-display-vignette-dark: #0000001f; + --color-workflow-display-highlight: #ffffff80; + --color-workflow-display-outline: #0000000d; + --color-workflow-display-error-bg: #fef3f2; + --color-workflow-display-error-bg-line-pattern: #f044384d; + --color-workflow-display-error-border-1: #f04438cc; + --color-workflow-display-error-border-2: #f0443880; + --color-workflow-display-error-vignette-color: #f0443833; - --color-workflow-display-warning-bg: #FFFAEB; - --color-workflow-display-warning-bg-line-pattern: #F790094D; - --color-workflow-display-warning-border-1: #F79009CC; - --color-workflow-display-warning-border-2: #F7900980; - --color-workflow-display-warning-vignette-color: #F7900933; + --color-workflow-display-warning-bg: #fffaeb; + --color-workflow-display-warning-bg-line-pattern: #f790094d; + --color-workflow-display-warning-border-1: #f79009cc; + --color-workflow-display-warning-border-2: #f7900980; + --color-workflow-display-warning-vignette-color: #f7900933; - --color-workflow-display-normal-bg: #F0F9FF; - --color-workflow-display-normal-bg-line-pattern: #0BA5EC4D; - --color-workflow-display-normal-border-1: #0BA5ECCC; - --color-workflow-display-normal-border-2: #0BA5EC80; - --color-workflow-display-normal-vignette-color: #0BA5EC33; + --color-workflow-display-normal-bg: #f0f9ff; + --color-workflow-display-normal-bg-line-pattern: #0ba5ec4d; + --color-workflow-display-normal-border-1: #0ba5eccc; + --color-workflow-display-normal-border-2: #0ba5ec80; + --color-workflow-display-normal-vignette-color: #0ba5ec33; - --color-workflow-display-disabled-bg: #F9FAFB; - --color-workflow-display-disabled-bg-line-pattern: #C8CEDA4D; - --color-workflow-display-disabled-border-1: #C8CEDA99; - --color-workflow-display-disabled-border-2: #C8CEDA66; - --color-workflow-display-disabled-vignette-color: #C8CEDA66; + --color-workflow-display-disabled-bg: #f9fafb; + --color-workflow-display-disabled-bg-line-pattern: #c8ceda4d; + --color-workflow-display-disabled-border-1: #c8ceda99; + --color-workflow-display-disabled-border-2: #c8ceda66; + --color-workflow-display-disabled-vignette-color: #c8ceda66; --color-workflow-display-disabled-outline: #00000000; - --color-workflow-workflow-progress-bg-1: #C8CEDA33; - --color-workflow-workflow-progress-bg-2: #C8CEDA0A; + --color-workflow-workflow-progress-bg-1: #c8ceda33; + --color-workflow-workflow-progress-bg-2: #c8ceda0a; - --color-divider-subtle: #1018280A; + --color-divider-subtle: #1018280a; --color-divider-regular: #10182814; --color-divider-deep: #10182824; - --color-divider-burn: #1018280A; - --color-divider-intense: #1018284D; - --color-divider-solid: #D0D5DC; - --color-divider-solid-alt: #98A2B2; + --color-divider-burn: #1018280a; + --color-divider-intense: #1018284d; + --color-divider-solid: #d0d5dc; + --color-divider-solid-alt: #98a2b2; - --color-state-base-hover: #C8CEDA33; - --color-state-base-active: #C8CEDA66; - --color-state-base-hover-alt: #C8CEDA66; + --color-state-base-hover: #c8ceda33; + --color-state-base-active: #c8ceda66; + --color-state-base-hover-alt: #c8ceda66; --color-state-base-handle: #10182833; - --color-state-base-handle-hover: #1018284D; + --color-state-base-handle-hover: #1018284d; + --color-state-base-hover-subtle: #c8ceda14; - --color-state-accent-hover: #EFF4FF; - --color-state-accent-active: #155AEF14; - --color-state-accent-hover-alt: #D1E0FF; - --color-state-accent-solid: #296DFF; - --color-state-accent-active-alt: #155AEF24; + --color-state-accent-hover: #eff4ff; + --color-state-accent-active: #155aef14; + --color-state-accent-hover-alt: #d1e0ff; + --color-state-accent-solid: #296dff; + --color-state-accent-active-alt: #155aef24; - --color-state-destructive-hover: #FEF3F2; - --color-state-destructive-hover-alt: #FEE4E2; - --color-state-destructive-active: #FECDCA; - --color-state-destructive-solid: #F04438; - --color-state-destructive-border: #FDA29B; + --color-state-destructive-hover: #fef3f2; + --color-state-destructive-hover-alt: #fee4e2; + --color-state-destructive-active: #fecdca; + --color-state-destructive-solid: #f04438; + --color-state-destructive-border: #fda29b; - --color-state-success-hover: #ECFDF3; - --color-state-success-hover-alt: #DCFAE6; - --color-state-success-active: #ABEFC6; - --color-state-success-solid: #17B26A; + --color-state-success-hover: #ecfdf3; + --color-state-success-hover-alt: #dcfae6; + --color-state-success-active: #abefc6; + --color-state-success-solid: #17b26a; - --color-state-warning-hover: #FFFAEB; - --color-state-warning-hover-alt: #FEF0C7; - --color-state-warning-active: #FEDF89; - --color-state-warning-solid: #F79009; + --color-state-warning-hover: #fffaeb; + --color-state-warning-hover-alt: #fef0c7; + --color-state-warning-active: #fedf89; + --color-state-warning-solid: #f79009; - --color-effects-highlight: #FFFFFF; - --color-effects-highlight-lightmode-off: #FFFFFF00; - --color-effects-image-frame: #FFFFFF; + --color-effects-highlight: #ffffff; + --color-effects-highlight-lightmode-off: #ffffff00; + --color-effects-image-frame: #ffffff; - --color-util-colors-orange-dark-orange-dark-50: #FFF4ED; - --color-util-colors-orange-dark-orange-dark-100: #FFE6D5; - --color-util-colors-orange-dark-orange-dark-200: #FFD6AE; - --color-util-colors-orange-dark-orange-dark-300: #FF9C66; - --color-util-colors-orange-dark-orange-dark-400: #FF692E; - --color-util-colors-orange-dark-orange-dark-500: #FF4405; - --color-util-colors-orange-dark-orange-dark-600: #E62E05; - --color-util-colors-orange-dark-orange-dark-700: #BC1B06; + --color-util-colors-orange-dark-orange-dark-50: #fff4ed; + --color-util-colors-orange-dark-orange-dark-100: #ffe6d5; + --color-util-colors-orange-dark-orange-dark-200: #ffd6ae; + --color-util-colors-orange-dark-orange-dark-300: #ff9c66; + --color-util-colors-orange-dark-orange-dark-400: #ff692e; + --color-util-colors-orange-dark-orange-dark-500: #ff4405; + --color-util-colors-orange-dark-orange-dark-600: #e62e05; + --color-util-colors-orange-dark-orange-dark-700: #bc1b06; - --color-util-colors-orange-orange-50: #FEF6EE; - --color-util-colors-orange-orange-100: #FDEAD7; - --color-util-colors-orange-orange-200: #F9DBAF; - --color-util-colors-orange-orange-300: #F7B27A; - --color-util-colors-orange-orange-400: #F38744; - --color-util-colors-orange-orange-500: #EF6820; - --color-util-colors-orange-orange-600: #E04F16; - --color-util-colors-orange-orange-700: #B93815; - --color-util-colors-orange-orange-100-transparent: #FDEAD700; + --color-util-colors-orange-orange-50: #fef6ee; + --color-util-colors-orange-orange-100: #fdead7; + --color-util-colors-orange-orange-200: #f9dbaf; + --color-util-colors-orange-orange-300: #f7b27a; + --color-util-colors-orange-orange-400: #f38744; + --color-util-colors-orange-orange-500: #ef6820; + --color-util-colors-orange-orange-600: #e04f16; + --color-util-colors-orange-orange-700: #b93815; + --color-util-colors-orange-orange-100-transparent: #fdead700; - --color-util-colors-pink-pink-50: #FDF2FA; - --color-util-colors-pink-pink-100: #FCE7F6; - --color-util-colors-pink-pink-200: #FCCEEE; - --color-util-colors-pink-pink-300: #FAA7E0; - --color-util-colors-pink-pink-400: #F670C7; - --color-util-colors-pink-pink-500: #EE46BC; - --color-util-colors-pink-pink-600: #DD2590; - --color-util-colors-pink-pink-700: #C11574; + --color-util-colors-pink-pink-50: #fdf2fa; + --color-util-colors-pink-pink-100: #fce7f6; + --color-util-colors-pink-pink-200: #fcceee; + --color-util-colors-pink-pink-300: #faa7e0; + --color-util-colors-pink-pink-400: #f670c7; + --color-util-colors-pink-pink-500: #ee46bc; + --color-util-colors-pink-pink-600: #dd2590; + --color-util-colors-pink-pink-700: #c11574; - --color-util-colors-fuchsia-fuchsia-50: #FDF4FF; - --color-util-colors-fuchsia-fuchsia-100: #FBE8FF; - --color-util-colors-fuchsia-fuchsia-200: #F6D0FE; - --color-util-colors-fuchsia-fuchsia-300: #EEAAFD; - --color-util-colors-fuchsia-fuchsia-400: #E478FA; - --color-util-colors-fuchsia-fuchsia-500: #D444F1; - --color-util-colors-fuchsia-fuchsia-600: #BA24D5; - --color-util-colors-fuchsia-fuchsia-700: #9F1AB1; + --color-util-colors-fuchsia-fuchsia-50: #fdf4ff; + --color-util-colors-fuchsia-fuchsia-100: #fbe8ff; + --color-util-colors-fuchsia-fuchsia-200: #f6d0fe; + --color-util-colors-fuchsia-fuchsia-300: #eeaafd; + --color-util-colors-fuchsia-fuchsia-400: #e478fa; + --color-util-colors-fuchsia-fuchsia-500: #d444f1; + --color-util-colors-fuchsia-fuchsia-600: #ba24d5; + --color-util-colors-fuchsia-fuchsia-700: #9f1ab1; - --color-util-colors-purple-purple-50: #F4F3FF; - --color-util-colors-purple-purple-100: #EBE9FE; - --color-util-colors-purple-purple-200: #D9D6FE; - --color-util-colors-purple-purple-300: #BDB4FE; - --color-util-colors-purple-purple-400: #9B8AFB; - --color-util-colors-purple-purple-500: #7A5AF8; - --color-util-colors-purple-purple-600: #6938EF; - --color-util-colors-purple-purple-700: #5925DC; + --color-util-colors-purple-purple-50: #f4f3ff; + --color-util-colors-purple-purple-100: #ebe9fe; + --color-util-colors-purple-purple-200: #d9d6fe; + --color-util-colors-purple-purple-300: #bdb4fe; + --color-util-colors-purple-purple-400: #9b8afb; + --color-util-colors-purple-purple-500: #7a5af8; + --color-util-colors-purple-purple-600: #6938ef; + --color-util-colors-purple-purple-700: #5925dc; - --color-util-colors-indigo-indigo-50: #EEF4FF; - --color-util-colors-indigo-indigo-100: #E0EAFF; - --color-util-colors-indigo-indigo-200: #C7D7FE; - --color-util-colors-indigo-indigo-300: #A4BCFD; - --color-util-colors-indigo-indigo-400: #8098F9; - --color-util-colors-indigo-indigo-500: #6172F3; - --color-util-colors-indigo-indigo-600: #444CE7; - --color-util-colors-indigo-indigo-700: #3538CD; + --color-util-colors-indigo-indigo-50: #eef4ff; + --color-util-colors-indigo-indigo-100: #e0eaff; + --color-util-colors-indigo-indigo-200: #c7d7fe; + --color-util-colors-indigo-indigo-300: #a4bcfd; + --color-util-colors-indigo-indigo-400: #8098f9; + --color-util-colors-indigo-indigo-500: #6172f3; + --color-util-colors-indigo-indigo-600: #444ce7; + --color-util-colors-indigo-indigo-700: #3538cd; - --color-util-colors-blue-blue-50: #EFF8FF; - --color-util-colors-blue-blue-100: #D1E9FF; - --color-util-colors-blue-blue-200: #B2DDFF; - --color-util-colors-blue-blue-300: #84CAFF; - --color-util-colors-blue-blue-400: #53B1FD; - --color-util-colors-blue-blue-500: #2E90FA; - --color-util-colors-blue-blue-600: #1570EF; - --color-util-colors-blue-blue-700: #175CD3; + --color-util-colors-blue-blue-50: #eff8ff; + --color-util-colors-blue-blue-100: #d1e9ff; + --color-util-colors-blue-blue-200: #b2ddff; + --color-util-colors-blue-blue-300: #84caff; + --color-util-colors-blue-blue-400: #53b1fd; + --color-util-colors-blue-blue-500: #2e90fa; + --color-util-colors-blue-blue-600: #1570ef; + --color-util-colors-blue-blue-700: #175cd3; - --color-util-colors-blue-light-blue-light-50: #F0F9FF; - --color-util-colors-blue-light-blue-light-100: #E0F2FE; - --color-util-colors-blue-light-blue-light-200: #B9E6FE; - --color-util-colors-blue-light-blue-light-300: #7CD4FD; - --color-util-colors-blue-light-blue-light-400: #36BFFA; - --color-util-colors-blue-light-blue-light-500: #0BA5EC; - --color-util-colors-blue-light-blue-light-600: #0086C9; - --color-util-colors-blue-light-blue-light-700: #026AA2; + --color-util-colors-blue-light-blue-light-50: #f0f9ff; + --color-util-colors-blue-light-blue-light-100: #e0f2fe; + --color-util-colors-blue-light-blue-light-200: #b9e6fe; + --color-util-colors-blue-light-blue-light-300: #7cd4fd; + --color-util-colors-blue-light-blue-light-400: #36bffa; + --color-util-colors-blue-light-blue-light-500: #0ba5ec; + --color-util-colors-blue-light-blue-light-600: #0086c9; + --color-util-colors-blue-light-blue-light-700: #026aa2; - --color-util-colors-gray-blue-gray-blue-50: #F8F9FC; - --color-util-colors-gray-blue-gray-blue-100: #EAECF5; - --color-util-colors-gray-blue-gray-blue-200: #D5D9EB; - --color-util-colors-gray-blue-gray-blue-300: #B3B8DB; - --color-util-colors-gray-blue-gray-blue-400: #717BBC; - --color-util-colors-gray-blue-gray-blue-500: #4E5BA6; - --color-util-colors-gray-blue-gray-blue-600: #3E4784; - --color-util-colors-gray-blue-gray-blue-700: #363F72; + --color-util-colors-gray-blue-gray-blue-50: #f8f9fc; + --color-util-colors-gray-blue-gray-blue-100: #eaecf5; + --color-util-colors-gray-blue-gray-blue-200: #d5d9eb; + --color-util-colors-gray-blue-gray-blue-300: #b3b8db; + --color-util-colors-gray-blue-gray-blue-400: #717bbc; + --color-util-colors-gray-blue-gray-blue-500: #4e5ba6; + --color-util-colors-gray-blue-gray-blue-600: #3e4784; + --color-util-colors-gray-blue-gray-blue-700: #363f72; - --color-util-colors-blue-brand-blue-brand-50: #F5F7FF; - --color-util-colors-blue-brand-blue-brand-100: #D1E0FF; - --color-util-colors-blue-brand-blue-brand-200: #B2CAFF; - --color-util-colors-blue-brand-blue-brand-300: #84ABFF; - --color-util-colors-blue-brand-blue-brand-400: #5289FF; - --color-util-colors-blue-brand-blue-brand-500: #296DFF; - --color-util-colors-blue-brand-blue-brand-600: #155AEF; - --color-util-colors-blue-brand-blue-brand-700: #004AEB; + --color-util-colors-blue-brand-blue-brand-50: #f5f7ff; + --color-util-colors-blue-brand-blue-brand-100: #d1e0ff; + --color-util-colors-blue-brand-blue-brand-200: #b2caff; + --color-util-colors-blue-brand-blue-brand-300: #84abff; + --color-util-colors-blue-brand-blue-brand-400: #5289ff; + --color-util-colors-blue-brand-blue-brand-500: #296dff; + --color-util-colors-blue-brand-blue-brand-600: #155aef; + --color-util-colors-blue-brand-blue-brand-700: #004aeb; - --color-util-colors-red-red-50: #FEF3F2; - --color-util-colors-red-red-100: #FEE4E2; - --color-util-colors-red-red-200: #FECDCA; - --color-util-colors-red-red-300: #FDA29B; - --color-util-colors-red-red-400: #F97066; - --color-util-colors-red-red-500: #F04438; - --color-util-colors-red-red-600: #D92D20; - --color-util-colors-red-red-700: #B42318; + --color-util-colors-red-red-50: #fef3f2; + --color-util-colors-red-red-100: #fee4e2; + --color-util-colors-red-red-200: #fecdca; + --color-util-colors-red-red-300: #fda29b; + --color-util-colors-red-red-400: #f97066; + --color-util-colors-red-red-500: #f04438; + --color-util-colors-red-red-600: #d92d20; + --color-util-colors-red-red-700: #b42318; - --color-util-colors-green-green-50: #ECFDF3; - --color-util-colors-green-green-100: #DCFAE6; - --color-util-colors-green-green-200: #ABEFC6; - --color-util-colors-green-green-300: #75E0A7; - --color-util-colors-green-green-400: #47CD89; - --color-util-colors-green-green-500: #17B26A; + --color-util-colors-green-green-50: #ecfdf3; + --color-util-colors-green-green-100: #dcfae6; + --color-util-colors-green-green-200: #abefc6; + --color-util-colors-green-green-300: #75e0a7; + --color-util-colors-green-green-400: #47cd89; + --color-util-colors-green-green-500: #17b26a; --color-util-colors-green-green-600: #079455; --color-util-colors-green-green-700: #067647; - --color-util-colors-warning-warning-50: #FFFAEB; - --color-util-colors-warning-warning-100: #FEF0C7; - --color-util-colors-warning-warning-200: #FEDF89; - --color-util-colors-warning-warning-300: #FEC84B; - --color-util-colors-warning-warning-400: #FDB022; - --color-util-colors-warning-warning-500: #F79009; - --color-util-colors-warning-warning-600: #DC6803; - --color-util-colors-warning-warning-700: #B54708; + --color-util-colors-warning-warning-50: #fffaeb; + --color-util-colors-warning-warning-100: #fef0c7; + --color-util-colors-warning-warning-200: #fedf89; + --color-util-colors-warning-warning-300: #fec84b; + --color-util-colors-warning-warning-400: #fdb022; + --color-util-colors-warning-warning-500: #f79009; + --color-util-colors-warning-warning-600: #dc6803; + --color-util-colors-warning-warning-700: #b54708; - --color-util-colors-yellow-yellow-50: #FEFBE8; - --color-util-colors-yellow-yellow-100: #FEF7C3; - --color-util-colors-yellow-yellow-200: #FEEE95; - --color-util-colors-yellow-yellow-300: #FDE272; - --color-util-colors-yellow-yellow-400: #FAC515; - --color-util-colors-yellow-yellow-500: #EAAA08; - --color-util-colors-yellow-yellow-600: #CA8504; - --color-util-colors-yellow-yellow-700: #A15C07; + --color-util-colors-yellow-yellow-50: #fefbe8; + --color-util-colors-yellow-yellow-100: #fef7c3; + --color-util-colors-yellow-yellow-200: #feee95; + --color-util-colors-yellow-yellow-300: #fde272; + --color-util-colors-yellow-yellow-400: #fac515; + --color-util-colors-yellow-yellow-500: #eaaa08; + --color-util-colors-yellow-yellow-600: #ca8504; + --color-util-colors-yellow-yellow-700: #a15c07; - --color-util-colors-teal-teal-50: #F0FDF9; - --color-util-colors-teal-teal-100: #CCFBEF; - --color-util-colors-teal-teal-200: #99F6E0; - --color-util-colors-teal-teal-300: #5FE9D0; - --color-util-colors-teal-teal-400: #2ED3B7; - --color-util-colors-teal-teal-500: #15B79E; - --color-util-colors-teal-teal-600: #0E9384; + --color-util-colors-teal-teal-50: #f0fdf9; + --color-util-colors-teal-teal-100: #ccfbef; + --color-util-colors-teal-teal-200: #99f6e0; + --color-util-colors-teal-teal-300: #5fe9d0; + --color-util-colors-teal-teal-400: #2ed3b7; + --color-util-colors-teal-teal-500: #15b79e; + --color-util-colors-teal-teal-600: #0e9384; --color-util-colors-teal-teal-700: #107569; - --color-util-colors-cyan-cyan-50: #ECFDFF; - --color-util-colors-cyan-cyan-100: #CFF9FE; - --color-util-colors-cyan-cyan-200: #A5F0FC; - --color-util-colors-cyan-cyan-300: #67E3F9; - --color-util-colors-cyan-cyan-400: #22CCEE; - --color-util-colors-cyan-cyan-500: #06AED4; - --color-util-colors-cyan-cyan-600: #088AB2; - --color-util-colors-cyan-cyan-700: #0E7090; + --color-util-colors-cyan-cyan-50: #ecfdff; + --color-util-colors-cyan-cyan-100: #cff9fe; + --color-util-colors-cyan-cyan-200: #a5f0fc; + --color-util-colors-cyan-cyan-300: #67e3f9; + --color-util-colors-cyan-cyan-400: #22ccee; + --color-util-colors-cyan-cyan-500: #06aed4; + --color-util-colors-cyan-cyan-600: #088ab2; + --color-util-colors-cyan-cyan-700: #0e7090; - --color-util-colors-violet-violet-50: #F5F3FF; - --color-util-colors-violet-violet-100: #ECE9FE; - --color-util-colors-violet-violet-200: #DDD6FE; - --color-util-colors-violet-violet-300: #C3B5FD; - --color-util-colors-violet-violet-400: #A48AFB; - --color-util-colors-violet-violet-500: #875BF7; - --color-util-colors-violet-violet-600: #7839EE; - --color-util-colors-violet-violet-700: #6927DA; + --color-util-colors-violet-violet-50: #f5f3ff; + --color-util-colors-violet-violet-100: #ece9fe; + --color-util-colors-violet-violet-200: #ddd6fe; + --color-util-colors-violet-violet-300: #c3b5fd; + --color-util-colors-violet-violet-400: #a48afb; + --color-util-colors-violet-violet-500: #875bf7; + --color-util-colors-violet-violet-600: #7839ee; + --color-util-colors-violet-violet-700: #6927da; - --color-util-colors-gray-gray-50: #F9FAFB; - --color-util-colors-gray-gray-100: #F2F4F7; - --color-util-colors-gray-gray-200: #E9EBF0; - --color-util-colors-gray-gray-300: #D0D5DC; - --color-util-colors-gray-gray-400: #98A2B2; - --color-util-colors-gray-gray-500: #676F83; + --color-util-colors-gray-gray-50: #f9fafb; + --color-util-colors-gray-gray-100: #f2f4f7; + --color-util-colors-gray-gray-200: #e9ebf0; + --color-util-colors-gray-gray-300: #d0d5dc; + --color-util-colors-gray-gray-400: #98a2b2; + --color-util-colors-gray-gray-500: #676f83; --color-util-colors-gray-gray-600: #495464; --color-util-colors-gray-gray-700: #354052; - --color-util-colors-green-light-green-light-50: #F3FEE7; - --color-util-colors-green-light-green-light-100: #E3FBCC; - --color-util-colors-green-light-green-light-200: #D0F8AB; - --color-util-colors-green-light-green-light-300: #A6EF67; - --color-util-colors-green-light-green-light-500: #66C61C; - --color-util-colors-green-light-green-light-400: #85E13A; - --color-util-colors-green-light-green-light-600: #4CA30D; - --color-util-colors-green-light-green-light-700: #3B7C0F; + --color-util-colors-green-light-green-light-50: #f3fee7; + --color-util-colors-green-light-green-light-100: #e3fbcc; + --color-util-colors-green-light-green-light-200: #d0f8ab; + --color-util-colors-green-light-green-light-300: #a6ef67; + --color-util-colors-green-light-green-light-500: #66c61c; + --color-util-colors-green-light-green-light-400: #85e13a; + --color-util-colors-green-light-green-light-600: #4ca30d; + --color-util-colors-green-light-green-light-700: #3b7c0f; - --color-util-colors-rose-rose-50: #FFF1F3; - --color-util-colors-rose-rose-100: #FFE4E8; - --color-util-colors-rose-rose-200: #FECDD6; - --color-util-colors-rose-rose-300: #FEA3B4; - --color-util-colors-rose-rose-400: #FD6F8E; - --color-util-colors-rose-rose-500: #F63D68; - --color-util-colors-rose-rose-600: #E31B54; - --color-util-colors-rose-rose-700: #C01048; + --color-util-colors-rose-rose-50: #fff1f3; + --color-util-colors-rose-rose-100: #ffe4e8; + --color-util-colors-rose-rose-200: #fecdd6; + --color-util-colors-rose-rose-300: #fea3b4; + --color-util-colors-rose-rose-400: #fd6f8e; + --color-util-colors-rose-rose-500: #f63d68; + --color-util-colors-rose-rose-600: #e31b54; + --color-util-colors-rose-rose-700: #c01048; - --color-util-colors-midnight-midnight-50: #FBFBFC; - --color-util-colors-midnight-midnight-100: #F0F2F5; - --color-util-colors-midnight-midnight-200: #DFE1EA; - --color-util-colors-midnight-midnight-300: #C6CBD9; - --color-util-colors-midnight-midnight-400: #A7AEC5; - --color-util-colors-midnight-midnight-500: #828DAD; - --color-util-colors-midnight-midnight-600: #5D698D; - --color-util-colors-midnight-midnight-700: #3E465E; + --color-util-colors-midnight-midnight-50: #fbfbfc; + --color-util-colors-midnight-midnight-100: #f0f2f5; + --color-util-colors-midnight-midnight-200: #dfe1ea; + --color-util-colors-midnight-midnight-300: #c6cbd9; + --color-util-colors-midnight-midnight-400: #a7aec5; + --color-util-colors-midnight-midnight-500: #828dad; + --color-util-colors-midnight-midnight-600: #5d698d; + --color-util-colors-midnight-midnight-700: #3e465e; - --color-third-party-LangChain: #1C3C3C; + --color-third-party-LangChain: #1c3c3c; --color-third-party-Langfuse: #000000; - --color-third-party-Github: #1B1F24; - --color-third-party-Github-tertiary: #1B1F24; - --color-third-party-Github-secondary: #1B1F24; - --color-third-party-model-bg-openai: #E3E5E8; - --color-third-party-model-bg-anthropic: #EEEDE7; - --color-third-party-model-bg-default: #F9FAFB; + --color-third-party-Github: #1b1f24; + --color-third-party-Github-tertiary: #1b1f24; + --color-third-party-Github-secondary: #1b1f24; + --color-third-party-model-bg-openai: #e3e5e8; + --color-third-party-model-bg-anthropic: #eeede7; + --color-third-party-model-bg-default: #f9fafb; - --color-third-party-aws: #141F2E; - --color-third-party-aws-alt: #0F1824; + --color-third-party-aws: #141f2e; + --color-third-party-aws-alt: #0f1824; - --color-saas-background: #FCFCFD; - --color-saas-pricing-grid-bg: #C8CEDA80; + --color-saas-background: #fcfcfd; + --color-saas-pricing-grid-bg: #c8ceda80; } \ No newline at end of file diff --git a/web/themes/tailwind-theme-var-define.ts b/web/themes/tailwind-theme-var-define.ts index ea5f80b88b..62c0ed82c7 100644 --- a/web/themes/tailwind-theme-var-define.ts +++ b/web/themes/tailwind-theme-var-define.ts @@ -206,6 +206,7 @@ const vars = { 'components-badge-bg-red-soft': 'var(--color-components-badge-bg-red-soft)', 'components-badge-bg-blue-light-soft': 'var(--color-components-badge-bg-blue-light-soft)', 'components-badge-bg-gray-soft': 'var(--color-components-badge-bg-gray-soft)', + 'components-badge-bg-dimm': 'var(--color-components-badge-bg-dimm)', 'components-chart-line': 'var(--color-components-chart-line)', 'components-chart-area-1': 'var(--color-components-chart-area-1)', @@ -399,7 +400,6 @@ const vars = { 'background-default-burn': 'var(--color-background-default-burn)', 'background-overlay-fullscreen': 'var(--color-background-overlay-fullscreen)', 'background-default-lighter': 'var(--color-background-default-lighter)', - 'background-account-teams-bg': 'var(--color-account-teams-bg)', 'background-section': 'var(--color-background-section)', 'background-interaction-from-bg-1': 'var(--color-background-interaction-from-bg-1)', 'background-interaction-from-bg-2': 'var(--color-background-interaction-from-bg-2)', @@ -503,6 +503,7 @@ const vars = { 'state-base-hover-alt': 'var(--color-state-base-hover-alt)', 'state-base-handle': 'var(--color-state-base-handle)', 'state-base-handle-hover': 'var(--color-state-base-handle-hover)', + 'state-base-hover-subtle': 'var(--color-state-base-hover-subtle)', 'state-accent-hover': 'var(--color-state-accent-hover)', 'state-accent-active': 'var(--color-state-accent-active)',