:root {
	color-scheme: light dark;
	--toolbar-height: 49px;
	--mobile-toolbar-height: 57px;
	--external-header-height: 24px;
	--search-header-height: 72px;
	--sidebar-width: 192px;
	--rightbar-width: 192px;
	--login-background-color: var(--brand-primary-500);
	--login-inner-background-color: light-dark(#ffffff, #000000);
	--gray-base: light-dark(#000000, #f2f2f2);
	--gray-darkest: light-dark(#262626, #d9d9d9);
	--gray-darker: light-dark(#4d4d4d, #999999);
	--gray-dark: light-dark(#666666, #777777);
	--gray: light-dark(#777777, #666666);
	--gray-light: light-dark(#999999, #4d4d4d);
	--gray-lighter: light-dark(#d9d9d9, #262626);
	--gray-lightest: light-dark(#f2f2f2, #191919);
	/* Stable colors which will not changed in dark mode */
	--gray-base-stable: #000000;
	--gray-darkest-stable: #262626;
	--gray-darker-stable: #4d4d4d;
	--gray-dark-stable: #666666;
	--gray-stable: #777777;
	--gray-light-stable: #999999;
	--gray-lighter-stable: #d9d9d9;
	--gray-lightest-stable: #f2f2f2;
	--black-bg: #000000;
	--white-bg: #ffffff;

	--surface-color: #f5f8fc;
	--surface-bg: light-dark(var(--surface-color), var(--gray-lighter));
	--gray-placeholder: var(--gray-dark);
	--warm-gray: var(--gray-light);
	--off-white: #fafafa;
	--translucent-black: rgba(0, 0, 0, 0.6);
	--translucent-white: rgba(255, 255, 255, 0.6);
	--overlay-bg: light-dark(var(--translucent-black), var(--translucent-white));
	--branding-font-family: "Roboto", Helvetica, Arial, sans-serif;
	--branding-font-family-regular: "Roboto", Helvetica, Arial, sans-serif;
	--branding-font-family-medium: "Roboto", Helvetica, Arial, sans-serif;
	--branding-font-family-bold: "Roboto", Helvetica, Arial, sans-serif;
	--branding-font-family-medium-italic: "Roboto", Helvetica, Arial, sans-serif;
	--color-light-positive: #00bd02;
	--color-light-negative: #ff1f1f;
	--body-bg: light-dark(#ffffff, #000000);
	--text-color: light-dark(var(--gray-darker), var(--gray-darkest));
	--text-color-white: #ffffff;
	--text-color-black: #000000;
	--dialog-title-fg: var(--gray-base);
	--dialog-bg: light-dark(#ffffff, #1A1A1A);
	--background-gray: var(--gray-lightest);
	--link-color: light-dark(var(--brand-primary-600), var(--brand-primary-400));
	--link-hover-color: light-dark(var(--brand-primary-800), var(--brand-primary-200));
	--link-hover-decoration: underline;
	--item-hover-bg: #ffffff;
	--item-selected-bg: var(--brand-primary-100);
	--border-color: light-dark(var(--gray-lighter), var(--gray));
	--hr-border: light-dark(var(--gray-lighter), var(--gray));
	--input-border-color: var(--gray-light);
	--placeholder-color: var(--gray-dark);
	--app-menu-active-color: light-dark(var(--text-color-white), var(--brand-primary-500));
	--app-menu-active-background-color: light-dark(var(--brand-primary-500), var(--text-color-white));
	--list-active-bg: light-dark(var(--brand-primary-50), var(--brand-primary-900));
	--list-hover-bg: var(--gray-lightest);
	--folder-item-hover-bg: var(--list-hover-bg);
	--sidebar-bg-color: var(--body-bg);
	--sidebar-header-bg-color: var(--body-bg);
	--sidebar-shaded-color: var(--border-color);
	--rightbar-bg-color: var(--gray-lightest);
	--read-pane-toolbar-color: var(--gray-lightest);
	--read-pane-bg-color: var(--gray-lightest);
	--favorite-indicator-active: var(--brand-warning-500);
	--favorite-indicator-inactive: var(--gray);
	--favorite-indicator-hover: var(--brand-warning-400);
	--favorite-indicator-disabled: var(--gray-lighter);
	--trash-indicator: var(--gray);
	--trash-indicator-hover: var(--brand-primary-500);
	--file-type-doc: #0f73ff;
	--file-type-ppt: #ff9937;
	--file-type-pdf: #ff4c4e;
	--file-type-xls: #0e9d58;
	--file-type-zip: #ada293;
	--file-type-default: #949cae;
	--file-type-media: #bc0e67;
	--file-type-code: #00b4ca;
	--toast-success-color: var(--brand-success-500);
	--toast-failure-color: var(--brand-danger-500);
	--toast-warning-color: var(--brand-warning-500);
	--font-family-sans-serif: "Roboto", Helvetica, Arial, sans-serif;
	--font-family-serif: Georgia, "Times New Roman", Times, serif;
	--font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
	--font-family-base: "Roboto", Helvetica, Arial, sans-serif;
	--font-brand-primary: inherit;
	--font-family-primary: inherit;
	--font-family-secondary: inherit;
	--font-family-plainText: monospace;
	--font-size-folder-list: 13px;
	--font-size-base: 14px;
	--font-size-med: calc(var(--font-size-base) * 1.15); /*~16px*/
	--font-size-large: calc(var(--font-size-base) * 1.25); /*~18px*/
	--font-size-small: calc(var(--font-size-base) * 0.85); /*~12px*/
	--font-size-h1: calc(var(--font-size-base) * 2.6); /* ~36px */
	--font-size-h2: calc(var(--font-size-base) * 2.15); /* ~30px */
	--font-size-h3: calc(var(--font-size-base) * 1.7); /* ~24px */
	--font-size-h4: calc(var(--font-size-base) * 1.25); /* ~18px */
	--font-size-h5: var(--font-size-base);
	--font-size-h6: calc(var(--font-size-base) * 0.85); /* ~12px */
	--line-height-base: 1.42857143;
	--line-height-computed: calc(var(--font-size-base) * var(--line-height-base)); /* ~20px */
	--headings-font-family: inherit;
	--headings-font-weight: 300;
	--headings-line-height: 1.1;
	--headings-color: inherit;
	--headings-small-color: var(--gray-light);
	--spacing-base: 8px;
	--spacing-xs: calc(var(--spacing-base) / 2);
	--spacing-sm: var(--spacing-base);
	--spacing-md: calc(var(--spacing-base) * 2);
	--spacing-lg: calc(var(--spacing-base) * 3);
	--spacing-xl: calc(var(--spacing-base) * 4);
	--radius-base: 4px;
	--radius-xs: var(--radius-base);
	--radius-sm: calc(var(--radius-base) * 2);
	--radius-md: calc(var(--radius-base) * 3);
	--radius-lg: calc(var(--radius-base) * 4);
	--radius-xl: calc(var(--radius-base) * 5);
	--icon-size-xs: 12px;
	--icon-size-sm: 16px;
	--icon-size-md: 24px;
	--icon-size-lg: 32px;
	--icon-size-xl: 40px;
	--logo-height: 32px;
	--logo-max-width: 200px;
	--header-bg: var(--gray-lightest);
	--header-fg: var(--gray-darker);
	--header-actions-fg: var(--gray-darker);
	--external-header-bg: var(--brand-primary-700);
	--external-header-fg: #ffffff;
	--search-highlighter: #fff100;
	--row-height-narrow: 72px;
	--row-height-wide: 27px;
	--tag-secondary-font-color: #ffffff;
	--popover-row-border-color: var(--border-color);
	--warning-banner-bg: light-dark(var(--brand-warning-50), var(--brand-warning-200));
	--drop-zone-bg: light-dark(rgba(215, 243, 255, 0.9), rgba(0, 55, 79, 0.9));
	--drop-zone-border-color: light-dark(rgba(0, 118, 168, 0.9), rgba(128, 187, 212, 0.9));
	--drop-zone-text-color: light-dark(#00648f, #80bbd4);
	--secondary-scrollbar: light-dark(#d1d1d1, #4d4d4d) light-dark(#d1d1d1, #4D4D4D);
	--tag-color-blue: #3C82F6;
	--tag-color-cyan: #008080;
	--tag-color-green: #248723;
	--tag-color-purple: #6F3C96;
	--tag-color-red: #DC2625;
	--tag-color-yellow: #FBAF19;
	--tag-color-pink: #DD0B73;
	--tag-color-gray: #758083;
	--tag-color-orange: #FF7015;
	--calendar-color-blue: #d2def8;
	--calendar-color-cyan: #d2eff3;
	--calendar-color-green: #d6f0cf;
	--calendar-color-purple: #e4d8ee;
	--calendar-color-red: #fcc3be;
	--calendar-color-yellow: #fdf8b1;
	--calendar-color-pink: #ffd7df;
	--calendar-color-gray: #e5e5e5;
	--calendar-color-orange: #fcdbb3;
	--avatar-color-navy: #1E3A8A;
	--avatar-color-violet: #5B21B6;
	--avatar-color-teal: #0F766E;
	--avatar-color-forest: #166534;
	--avatar-color-emerald: #065F46;
	--avatar-color-rust: #C2410C;
	--avatar-color-amber: #B45309;
	--avatar-color-crimson: #991B1B;
	--avatar-color-rose: #9F1239;
	--avatar-color-indigo: #3730A3;
	--avatar-color-coffee: #4E342E;
	--avatar-color-slate: #334155;
}