.theme-darknight {
    /* main page */
    --color-bg: #0F172A;
    --color-bg-text: #94A3B8;
    /* sidebar menu */
    --color-sb: #1E293B;
    --color-sb-item: #1E293B;
    --color-sb-item-text: #94A3B8;
    --color-sb-item-hover: #334155;
    --color-sb-item-hover-text: #F8FAFC;
    --color-sb-item-activeline: #06B6D4;
    --color-sb-imagebackground: #111827;
    /* title bar */
    --color-titlebar: #0F172A;
    --color-titlebar-text: #94A3B8;
    --color-titlebar-border: #334155;
    /* page header */
    --color-header: #1E293B;
    --color-header-text: #E2E8F0;
    --color-header-text-active: #38BDF8;
    --color-header-border: #334155;
    /* Controls */
    --color-surface: #1E293B;
    --color-surface-text: #94A3B8;
    --color-surface-border: #334155;
    --color-surface-border-focus: #38BDF8;
    --color-surface-border-disabled: #475569;
    --color-surface-select: #475569;
    --color-surface-select-text: #FFFFFF;
    --color-surface-hover: #334155;
    --color-surface-hover-text: #FFFFFF;
    --color-surface-disabled: #1E293B;
    --color-surface-disabled-text: #64748B;
    --color-surface-button: #334155;
    --color-surface-button-text: #E2E8F0;
    --color-surface-button-hover: #475569;
    --color-surface-button-hover-text: #FFFFFF;
    --color-surface-check: #06B6D4;
    --color-surface-text-secondary: #06B6D4;
    /* tabs */
    --color-tab-bg: #0F172A;
    --color-tab: #1E293B;
    --color-tab-text: #94A3B8;
    --color-tab-border: #334155;
    --color-tab-focus: #0F172A;
    --color-tab-focus-text: #E2E8F0;
    --color-tab-hover: #1E293B;
    /* lists / groups */
    --color-list-bg: #1E293B;
    --color-list-border: #334155;
    --color-list-border-focus: #38BDF8;
    --color-list-text: #94A3B8;
    --color-list-item-border: #334155;
    --color-list-select: #475569;
    --color-list-select-text: #FFFFFF;
    --color-list-hover: #334155;
    --color-list-hover-text: #E2E8F0;
    --color-list-header: #1E293B;
    --color-list-header-text: #94A3B8;
    --color-list-header-border: #0F172A;
    --color-list-heading: #334155;
    --color-list-heading-text: #FFFFFF;
    --color-list-primary: #10B981;
    --color-list-primary-selected: #34D399;
    --color-list-danger: #EF4444;
    --color-list-danger-selected: #F87171;
    --color-list-info: #0EA5E9;
    --color-list-info-selected: #38BDF8;
    --color-list-warning: #F59E0B;
    --color-list-warning-selected: #FBBF24;
    --color-list-header-warning: #D97706;
    --color-list-success: #10B981;
    /* toolbars */
    --color-toolbar-bg: #1E293B;
    --color-toolbar-bg-border: #334155;
    --color-toolbar: #293952;
    --color-toolbar-border: #334155;
    --color-toolbar-text: #94A3B8;
    --color-toolbar-hover: #334155;
    --color-toolbar-hover-text: #FFFFFF;
    --color-toolbar-hover-border: #475569;
    --color-toolbar-disabled: #1E293B;
    --color-toolbar-disabled-text: #fff;
    --color-toolbar-border-disabled: #1E293B;
    /* dockbars */
    --color-sidepanel: #1E293B;
    --color-sidepanel-text: #94A3B8;
    --color-sidepanel-border: #334155;
    --color-sidepanel-item: #334155;
    --color-sidepanel-item-text: #94A3B8;
    --color-sidepanel-item-border: #334155;
    --color-dockpanel-heading: #1E293B;
    --color-dockpanel-heading-text: #E2E8F0;
    --color-dockpanel-border: #0F172A;
    --color-dockpanel-underlay: #334155;
    /* hyperlinks */
    --color-hyperlink: #38BDF8;
    --color-hyperlink-hover: #7DD3FC;
    --color-hyperlink-visited: #C084FC;
    --color-hyperlink-visited-hover: #D8B4FE;
    /* others */
    --color-primary: #06B6D4;
    --color-primary-text: #083344;
    --color-primary-border: #0891B2;
    --color-primary-hover: #22D3EE;
    --color-secondary: #334155;
    --color-secondary-text: #F8FAFC;
    --color-secondary-border: #475569;
    --color-secondary-hover: #475569;
    --color-accent: #EC4899;
    --color-accent-text: #500724;
    --color-accent-border: #DB2777;
    --color-accent-hover: #F472B6;
    --color-danger: #EF4444;
    --color-danger-text: #450A0A;
    --color-danger-border: #DC2626;
    --color-danger-hover: #F87171;
    --color-success: #10B981;
    --color-success-text: #022C22;
    --color-success-border: #059669;
    --color-success-hover: #34D399;
    --color-info: #0EA5E9;
    --color-info-text: #082F49;
    --color-info-border: #0284C7;
    --color-info-hover: #38BDF8;
    --color-warning: #F59E0B;
    --color-warning-text: #451A03;
    --color-warning-border: #D97706;
    --color-warning-hover: #FBBF24;
    --color-default: #334155;
    --color-default-text: #E2E8F0;
    --color-default-border: #475569;
    --color-default-hover: #475569;
    --color-default-hover-text: #FFFFFF;
    --color-tertiary: #8B5CF6;
    --color-tertiary-text: #2E1065;
    --color-tertiary-border: #7C3AED;
    --color-tertiary-hover: #A78BFA;
}